.menu {
	list-style: none;
	margin: 0;
	padding: 0;
}

.menu-navbar {
	display: flex;
	flex-direction: column;
	gap: $sp-4;
	> li {
		> .menu-item {
			padding: $sp-3 0;
			color: $text-color;

			.ico-start { margin-right: $sp-1;}
			.ico-end { vertical-align: 0;}

			&:hover,
			&:focus,
			&.show {
				color: $co-alpha;
			}
		}

		&.is-active > .menu-item {
			text-decoration: underline;
		}
	}
}

.menu-footer {
	> li {
		> a {
			color: $text-color;
			@include hover() { opacity: .7;}
		}

		&.is-active > a {
			text-decoration: underline;
			pointer-events: none;
		}
	}
}

@include mediaQ(bpMax) {
	// reset bs & popper (dropdown-menu)
	.menu.menu-navbar {
		> li {
			> a {
				// display: flex;
				// align-items: center;
				padding: $sp-1 0;
				// .ico { margin-left: auto;}
			}
		}

		.dropdown-menu {
			position: static !important;
			margin: 0 !important;
			transform: none !important;
			padding: 0;
			padding-left: $sp-3;
			border: none;
			border-radius: 0;
			background-color: transparent;
			box-shadow: none;

			> li:after {
				display: none;
			}

			.dropdown-menu {
				padding-top: $sp-1;
			}

			.dropdown-item {
				padding: $sp-2 0;
			}
		}
	}
}

@include mediaQ(bp) {
	.menu-navbar {
		flex-direction: row;
		align-items: center;
		gap: $sp-5;
	}
}