/* =========================================================
   THEMES — three visual directions (toggled via body class)
   ========================================================= */

/* THEME 1 · PAPIER (default) — already in styles.css */

/* THEME 2 · NOCTURNE — cabinet de curiosités, encre + or */
body.theme-nocturne {
  --paper:        #16201a;
  --paper-2:      #1d2820;
  --paper-3:      #243029;
  --cream:        #1a241d;
  --ink:          #f1ead9;
  --ink-soft:     #d6cdb5;
  --ink-mute:     #8a8268;
  --line:         #3a4a3a;
  --line-soft:    #2a3a2c;
  --nav-bg:       rgba(20,28,23,0.88);   /* nav sombre translucide (sinon fond clair illisible) */
  --tint:         rgba(255,255,255,0.05); /* voile très subtil sur fond sombre */

  --moss:         #a8b89a;
  --moss-deep:    #c9b88a;   /* gold accent replaces moss-deep */
  --moss-dark:    #f1ead9;
  --sage:         #8a9a73;
  --olive:        #b8973a;

  --sand:         #c9b88a;
  --terra:        #d4a574;
  --rust:         #b8763a;
  --gold:         #d4b059;
}
body.theme-nocturne::before {
  background-image:
    radial-gradient(rgba(255,240,200,0.025) 1px, transparent 1.2px),
    radial-gradient(rgba(255,240,200,0.015) 1px, transparent 1px);
  mix-blend-mode: screen;
}
body.theme-nocturne::after {
  background: radial-gradient(ellipse at center, transparent 50%, rgba(0,0,0,0.55) 100%);
}
body.theme-nocturne .plate {
  background:
    linear-gradient(135deg, rgba(212,176,89,0.06), rgba(168,184,154,0.04)),
    repeating-linear-gradient(45deg,
      transparent 0 9px,
      rgba(212,176,89,0.07) 9px 10px),
    var(--cream);
}
/* Tags/filtres inactifs : le fond rgba(255,255,255,0.35) de styles.css devient
   gris clair en nocturne et écrase le texte clair. On force un fond sombre
   opaque pour rétablir le contraste (texte beige clair sur vert sombre). */
body.theme-nocturne .tag:not(.tag-active) {
  background: var(--paper-2);
  border-color: var(--line);
  color: var(--ink-soft);
}

/* THEME 3 · ÉDITORIAL — minimal, blanc cassé, photos dominantes */
body.theme-editorial {
  --paper:        #f7f4ee;
  --paper-2:      #efeae0;
  --paper-3:      #e6e0d3;
  --cream:        #ffffff;
  --ink:          #0d130d;
  --ink-soft:     #2a3329;
  --ink-mute:     #7a7d72;
  --line:         #d8d2c4;
  --line-soft:    #ebe6da;
  --nav-bg:       rgba(247,244,238,0.9);
  --tint:         rgba(255,255,255,0.5);

  --moss:         #2c5e3a;
  --moss-deep:    #0f2e1f;
  --moss-dark:    #061511;
  --sage:         #7a9a6e;
  --olive:        #5a6e3e;

  --sand:         #b8a576;
  --terra:        #8a5a3d;
  --rust:         #6e3e22;
}
body.theme-editorial::before { opacity: 0.4; }
body.theme-editorial::after { background: none; }

/* Floating tweaks toggle button */
.theme-toggle {
  position: fixed;
  bottom: 28px;
  right: 28px;
  z-index: 60;
  display: flex;
  gap: 6px;
  padding: 6px;
  background: var(--cream);
  border: 1px solid var(--line);
  box-shadow: 0 8px 28px rgba(0,0,0,0.12);
  backdrop-filter: blur(12px);
}
.theme-toggle button {
  padding: 10px 14px;
  font-family: var(--mono);
  font-size: 10px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--ink-mute);
  border: 0;
  background: transparent;
  cursor: pointer;
  transition: all 280ms var(--ease);
}
.theme-toggle button.active {
  background: var(--moss-deep);
  color: var(--paper);
}
.theme-toggle button:hover:not(.active) { color: var(--ink); }
