/* FITONORDIC LAB — brand palette
 * Based on the blue and green colours of the FITONORDIC LAB logo.
 * Existing variable names are preserved to avoid changes in components.
 */
:root {
  /* Main text, backgrounds, accents and header. */
  --color-ink: #25285d;
  --color-muted: #62658a;
  --color-paper: #f5f6f1;
  --color-border: #d9dae7;
  --color-accent: #dcefdc;
  --color-header: #292c65;
  --color-header-production: #2f3270;
  --color-white: #ffffff;
  --color-black: #000000;

  /* FITONORDIC LAB brand colours */
  --color-brand-green: #419d49;
  --color-brand-green-hover: #347f39;
  --color-brand-blue: #2f3270;
  --color-editorial-blue: #353878;
  --color-focus: var(--color-brand-green-hover);

  --color-footer: #eceef3;
  --color-footer-text: #4e5176;
  --color-legacy-text: #25285d;
  --color-legacy-muted: #666987;
  --color-error: #913729;

  /* Interface roles: use these instead of numbered shades for readable text and controls. */
  --color-text-accent: var(--color-brand-green-hover);
  --color-placeholder: var(--color-muted);
  --color-control-border: color-mix(in srgb, var(--color-muted) 80%, var(--color-paper));
  --color-border-on-dark: color-mix(in srgb, var(--color-white) 24%, var(--color-transparent));
  --color-media-dark: var(--color-header);
  --color-hero-overlay: var(--color-brand-blue);
  --color-button-primary: var(--color-brand-green-hover);
  --color-button-primary-hover: var(--color-sage-50);
  --color-error-surface: color-mix(in srgb, var(--color-error) 7%, var(--color-white));

  /* Section surfaces */
  --color-section-sage: #e9f2e8;
  --color-section-laboratory: #e9eaf2;
  --color-equipment-surface: #edf2e9;
  --color-packaging-border: #91bd94;

  --color-legacy-dark: #25285d;
  --color-legacy-border: #dedfea;
  --color-legacy-soft: #f7f7fa;
  --color-error-strong: #a53b2e;
  --color-transparent: transparent;

  /*
   * BLUE FAMILY
   * FITONORDIC LAB blue → pale blue/lavender
   */
  --color-slate-10: #171936;
  --color-slate-20: #1b1d42;
  --color-slate-30: #202249;
  --color-slate-40: #242752;
  --color-slate-50: #292c61;
  --color-slate-60: #2c2f69;
  --color-slate-70: #2f3270;
  --color-slate-80: #353878;
  --color-slate-90: #3b3e7d;
  --color-slate-100: #424582;
  --color-slate-110: #494c88;
  --color-slate-120: #55588f;
  --color-slate-130: #626597;
  --color-slate-140: #7477a2;
  --color-slate-150: #8d8fb2;
  --color-slate-160: #aaaac8;
  --color-slate-170: #bebfd4;
  --color-slate-180: #cdcde0;
  --color-slate-190: #d5d6e5;
  --color-slate-200: #dcdeea;
  --color-slate-210: #e2e3ed;
  --color-slate-220: #e7e8f0;
  --color-slate-230: #ebecf3;
  --color-slate-240: #eef0f5;
  --color-slate-250: #f0f1f6;
  --color-slate-260: #f2f3f7;
  --color-slate-270: #f4f5f8;
  --color-slate-280: #f6f7fa;
  --color-slate-290: #f8f9fb;
  --color-slate-300: #fbfbfd;

  /*
   * GREEN FAMILY
   * FITONORDIC green → pale laboratory green
   */
  --color-sage-10: #17351a;
  --color-sage-20: #1c401f;
  --color-sage-30: #214b25;
  --color-sage-40: #27572b;
  --color-sage-50: #2c6331;
  --color-sage-60: #316f36;
  --color-sage-70: #357a3a;
  --color-sage-80: #39853e;
  --color-sage-90: #3d9043;
  --color-sage-100: var(--color-brand-green);
  --color-sage-110: #49a14e;
  --color-sage-120: #50a755;
  --color-sage-130: #57ad5c;
  --color-sage-140: #5fb364;
  --color-sage-150: #67b96c;
  --color-sage-160: #70be75;
  --color-sage-170: #79c37e;
  --color-sage-180: #82c887;
  --color-sage-190: #8bcd90;
  --color-sage-200: #94d199;
  --color-sage-210: #9dd5a2;
  --color-sage-220: #a5d9aa;
  --color-sage-230: #adddb2;
  --color-sage-240: #b5e0ba;
  --color-sage-250: #bce3c1;
  --color-sage-260: #c3e6c8;
  --color-sage-270: #c9e8ce;
  --color-sage-280: #cfead3;
  --color-sage-290: #d4ecd8;
  --color-sage-300: #d8eedc;
  --color-sage-310: #dcf0e0;
  --color-sage-320: #dff1e3;
  --color-sage-330: #e2f2e6;
  --color-sage-340: #e4f3e8;
  --color-sage-350: #e6f4ea;
  --color-sage-360: #e8f5ec;
  --color-sage-370: #eaf5ed;
  --color-sage-380: #ebf6ee;
  --color-sage-390: #ecf6ef;
  --color-sage-400: #edf7f0;
  --color-sage-410: #eef7f1;
  --color-sage-420: #eff8f2;
  --color-sage-430: #f0f8f3;
  --color-sage-440: #f1f8f3;
  --color-sage-450: #f1f9f4;
  --color-sage-460: #f2f9f4;
  --color-sage-470: #f2f9f5;
  --color-sage-480: #f3f9f5;
  --color-sage-490: #f3faf6;
  --color-sage-500: #f4faf6;
  --color-sage-510: #f4faf7;
  --color-sage-520: #f5faf7;
  --color-sage-530: #f5fbf8;
  --color-sage-540: #f6fbf8;
  --color-sage-550: #f6fbf8;
  --color-sage-560: #f6fbf9;
  --color-sage-570: #f7fbf9;
  --color-sage-580: #f7fbf9;
  --color-sage-590: #f7fcfa;
  --color-sage-600: #f8fcfa;
  --color-sage-610: #f8fcfa;
  --color-sage-620: #f8fcfb;
  --color-sage-630: #f9fcfb;
  --color-sage-640: #f9fcfb;
  --color-sage-650: #f9fdfb;
  --color-sage-660: #fafdfc;
  --color-sage-670: #fafdfc;
  --color-sage-680: #fafdfc;
  --color-sage-690: #fbfdfc;
  --color-sage-700: #fbfdfc;
  --color-sage-710: #fbfefd;
  --color-sage-720: #fbfefd;
  --color-sage-730: #fcfefd;
  --color-sage-740: #fcfefd;
  --color-sage-750: #fcfefd;
  --color-sage-760: #fcfefe;
  --color-sage-770: #fdfefe;
  --color-sage-780: #fdfefe;
  --color-sage-790: #fdfefe;
  --color-sage-800: #fdfefe;
  --color-sage-810: #fefefe;
  --color-sage-820: #fefefe;
  --color-sage-830: #fefefe;
  --color-sage-840: #fefefe;
  --color-sage-850: #ffffff;
  --color-sage-860: #ffffff;
  --color-sage-870: #ffffff;

  /*
   * WARM ACCENTS
   * Neutralised so orange does not compete with the FITONORDIC logo.
   */
  --color-warm-10: #78b77c;
  --color-warm-20: #91c594;
  --color-warm-30: #a9d2ab;
  --color-warm-40: #c3dfc4;
  --color-warm-50: #d9ead9;
  --color-warm-60: #edf4ec;
  --color-warm-70: #f6f8f3;
}