/* Paleta Innvita (derivada de la imagen enviada)
   - Sand:    #E9D6C9
   - Beige:   #E2CFBF
   - Sage:    #C9CCB8
   - Mint:    #9FC8BC
   - Charcoal:#1F2322
*/

:root{
  --pal-sand:#E9D6C9;
  --pal-beige:#E2CFBF;
  --pal-sage:#C9CCB8;
  --pal-mint:#9FC8BC;
  --pal-charcoal:#1F2322;

  /* Tema día (default) — tonos amarillo claro / crema */
  --bg1: #FFFDF5;
  --bg2: #FFF6E0;
  --bg3: #FFFBF0;
  --card: rgba(255,255,255,.88);
  --card2: rgba(255,255,255,.72);
  --stroke: rgba(31,35,34,.12);
  --text: #1F2322;
  --muted: rgba(31,35,34,.68);
  --accent: var(--pal-mint);
  --accent2: var(--pal-sage);
  --shadow: 0 26px 70px rgba(31,35,34,.16);
  --ok: #1A8F63;
  --bad: #C53434;
  --btnGhostBg: rgba(31,35,34,.05);
  --btnBg: rgba(31,35,34,.07);
  --inputBg: rgba(255,255,255,.86);
  --topbarFade: linear-gradient(180deg, rgba(255,253,245,.96), rgba(255,248,224,.82) 75%, rgba(255,251,240,0));
}

body.theme--dark{
  --bg1:#06050a;
  --bg2:#0b0912;
  --bg3:#07060a;
  --card: rgba(255,255,255,.07);
  --card2: rgba(255,255,255,.10);
  --stroke: rgba(255,255,255,.12);
  --text:#f4f2f7;
  --muted: rgba(244,242,247,.70);
  --accent: var(--pal-mint);
  --accent2: var(--pal-sand);
  --shadow: 0 30px 80px rgba(0,0,0,.55);
  --ok:#34d399;
  --bad:#f87171;
  --btnGhostBg: rgba(0,0,0,.12);
  --btnBg: rgba(255,255,255,.06);
  --inputBg: rgba(0,0,0,.12);
  --topbarFade: linear-gradient(180deg, rgba(7,6,10,.92), rgba(7,6,10,.72) 75%, rgba(7,6,10,0));
}