/* GASTO — merk-skin over auth.css (multi-branding, IRES-13637).
 *
 * Token-first, geen fork: auth.css levert de structuur/componenten, dit bestand
 * herdefinieert enkel de merk-tokens + het login-paneel naar de GASTO-huisstijl
 * (terracotta/crème/flesgroen). Zo houdt i-Reserve exact z'n look en krijgt GASTO
 * een eigen skin zonder duplicatie. Geladen náást auth.css als data-product="gasto".
 * Palet uit het GASTO-brandboard: Inkt #2A231C · Terracotta #D9552F · Oker #C4892B
 * · Flesgroen #2E5D46 · Crème #F5EDE1. */

:root[data-product="gasto"]{
  /* Warme neutralen (crème i.p.v. koel groen-grijs). */
  --ink:#2A231C;--ink2:#5B4E40;--ink3:#8B7A66;
  --line:#E7DAC5;--line2:#EFE4D3;--bg:#F5EDE1;--card:#FFFDF8;
  /* Merk-accent = terracotta (vervangt het i-Reserve-groen op CTA's/focus). */
  --green:#D9552F;--green6:#D9552F;--green7:#B4402A;
  --greenSoft:#F7E7DD;--greenInk:#B4402A;
  /* Links = flesgroen (secundair merk-accent). */
  --blue:#2E5D46;--blueSoft:#E4EFE8;--blueInk:#2E5D46;
  --rad:14px;
}

/* Donkere modus: warme inkt-tinten, terracotta blijft het accent. */
:root[data-product="gasto"][data-theme="dark"]{
  --ink:#F5EDE1;--ink2:#D8C7B2;--ink3:#A8967E;
  --line:#3A2F26;--line2:#2A231C;--bg:#1C1712;--card:#241D17;
  --green:#E4693F;--green6:#E4693F;--green7:#D9552F;
  --greenSoft:#3A241B;--greenInk:#E9926F;
  --blue:#9DC4B0;--blueSoft:#22332A;--blueInk:#9DC4B0;
}
@media (prefers-color-scheme: dark){
  :root[data-product="gasto"]:not([data-theme]){
    --ink:#F5EDE1;--ink2:#D8C7B2;--ink3:#A8967E;
    --line:#3A2F26;--line2:#2A231C;--bg:#1C1712;--card:#241D17;
    --green:#E4693F;--green6:#E4693F;--green7:#D9552F;
    --greenSoft:#3A241B;--greenInk:#E9926F;
    --blue:#9DC4B0;--blueSoft:#22332A;--blueInk:#9DC4B0;
  }
}

/* Login-paneel: warme terracotta→oker gradient i.p.v. blauw→groen. */
:root[data-product="gasto"] .bPanel{
  background:linear-gradient(158deg,#2E5D46 0%,#B4402A 54%,#D9552F 116%);
}
:root[data-product="gasto"] .sdot{background:#F5C99B;box-shadow:0 0 0 3px rgba(245,201,155,.25)}

/* CTA-schaduw meekleuren met terracotta (auth.css hardcodeert de groene rgba). */
:root[data-product="gasto"] .cta{box-shadow:0 2px 12px rgba(217,85,47,.28)}
:root[data-product="gasto"] .inp:focus,
:root[data-product="gasto"] .inp-foc{box-shadow:0 0 0 3px rgba(217,85,47,.16)}

/* GASTO-woordmerk (tekst-lockup; geen aparte logo-asset nodig onder de strikte CSP).
   De laatste 'o' is het bord — terracotta ring, net als in het brandboard. */
:root[data-product="gasto"] .gasto-wm{
  display:inline-flex;align-items:baseline;gap:1px;
  font:800 30px/1 'Bricolage Grotesque','Hanken Grotesk',system-ui,sans-serif;
  letter-spacing:-.02em;color:var(--ink);margin-bottom:2px;
}
:root[data-product="gasto"] .gasto-wm .dot{
  width:.62em;height:.62em;border:3px solid #D9552F;border-radius:50%;
  display:inline-block;transform:translateY(.02em);
}
/* Op het donkere paneel staat het woordmerk in knockout-wit. */
:root[data-product="gasto"] .bPanel .gasto-wm{color:#fff}