/* -----------------------------

Sidebar & Scrollbar

 ------------------------------ */
#sidebar {
    width: var(--sidebar-and-margin-left);
    min-height: 100dvh;
    z-index: 11;
    transition: all 500ms ease-in-out;
    position: fixed;
    margin-left: 0;

    max-height: 100dvh;
    scrollbar-width: none;
    -ms-overflow-style: none;
    scrollbar-gutter: stable;
    border-right: 1px solid var(--bs-white);

    & .nav-item {
        margin-top: 10px;
    }

    & .nav-link {
        width: 100%;
        padding-left: .8rem;
    }

    & a {
        color: var(--font-primary-light);
    }

    & .menu-header {
        background: var(--blue-800);
    }

    & .nav-link {
        display: flex;
        font-size: 110%;

        & span {
            width: 2rem;
        }

        &.detailCatalogLink span{
            width: 1.4rem;
        }

        & p {
            margin: 0;
        }
    }
}

@media (max-height: 1420px) {
    #sidebar {
        overflow-y: auto;
        scrollbar-width: auto;
        -ms-overflow-style: scrollbar;
    }
}

#sidebar::-webkit-scrollbar {
    width: 10px;
}

#sidebar::-webkit-scrollbar-thumb {
    background-color: var(--gray-200);
    border-radius: 5px;
    border: 2px solid transparent;
    background-clip: content-box;
}

#sidebar.active {
    margin-left: 0;
}

.closeMenuButton {
    color: var(--light-primary);
    transition: .5s ease;

    &:hover {
        color: var(--blue-secondary);
        transform: rotate(90deg);
    }
}

.sidemenuOpenIcon {
    transition: .5s ease-in-out;
    cursor: pointer;
    background: var(--blue-secondary);

    &:hover {
        background: var(--blue-700);
    }
}

@media (max-height: 775px) {
    #sidebar .sidebar-header {
        padding: 0 !important;
        margin: 0;
        max-height: 40px;

        & label {
            padding: 15px 15px 0 0;
        }
        & .navbar-brand{
            margin: 0;
            padding-left: 1rem;
        }
    }
}

#content {
    transition: margin-left 500ms ease-in-out;
}

@media (max-width: 1819.9px) {
    #sidebar {
        width: 230px;
        transition: margin-left 500ms ease-in-out;
        margin-left: -230px; /* Skryj sidebar na menších obrazovkách */
    }

    #menuToggle:checked + #sidebar,
    #menuToggle:checked ~ #content {
        margin-left: 0; /* Zobraz sidebar */
    }

    #menuToggle:checked ~ #content {
        margin-left: 270px; /* Posuň obsah, když je sidebar otevřený */
    }
}

/* -------------------------

Sidebar dropdown menu

---------------------------- */

#sidebar .chevron i {
    display: inline-block;
    width: 1.2rem;
    text-align: center;
    transition: transform .18s ease;
}

#riskManagementButton[aria-expanded="true"] .chevron i { transform: rotate(180deg); }
#catalogButton[aria-expanded="true"] .chevron i { transform: rotate(180deg); }
#administrationButton[aria-expanded="true"] .chevron i { transform: rotate(180deg); }

#riskManagementButton.nav-link[aria-expanded="true"]{border-left: 1px solid var(--light-primary);}
#catalogButton.nav-link[aria-expanded="true"],
#administrationButton.nav-link[aria-expanded="true"]{border-left: 1px solid var(--light-primary);}


#sidebar .nav-link { color: #fff; }
#sidebar .nav-link:focus { outline: none; }

.nav-link.active {
    box-shadow: inset 0 0 0 9999px rgba(0,0,0,.20);
    border-left: 1px solid var(--light-primary);
}


#main-menu .collapse.show{
    transition: .5s ease-in-out;
    background-color: var(--blue-650);
}

#main-menu .collapse.show.borderBottomDropdown {
    box-shadow: inset 0 -1px 0 0 rgb(255, 255, 255);
}

#riskManagementButton[aria-expanded="true"],
#catalogButton[aria-expanded="true"],
#administrationButton[aria-expanded="true"]{
    background-color: var(--blue-900);
}

#submenuCatalog .list-unstyled > li > .nav-link,
#submenuAdministration .list-unstyled > li > .nav-link,
#submenuRiskManagement .list-unstyled > li > .nav-link{
    display: flex;
    width: 100%;
}

#sidebar .nav-link:hover {
    box-shadow: inset 2px 0 0 0 var(--light-primary), inset 0 0 0 9999px rgba(0,0,0,.10);
}
