/**
 * Odido design tokens — base for chat overlay and other UI
 * Source: https://merk.odido.nl/en/colour
 * Use with ODIDO_BRAND_GUIDELINES.md and RULES_OVERLAY_ODIDO.md
 *
 * Do not alter the project with this file; import or copy into overlay when implementing.
 */

:root {
  /* --- Core palette --- */
  --odido-black: #000000;
  --odido-white: #FFFFFF;

  /* --- Glows (use as gradient triples only) --- */
  --odido-glow-1-a: #FF7621;
  --odido-glow-1-b: #FF808C;
  --odido-glow-1-c: #2F9A92;

  --odido-glow-2-a: #FFAC24;
  --odido-glow-2-b: #7066FF;
  --odido-glow-2-c: #2C72FF;

  --odido-glow-3-a: #2F9A92;
  --odido-glow-3-b: #2C72FF;
  --odido-glow-3-c: #FF7621;

  --odido-glow-4-a: #FF7621;
  --odido-glow-4-b: #7066FF;
  --odido-glow-4-c: #2C72FF;

  /* --- Secondary: Tech blue --- */
  --odido-tech-blue-100: #2C72FF;
  --odido-tech-blue-80: #578FFF;
  --odido-tech-blue-60: #82ACFF;
  --odido-tech-blue-40: #ADC8FF;
  --odido-tech-blue-20: #C3D7FF;
  --odido-tech-blue-10: #EEF3FF;

  /* --- Secondary: Charm teal --- */
  --odido-charm-teal-100: #2F9A92;
  --odido-charm-teal-80: #59AFA8;
  --odido-charm-teal-60: #84C3BE;
  --odido-charm-teal-40: #AED8D5;
  --odido-charm-teal-20: #D9ECEB;
  --odido-charm-teal-10: #EEF7F6;

  /* --- Secondary: Solar yellow --- */
  --odido-solar-yellow-100: #FFAC24;
  --odido-solar-yellow-80: #FFBD51;
  --odido-solar-yellow-60: #FFCE7D;
  --odido-solar-yellow-40: #FFDFAA;
  --odido-solar-yellow-20: #FFF0D7;
  --odido-solar-yellow-10: #FFF8ED;

  /* --- Secondary: Dutch orange --- */
  --odido-dutch-orange-100: #FF7621;
  --odido-dutch-orange-80: #FF924E;
  --odido-dutch-orange-60: #FFAE7C;
  --odido-dutch-orange-40: #FFCAA9;
  --odido-dutch-orange-20: #FFE6D6;
  --odido-dutch-orange-10: #FFF4ED;

  /* --- Secondary: Warm pink --- */
  --odido-warm-pink-100: #FF808C;
  --odido-warm-pink-80: #FF9AA3;
  --odido-warm-pink-60: #FFB4BB;
  --odido-warm-pink-40: #FFCED2;
  --odido-warm-pink-20: #FFE8EA;
  --odido-warm-pink-10: #FFF5F6;

  /* --- Secondary: Lively purple --- */
  --odido-lively-purple-100: #7066FF;
  --odido-lively-purple-80: #8D85FF;
  --odido-lively-purple-60: #AAA4FF;
  --odido-lively-purple-40: #C7C4FF;
  --odido-lively-purple-20: #E5E3FF;
  --odido-lively-purple-10: #F3F2FF;

  /* --- Typography (reference; actual font loading in overlay) --- */
  --odido-font-headline: "Otypical Headline", Arial, sans-serif;
  --odido-font-text: "Otypical Text", Arial, sans-serif;
  --odido-font-fallback: Arial, sans-serif;

  /* Breakpoint: Headline vs Text per brand (24px) */
  --odido-type-headline-min-size: 24px;
  --odido-type-headline-leading: 1;
  --odido-type-body-leading: 1.2;

  /* --- Shapes: radii (use per guidelines) --- */
  /* Pill/speech bubble: 50% of shape height in implementation */
  --odido-shape-pill-radius: 50%; /* interpret as 50% of height */
  /* Tile/speech tile: single absolute value per layout; example */
  --odido-shape-tile-radius: 40px; /* example; base on 10% of reference square or logo */
}