/* Hallmark · theme: custom-meddata-dz · genre: modern-minimal · macrostructure: Stat-Led
 * axes: paper: light (98%) · display: geometric-sans (Plus Jakarta Sans) · accent: cyan-blue (oklch 68% 0.16 220)
 * nav: N5 Floating pill · footer: Ft5 Statement
 * contrast: pass (WCAG AAA/AA)
 */

:root {
  /* OKLCH Palette anchored on MedData DZ Logo */
  --color-paper:        oklch(98.5% 0.006 230);    /* Clean crisp canvas */
  --color-paper-2:      oklch(96.5% 0.010 230);    /* Elevated card / section background */
  --color-paper-3:      oklch(93.5% 0.015 230);    /* Sub-card / hover surface */
  --color-paper-dark:   oklch(16.0% 0.035 245);    /* Midnight Navy deep contrast surface */
  --color-paper-dark-2: oklch(20.0% 0.040 245);    /* Elevated dark card */
  
  --color-ink:          oklch(17.0% 0.035 245);    /* Primary Ink - Deep Navy */
  --color-ink-muted:    oklch(46.0% 0.025 240);    /* Secondary Ink - Slate */
  --color-ink-subtle:   oklch(62.0% 0.018 235);    /* Subtle Ink - Cool Grey */
  --color-ink-light:    oklch(96.0% 0.008 230);    /* Text on dark surfaces */
  --color-ink-light-muted: oklch(75.0% 0.015 230); /* Muted text on dark */

  --color-accent:       oklch(66.0% 0.180 220);    /* Electric Cyan Blue (#00A3E0) */
  --color-accent-hover: oklch(60.0% 0.190 220);    /* Darker Cyan for hover */
  --color-accent-subtle:oklch(94.0% 0.040 220);    /* Ice Blue soft tint */
  --color-accent-dark:  oklch(35.0% 0.110 235);    /* Deep Blue accent */

  --color-rule:         oklch(90.0% 0.010 230);    /* Hairline border */
  --color-rule-dark:    oklch(28.0% 0.025 245);    /* Dark border */
  --color-focus:        oklch(66.0% 0.180 220);    /* Focus ring */
  --color-badge:        oklch(94.5% 0.025 220);    /* Badge background */
  --color-badge-text:   oklch(32.0% 0.100 235);    /* Badge text */

  /* Typography System (Display + Body + Outlier Mono) */
  --font-display:       'Plus Jakarta Sans', system-ui, -apple-system, sans-serif;
  --font-body:          'Plus Jakarta Sans', system-ui, -apple-system, sans-serif;
  --font-mono:          'JetBrains Mono', 'Geist Mono', monospace;

  /* Type Scale (Major Third - 1.25 ratio) */
  --text-xs:            0.75rem;    /* 12px */
  --text-sm:            0.875rem;   /* 14px */
  --text-base:          1rem;       /* 16px */
  --text-md:            1.125rem;   /* 18px */
  --text-lg:            1.25rem;    /* 20px */
  --text-xl:            1.5625rem;  /* 25px */
  --text-2xl:           1.953rem;   /* 31.25px */
  --text-3xl:           2.441rem;   /* 39px */
  --text-4xl:           3.052rem;   /* 48.8px */
  --text-display:       clamp(2.75rem, 5vw + 1rem, 5.25rem);
  --text-stat:          clamp(3.5rem, 7vw + 1rem, 7.5rem);

  /* Spacing System (4-pt base) */
  --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 */
  --space-20:           5rem;       /* 80px */
  --space-24:           6rem;       /* 96px */
  --space-32:           8rem;       /* 128px */

  /* Layout Containers */
  --container-max:      1240px;
  --container-narrow:   840px;

  /* Motion & Easings */
  --ease-out:           cubic-bezier(0.16, 1, 0.3, 1);
  --ease-in:            cubic-bezier(0.7, 0, 0.84, 0);
  --ease-in-out:        cubic-bezier(0.65, 0, 0.35, 1);

  --dur-micro:          120ms;
  --dur-short:          220ms;
  --dur-medium:         340ms;
  --dur-long:           480ms;

  /* Radii */
  --radius-sm:          4px;
  --radius-md:          8px;
  --radius-lg:          14px;
  --radius-full:        9999px;

  /* Shadows (Subtle, tactile) */
  --shadow-sm:          0 1px 2px rgba(10, 25, 47, 0.04);
  --shadow-md:          0 4px 12px rgba(10, 25, 47, 0.06);
  --shadow-lg:          0 12px 32px rgba(10, 25, 47, 0.08);
  --shadow-pill:        0 8px 24px -4px rgba(10, 25, 47, 0.08), 0 2px 6px -1px rgba(10, 25, 47, 0.04);
}