/* ── Mobile (320-480px) ─────────────────────────────────────────────────────── */
@media (max-width: 480px) {
  .hamburger { display: flex; }
  .sidebar { transform: translateX(-100%); }
  .sidebar.sidebar-open { transform: translateX(0); }
  .main-content { margin-left: 0; }

  .kanban-board { grid-template-columns: 1fr; overflow-x: auto; display: flex; flex-wrap: nowrap; gap: .75rem; padding-bottom: .5rem; }
  .kanban-col { min-width: 280px; flex-shrink: 0; }

  .page-header { flex-direction: column; align-items: flex-start; }
  .filters-bar { flex-direction: column; align-items: stretch; }
  .filters-bar .form-control { width: 100%; }

  .form-row-2, .form-row-3 { grid-template-columns: 1fr; }

  .stats-grid { grid-template-columns: 1fr 1fr; }

  /* Tabelas viram cards */
  .table-card-view thead { display: none; }
  .table-card-view tbody tr {
    display: block; margin-bottom: .75rem;
    border: 1px solid var(--border); border-radius: var(--radius);
    padding: .75rem; background: var(--bg-card);
  }
  .table-card-view tbody td {
    display: flex; justify-content: space-between; align-items: center;
    padding: .35rem 0; border: none; font-size: .85rem;
  }
  .table-card-view tbody td::before {
    content: attr(data-label);
    font-weight: 600; color: var(--text-muted); font-size: .78rem;
  }

  .user-info { display: none; }
  .login-card { padding: 1.75rem 1.25rem; }
  .modal-box { max-height: 95vh; }
  .modal-footer { flex-direction: column-reverse; }
  .modal-footer .btn { width: 100%; justify-content: center; }

  .btn-checkin { width: 100%; }
}

/* ── Tablet (481-768px) ─────────────────────────────────────────────────────── */
@media (min-width: 481px) and (max-width: 768px) {
  .hamburger { display: flex; }
  .sidebar { transform: translateX(-100%); }
  .sidebar.sidebar-open { transform: translateX(0); box-shadow: var(--shadow-md); }
  .main-content { margin-left: 0; }

  .kanban-board { grid-template-columns: repeat(2, 1fr); overflow-x: auto; }

  .form-row-3 { grid-template-columns: 1fr 1fr; }
  .stats-grid { grid-template-columns: repeat(2, 1fr); }
}

/* ── Desktop (769-1100px) ────────────────────────────────────────────────────── */
@media (min-width: 769px) and (max-width: 1100px) {
  .kanban-board { grid-template-columns: repeat(2, 1fr); }
}

/* ── Desktop grande (1101px+) ────────────────────────────────────────────────── */
@media (min-width: 1101px) {
  .kanban-board { grid-template-columns: repeat(4, 1fr); }
}

/* ── Sidebar overlay em mobile ───────────────────────────────────────────────── */
@media (max-width: 768px) {
  .sidebar-overlay {
    display: none; position: fixed; inset: 0; background: rgba(0,0,0,.4); z-index: 89;
  }
  .sidebar-overlay.visible { display: block; }
}
