/* ------------------------------
   SIDEBAR BASE
------------------------------- */

#sidebar {
    top: 3.5rem;
    left: 0;
    height: calc(100vh - 3.5rem);
    width: 20rem;
    padding-top: .5rem;
    z-index: 1000;
    align-items: center;
    position: fixed;
    overflow-y: auto;
    background-color: var(--light);
    transition: all .25s ease;
}

/* Colapsado */
#sidebar.collapsed {
    width: 70px;
    transition: all .25s ease;
}

/* Quando o sidebar colapsa */
.main.sidebar-collapsed {
    margin-left: 70px;
    width: calc(100% - 70px);
    transition: all .25s ease;
}

.sidebar-nav {
    list-style: none;
    padding: 0;
    margin: 0;
    width: 100%;
}


/* ------------------------------
   SIDEBAR ITEM (cada linha do menu)
------------------------------- */
.sidebar-item {
    margin: 0rem 0;
}

.sidebar-link-wrapper {
    display: flex;
    align-items: center;
    height: 48px; /* fixa altura do item */
    padding: 0 .8rem;
    width: 100%;
    cursor: pointer;
    text-decoration: none;
    border-left: 3.5px solid var(--destaque-light);
    transition: background-color .2s ease;
}

.sidebar-link-wrapper:hover {
    background-color: var(--secundario-light);
    border-left: 3.5px solid var(--destaque);
}

/* Texto */
a.sidebar-link {
    padding: .625rem 1.625rem;
    color: var(--dark);
    white-space: nowrap;
    width: 100%;
    position: relative;
    text-decoration: none;
}

.sidebar-text {
    font-size: .95rem;
    font-weight: 500;
}

/* Ícones */
.icon-sidebar {
    font-size: 1.3rem;
    min-width: 25px;
    text-align: center;
    margin-left: 0.5rem;
    transition: margin 0.3s ease-in-out;
    color: var(--secundario-dark);
}

/* ------------------------------
   SUBMENU
------------------------------- */
/* Se quiser deslocar o border left do submenu*/
/* .sidebar-submenu {
    padding-left: 2rem;
    padding-top: .25rem;
} */
/* 


/* Indicador de dropdown */
.arrow-dropdown {
    font-size: .8rem;
    opacity: .5;
    transition: transform .25s ease;
}

/* Rotação quando abre */
.sidebar-link[aria-expanded="true"] + .arrow-dropdown {
    transform: rotate(180deg);
    opacity: .9;
}

/* ------------------------------
   COLAPSADO
------------------------------- */

#sidebar.collapsed .sidebar-text {
    display: none;
}

#sidebar.collapsed .arrow-dropdown {
    display: none;
}

#sidebar.collapsed .sidebar-submenu {
    display: none !important;
}


#sidebar.collapsed .sidebar-link-wrapper {
    justify-content: center;
}

/* Ícones no centro quando colapsado */
#sidebar.collapsed .icon-sidebar {
    margin-right: 0 !important;
}

#sidebar.collapsed .sidebar-link-wrapper,
#sidebar.collapsed .sidebar-link {
  padding-left: 0.5rem;
  padding-right: 0.5rem;
}

#sidebar .icon-sidebar {
  cursor: pointer;
}