/* ══════════════════════════════════════════════
   dark.css — Mode nuit · Ruelle de l'avenir
   Import dans chaque page APRÈS les styles existants
   ══════════════════════════════════════════════ */

/* ── Bouton toggle ── */
.dark-toggle {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  border: 1.5px solid rgba(0,0,0,.12);
  background: transparent;
  cursor: pointer;
  font-size: 16px;
  line-height: 1;
  transition: background .2s, border-color .2s, transform .2s;
  flex-shrink: 0;
}
.dark-toggle:hover {
  background: rgba(0,0,0,.06);
  transform: scale(1.1);
}

/* ── Variables mode nuit ── */
body.dark-mode {
  --cream: #1A1714;
  --warm:  #222018;
  --white: #1E1C19;
  --ink:   #F0EDE8;
  --mid:   #B0AA9F;
  --soft:  #7A7570;
  --border: rgba(255,255,255,0.08);
  --light: #8C8680;
}

/* ── Nav ── */
body.dark-mode #nav {
  background: rgba(22,20,17,.97);
  border-bottom-color: rgba(255,255,255,.08);
}
body.dark-mode .nav-links a {
  color: #B0AA9F;
}
body.dark-mode .nav-links a:hover,
body.dark-mode .nav-links a.active {
  color: #fff;
}
body.dark-mode .dark-toggle {
  border-color: rgba(255,255,255,.15);
  color: #F0EDE8;
}
body.dark-mode .dark-toggle:hover {
  background: rgba(255,255,255,.08);
}

/* ── Body & fond général ── */
body.dark-mode {
  background: #1A1714;
  color: #F0EDE8;
}

/* ── Sections blanches/crème ── */
body.dark-mode .programme,
body.dark-mode .qui,
body.dark-mode .citations,
body.dark-mode .maya-section,
body.dark-mode .etienne-section {
  background: #1E1C19;
}
body.dark-mode .activites,
body.dark-mode .galerie,
body.dark-mode .qui-l,
body.dark-mode .qui-r {
  background: #222018;
}

/* ── Cartes tc (témoignages) ── */
body.dark-mode .tc {
  background: #2A2724;
  border-color: rgba(255,255,255,.07);
}
body.dark-mode .tc-txt,
body.dark-mode .tc-n,
body.dark-mode .tc-r { color: #C0BAB0; }

/* ── Cartes qui-val ── */
body.dark-mode .qui-val {
  background: #222018;
}
body.dark-mode .qui-val-t { color: #F0EDE8; }
body.dark-mode .qui-val-d { color: #908A80; }

/* ── Section sbar (bande noire) ── */
body.dark-mode .sbar {
  background: #111009;
}

/* ── Cards cp (projets, à la une) ── */
body.dark-mode .cp {
  background: #222018;
  border-color: rgba(255,255,255,.06);
}
body.dark-mode .cp-title { color: #F0EDE8; }
body.dark-mode .cp-meta  { color: #908A80; }

/* ── Rows ── */
body.dark-mode .rows { background: #1A1714; }
body.dark-mode .row-title { color: #F0EDE8; }

/* ── Obj-cards (impact) ── */
body.dark-mode .obj-card {
  background: rgba(255,255,255,.09);
  border-color: rgba(255,255,255,.15);
}
body.dark-mode .obj-card h3 {
  color: #F0EDE8;
}
body.dark-mode .obj-card p {
  color: #C0BAB0;
}
body.dark-mode .obj-stat {
  color: #7DD4DC;
}
body.dark-mode .obj-stat span {
  color: rgba(255,255,255,.5);
}
body.dark-mode .impact {
  background: #111009 !important;
}
body.dark-mode .impact .section-tag {
  color: var(--green) !important;
}
body.dark-mode .impact .section-title {
  color: #F0EDE8 !important;
}
body.dark-mode .impact .section-sub {
  color: rgba(255,255,255,.65) !important;
}
body.dark-mode .impact .obj-card {
  background: rgba(255,255,255,.08) !important;
  border-color: rgba(255,255,255,.12) !important;
}
body.dark-mode .impact .obj-card h3 {
  color: #F0EDE8 !important;
}
body.dark-mode .impact .obj-card p {
  color: rgba(255,255,255,.6) !important;
}
body.dark-mode .impact .obj-stat {
  color: var(--green) !important;
}
body.dark-mode .impact .obj-stat span {
  color: rgba(255,255,255,.4) !important;
}

/* ── Cit-cards ── */
body.dark-mode .cit-card {
  background: #222018;
}
body.dark-mode .cit-text { color: #D0CAC0; }

/* ── Split-text ── */
body.dark-mode .split-text {
  background: #1E1C19;
}
body.dark-mode .programme-stat {
  border-top-color: rgba(255,255,255,.1);
}

/* ── Maya / Etienne bio ── */
body.dark-mode .maya-bio,
body.dark-mode .etienne-bio { color: #A0998F; }
body.dark-mode .maya-quote,
body.dark-mode .etienne-quote {
  background: #2A2724;
  color: #D0CAC0;
}

/* ── Footer ── */
body.dark-mode footer {
  background: #111009;
}

/* ── Impl cards ── */
body.dark-mode .impl-card {
  background: #222018;
  border-color: rgba(255,255,255,.07);
}
body.dark-mode .impl-card-title { color: #F0EDE8; }
body.dark-mode .impl-card-desc  { color: #908A80; }

/* ── Qui-quote ── */
body.dark-mode .qui-quote {
  color: #A0998F;
  border-left-color: var(--red);
}

/* ── Inputs / formulaires ── */
body.dark-mode input,
body.dark-mode textarea,
body.dark-mode select {
  background: #2A2724;
  color: #F0EDE8;
  border-color: rgba(255,255,255,.12);
}

/* ── Dock ── */
body.dark-mode .dock-label {
  background: rgba(240,237,232,.9);
  color: #1A1714;
}
body.dark-mode .dock-label::before {
  border-left-color: rgba(240,237,232,.9);
}

/* ── Transition douce sur tout ── */
body, #nav, .tc, .cp, .qui, .qui-l, .qui-r,
.sbar, .rows, .programme, .split-text,
.activites, .galerie, .citations, .maya-section,
.impl-card, .obj-card, .cit-card, .qui-val,
footer {
  transition: background .3s, color .3s, border-color .3s;
}