/* =====================================================================
   Duck Hunt — système de thèmes partagé par toutes les pages du manuel
   de terrain (index.html, progression_table_fr.html, shop_fr.html,
   stats.html, commands_fr.html). Un thème = un jeu de variables CSS choisi via l'attribut
   data-theme sur <html>, positionné par theme.js (lu depuis localStorage).

   Couleurs constantes, PAS liées au thème choisi (elles portent un sens,
   pas juste une préférence) : --tier-1..4 (paliers d'arme) et --mono.
   ===================================================================== */

:root{
  --mono: "JetBrains Mono", ui-monospace, "SFMono-Regular", Menlo, Consolas, "Liberation Mono", monospace;
  --tier-1:#9a9b7e;   /* mitrailleuse */
  --tier-2:#7a9a52;   /* fusil d'assaut */
  --tier-3:#b8790e;   /* fusil de chasse */
  --tier-4:#c1502c;   /* fusil de précision */
}

/* --- Thème par défaut (identique à "blaze") tant que theme.js n'a pas
   encore posé data-theme, pour qu'une page fonctionne même sans JS. --- */
:root,
:root[data-theme="blaze"]{
  --ink:#171713;
  --panel:#1f1d18;
  --panel-2:#262319;
  --paper:#ede7d8;
  --paper-dim:#a39c8a;
  --blaze:#ff6a13;
  --blaze-dim:#c4550f;
  --field:#7c8a54;
  --warn:#e3a06e;
  --line:rgba(237,231,216,.14);
  --line-strong:rgba(237,231,216,.28);
}

/* Marais — chasse dans les zones humides : vert mousse et ambre boueux. */
:root[data-theme="marais"]{
  --ink:#11150e;
  --panel:#1a1f15;
  --panel-2:#222819;
  --paper:#e8e6d3;
  --paper-dim:#9da089;
  --blaze:#c9a227;
  --blaze-dim:#9a7d1c;
  --field:#4f6b4a;
  --warn:#c98a4a;
  --line:rgba(232,230,211,.14);
  --line-strong:rgba(232,230,211,.28);
}

/* Givre — chasse d'hiver : nuit polaire et bleu de gel. */
:root[data-theme="givre"]{
  --ink:#0d1117;
  --panel:#161c24;
  --panel-2:#1d2530;
  --paper:#dbe6ee;
  --paper-dim:#8493a3;
  --blaze:#5fb0ff;
  --blaze-dim:#3d86cc;
  --field:#7c8a9a;
  --warn:#7fc7d9;
  --line:rgba(219,230,238,.14);
  --line-strong:rgba(219,230,238,.28);
}

/* Jour — pour ceux qui préfèrent lire en pleine lumière. */
:root[data-theme="jour"]{
  --ink:#f4efe1;
  --panel:#fdfbf5;
  --panel-2:#f0ead9;
  --paper:#241f16;
  --paper-dim:#6b6352;
  --blaze:#c1500f;
  --blaze-dim:#953e0c;
  --field:#3f6b34;
  --warn:#a35d1d;
  --line:rgba(36,31,22,.12);
  --line-strong:rgba(36,31,22,.24);
}

/* =====================================================================
   Lien de retour vers le sommaire (toutes les pages sauf index.html)
   ===================================================================== */

.back-link{
  display:inline-flex;
  align-items:center;
  gap:.45rem;
  margin-bottom:1.1rem;
  padding:.35rem .7rem;
  border:1px solid var(--line-strong);
  background:var(--panel);
  color:var(--paper);
  font-family:var(--mono);
  font-size:.75rem;
  font-weight:700;
  letter-spacing:.04em;
  text-decoration:none;
  transition:background-color .15s ease, border-color .15s ease, color .15s ease;
}
.back-link:hover{
  background:var(--panel-2);
  border-color:var(--blaze);
  color:var(--blaze);
}
.back-link:focus-visible{
  outline:2px solid var(--blaze);
  outline-offset:2px;
}
.back-link + .stamp{ margin-left:.75rem; }

/* =====================================================================
   Widget de sélection de thème (injecté par theme.js)
   ===================================================================== */

.theme-picker{
  position:fixed;
  right:1rem;
  bottom:1rem;
  z-index:50;
  display:flex;
  align-items:center;
  gap:.5rem;
  background:var(--panel);
  border:1px solid var(--line-strong);
  padding:.5rem .6rem;
  font-family:var(--mono);
}
.theme-picker .tp-label{
  font-size:.62rem;
  letter-spacing:.1em;
  text-transform:uppercase;
  color:var(--paper-dim);
  margin-right:.15rem;
}
.theme-picker button{
  width:1.15rem;
  height:1.15rem;
  padding:0;
  border:1px solid var(--line-strong);
  cursor:pointer;
  background:var(--swatch-color);
}
.theme-picker button[aria-pressed="true"]{
  outline:2px solid var(--paper);
  outline-offset:2px;
}
.theme-picker button:focus-visible{
  outline:2px solid var(--blaze);
  outline-offset:2px;
}
@media (max-width:520px){
  .theme-picker{ right:.6rem; bottom:.6rem; padding:.4rem .5rem; }
}
