/* =========================================================
   BrioCom Solutions — Modular CSS
   sidebar.css
   Refactored from the original Time Tracking Workspace CSS.
   ========================================================= */

/* =========================================================
   7. LEFT SIDEBAR
   ========================================================= */

.freelancer-sidebar {

    position: sticky;
    top: 74px;

    height:
        calc(100vh - 74px);

    overflow-y: auto;

    padding:
        22px 16px;

    background:
        linear-gradient(
            180deg,
            #090909,
            #070707
        );

    border-right:
        1px solid var(--border);
}


/* SIDEBAR SCROLLBAR */

.freelancer-sidebar::-webkit-scrollbar,
.quick-tools-panel::-webkit-scrollbar {

    width: 5px;
}

.freelancer-sidebar::-webkit-scrollbar-thumb,
.quick-tools-panel::-webkit-scrollbar-thumb {

    background: #333;

    border-radius: 10px;
}


/* =========================================================


/* =========================================================
   8. WORKSPACE MENU
   ========================================================= */

.workspace-menu-section {

    margin-bottom: 24px;
}


.workspace-menu-label {

    display: block;

    margin:
        0 10px
        9px;

    color: #666;

    font-size: 11px;
    font-weight: 800;

    letter-spacing: .12em;
}


.sidebar-link {

    display: flex;
    align-items: center;

    gap: 12px;

    min-height: 45px;

    margin-bottom: 4px;

    padding:
        8px 11px;

    color: #aaa;

    font-size: 13px;
    font-weight: 500;

    text-decoration: none;

    border:
        1px solid transparent;

    border-radius: 9px;

    transition:
        color .2s ease,
        background .2s ease,
        border .2s ease,
        transform .2s ease;
}


.sidebar-link:hover {

    color: #fff;

    background:
        rgba(220,38,38,.08);

    border-color:
        rgba(220,38,38,.15);

    transform:
        translateX(2px);
}


.sidebar-link.active {

    color: #fff;

    background:
        rgba(220,38,38,.13);

    border-color:
        rgba(220,38,38,.28);

    box-shadow:
        inset 3px 0 0 var(--red);
}


.workspace-icon {

    width: 25px;

    text-align: center;

    color: var(--red);

    font-size: 16px;
}


/* SIDEBAR FOOTER */

.workspace-sidebar-footer {

    margin-top: 35px;

    padding:
        16px 10px;

    border-top:
        1px solid #222;

    text-align: center;
}


.workspace-sidebar-footer span {

    display: block;

    color: #aaa;

    font-size: 10px;
    font-weight: 800;

    letter-spacing: .08em;
}


.workspace-sidebar-footer small {

    display: block;

    margin-top: 4px;

    color: #555;

    font-size: 10px;
}


/* =========================================================


/* =========================================================
   34. SIDEBAR OVERLAY
   ========================================================= */

.sidebar-overlay {

    display: none;
}


/* =========================================================

