/* Colour themes. The default ("classic") is the Official AP palette; the others
   change the background and the matching surfaces. Pick one in config.js (theme),
   with ?theme=<name> in the URL, or with the Style chip on the screen. */

/* ------------------------------------------------ Classic Blue (default) */
:root, :root[data-theme="classic"] {
  /* background motion */
  --orb-1: rgba(242, 140, 30, 0.16);
  --orb-2: rgba(11, 74, 158, 0.14);
  --orb-3: rgba(30, 142, 78, 0.10);
  --wave-1: rgba(11, 74, 158, 0.13);
  --wave-2: rgba(242, 140, 30, 0.11);
  /* brand */
  --navy: #08306B;
  --blue: #0B4A9E;
  --blue-deep: #0B3F86;
  --blue-soft: #E6EEF9;
  --saffron: #F28C1E;
  --saffron-ink: #C4610B;     /* saffron for text on white (readable contrast) */
  --gold: #FFC46B;
  --green: #1E8E4E;

  /* surfaces */
  --bg: #F3F6FA;
  --bg-paint: var(--bg);      /* body background (may be a gradient) */
  --card: #FFFFFF;
  --fill: #EEF2F8;
  --sep: #E4EAF2;

  /* text */
  --label: #0E2240;
  --label-2: #34496A;
  --label-3: #4A5D7A;
  --label-4: #8DA0BC;
  --title: #08306B;           /* policy and section titles */
  --head: #0B4A9E;            /* small uppercase headings */
  --num: #C4610B;             /* highlighted amounts in the text */

  /* page parts */
  --chip-bg: #E6EEF9;
  --chip-ink: #0B4A9E;
  --photo-a: #DDE6F2;
  --photo-b: #C9D6E8;
  --ph-icon-bg: rgba(255, 255, 255, 0.85);
  --band-a: #08306B;          /* Key Incentives band gradient */
  --band-b: #0B4A9E;
  --tile: #0B3F86;
  --band-title: #FFC46B;
  --kval: #FFC46B;
  --klbl: rgba(255, 255, 255, 0.88);
  --focus-ring: #F28C1E;      /* highlight frame and number colour */
  --acc-a: #E07B12;           /* section accents (edge + icons), cycling per section */
  --acc-b: #0B4A9E;
  --acc-c: #1E8E4E;
  --spot-fill: rgba(242, 140, 30, 0.06);
  --spot-glow: rgba(242, 140, 30, 0.28);
  --marker: rgba(255, 186, 90, 0.55);   /* highlighter stroke under the title */

  /* floating glass tab bar */
  --glass: rgba(255, 255, 255, 0.74);
  --glass-border: rgba(255, 255, 255, 0.85);
  --glass-shine: rgba(255, 255, 255, 0.7);

  /* aliases used by shared components */
  --accent: #F28C1E;
  --accent-ink: #C4610B;
  --accent-soft: #FFF1E2;
  --navy-2: #0B4A9E;
  --brand-deep: #08306B;
  --brand-dark: #08306B;
  --brand: #0B4A9E;
  --tint: #EEF2F8;
  --line: #E4EAF2;
  --ink: #0E2240;
  --muted: #4A5D7A;
  --shadow-rgb: 8, 48, 107;
}

