/* THEMES v3 (10 Nov 2026): 5 clean modern palettes + Android force-dark opt-out.
   Keys: classic (default, no data-accent), ivory, navypro, emerald, graphite (dark).
   color-scheme: 'only light' unless the customer explicitly picks Graphite. WCAG AA on text, buttons, prices. */
:root,html{color-scheme:only light}
html[data-theme=light]{color-scheme:only light}
html[data-theme=dark]{color-scheme:dark}

/* Classic Red – default, brand #D81E27, cleaner off-white (not the old dingy pink) */
html[data-theme=light]:not([data-accent]){
  --bg0:#F6F4F4;--bg1:#FFFBFC;--bg2:#F1E4E5;--ink:#1C1919;--mute:#5C4F50;--mute2:#746667;
  --y:#D81E27;--y2:#9E1219;--yg:linear-gradient(180deg,#D81E27 0%,#9E1219 100%);
  --t3h:357;--t3l:1;--t3p:#D81E27;--t3p2:#E01F29;--t3pd:#9E1219;--t3hov:#9E1219;
  --t3pg:linear-gradient(135deg,#D81E27 0%,#9E1219 100%);--t3tint:#FDECEC;--t3tintt:#D81E27;
  --hxa:#D81E27;--hxb:#9E1219;--hxt:#FDECEC;--hxi:#D81E27;
  --ok:#0B6B47;--bad:#B02A2A;--tile:#ffffff;
  --bd:rgba(28,25,25,.12);--bd2:rgba(28,25,25,.20);--glass:rgba(255,255,255,.92);--glass2:rgba(28,25,25,.06)
}
html[data-theme=light]:not([data-accent]) body{background:linear-gradient(180deg,#FFFBFC 0%,#F6F4F4 100%)}
html[data-theme=light]:not([data-accent]) .hdr{background:rgba(255,251,252,.94)}
html[data-theme=light]:not([data-accent]) .bnav{background:rgba(255,251,252,.96)}
html[data-theme=light]:not([data-accent]) .rate .v,html[data-theme=light]:not([data-accent]) .cnum,html[data-theme=light]:not([data-accent]) .hsamt{color:#1C1919}

/* Ivory / Warm White */
html[data-accent=ivory]{
  color-scheme:only light;
  --bg0:#F8F3EA;--bg1:#FFFBF4;--bg2:#EFE4D4;--ink:#2A241C;--mute:#5C5348;--mute2:#73685C;
  --y:#8E2C24;--y2:#6E1F19;--yg:linear-gradient(180deg,#8E2C24 0%,#6E1F19 100%);
  --t3h:6;--t3l:1;--t3p:#8E2C24;--t3p2:#A4352B;--t3pd:#6E1F19;--t3hov:#6E1F19;
  --t3pg:linear-gradient(135deg,#8E2C24 0%,#6E1F19 100%);--t3tint:#F6EBE4;--t3tintt:#8E2C24;
  --hxa:#8E2C24;--hxb:#6E1F19;--hxt:#F6EBE4;--hxi:#8E2C24;
  --ok:#0B6B47;--bad:#B02A2A;--tile:#FFFdf8;
  --bd:rgba(42,36,28,.12);--bd2:rgba(42,36,28,.20);--glass:rgba(255,251,244,.94);--glass2:rgba(42,36,28,.06)
}
html[data-accent=ivory]{background:var(--bg0)}
html[data-accent=ivory] body{background:linear-gradient(180deg,#FFFBF4 0%,#F8F3EA 100%)}
html[data-accent=ivory] .hdr{background:rgba(255,251,244,.94)}
html[data-accent=ivory] .bnav{background:rgba(255,251,244,.96)}
html[data-accent=ivory] .foot{background:rgba(255,251,244,.8)}
html[data-accent=ivory] .drawer,html[data-accent=ivory] .sheet,html[data-accent=ivory] .pop,html[data-accent=ivory] .menu,html[data-accent=ivory] .thpop{background:rgba(255,251,244,.98);color:var(--ink)}
html[data-accent=ivory] .rate .v,html[data-accent=ivory] .cnum,html[data-accent=ivory] .hsamt{color:#2A241C}
html[data-accent=ivory] .kick,html[data-accent=ivory] .cpath a,html[data-accent=ivory] .cpclr{color:#6E1F19}

/* Navy Professional – new key navypro (old data-accent=navy was a brown palette) */
html[data-accent=navypro]{
  color-scheme:only light;
  --bg0:#F3F5F9;--bg1:#F9FBFE;--bg2:#E3E8F1;--ink:#152033;--mute:#4A5568;--mute2:#5E6B80;
  --y:#1E3A8A;--y2:#152A66;--yg:linear-gradient(180deg,#1E3A8A 0%,#152A66 100%);
  --t3h:221;--t3l:1;--t3p:#1E3A8A;--t3p2:#2546A8;--t3pd:#152A66;--t3hov:#152A66;
  --t3pg:linear-gradient(135deg,#1E3A8A 0%,#152A66 100%);--t3tint:#E8EEFB;--t3tintt:#1E3A8A;
  --hxa:#1E3A8A;--hxb:#152A66;--hxt:#E8EEFB;--hxi:#1E3A8A;
  --ok:#0B6B47;--bad:#B02A2A;--tile:#ffffff;
  --bd:rgba(21,32,51,.12);--bd2:rgba(21,32,51,.20);--glass:rgba(249,251,254,.94);--glass2:rgba(21,32,51,.06)
}
html[data-accent=navypro]{background:var(--bg0)}
html[data-accent=navypro] body{background:linear-gradient(180deg,#F9FBFE 0%,#F3F5F9 100%)}
html[data-accent=navypro] .hdr{background:rgba(249,251,254,.94)}
html[data-accent=navypro] .bnav{background:rgba(249,251,254,.96)}
html[data-accent=navypro] .foot{background:rgba(249,251,254,.8)}
html[data-accent=navypro] .drawer,html[data-accent=navypro] .sheet,html[data-accent=navypro] .pop,html[data-accent=navypro] .menu,html[data-accent=navypro] .thpop{background:rgba(249,251,254,.98);color:var(--ink)}
html[data-accent=navypro] .rate .v,html[data-accent=navypro] .cnum,html[data-accent=navypro] .hsamt{color:#152033}
html[data-accent=navypro] .kick,html[data-accent=navypro] .cpath a,html[data-accent=navypro] .cpclr{color:#152A66}
html.appx[data-accent=navypro] .bnav .on{color:#1E3A8A}
html.appx[data-accent=navypro] .bnav .on .ico{background:#E8EEFB}

/* Emerald */
html[data-accent=emerald]{
  color-scheme:only light;
  --bg0:#F2F7F4;--bg1:#F7FBF8;--bg2:#DCEBE2;--ink:#13241C;--mute:#3F574A;--mute2:#567062;
  --y:#0F6B45;--y2:#0A4F33;--yg:linear-gradient(180deg,#0F6B45 0%,#0A4F33 100%);
  --t3h:158;--t3l:1;--t3p:#0F6B45;--t3p2:#158255;--t3pd:#0A4F33;--t3hov:#0A4F33;
  --t3pg:linear-gradient(135deg,#0F6B45 0%,#0A4F33 100%);--t3tint:#E5F4EC;--t3tintt:#0F6B45;
  --hxa:#0F6B45;--hxb:#0A4F33;--hxt:#E5F4EC;--hxi:#0F6B45;
  --ok:#0F6B45;--bad:#B02A2A;--tile:#ffffff;
  --bd:rgba(19,36,28,.12);--bd2:rgba(19,36,28,.20);--glass:rgba(247,251,248,.94);--glass2:rgba(19,36,28,.06)
}
html[data-accent=emerald]{background:var(--bg0)}
html[data-accent=emerald] body{background:linear-gradient(180deg,#F7FBF8 0%,#F2F7F4 100%)}
html[data-accent=emerald] .hdr{background:rgba(247,251,248,.94)}
html[data-accent=emerald] .bnav{background:rgba(247,251,248,.96)}
html[data-accent=emerald] .foot{background:rgba(247,251,248,.8)}
html[data-accent=emerald] .drawer,html[data-accent=emerald] .sheet,html[data-accent=emerald] .pop,html[data-accent=emerald] .menu,html[data-accent=emerald] .thpop{background:rgba(247,251,248,.98);color:var(--ink)}
html[data-accent=emerald] .rate .v,html[data-accent=emerald] .cnum,html[data-accent=emerald] .hsamt{color:#13241C}
html[data-accent=emerald] .kick,html[data-accent=emerald] .cpath a,html[data-accent=emerald] .cpclr{color:#0A4F33}
html.appx[data-accent=emerald] .bnav .on{color:#0F6B45}
html.appx[data-accent=emerald] .bnav .on .ico{background:#E5F4EC}

/* Graphite Dark – designed dark (not the old #171212 black), high-contrast light text */
html[data-theme=dark][data-accent=graphite],html[data-accent=graphite]{
  color-scheme:dark;
  --bg0:#1A1D23;--bg1:#22262E;--bg2:#2E3440;--ink:#F4F5F7;--mute:#C5CAD3;--mute2:#A8B0BD;
  --y:#FF6B73;--y2:#FFD2D4;--yg:linear-gradient(180deg,#E11D28 0%,#B0151E 100%);
  --t3h:357;--t3l:1;--t3p:#FF6B73;--t3p2:#E11D28;--t3pd:#FF8A90;--t3hov:#FF8A90;
  --t3pg:linear-gradient(135deg,#E11D28 0%,#8A1016 100%);--t3tint:#3A2428;--t3tintt:#FFD2D4;
  --hxa:#E11D28;--hxb:#1A1D23;--hxt:#2A303A;--hxi:#FFD2D4;
  --ok:#3DDC97;--bad:#FF8A8A;--tile:#2A2F38;--glass:#22262E;--glass2:#2E3440;
  --bd:rgba(255,255,255,.10);--bd2:rgba(255,255,255,.18)
}
html[data-accent=graphite]{background:var(--bg0)}
html[data-accent=graphite] body{background:linear-gradient(180deg,#22262E 0%,#1A1D23 100%);color:var(--ink)}
html[data-accent=graphite] .hdr,html[data-accent=graphite] .bnav{background:rgba(22,25,32,.94);color:var(--ink)}
html[data-accent=graphite] .foot{background:rgba(22,25,32,.75)}
html[data-accent=graphite] .drawer,html[data-accent=graphite] .sheet,html[data-accent=graphite] .pop,html[data-accent=graphite] .menu,html[data-accent=graphite] .thpop,html[data-accent=graphite] .prel{background:rgba(34,38,46,.98);color:var(--ink)}
html[data-accent=graphite] .rate .v,html[data-accent=graphite] .cnum,html[data-accent=graphite] .hsamt{color:#F4F5F7}
html[data-accent=graphite] .btn.pri,html[data-accent=graphite] .addb,html[data-accent=graphite] .cbgo{color:#fff}
html[data-accent=graphite] .hsrch input,html[data-accent=graphite] .msrch input,html[data-accent=graphite] .f input,html[data-accent=graphite] .f textarea,html[data-accent=graphite] .f select{background:#2A2F38;color:#F4F5F7;border-color:var(--bd2)}
html.appx[data-accent=graphite] .bnav{background:#161920!important;border-top-color:#2E3440}
html.appx[data-accent=graphite] .bnav a,html.appx[data-accent=graphite] .bnav button{color:#A8B0BD}
html.appx[data-accent=graphite] .bnav .on{color:#FFD2D4}
html.appx[data-accent=graphite] .bnav .on .ico{background:#3A2428;color:#FFD2D4}
html.appx[data-accent=graphite] .hdr{background:linear-gradient(135deg,#2A2F38,#161920)!important;color:#F4F5F7}

/* YQ stays neutral: new palettes must not bring ATC red onto a YQ screen. Ivory/navy/emerald keep structure; graphite stays dark-neutral. */
html.yqneu[data-theme=light]:not([data-accent=graphite]){--t3h:215;--y:#334155;--y2:#1E293B;--yg:linear-gradient(135deg,#334155,#1E293B);--t3p:#334155;--t3p2:#334155;--t3pd:#1E293B;--t3hov:#1E293B;--t3pg:linear-gradient(135deg,#334155 0%,#1E293B 100%);--t3tint:#EEF1F5;--t3tintt:#334155;--hxa:#334155;--hxb:#475569;--hxt:#EEF1F5;--hxi:#334155}

/* Swatch sheet */
.sw-classic{background:linear-gradient(135deg,#FFFBFC 48%,#D81E27 48%)}
.sw-ivory{background:linear-gradient(135deg,#FFF9F0 48%,#8E2C24 48%)}
.sw-navypro{background:linear-gradient(135deg,#F4F6FA 48%,#1E3A8A 48%)}
.sw-emerald{background:linear-gradient(135deg,#F3F8F5 48%,#0F6B45 48%)}
.sw-graphite{background:linear-gradient(135deg,#1A1D23 48%,#D8DEE8 48%)}
.thpop.thsheet{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:4px;width:min(360px,calc(100vw - 16px));padding:10px;border-radius:16px}
.thpop.thsheet button{display:flex;flex-direction:column;align-items:center;justify-content:center;height:auto;min-height:72px;padding:8px 4px;gap:6px;font-size:10.5px;font-weight:700;text-align:center;line-height:1.2;border-radius:12px}
.thpop.thsheet button i{width:28px;height:28px;border-radius:50%;flex:none;border:1px solid rgba(128,128,128,.35)}
.thpop.thsheet button span{flex:none;max-width:100%}
.thpop.thsheet button[aria-checked=true]{box-shadow:inset 0 0 0 2px var(--y)}
.thpop.thsheet button[aria-checked=true]::after{content:none}
@media(max-width:520px){.thpop.thsheet{left:8px;right:8px!important;width:auto}}

/* Greeting card uses lxpages border-image (--lpg1/--lpg2), not background. Map those (and --lxr/--lpr) per palette. YQ stays slate. */
html.lx[data-accent=ivory]:not(.yqneu){--lxr:#8E2C24;--lxr2:#6E1F19;--lpg1:#8E2C24;--lpg2:#6E1F19;--lpr:#8E2C24;--lpr2:#6E1F19;--lpk:#F3D2A0;--lpsub:#F6EBE4}
html.lx[data-accent=navypro]:not(.yqneu){--lxr:#1E3A8A;--lxr2:#152A66;--lpg1:#1E3A8A;--lpg2:#152A66;--lpr:#1E3A8A;--lpr2:#152A66;--lpk:#D6E0F8;--lpsub:#E8EEFB}
html.lx[data-accent=emerald]:not(.yqneu){--lxr:#0F6B45;--lxr2:#0A4F33;--lpg1:#0F6B45;--lpg2:#0A4F33;--lpr:#0F6B45;--lpr2:#0A4F33;--lpk:#CDEAD9;--lpsub:#E5F4EC}
html.lx[data-accent=graphite]:not(.yqneu){--lxr:#E11D28;--lxr2:#8A1016;--lpg1:#2A2F38;--lpg2:#161920;--lpr:#E11D28;--lpr2:#8A1016;--lpk:#FFD2D4;--lpsub:#C5CAD3}