//
// Main Navigation
//
.navbar-mainnavigation {
    --mainnavigation-hightlight: #{$primary};
    --mainnavigation-nav-spacing-y: 1px;
    --mainnavigation-nav-spacing-x: .75em;
    --mainnavigation-link-font-size: 1rem;
    --mainnavigation-link-line-height: 1.45;
    --mainnavigation-link-padding-y: .5rem;
    --mainnavigation-link-padding-x: .75rem;
    --mainnavigation-link-height: calc((var(--mainnavigation-link-padding-y) * 2) + (var(--mainnavigation-link-line-height) * var(--mainnavigation-link-font-size)));
    --mainnavigation-dropdown-column-spacing: 1px;
    --mainnavigation-dropdown-column-min-width: 220px;
    --mainnavigation-dropdown-padding-y: 1rem;
    --mainnavigation-dropdown-padding-x: 1rem;
    --mainnavigation-dropdown-link-padding-y: .2rem;
    --mainnavigation-dropdown-link-padding-x: .5rem;
    --mainnavigation-dropdown-spacer: 0;
    box-shadow: 0 1px 0 0 rgba(0, 0, 0, .15);
    padding-top: calc((var(--mainnavigation-nav-height) - var(--mainnavigation-link-height)) / 2);
    padding-bottom: calc((var(--mainnavigation-nav-height) - var(--mainnavigation-link-height)) / 2);
    @each $breakpoint in map-keys($navbar-heights) {
        @include media-breakpoint-up($breakpoint) {
            --mainnavigation-nav-height: #{map-get($navbar-heights, $breakpoint)};
        }
    }
    @media (min-width: $grid-float-breakpoint) {
        --mainnavigation-link-padding-x: .5em;
    }
    @media (min-width: $grid-float-breakpoint) {
        --mainnavigation-dropdown-spacer: .5rem;
    }
    .nav-item {
        display: flex;
        flex-wrap: wrap;
        align-content: flex-start;
    }
    .navbar-nav {
        gap: var(--mainnavigation-nav-spacing-y) var(--mainnavigation-nav-spacing-x);
        line-height: var(--mainnavigation-link-line-height);
        --#{$prefix}nav-link-font-size: var(--mainnavigation-link-font-size);
        --#{$prefix}nav-link-padding-y: var(--mainnavigation-link-padding-y);
        --#{$prefix}nav-link-padding-x: var(--mainnavigation-link-padding-x);
    }
}
.container-mainnavigation {
    position: relative;
    align-items: unset !important;
    gap: 0 2rem;
}
@import "navbar/fixed";
@import "navbar/brand";
@import "navbar/link";
@import "navbar/dropdown";
@import "navbar/status";
@import "navbar/toggle";
@import "navbar/style";
@import "navbar/carousel";
@import "navbar/responsive";
@import "navbar/transition";
