/* ============================================================
   WORKSTATION CRIATOR — responsive.css
   Ajustes por breakpoint. Carregar por último.
   ============================================================ */

@media (max-width:980px){
  .chart-grid{grid-template-columns:1fr;}
  .auth-visual{display:none;}
  .auth-form-brand{display:inline-flex;}
  .auth-form-side{padding:32px 24px;align-items:flex-start;padding-top:56px;}
}

@media (max-width:720px){
  .sidebar{position:fixed;left:-280px;top:0;bottom:0;z-index:46;box-shadow:var(--shadow-lg);height:100vh;width:264px;min-width:264px;}
  .sidebar.mobile-open{left:0;}
  .mobile-menu-btn{display:flex;}
  .sidebar.mobile-open ~ .sidebar-scrim,.app:has(.sidebar.mobile-open) .sidebar-scrim{display:block;position:fixed;inset:0;background:rgba(11,23,41,0.5);z-index:45;}
  #collapseBtn{display:none;}
  /* Chrome da topbar some sob o scrim quando o drawer abre */
  .app:has(.sidebar.mobile-open) .topbar-actions{opacity:0;pointer-events:none;transition:opacity .15s var(--ease);}

  /* Alvos de toque >= 44px no drawer */
  .nav-item{padding:12px 10px;}
  .side-action-btn{padding:12px;}
  .sidebar-footer{padding:14px 10px 0;font-size:var(--text-sm);}
  .sidebar-footer svg{width:18px;height:18px;}

  /* Topbar em UMA linha: título curto, ações viram ícones, chip vira só avatar */
  .topbar{height:auto;min-height:56px;padding:10px 16px;flex-wrap:nowrap;gap:8px;}
  .tb-left{flex:1;min-width:0;}
  .topbar-title h1,.topbar-title h2{font-size:var(--text-md);}
  .topbar-title p,.topbar-title .crumb{display:none;}
  .topbar-actions{gap:4px;flex-shrink:0;}
  .topbar-actions .tb-link{font-size:0;width:36px;height:36px;padding:0;justify-content:center;}
  .topbar-actions .tb-link svg{width:18px;height:18px;}
  .user-chip{padding:4px;border-left:none;gap:0;}
  .user-chip .user-meta,.user-chip .chev{display:none;}

  .content{padding:16px;}
  .hero-row{align-items:flex-start;gap:12px;margin-bottom:12px;}
  .hero-row p{display:none;}

  /* KPIs: 2-up sempre; card horizontal para não ficar oco */
  .kpi-grid{grid-template-columns:repeat(2,1fr);gap:12px;}
  .kpi-card{padding:16px;}
  .kpi-card .kc-value{margin-top:8px;font-size:var(--text-xl);}

  .module-grid{grid-template-columns:1fr;}
  .module-card{gap:12px;padding:16px;}
  .module-card .mc-body p{min-height:0;}

  .builder-grid{flex-direction:column;}
  .builder-left{flex:1 1 auto;width:100%;}
  .auth-row-2{grid-template-columns:1fr;}

  /* Toolbar: busca full, secundários em 2 colunas, primário full */
  .toolbar-left,.toolbar-right{display:grid;grid-template-columns:1fr 1fr;gap:8px;width:100%;flex:1 1 100%;}
  .search-box{grid-column:1 / -1;max-width:none;min-width:0;}
  .toolbar .btn{width:100%;justify-content:center;}
  #addRecordBtn{grid-column:1 / -1;}

  .modal-foot{flex-direction:column-reverse;}
  .modal-foot .btn{width:100%;}
  .icon-picker{grid-template-columns:repeat(5,1fr);}
  .record-grid{grid-template-columns:1fr;gap:12px;}
  .record-grid .field{flex-direction:column;align-items:stretch;gap:6px;}
  .record-grid .field > label{flex:none;text-align:left;}
  table.dt{min-width:560px;}
}