/* Datavid — Color tokens
 * Values taken directly from the official Datavid Brand Guidelines (2026).
 * Brand families (brand names in parentheses):
 *   Navy  (DarkBlue)   #04367A  — authoritative, structural: headings, surfaces, body
 *   Teal  (Happy Blue) #36C2D4  — accent, links, tertiary actions, the line motif
 *   Coral (PinkCoral)  #FF2E62  — the PRIMARY call-to-action colour
 *   Neutral (charcoal) greys    — backgrounds, text support, dividers, layout
 * Internal scale names (navy / cyan / coral / slate) are unchanged for
 * backwards-compatibility; "cyan" === Happy Blue, "coral" === PinkCoral.
 */
:root {
  /* ---- Brand: Navy / "DarkBlue" ---- */
  --dv-navy-50:  #F1F5FD;
  --dv-navy-100: #E8F0FC;
  --dv-navy-200: #DDEAFC;
  --dv-navy-300: #C7D7ED;
  --dv-navy-400: #9BAEC8;
  --dv-navy-500: #385E93;
  --dv-navy-600: #04367A;   /* CORE — DarkBlue, the DATAVID wordmark */
  --dv-navy-700: #042B61;
  --dv-navy-800: #042049;   /* deep panel navy */
  --dv-navy-900: #02163A;

  /* ---- Brand: Teal / "Happy Blue" (internal name: cyan) ---- */
  --dv-cyan-50:  #F5FBFC;
  --dv-cyan-100: #EAF8FA;
  --dv-cyan-200: #D8F2F5;
  --dv-cyan-300: #8ADAE4;
  --dv-cyan-400: #36C2D4;   /* CORE — Happy Blue */
  --dv-cyan-500: #2B9BA9;
  --dv-cyan-600: #217580;
  --dv-cyan-700: #184F57;

  /* ---- Brand: Coral / "PinkCoral" (internal name: coral) ---- */
  --dv-coral-50:  #FFF4F6;
  --dv-coral-100: #FFE9EE;
  --dv-coral-200: #FFD4DE;
  --dv-coral-300: #FF819F;
  --dv-coral-400: #FF2E62;   /* CORE — PinkCoral, primary CTA */
  --dv-coral-500: #CF254F;
  --dv-coral-600: #9B1C3B;

  /* ---- Neutrals: brand charcoal / grey ---- */
  --dv-white:    #FFFFFF;
  --dv-slate-50:  #F4F6F9;
  --dv-slate-100: #EDEDED;
  --dv-slate-200: #DCDCDC;
  --dv-slate-300: #C6C6C6;
  --dv-slate-400: #B3B3B3;
  --dv-slate-500: #8E8E8E;
  --dv-slate-600: #6B6B6B;
  --dv-slate-700: #444444;
  --dv-slate-800: #2B2B2B;
  --dv-slate-900: #222222;

  /* ---- Secondary palette: status ----
   * Brand secondary palette = Red (alerts/errors), Green (success),
   * Orange (highlights/attention). Approximate hexes harmonised to the brand;
   * see README — exact swatches in the PDF are raster and were not extractable. */
  --dv-red-500:   #E5342B;   /* alerts / errors (distinct from PinkCoral) */
  --dv-red-50:    #FCEAE9;
  --dv-green-500: #1FA56A;   /* success / positive */
  --dv-green-50:  #E6F6EE;
  --dv-orange-500:#F5922F;   /* highlights / attention / warnings */
  --dv-orange-50: #FDF0E1;
  /* Back-compat aliases */
  --dv-amber-500: var(--dv-orange-500);
  --dv-amber-50:  var(--dv-orange-50);
  --dv-danger-500: var(--dv-red-500);
  --dv-danger-50:  var(--dv-red-50);

  /* ===== Semantic aliases ===== */
  /* Navy is the structural brand colour; Coral (PinkCoral) is the primary CTA;
     Teal (Happy Blue) is the accent / link colour. */
  --color-primary:        var(--dv-navy-600);   /* structural brand (DarkBlue) */
  --color-primary-hover:  var(--dv-navy-700);
  --color-primary-active: var(--dv-navy-800);
  --color-brand:          var(--dv-navy-600);

  --color-cta:            var(--dv-coral-400);   /* PinkCoral — primary action */
  --color-cta-hover:      var(--dv-coral-500);
  --color-cta-active:     var(--dv-coral-600);

  --color-accent:         var(--dv-cyan-400);    /* Happy Blue */
  --color-accent-deep:    var(--dv-cyan-600);
  --color-highlight:      var(--dv-coral-400);
  --color-highlight-deep: var(--dv-coral-500);

  /* Text */
  --text-strong:  var(--dv-navy-800);
  --text-body:    var(--dv-slate-700);
  --text-muted:   var(--dv-slate-600);
  --text-subtle:  var(--dv-slate-500);
  --text-on-brand: var(--dv-white);
  --text-link:    var(--dv-cyan-600);   /* Happy Blue links */

  /* Surfaces */
  --surface-page:    var(--dv-white);
  --surface-subtle:  var(--dv-slate-50);
  --surface-card:    var(--dv-white);
  --surface-tint:    var(--dv-cyan-50);     /* light Happy-Blue wash */
  --surface-tint-blue: var(--dv-navy-50);   /* light DarkBlue wash */
  --surface-brand:   var(--dv-navy-600);
  --surface-brand-deep: var(--dv-navy-800);
  --surface-accent:  var(--dv-cyan-400);

  /* Borders */
  --border-subtle:  var(--dv-slate-200);
  --border-default: var(--dv-slate-300);
  --border-strong:  var(--dv-slate-400);
  --border-brand:   var(--dv-navy-600);
  --border-accent:  var(--dv-cyan-400);

  /* Focus ring */
  --focus-ring: color-mix(in srgb, var(--dv-cyan-400) 55%, transparent);

  /* Signature gradient (Happy Blue → DarkBlue line-art motif) */
  --gradient-brand: linear-gradient(120deg, var(--dv-cyan-400) 0%, var(--dv-navy-600) 100%);
  --gradient-wave:  linear-gradient(120deg, var(--dv-navy-100) 0%, var(--dv-cyan-500) 100%);
}