/* KairoZen Control - Light-Theme B2B Infrastructure Design System Tokens */

:root {
  /* Surface & Canvas Colors */
  --bg-app: #FAFAFC;
  --bg-surface-0: #FFFFFF;
  --bg-surface-1: #F4F5F8;
  --bg-surface-2: #EBECEF;
  --bg-surface-subtle: #F1F5F9;
  --bg-surface-dark: #0F172A;
  
  /* Border & Line Systems */
  --border-subtle: #E2E8F0;
  --border-medium: #CBD5E1;
  --border-strong: #94A3B8;
  --border-accent: rgba(37, 99, 235, 0.3);

  /* Typography Color Scale */
  --text-primary: #0F172A;
  --text-secondary: #475569;
  --text-tertiary: #64748B;
  --text-muted: #94A3B8;
  --text-inverse: #FFFFFF;

  /* Brand Technology Accents */
  --accent-primary: #2563EB;
  --accent-primary-hover: #1D4ED8;
  --accent-primary-light: #EFF6FF;
  
  --accent-teal: #0D9488;
  --accent-teal-light: #CCFBF1;
  
  --accent-purple: #7C3AED;
  --accent-purple-light: #F3E8FF;

  /* Status Colors */
  --status-healthy-bg: #ECFDF5;
  --status-healthy-border: #A7F3D0;
  --status-healthy-text: #047857;

  --status-warning-bg: #FFFBEB;
  --status-warning-border: #FDE68A;
  --status-warning-text: #B45309;

  --status-critical-bg: #FEF2F2;
  --status-critical-border: #FECACA;
  --status-critical-text: #B91C1C;

  --status-info-bg: #EFF6FF;
  --status-info-border: #BFDBFE;
  --status-info-text: #1D4ED8;

  /* Shadow Elevation System */
  --shadow-xs: 0px 1px 2px rgba(15, 23, 42, 0.04);
  --shadow-sm: 0px 2px 4px rgba(15, 23, 42, 0.06);
  --shadow-md: 0px 4px 12px rgba(15, 23, 42, 0.08);
  --shadow-lg: 0px 12px 32px rgba(15, 23, 42, 0.10);
  --shadow-hover: 0px 12px 24px -4px rgba(37, 99, 235, 0.08);

  /* Typography Specs */
  --font-sans: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  --font-mono: 'JetBrains Mono', ui-monospace, SFMono-Regular, Menlo, monospace;

  /* Radius System */
  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-lg: 12px;
  --radius-xl: 16px;
  --radius-full: 9999px;

  /* Transition Speeds */
  --transition-fast: 150ms cubic-bezier(0.4, 0, 0.2, 1);
  --transition-normal: 250ms cubic-bezier(0.4, 0, 0.2, 1);
}
