/* ==========================================================================
   Brandspectra CRM — Responsive
   ========================================================================== */

@media (max-width: 1200px) {
  .stats-grid { grid-template-columns: repeat(3, 1fr); }
  .stats-row { grid-template-columns: repeat(3, 1fr); }
}

@media (max-width: 992px) {
  .sidebar {
    position: fixed;
    left: 0;
    margin-left: calc(-1 * var(--sidebar-width));
  }
  .sidebar.is-open { margin-left: 0; }

  .topbar__menu-toggle { display: flex; }

  .content { padding: 4px 24px 40px; }
  .topbar { padding: 0 24px; }

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

  .welcome-card { flex-wrap: wrap; }
  .welcome-card__portrait { order: -1; }

  .topbar__search { display: none; }
  .chat-btn span:not(.chat-btn__badge) { display: none; }
  .form-grid,
  .form-grid--4 { grid-template-columns: repeat(2, 1fr); }
  .page-header { flex-direction: column; }
}

@media (max-width: 640px) {
  .stats-grid { grid-template-columns: 1fr; }

  .welcome-card { padding: 24px; }
  .welcome-card__heading { font-size: 21px; }

  .topbar { gap: 10px; padding: 0 16px; }
  .content { padding: 4px 16px 32px; }

  .topbar__user-text { display: none; }
  .form-grid,
  .form-grid--2,
  .form-grid--4 { grid-template-columns: 1fr; }
  .panel { padding: 24px 20px 28px; }
  .toolbar-row { flex-direction: column; align-items: stretch; }
  .toolbar-search { max-width: none; }
  .toolbar-actions { justify-content: space-between; }
  .stats-row { grid-template-columns: repeat(2, 1fr); }
  .filter-bar { flex-direction: column; align-items: stretch; }
  .filter-bar .toolbar-search,
  .filter-bar .filter-select,
  .filter-bar .date-range-btn { max-width: none; width: 100%; }
  .tabs { padding: 0 16px; gap: 20px; }
}