/* Responsive: tablet & mobile */

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

  .dashboard-col-side {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: var(--space-6);
  }
}

@media (max-width: 1024px) {
  :root {
    --sidebar-width: 240px;
  }

  .app-content {
    padding: var(--space-5) var(--space-5);
  }

  .stats-grid {
    grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
  }

  .profile-meta {
    display: none;
  }
}

@media (max-width: 768px) {
  .sidebar {
    transform: translateX(-100%);
  }

  body.sidebar-open .sidebar {
    transform: translateX(0);
  }

  .app-main {
    margin-left: 0 !important;
  }

  .topbar-menu-toggle {
    display: inline-flex;
  }

  .topbar-search {
    max-width: none;
    flex: 1;
  }

  .page-header-row {
    flex-direction: column;
  }

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

  .stat-card-value {
    font-size: var(--text-xl);
  }

  .dashboard-col-side {
    grid-template-columns: 1fr;
  }

  .quick-actions {
    flex-direction: column;
  }

  .quick-action-btn {
    justify-content: center;
  }

  .chart-bars {
    height: 120px;
  }
}

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

  .auth-card {
    padding: var(--space-6) var(--space-5);
  }

  .topbar {
    padding: 0 var(--space-4);
  }

  .app-content {
    padding: var(--space-4);
  }
}