@import "../base/common";
@import "../base/themes/admin-menu-theme";

.ub-menu-navigation {
	height: 100%;
	display: grid;
	grid-template-rows: 1fr;
	grid-template-columns: minmax(0, 1fr);
	grid-gap: 10px;
	background-color: $white;

	.ub-menu-navigation-header-button {
		@extend %default-transition;
		@extend %flex-center-all;
		@extend %pointer;
		@extend %size-full;

		padding: 0 10px;
		border: solid rgb(0 0 0 / 0%);
		border-width: 0 0 2px;

		@include screen-max($screen-xl) {
			padding: 0 10px;
		}

		&[data-active="true"] {
			border-color: $red-500;
		}

		&[data-active="false"] {
			color: $text-faded-color;
		}

		&:hover[data-active="false"] {
			border-color: $border-color;
		}
	}
}