/* ─────────────────────────────────────────────────────────
   theme.css — Design tokens for the CDN Demo app
   ───────────────────────────────────────────────────────── */

:root {
  /* Azure blues */
  --color-primary:        #0078D4;
  --color-primary-dark:   #005A9E;
  --color-primary-light:  #2899F5;
  --color-primary-muted:  #D0E8F8;

  /* Accent / CDN green */
  --color-accent:         #00B294;
  --color-accent-dark:    #00876E;
  --color-accent-light:   #C7F5EE;

  /* Status */
  --color-hit:            #107C10;
  --color-hit-bg:         #DFF6DD;
  --color-miss:           #D83B01;
  --color-miss-bg:        #FDE7D8;
  --color-warn:           #C19C00;
  --color-warn-bg:        #FFF4CE;

  /* Neutrals */
  --color-bg:             #F4F6FB;
  --color-bg-alt:         #EAECF4;
  --color-surface:        #FFFFFF;
  --color-border:         #D1D5DB;
  --color-text:           #1A1A2E;
  --color-text-muted:     #6B7280;
  --color-text-inverse:   #FFFFFF;

  /* Code */
  --color-code-bg:        #1E2A3B;
  --color-code-text:      #CDD9E5;

  /* Typography */
  --font-sans:   'Segoe UI', system-ui, -apple-system, sans-serif;
  --font-mono:   'Cascadia Code', 'Consolas', 'Courier New', monospace;
  --fs-xs:       0.75rem;
  --fs-sm:       0.875rem;
  --fs-base:     1rem;
  --fs-lg:       1.125rem;
  --fs-xl:       1.25rem;
  --fs-2xl:      1.5rem;
  --fs-3xl:      2rem;
  --fs-4xl:      2.5rem;
  --fw-normal:   400;
  --fw-medium:   500;
  --fw-semibold: 600;
  --fw-bold:     700;
  --lh-tight:    1.25;
  --lh-base:     1.6;

  /* Spacing */
  --sp-1:  0.25rem;
  --sp-2:  0.5rem;
  --sp-3:  0.75rem;
  --sp-4:  1rem;
  --sp-6:  1.5rem;
  --sp-8:  2rem;
  --sp-10: 2.5rem;
  --sp-12: 3rem;
  --sp-16: 4rem;
  --sp-20: 5rem;

  /* Radii */
  --radius-sm:  4px;
  --radius-md:  8px;
  --radius-lg:  12px;
  --radius-xl:  20px;
  --radius-pill: 999px;

  /* Shadows */
  --shadow-sm: 0 1px 3px rgba(0,0,0,.08);
  --shadow-md: 0 4px 12px rgba(0,0,0,.10);
  --shadow-lg: 0 8px 24px rgba(0,0,0,.12);

  /* Transitions */
  --transition-fast: 120ms ease;
  --transition-base: 220ms ease;
}
