/* Popote — tokens visuels, ambiance « Marché » choisie par Bryan le 2026-10-13 (tomate, moutarde, basilic).
   Base : charte v0.1 de l'agent visuel, couleurs remplacées.
   Écrit à la main (pas généré) : charte propre au produit Popote, distincte de la charte BryOne.
   Police : Nunito (titres et texte), choisie par Bryan le 2026-10-13 pour la lisibilité, SIL OFL 1.1, voir fonts/LICENCE.txt.
   Contrastes WCAG AA vérifiés pour chaque paire texte/fond (voir README.md). */

@font-face{font-family:"Nunito";font-style:normal;font-weight:200 1000;font-display:swap;src:url(/fonts/nunito.woff2) format("woff2")}

:root{
  /* Couleurs — clair (crème chaud, vert marmite, jaune soleil) */
  --pop-bg:#FFF8EF;
  --pop-surface:#FFFFFF;
  --pop-surface-2:#FBEFE2;
  --pop-ink:#2B1B14;
  --pop-muted:#5E4A3F;
  --pop-line:#EBDCCB;
  --pop-accent:#C93A24;
  --pop-accent-hover:#A92F1C;
  --pop-on-accent:#FFFFFF;
  --pop-soft:#FFE7DC;
  --pop-sun:#FFC23D;
  --pop-sun-soft:#FFEBB8;
  --pop-on-sun:#2B1B14;
  --pop-success:#2E9E5B;
  --pop-warning:#8A5A00;
  --pop-danger:#B3261E;
  --pop-info:#2C6E8F;
  --pop-focus:#C93A24;

  /* Typographies */
  --pop-font-display:"Nunito",system-ui,-apple-system,"Segoe UI",sans-serif;
  --pop-font-body:"Nunito",system-ui,-apple-system,"Segoe UI",sans-serif;
  --pop-text-xs:.75rem; --pop-text-sm:.875rem; --pop-text-md:1rem; --pop-text-lg:1.25rem;
  --pop-text-xl:1.625rem; --pop-text-2xl:2.125rem;
  --pop-leading:1.45; --pop-leading-tight:1.15;

  /* Espacements (base 4 px) */
  --pop-space-1:4px; --pop-space-2:8px; --pop-space-3:12px; --pop-space-4:16px;
  --pop-space-5:24px; --pop-space-6:32px; --pop-space-7:48px;

  /* Rayons : généreux, esprit « galet » */
  --pop-radius-sm:10px; --pop-radius-md:16px; --pop-radius-lg:24px; --pop-radius-pill:999px;

  /* Ombres douces, teintées vert */
  --pop-shadow-1:0 1px 2px rgba(27,42,33,.06),0 1px 1px rgba(27,42,33,.04);
  --pop-shadow-2:0 6px 16px -6px rgba(27,42,33,.18),0 2px 4px rgba(27,42,33,.05);
  --pop-shadow-3:0 18px 40px -12px rgba(27,42,33,.28);

  --pop-tap-min:44px;
  --pop-pop:#2E9E5B;            /* vert basilic, accent secondaire */
  --pop-head:#E8462E;           /* en-tête tomate */
  --pop-on-head:#FFFFFF;
  --pop-tabs:#2B1B14; --pop-tabs-ink:#D9C6B8;
  color-scheme:light;
}

@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]){
    --pop-bg:#1C1410; --pop-surface:#271C17; --pop-surface-2:#30231C; --pop-ink:#F7EDE4;
    --pop-muted:#D2BFB1; --pop-line:#3A2B24; --pop-accent:#FF7A61; --pop-accent-hover:#FF937E;
    --pop-on-accent:#2B1B14; --pop-soft:#3A2019; --pop-sun:#FFC23D; --pop-sun-soft:#4A3712;
    --pop-on-sun:#2B1B14; --pop-success:#49C37C; --pop-warning:#FFC23D; --pop-danger:#FF8A7A;
    --pop-info:#7CC0DF; --pop-focus:#FF7A61;
    --pop-shadow-1:0 1px 2px rgba(0,0,0,.4);
    --pop-shadow-2:0 8px 20px -8px rgba(0,0,0,.6);
    --pop-shadow-3:0 20px 44px -12px rgba(0,0,0,.7);
    --pop-pop:#49C37C; --pop-head:#B8321E; --pop-tabs:#120C09; --pop-tabs-ink:#BFA999;
    color-scheme:dark;
  }
}
:root[data-theme="dark"]{
  --pop-pop:#49C37C; --pop-head:#B8321E; --pop-tabs:#120C09; --pop-tabs-ink:#BFA999;
  --pop-bg:#1C1410; --pop-surface:#271C17; --pop-surface-2:#30231C; --pop-ink:#F7EDE4;
  --pop-muted:#D2BFB1; --pop-line:#3A2B24; --pop-accent:#FF7A61; --pop-accent-hover:#FF937E;
  --pop-on-accent:#2B1B14; --pop-soft:#3A2019; --pop-sun:#FFC23D; --pop-sun-soft:#4A3712;
  --pop-on-sun:#2B1B14; --pop-success:#49C37C; --pop-warning:#FFC23D; --pop-danger:#FF8A7A;
  --pop-info:#7CC0DF; --pop-focus:#FF7A61;
  --pop-shadow-1:0 1px 2px rgba(0,0,0,.4);
  --pop-shadow-2:0 8px 20px -8px rgba(0,0,0,.6);
  --pop-shadow-3:0 20px 44px -12px rgba(0,0,0,.7);
  color-scheme:dark;
}