/**
 * PM SHRI SUNPURA HIGH SCHOOL — Design System Tokens
 * Document ID: 03_DESIGN_SYSTEM
 * Compliance: GIGW 3.0 / WCAG 2.1 Level AA
 */

:root {
  /* Provisional Brand Color Palette (Derived from official logos) */
  --color-primary-provisional: #0A2540;   /* Navy Blue from School Seal */
  --color-primary-dark: #061729;
  --color-primary-light: #163B66;
  
  --color-accent-provisional: #D4AF37;    /* Gold trim from School Seal */
  --color-accent-dark: #A88620;
  
  --color-pmshri-provisional: #E05A2B;    /* Flame Orange from PM SHRI logo */
  --color-pmshri-light: #FFF1EC;

  /* Neutral Surface & Background Tokens */
  --color-background: #F8FAFC;
  --color-surface: #FFFFFF;
  --color-surface-subtle: #F1F5F9;
  --color-border: #CBD5E1;
  --color-border-light: #E2E8F0;

  /* High-Contrast Typography Color Tokens */
  --color-text: #0F172A;                 /* Contrast > 7:1 against surface */
  --color-text-muted: #334155;           /* Contrast > 4.5:1 against surface */
  --color-text-inverse: #FFFFFF;

  /* Semantic Feedback Tokens (Color + Label mandatory) */
  --color-info: #0284C7;
  --color-success: #15803D;
  --color-warning: #B45309;
  --color-error: #B91C1C;

  /* Accessibility Keyboard Focus Indicator */
  --color-focus: #1D4ED8;
  --focus-outline-width: 3px;
  --focus-outline-offset: 3px;

  /* Typography Scale & Font Tokens */
  --font-family-base: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --font-size-display: 2.25rem;          /* 36px */
  --font-size-h1: 1.875rem;              /* 30px */
  --font-size-h2: 1.5rem;                /* 24px */
  --font-size-h3: 1.25rem;               /* 20px */
  --font-size-h4: 1.125rem;              /* 18px */
  --font-size-body: 1rem;                /* 16px */
  --font-size-small: 0.875rem;           /* 14px */
  --font-size-caption: 0.75rem;          /* 12px */
  --line-height-base: 1.5;
  --line-height-heading: 1.25;

  /* Modular 4px Spacing Scale */
  --space-1: 0.25rem;                    /* 4px */
  --space-2: 0.5rem;                     /* 8px */
  --space-3: 0.75rem;                    /* 12px */
  --space-4: 1rem;                       /* 16px */
  --space-5: 1.25rem;                    /* 20px */
  --space-6: 1.5rem;                     /* 24px */
  --space-8: 2rem;                       /* 32px */
  --space-10: 2.5rem;                    /* 40px */
  --space-12: 3rem;                      /* 48px */
  --space-16: 4rem;                      /* 64px */

  /* Structural Container & Radius Tokens */
  --container-max-width: 1200px;
  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-lg: 12px;
  --shadow-subtle: 0 1px 3px rgba(0, 0, 0, 0.08), 0 1px 2px rgba(0, 0, 0, 0.04);
  --shadow-card: 0 4px 6px -1px rgba(0, 0, 0, 0.08), 0 2px 4px -1px rgba(0, 0, 0, 0.04);
}