/* ------------------------------------------------------------ Pure White */
:root[data-theme="white"] {
  /* background motion */
  --orb-1: rgba(242, 140, 30, 0.12);
  --orb-2: rgba(11, 74, 158, 0.10);
  --orb-3: rgba(30, 142, 78, 0.08);
  --wave-1: rgba(11, 74, 158, 0.10);
  --wave-2: rgba(242, 140, 30, 0.08);
  --bg: #FFFFFF;
  --card: #F5F8FC;
  --sep: #E1E8F1;
  --fill: #EEF2F8;
  --shadow-rgb: 8, 48, 107;
}
:root[data-theme="white"] .sec-card { box-shadow: none; border: 0.06em solid #E3EAF3; border-left: 0.42em solid var(--saffron); }

/* ------------------------------------------------------------ Warm Ivory */
:root[data-theme="ivory"] {
  /* background motion */
  --orb-1: rgba(242, 140, 30, 0.20);
  --orb-2: rgba(196, 97, 11, 0.10);
  --orb-3: rgba(11, 74, 158, 0.08);
  --wave-1: rgba(196, 97, 11, 0.13);
  --wave-2: rgba(242, 140, 30, 0.13);
  --bg: #FBF6EE;
  --card: #FFFFFF;
  --sep: #EFE5D6;
  --fill: #F5EDE1;
  --label-3: #5E5A52;
  --chip-bg: #F8E7D0;
  --chip-ink: #9A4D08;
  --head: #9A4D08;
  --photo-a: #F1E6D6;
  --photo-b: #E5D4BC;
  --glass: rgba(255, 252, 247, 0.78);
  --shadow-rgb: 92, 60, 20;
}

/* --------------------------------------------------------------- Sky Blue */
:root[data-theme="sky"] {
  /* background motion */
  --orb-1: rgba(255, 255, 255, 0.75);
  --orb-2: rgba(24, 102, 200, 0.18);
  --orb-3: rgba(242, 140, 30, 0.10);
  --wave-1: rgba(24, 102, 200, 0.10);
  --wave-2: rgba(255, 255, 255, 0.55);
  --bg: #E7F0FB;
  --bg-paint: linear-gradient(180deg, #DCEAFA 0%, #EEF4FC 55%, #F6F9FD 100%);
  --card: #FFFFFF;
  --sep: #DCE6F3;
  --chip-bg: #D5E5F8;
  --photo-a: #CFE0F5;
  --photo-b: #B9D0EE;
  --band-a: #0A3F8F;
  --band-b: #1866C8;
  --tile: #0E4CA8;
}

/* ---------------------------------------------------------- Green & Gold */
:root[data-theme="green"] {
  --acc-b: #13774A;
  --acc-c: #B07A12;
  /* background motion */
  --orb-1: rgba(255, 196, 107, 0.22);
  --orb-2: rgba(21, 128, 79, 0.16);
  --orb-3: rgba(11, 74, 158, 0.08);
  --wave-1: rgba(21, 128, 79, 0.14);
  --wave-2: rgba(255, 196, 107, 0.19);
  --bg: #EEF6F1;
  --card: #FFFFFF;
  --sep: #DCEAE1;
  --fill: #E3F0E8;
  --label: #10291D;
  --label-2: #2F4A3C;
  --label-3: #4A6355;
  --title: #0B4A32;
  --head: #13774A;
  --chip-bg: #D9EDE1;
  --chip-ink: #13774A;
  --photo-a: #D8EADF;
  --photo-b: #C2DCCC;
  --band-a: #0A4A30;
  --band-b: #15804F;
  --tile: #0D5C3B;
  --blue: #13774A;            /* counter chip, play button */
  --navy: #0A4A30;
  --blue-soft: #D9EDE1;
  --shadow-rgb: 10, 74, 48;
}

/* ------------------------------------------------------- Sunrise Saffron */
:root[data-theme="saffron"] {
  /* background motion */
  --orb-1: rgba(242, 140, 30, 0.22);
  --orb-2: rgba(255, 196, 107, 0.26);
  --orb-3: rgba(11, 74, 158, 0.08);
  --wave-1: rgba(242, 140, 30, 0.14);
  --wave-2: rgba(255, 196, 107, 0.20);
  --bg: #FFF7EF;
  --card: #FFFFFF;
  --sep: #F3E3D2;
  --fill: #FCEBDA;
  --chip-bg: #FDE6CC;
  --chip-ink: #A54F05;
  --head: #B85A06;
  --photo-a: #FBE3C8;
  --photo-b: #F4CFA6;
  --band-a: #D2600A;
  --band-b: #F28C1E;
  --tile: #C95A08;
  --band-title: #FFFFFF;
  --kval: #FFFFFF;
  --klbl: rgba(255, 255, 255, 0.92);
  --focus-ring: #0B4A9E;
  --spot-fill: rgba(11, 74, 158, 0.05);
  --spot-glow: rgba(11, 74, 158, 0.22);
  --marker: rgba(11, 74, 158, 0.18);
  --glass: rgba(255, 251, 246, 0.8);
  --shadow-rgb: 140, 70, 10;
}

/* -------------------------------------------------------- Deep Navy (dark) */
:root[data-theme="navy"] {
  --acc-a: #FFA94D;
  --acc-b: #6FA8FF;
  --acc-c: #4CCB8A;
  /* background motion */
  --orb-1: rgba(40, 110, 230, 0.34);
  --orb-2: rgba(242, 140, 30, 0.14);
  --orb-3: rgba(30, 160, 130, 0.16);
  --wave-1: rgba(80, 140, 255, 0.10);
  --wave-2: rgba(255, 255, 255, 0.04);
  --bg: #061733;
  --bg-paint: radial-gradient(120% 70% at 80% 0%, #0D2B5E 0%, #061733 60%);
  --card: #0D2550;
  --fill: #10295A;
  --sep: rgba(255, 255, 255, 0.09);
  --label: #EEF3FF;
  --label-2: #C9D6EE;
  --label-3: #9DB0D2;
  --label-4: #6F86AE;
  --title: #FFFFFF;
  --head: #8FB8FF;
  --num: #FFB25E;
  --chip-bg: rgba(255, 255, 255, 0.08);
  --chip-ink: #CFE0FF;
  --blue-soft: rgba(255, 255, 255, 0.1);
  --photo-a: #12336B;
  --photo-b: #0C2550;
  --ph-icon-bg: rgba(255, 255, 255, 0.1);
  --band-a: #0F3C80;
  --band-b: #1659B8;
  --tile: #134592;
  --spot-fill: rgba(242, 140, 30, 0.08);
  --spot-glow: rgba(242, 140, 30, 0.35);
  --marker: rgba(242, 140, 30, 0.38);
  --glass: rgba(13, 37, 80, 0.8);
  --glass-border: rgba(255, 255, 255, 0.1);
  --glass-shine: rgba(255, 255, 255, 0.08);
  --shadow-rgb: 0, 0, 0;
}