/* ============================================================
   Drug Access Canada — Web Design Tokens  v1.0 (Sep 2026)
   Single source of truth for the website build.
   Decisions locked 29 Sep 2026:
   · True Navy #000E60 (brand guide)   · Ubuntu Sans headings/UI
   · Lora body copy (digital guide)    · Red = primary, Navy = secondary
   · Two hero tiers                    · Navy nav bar w/ on-dark hairline
   ============================================================ */

/* Fonts are self-hosted in fonts.css; token values below match the approved source. */

:root {
  /* ---- Brand palette (brand guide 02) ---- */
  --dac-true-navy:      #000E60;
  --dac-canadian-red:   #FF2D2D;
  --dac-clean-white:    #FFFFFF;
  --dac-rich-black:     #141414;
  --dac-morning-glory:  #6D6BEA;
  --dac-deep-crimson:   #5F0000;
  --dac-calm-lavender:  #E5E4FF;

  /* ---- Navy ramp ---- */
  --dac-navy-900: #00073A;
  --dac-navy-800: #000E60;
  --dac-navy-700: #101A78;
  --dac-navy-600: #1E2A93;

  /* ---- Morning Glory ramp ---- */
  --dac-peri-700: #4A47C9;  /* accent text on light — AA */
  --dac-peri-600: #6D6BEA;
  --dac-peri-500: #8A88F0;
  --dac-peri-300: #B6B5F6;  /* accent text on navy — AA */
  --dac-peri-100: #E5E4FF;  /* = Calm Lavender */
  --dac-peri-050: #F3F3FF;  /* band / quiet surface */

  /* ---- Red ramp ---- */
  --dac-red-700: #C81E1E;
  --dac-red-600: #FF2D2D;
  --dac-red-500: #FF4632;
  --dac-red-100: #FFE6E3;

  /* ---- Neutrals ---- */
  --dac-ink-900:  #141414;
  --dac-ink-700:  #33343F;
  --dac-ink-500:  #5C5E70;
  --dac-ink-300:  #AEAFBC;
  --dac-line-200: #E2E2EC;
  --dac-line-100: #EFEFF5;

  /* ============ SEMANTIC ALIASES ============ */
  --surface-page:        var(--dac-clean-white);
  --surface-band:        var(--dac-peri-050);
  --surface-card:        var(--dac-clean-white);
  --surface-inverse:     var(--dac-true-navy);
  --surface-inverse-2:   var(--dac-navy-900);
  --surface-accent-soft: var(--dac-calm-lavender);
  --surface-selected:    var(--dac-red-100);

  --text-strong:          var(--dac-true-navy);
  --text-body:            var(--dac-ink-700);
  --text-muted:           var(--dac-ink-500);
  --text-on-dark:         var(--dac-clean-white);
  --text-on-dark-muted:   rgba(255,255,255,0.78);
  --text-accent:          var(--dac-peri-700);
  --text-accent-on-dark:  var(--dac-peri-300);
  --text-highlight:       var(--dac-canadian-red);
  --text-link:            var(--dac-true-navy);
  --bg-page:              var(--surface-page);   /* legacy alias */
  --dac-lavender:         var(--dac-calm-lavender); /* legacy alias */

  --action-primary:          var(--dac-canadian-red);
  --action-primary-hover:    #FF4E39;
  --action-primary-press:    var(--dac-red-700);
  --action-cta:              var(--action-primary);   /* legacy alias */
  --action-cta-hover:        var(--action-primary-hover);
  --action-secondary:        var(--dac-true-navy);
  --action-secondary-hover:  #2D3AB0;

  --border-subtle:  var(--dac-line-200);
  --border-strong:  var(--dac-ink-300);
  --border-on-dark: #293579;
  --focus-ring:     var(--dac-morning-glory);

  --status-success: #177A4E;
  --status-success-tint: #DCF3E8;
  --surface-neutral-tint: var(--dac-line-100);
  --status-warning: #C77700;
  --status-danger:  var(--dac-red-700);
}

/* ============ TYPOGRAPHY ============ */
:root {
  --font-display: "Ubuntu Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-ui:      "Ubuntu Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-serif:   "Lora", Georgia, "Times New Roman", serif;

  --fw-regular: 400; --fw-medium: 500; --fw-semibold: 600; --fw-bold: 700;

  /* Desktop scale — integer px only */
  --text-display: 48px;  /* Hero H1, both tiers */
  --text-h1:      48px;  /* alias of --text-display */
  --text-h2:      32px;  /* section title  */
  --text-h3:      24px;
  --text-h4:      20px;
  --text-h5:      18px;
  --text-lead:    18px;  /* Lora */
  --text-base:    16px;  /* Lora body / UI */
  --text-sm:      14px;
  --text-xs:      13px;
  --text-eyebrow: 13px;
  --text-caption: 12px;

  --lh-tight: 1.08; --lh-snug: 1.2; --lh-normal: 1.5; --lh-relaxed: 1.65;
  --ls-display: -0.02em; --ls-heading: -0.01em; --ls-eyebrow: 0.16em;
}

/* ============ SPACE · RADII · LAYOUT ============ */
:root {
  --space-1: 4px;  --space-2: 8px;  --space-3: 12px; --space-4: 16px;
  --space-5: 24px; --space-6: 32px; --space-7: 48px; --space-8: 64px;
  --space-9: 96px;

  --radius-xs:   8px;    /* legacy alias of sm */
  --radius-sm:   8px;    /* inputs, list rows, icon tiles */
  --radius-md:   16px;   /* cards, accordions */
  --radius-lg:   24px;   /* media, feature panels */
  --radius-pill: 999px;  /* buttons, chips, search */

  --container:   1200px;
  --container-text: 760px;
  --gutter:      64px;
  --section-y:   64px;
  --hero-y:      64px;
  --nav-height:  76px;
}

/* ============ ELEVATION · GRADIENTS · MOTION ============ */
:root {
  /* Three shadows only */
  --shadow-card: 0 10px 30px rgba(0,14,96,0.12);  /* cards, lists, accordions, forms */
  --shadow-lg:   0 24px 60px rgba(0,14,96,0.18);  /* hero media on light (Tier 1) heroes */
  --shadow-on-dark: 0 24px 60px rgba(0,0,0,0.4);  /* hero media on navy (Tier 2) heroes */
  /* legacy aliases — do not use in new code */
  --shadow-xs:   var(--shadow-card);
  --shadow-sm:   var(--shadow-card);
  --shadow-md:   var(--shadow-card);
  --shadow-focus: 0 0 0 3px rgba(109,107,234,0.45);

  --grad-hero-light: linear-gradient(135deg, #EDEBFA 0%, #E5E4FF 55%, #F7EEF1 100%);
  --grad-navy:       linear-gradient(150deg, #00073A 0%, #000E60 55%, #1E2A93 100%);

  --ease-standard: cubic-bezier(0.4, 0, 0.2, 1);
  --ease-out:      cubic-bezier(0.16, 1, 0.3, 1);
  --dur-fast: 140ms; --dur-base: 220ms; --dur-slow: 360ms;
}
