/* ==========================================================
   Digital Blink CRM - Responsive Rules · v3
   ========================================================== */

@media (max-width: 1200px){
  .kpi-grid{grid-template-columns:repeat(auto-fit,minmax(200px,1fr));}
  .search-wrap input{width:240px;}
  .search-wrap input:focus{width:300px;}
}

@media (max-width: 1100px){
  .grid-2{grid-template-columns:1fr;}
  .grid-3{grid-template-columns:repeat(2,1fr);}
  .grid-4{grid-template-columns:repeat(2,1fr);}
  .ticket-hero{grid-template-columns:1fr;}
  .auth-shell{grid-template-columns:1fr;}
  .auth-left{padding:40px 32px 0;}
  .auth-left h1{font-size:38px;}
}

@media (max-width: 900px){
  .app-shell{grid-template-columns:1fr;}
  .sidebar{position:fixed;left:-280px;top:0;width:260px;z-index:120;transition:left .3s ease;box-shadow:var(--shadow-lg);}
  .sidebar.open{left:0;}
  .hamburger{display:inline-flex;}
  .search-wrap{display:none;}
  .topbar{padding:12px 16px;}
  .user-meta{display:none;}
  .form-grid{grid-template-columns:1fr;}
  .req-grid{grid-template-columns:repeat(2,1fr);}
  .grid-3,.grid-4{grid-template-columns:1fr;}
  .ticket-meta-grid{grid-template-columns:1fr;}
  .kpi-grid{grid-template-columns:repeat(2,1fr);}
  .alert-popup{right:12px;left:12px;width:auto;}
}

@media (max-width: 640px){
  .auth-left{padding:30px 24px 0;}
  .auth-left h1{font-size:30px;}
  .auth-right{padding:24px;}
  .auth-card{padding:26px;}
  .page-body{padding:14px;}
  .page-head h1{font-size:20px;}
  .page-head .actions{width:100%;}
  .kpi-grid{grid-template-columns:1fr;}
  .kpi-card{padding:16px;}
  .kpi-card .kpi-value{font-size:22px;}
  .topbar-title .muted{display:none;}
  .req-grid{grid-template-columns:1fr;}
  .date-filter{padding:8px 10px;}
  .date-filter .chip{padding:6px 10px;font-size:12px;}
  table.dt thead{display:none;}
  table.dt tbody td{display:block;border:none;padding:6px 0;}
  table.dt tbody tr{display:block;background:var(--surface);border:1px solid var(--line);
                     border-radius:12px;padding:12px;margin-bottom:10px;}
  table.dt tbody td::before{content:attr(data-label);display:block;font-size:11px;color:var(--muted);
                             text-transform:uppercase;letter-spacing:.4px;font-weight:600;margin-bottom:2px;}
  .modal-card{max-width:100%;}
  .toast-stack{left:12px;right:12px;}
  .toast{min-width:auto;max-width:100%;}
}

@media (max-width: 480px){
  .topbar-actions{gap:6px;}
  .icon-btn{width:34px;height:34px;font-size:14px;}
  .user-chip{padding:3px 6px 3px 3px;}
  .avatar{width:28px;height:28px;font-size:12px;}
  .page-head h1{font-size:18px;}
  .cal-cell{min-height:64px;font-size:10px;}
  .cal-cell .ev{font-size:10px;padding:2px 4px;}
}