.component.navigation-main {
	.nav-list {
		display: flex;
		gap: $std-mg-lg;
		align-items: center;

		@include media("max", "lg") {
			flex-direction: column;
			align-items: flex-start;
			gap: 0;
		}	

		.nav-list-item {
			@include media("max", "lg") {
				width: 100%;
				box-sizing: border-box;
			}

			.nav-link {
				font-size: $fsize-sm;
				color: $color-text;
				border: 0;
				padding: 10px 0;

				&:hover, 
				&.active {
					color: $color-primary;

					@include media("max", "lg") {
						background-color: rgba(0, 0, 0, .05);
					}
				}

				@include media("max", "lg") {
					padding: $std-pd-lg;
					width: 100%;
					box-sizing: border-box;
					font-size: $fsize-md;
				}
			}

			.create-uadpost {
				@include media("max", "lg") {
					width: -webkit-fill-available;
					margin: $std-mg-lg;
				}
			}
		}
	}
}