/* =====================================================================
   ACERS - responsive layout
     < 768px      sidebar is a Bootstrap offcanvas
     768–1199px   icon-only rail; expands as an overlay (body.sidebar-expanded)
     ≥ 1200px     permanent sidebar; user may collapse it (body.sidebar-mini)
   body.sidebar-mini is maintained by ACERSLayout.applySidebar().
   ===================================================================== */

@media (min-width: 768px) {
    .app-sidebar {
        position: fixed;
        top: 0;
        bottom: 0;
        left: 0;
        z-index: 1035;
        width: var(--sidebar-full);
        transition: width .2s ease;
    }
    .app-sidebar .sidebar-panel { width: 100%; }
    .app-main {
        margin-left: var(--sidebar-full);
        transition: margin-left .2s ease;
    }

    /* Icon-only rail */
    .sidebar-mini .app-sidebar { width: var(--sidebar-mini); }
    .sidebar-mini .app-main { margin-left: var(--sidebar-mini); }
    .sidebar-mini .sidebar-brand { padding: 0; justify-content: center; }
    .sidebar-mini .sidebar-brand-text,
    .sidebar-mini .sidebar-label,
    .sidebar-mini .sidebar-soon { display: none; }
    .sidebar-mini .sidebar-nav { padding: 0 .75rem 1rem; }
    .sidebar-mini .sidebar-profile { padding: .25rem 0 1rem; }
    .sidebar-mini .sidebar-profile .hello,
    .sidebar-mini .sidebar-profile .role { display: none; }
    .sidebar-mini .sidebar-profile .avatar-lg { width: 2.75rem; height: 2.75rem; font-size: .85rem; margin: 0; }
    .sidebar-mini .sidebar-section-title {
        height: 1px;
        margin: .6rem .5rem;
        padding: 0;
        overflow: hidden;
        background: var(--acers-border);
        color: transparent;
    }
    .sidebar-mini .sidebar-section:first-child .sidebar-section-title { display: none; }
    .sidebar-mini .sidebar-link { justify-content: center; padding: .65rem 0; }
    .sidebar-mini .sidebar-footer { visibility: hidden; }
}

/* Tablet: the rail is always the resting width; expanding overlays the content. */
@media (min-width: 768px) and (max-width: 1199.98px) {
    .app-main { margin-left: var(--sidebar-mini); }
    .sidebar-expanded .app-sidebar { box-shadow: 0 0 40px rgba(12, 42, 74, .2); }
    .sidebar-expanded .sidebar-backdrop {
        display: block;
        position: fixed;
        inset: 0;
        z-index: 1034;
        background: rgba(12, 42, 74, .35);
    }
}

@media (max-width: 767.98px) {
    .app-content { padding: 1rem; }
    .topbar { padding: 0 .75rem; gap: .5rem; height: 64px; }
    .btn-round, .avatar { width: 2.4rem; height: 2.4rem; }
    .app-footer { padding: .85rem 1rem; }
}

.table-responsive { -webkit-overflow-scrolling: touch; }

@media print {
    .app-sidebar, .topbar, .app-footer, .sidebar-backdrop, .toast-container { display: none !important; }
    .app-main { margin-left: 0 !important; }
    .app-content { padding: 0; }
}
