.erp-sidebar{

    width:260px;

    background:var(--sidebar);

    color:#fff;

    display:flex;

    flex-direction:column;

    border-right:1px solid rgba(255,255,255,.08);

}

.erp-sidebar__brand{

    display:flex;

    align-items:center;

    gap:15px;

    padding:24px;

    border-bottom:1px solid rgba(255,255,255,.08);

}

.erp-logo{

    width:48px;

    height:48px;

    border-radius:14px;

    background:var(--primary);

    display:flex;

    align-items:center;

    justify-content:center;

    font-weight:bold;

    color:#fff;

}

.erp-brand h3{

    margin:0;

    font-size:20px;

}

.erp-brand small{

    color:#9ca3af;

}

.erp-nav{

    flex:1;

    overflow:auto;

    padding:15px;

}

.erp-nav-group{

    margin-bottom:25px;

}

.erp-nav-title{

    font-size:12px;

    text-transform:uppercase;

    color:#7f8da5;

    margin-bottom:10px;

    padding-left:10px;

}

.erp-nav-link{

    display:flex;

    align-items:center;

    gap:12px;

    padding:12px 14px;

    border-radius:12px;

    color:#dbe3ef;

    text-decoration:none;

    transition:.2s;

}

.erp-nav-link:hover{

    background:var(--sidebar-hover);

    color:#fff;

}

.erp-nav-link.active{

    background:var(--primary);

    color:#fff;

}

html.sidebar-collapsed .erp-sidebar{

    width:80px;

}

html.sidebar-collapsed .erp-brand,
html.sidebar-collapsed .erp-nav-title,
html.sidebar-collapsed .erp-nav-link span{

    display:none;

}

html.sidebar-collapsed .erp-nav-link{

    justify-content:center;

}

/* ==========================================================
   MOBILE / TABLET (off-canvas меню)
========================================================== */

.sidebar-backdrop{

    display:none;

}

@media(max-width:992px){

    .erp-sidebar{

        position:fixed;

        top:0;

        left:0;

        height:100vh;

        z-index:1000;

        transform:translateX(-100%);

        transition:transform .25s ease;

        box-shadow:0 0 40px rgba(0,0,0,.35);

    }

    /* На мобилен, състоянието "collapsed" от desktop не важи - менюто е или напълно скрито, или напълно показано. */
    html.sidebar-collapsed .erp-sidebar{

        width:260px;

    }

    html.sidebar-collapsed .erp-brand{

        display:block;

    }

    html.sidebar-collapsed .erp-nav-title{

        display:block;

    }

    html.sidebar-collapsed .erp-nav-link span{

        display:inline;

    }

    html.sidebar-collapsed .erp-nav-link{

        justify-content:flex-start;

    }

    html.mobile-sidebar-open .erp-sidebar{

        transform:translateX(0);

    }

    html.mobile-sidebar-open .sidebar-backdrop{

        display:block;

        position:fixed;

        inset:0;

        background:rgba(15,23,42,.5);

        z-index:999;

    }

}