/* =========================================================
   WorkForce Admin — Responsive Rules
   ========================================================= */

/* ---- Tablet & below: sidebar becomes off-canvas ---- */
@media (max-width: 991.98px){
  .sidebar{
    transform:translateX(-100%);
    width:var(--sidebar-w);
  }
  .app-shell.sidebar-mobile-open .sidebar{
    transform:translateX(0);
  }
  .app-shell.sidebar-mobile-open .sidebar-overlay{
    display:block;
  }
  .main-wrap{margin-left:0;}
  .topbar{left:0;}
  .app-shell.sidebar-collapsed .main-wrap{margin-left:0;}
  .app-shell.sidebar-collapsed .topbar{left:0;}
  .app-shell.sidebar-collapsed .sidebar{width:var(--sidebar-w);}
  .app-shell.sidebar-collapsed .sidebar-brand .brand-text,
  .app-shell.sidebar-collapsed .sidebar-section-label,
  .app-shell.sidebar-collapsed .sidebar-nav .nav-link span{
    display:block;
  }
  .app-shell.sidebar-collapsed .sidebar-nav .nav-link{justify-content:flex-start;}

  .sidebar-desktop-collapse{display:none;}
}

@media (min-width: 992px){
  .sidebar-mobile-close{display:none;}
}

/* ---- Page paddings ---- */
@media (max-width: 767.98px){
  .page-content{padding:1rem;}
  .topbar{padding:0 .9rem;}
  .page-subtitle{display:none;}
  .admin-chip .who{display:none;}
  .admin-chip{padding:.3rem;}
}

@media (max-width: 575.98px){
  .stat-card{padding:1.05rem;}
  .stat-card .stat-value{font-size:1.5rem;}
  .filter-bar{flex-direction:column; align-items:stretch;}
  .filter-bar > *{width:100%;}
  .modal-body{padding:1.1rem;}
  .card-body{padding:1rem;}
  .page-title{font-size:1rem;}
}

/* ---- Table responsiveness: card-list on very small screens ---- */
@media (max-width: 575.98px){
  .table-responsive-cards table thead{display:none;}
  .table-responsive-cards table, 
  .table-responsive-cards tbody,
  .table-responsive-cards tr,
  .table-responsive-cards td{
    display:block;
    width:100%;
  }
  .table-responsive-cards tbody tr{
    border:1px solid var(--border);
    border-radius:12px;
    margin-bottom:.8rem;
    padding:.6rem .8rem;
    box-shadow:var(--shadow-sm);
  }
  .table-responsive-cards tbody td{
    border-bottom:1px dashed var(--border);
    padding:.55rem .1rem;
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:.6rem;
    text-align:right;
  }
  .table-responsive-cards tbody td:last-child{border-bottom:none;}
  .table-responsive-cards tbody td::before{
    content:attr(data-label);
    font-family:var(--font-mono);
    font-size:.65rem;
    text-transform:uppercase;
    letter-spacing:.06em;
    color:var(--slate-500);
    text-align:left;
    font-weight:600;
  }
  .table-responsive-cards tbody td.cell-actions{justify-content:flex-end;}
  .table-responsive-cards tbody td.cell-actions::before{display:none;}
}

/* ---- Dashboard grid tweaks ---- */
@media (max-width: 575.98px){
  .quick-actions-grid{grid-template-columns:repeat(2,1fr) !important;}
}

/* ---- Ensure modals are comfortable on mobile ---- */
@media (max-width: 575.98px){
  .modal-dialog{margin:.6rem;}
}

/* ---- Print-safe hide for sidebar/topbar (not required but polish) ---- */
@media print{
  .sidebar, .topbar{display:none;}
  .main-wrap{margin-left:0;}
}
