/* ============================================
   SentraScan Platform - Responsive Design
   ============================================ */

/* ============================================
   Tablet Styles (max-width: 1023px)
   ============================================ */

@media (max-width: 1023px) {
  .global-search-desktop {
    display: none !important;
  }
  
  .global-search-mobile {
    display: flex !important;
  }

  .nav-desktop {
    display: none;
  }

  .nav-mobile-toggle {
    display: flex !important;
  }

  .user-menu-desktop {
    display: none !important;
  }

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

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

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

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

  .stat-card-icon {
    width: 36px;
    height: 36px;
  }

  .stat-card-icon span {
    font-size: 18px;
  }

  .charts-grid {
    grid-template-columns: 1fr !important;
  }
}

/* ============================================
   Mobile Styles (max-width: 767px)
   ============================================ */

@media (max-width: 767px) {
  .page-header h1 {
    font-size: var(--font-size-xl);
  }

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

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

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

  .stat-card-icon {
    width: 32px;
    height: 32px;
  }

  .stat-card-icon span {
    font-size: 16px;
  }

  .table-container {
    overflow-x: auto;
  }

  .table {
    min-width: 600px;
  }

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

  .form-actions .btn {
    width: 100%;
  }

  .comparison-container {
    grid-template-columns: 1fr !important;
  }

  .baseline-info-cards {
    grid-template-columns: 1fr !important;
  }

  .charts-grid {
    grid-template-columns: 1fr !important;
  }

  .chart-card {
    padding: var(--spacing-md) !important;
  }

  .chart-card h3 {
    font-size: var(--font-size-sm);
  }

  .dashboard-filters .dashboard-filter-form {
    flex-direction: column;
  }

  .dashboard-filters .form-group {
    width: 100%;
  }
}