@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap');

:root {
  /* ── 4px/8px Geometric Scale ── */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-8: 32px;
  --space-10: 40px;
  --space-12: 48px;

  /* ── Structural Dimensions ── */
  --sidebar-collapsed-w: 64px;
  --sidebar-expanded-w: 240px;
  --header-h: 52px;

  /* ── Surface Colors (Light Mode) ── */
  --bg-app: #F8FAFC;
  --bg-surface: #FFFFFF;
  --bg-surface-elevated: #F1F5F9;
  --bg-surface-hover: #E2E8F0;
  --border-subtle: #E2E8F0;
  --border-strong: #CBD5E1;
  --text-primary: #0F172A;
  --text-secondary: #475569;
  --text-muted: #94A3B8;

  /* ── Brand / Status Colors (Canonical Emerald Green - WCAG AA 4.5:1+) ── */
  --primary: #059669;
  --primary-hover: #047857;
  --primary-focus: rgba(5, 150, 105, 0.35);
  --primary-fg: #FFFFFF;

  --destructive: #DC2626;
  --destructive-hover: #B91C1C;
  --destructive-focus: rgba(220, 38, 38, 0.35);
  --destructive-fg: #FFFFFF;

  --success: #059669;
  --warning: #D97706;

  /* ── Standardized Component Geometry ── */
  --btn-height: 32px;
  --btn-radius: 8px;
  --btn-font-size: 0.75rem;
  --btn-font-weight: 600;
  --filter-bar-height: 48px;
  --filter-bar-radius: 14px;

  /* ── Focus Ring Offsets ── */
  --ring-offset: 2px;
  --ring-width: 2px;
  --transition-fast: 150ms cubic-bezier(0.16, 1, 0.3, 1);
}

.dark {
  /* ── Surface Colors (Dark Mode) ── */
  --bg-app: #0B0F17;
  --bg-surface: #111827;
  --bg-surface-elevated: #1F2937;
  --bg-surface-hover: #374151;
  --border-subtle: #1E293B;
  --border-strong: #334155;
  --text-primary: #F8FAFC;
  --text-secondary: #94A3B8;
  --text-muted: #64748B;

  --primary: #10B981;
  --primary-hover: #059669;
  --primary-focus: rgba(16, 185, 129, 0.35);
  --primary-fg: #0B0F17;

  --destructive: #EF4444;
  --destructive-hover: #DC2626;
  --destructive-focus: rgba(239, 68, 68, 0.35);
  --destructive-fg: #FFFFFF;
}

/* ── Typography & Tabular Numbers ── */
body {
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  background-color: var(--bg-app);
  color: var(--text-primary);
  -webkit-font-smoothing: antialiased;
}

/* Crucial: Tabular Numbers on All Numbers, Counters, and Metrics to Prevent Layout Shift */
.tnum, table, .metric-value, .badge, .tabular-nums, [data-tnum] {
  font-variant-numeric: tabular-nums lining-nums;
  font-feature-settings: "tnum" 1, "lnum" 1;
}

/* Natural Case on Tabs and Table Headers (No uppercase forcing) */
.mud-tab, .mud-tab-slider, .mud-tabs-tabbar, [role="tab"] {
  text-transform: none !important;
  letter-spacing: normal !important;
}

table thead th, .mud-table-head th, .mud-table-cell.mud-table-header-cell, th {
  text-transform: none !important;
  letter-spacing: normal !important;
}