/*
 * Design tokens for the public site redesign.
 *
 * All brand colors live here. The active palette is chosen per conference in
 * config/initializers/constants.rb (Constants.conference_palette), rendered by the
 * Rails layout as <html data-palette="...">.
 * To change the site colors, pick another palette there or edit its values below.
 *
 *   --brand-1 → --brand-2 → --brand-3   gradient used by the logo mark and bands
 *   --accent / --on-accent               highlight color and text drawn on top of it
 *   --accent-alt                         secondary highlight (defaults to --accent)
 *   --action / --on-action               buttons and calls to action (defaults to --accent)
 *   --surface*                           dark neutrals; a palette may override them
 *   --band                               background of full-width colored strips
 */

:root {
  /* Neutrals (shared by every palette) */
  --surface: #0d100e;
  --surface-raised: #161b17;
  --surface-line: #2c332d;
  --text: #f1f3e9;
  --text-muted: #b9c0b4;
  --text-subtle: #8a9386;
  --light-surface: #eaf1ed;
  --light-surface-raised: #dce8e3;
  --light-surface-line: #b8c9c3;
  --light-text: #102024;
  --light-text-muted: #3b5555;
  --light-text-subtle: #536d69;
  --light-accent: color-mix(in srgb, var(--accent) 38%, #102024);
  --light-action: color-mix(in srgb, var(--action) 68%, #102024);

  /* Typography */
  --font-sans: 'Manrope', 'Inter', system-ui, -apple-system, 'Segoe UI', sans-serif;

  /* Default palette: Frontier lime (the one reviewed with Venkat) */
  --brand-1: #2fb6a6;
  --brand-2: #7fe0b0;
  --brand-3: #ddff67;
  --accent: #dfff78;
  --on-accent: #131811;
  --accent-alt: var(--accent);   /* secondary highlight (hero eyebrow) */
  --action: var(--accent);       /* buttons / calls to action */
  --on-action: var(--on-accent);
  --band: var(--accent);
  --on-band: var(--on-accent);
  --art-filter: none;
}

/* Matches the official logo: teal arc + orange "AI". Cooler neutrals than the default. */
:root[data-palette="original"] {
  --surface: #070d0f;
  --surface-raised: #111b1d;
  --surface-line: #29393d;
  --accent-alt: #74b6c4;
  --brand-1: #3fb3c6;
  --brand-2: #8fb9a8;
  --brand-3: #ff5a1f;
  --accent: #ff6a2b;
  --on-accent: #1a0b04;
  --band: linear-gradient(90deg, #3fb3c6, #8fb9a8 45%, #ff5a1f);
  --on-band: #0d100e;
  --art-filter: hue-rotate(-58deg) saturate(1.25);
}

/*
 * Logo-led: the blue arc of the logo is the main highlight; orange (the "AI")
 * is kept for buttons and calls to action only.
 */
:root[data-palette="logo"] {
  --surface: #070d0f;
  --surface-raised: #111b1d;
  --surface-line: #29393d;
  --brand-1: #2f8fa3;
  --brand-2: #3fb3c6;
  --brand-3: #ff5a1f;
  --accent: #74b6c4;
  --light-accent: #176477;
  --on-accent: #061416;
  --accent-alt: var(--accent);
  --action: #ff6a2b;
  --light-action: #a94014;
  --on-action: #1a0b04;
  --band: linear-gradient(90deg, #2f8fa3, #3fb3c6 25%, #8fb9a8 50%, #ff7a3d 78%, #ff6a2b);
  --on-band: #061416;
  --art-filter: hue-rotate(115deg) saturate(.72) brightness(1.08);
}

:root[data-palette="electric"] {
  --brand-1: #7b5cff;
  --brand-2: #3d8bff;
  --brand-3: #34e0ff;
  --accent: #34e0ff;
  --on-accent: #07131c;
  --band: linear-gradient(90deg, #7b5cff, #3d8bff 50%, #34e0ff);
  --on-band: #ffffff;
  --art-filter: hue-rotate(125deg) saturate(1.2);
}

:root[data-palette="sunset"] {
  --brand-1: #e8368f;
  --brand-2: #ff6b4a;
  --brand-3: #ffb020;
  --accent: #ffb020;
  --on-accent: #1f1204;
  --band: linear-gradient(90deg, #e8368f, #ff6b4a 50%, #ffb020);
  --on-band: #1a0710;
  --art-filter: hue-rotate(-100deg) saturate(1.3);
}

:root[data-palette="ocean"] {
  --brand-1: #2747d8;
  --brand-2: #3aa0ff;
  --brand-3: #5ef2d6;
  --accent: #5ef2d6;
  --on-accent: #05201b;
  --band: linear-gradient(90deg, #2747d8, #3aa0ff 50%, #5ef2d6);
  --on-band: #ffffff;
  --art-filter: hue-rotate(95deg) saturate(1.1);
}

:root[data-palette="mono"] {
  --brand-1: #8a9087;
  --brand-2: #c9cec4;
  --brand-3: #ffffff;
  --accent: #ffffff;
  --on-accent: #0d100e;
  --band: #f1f3e9;
  --on-band: #0d100e;
  --art-filter: grayscale(1) brightness(1.15);
}