/* Navigation */
header {
    height: 4rem;
}

header > * {
    height: 100%;
}

header .navbar .nav-item .nav-link {
    --voyadores-nav-link-padding-y: .5rem;
}

header .navbar-toggler {
    --voyadores-navbar-toggler-padding-x: 0.25rem;
    border: none;
}

header .navbar-toggler-icon {
    font-family: 'voyadores-icon-regular';
    content: "\ec66";
}

header .navbar {
    border-bottom-color: var(--voyadores-border-color);
}

header #mobileNavbar .dropdown-menu.show {
    margin-bottom: 1rem;
}

@media(max-width: 576px) {
    header .offcanvas {
        min-width: 100%;
        height: 100vh;
    }
}

@media(max-width: 1200px) {
    header .offcanvas {
        width: unset;
        height: 100vh;
    }
}

@media(max-width: 991px) {
    header .dropdown-menu,
    header .dropdown-divider {
        border: none;
    }
}

/* Menu */
header .dropdown-submenu {
    position: relative;
}

/* Desktop */
@media (min-width: 992px) {
    header .dropdown-submenu > .dropdown-menu {
        top: 0;
        left: 100%;
        margin-top: -1px;
        display: none;
    }

    header .dropdown-submenu:hover > .dropdown-menu {
        display: block;
    }

    header .dropdown-submenu > .dropdown-toggle::after {
        transform: rotate(-90deg);
    }
}

/* Mobile */
@media (max-width: 992px) {
    header .dropdown-submenu > .dropdown-menu {
        position: static !important;
        display: none;
        border: 0;
        margin-left: 1rem;
        padding-left: .5rem;
        box-shadow: none;
        transform: none !important;
    }

    header .dropdown-submenu.open > .dropdown-menu {
        display: block;
    }

    header .dropdown-submenu > .dropdown-toggle::after {
        transform: none;
        transition: transform .2s ease;
    }

    header .dropdown-submenu.open > .dropdown-toggle::after {
        transform: rotate(180deg);
    }
}

header .dropdown-submenu {
    --submenu-offset: 2rem;
}

header .dropdown-submenu:nth-child(1) {
    --index: 0;
}

header .dropdown-submenu:nth-child(2) {
    --index: 1;
}

header .dropdown-submenu:nth-child(3) {
    --index: 2;
}

header .dropdown-submenu:nth-child(4) {
    --index: 3;
}

header .dropdown-submenu > .dropdown-menu {
    top: calc(var(--index) * var(--submenu-offset) * -1);
}

    header .dropdown-submenu:hover > .dropdown-toggle,
    header .dropdown-submenu.open > .dropdown-toggle {
        background-color: var(--voyadores-dropdown-link-hover-bg);
    }