/* ═══════════════════════════════════════════════════════════════
   EventPix — Tema "NOTTE" per il sito pubblico
   Non ridefinisce la struttura: si appoggia a tema-chiaro.css e ne
   cambia soltanto la palette e le poche regole che davano per
   scontato uno sfondo chiaro. Così i due temi hanno per costruzione
   lo stesso identico contenuto.
   Va caricato DOPO tema-chiaro.css.
   ═══════════════════════════════════════════════════════════════ */

body.tema-notte {
  /* superfici */
  --ch-carta:    #16132A;
  --ch-crema:    #1E1A36;
  --ch-crema-2:  #262141;
  --ch-bordo:    #322B52;

  /* testo */
  --ch-inch:     #F5F2FA;
  --ch-inch-2:   #C3BCDC;
  --ch-muto:     #8F87B0;

  /* accenti (leggermente più luminosi, per staccare sul fondo scuro) */
  --ch-corallo:  #F0836B;
  --ch-corallo-s:#3A2438;
  --ch-salvia:   #7FB79C;
  --ch-salvia-s: #1E3330;
  --ch-oro:      #E4B95B;
  --ch-oro-s:    #382E1E;
  --ch-cielo:    #86A6D2;
  --ch-cielo-s:  #1E2842;

  --ch-ombra:    0 2px 12px rgba(0,0,0,.32);
  --ch-ombra-2:  0 16px 44px rgba(0,0,0,.46);

  background: var(--ch-carta);
  color: var(--ch-inch);
}

/* ── Barra di navigazione ─────────────────────────────────── */
.tema-notte .ch-nav { background: rgba(22,19,42,.86); }
.tema-notte .ch-nav.staccata {
  border-bottom-color: var(--ch-bordo);
  box-shadow: 0 2px 22px rgba(0,0,0,.45);
}
.tema-notte .ch-menu a.attiva { background: rgba(240,131,107,.16); color: var(--ch-corallo); }
.tema-notte .ch-menu a.attiva:hover { background: rgba(240,131,107,.16); }

/* ── Pulsanti ─────────────────────────────────────────────── */
.tema-notte .ch-btn-p { box-shadow: 0 6px 20px rgba(240,131,107,.26); color: #24162A; }
.tema-notte .ch-btn-p:hover { box-shadow: 0 12px 30px rgba(240,131,107,.34); }
.tema-notte .ch-btn-s { background: var(--ch-oro); color: #241E12; }
.tema-notte .ch-btn-l { border-color: var(--ch-bordo); color: var(--ch-inch); }
.tema-notte .ch-btn-l:hover { border-color: var(--ch-inch-2); }

/* ── Apertura ─────────────────────────────────────────────── */
.tema-notte .ch-hero::before {
  background: radial-gradient(closest-side, rgba(240,131,107,.18), transparent 72%);
}
.tema-notte .ch-occhiello { background: var(--ch-crema); border-color: var(--ch-bordo); color: var(--ch-inch-2); }

/* le polaroid restano bianche: sono fotografie stampate */
.tema-notte .ch-scatto { background: #F7F4EE; box-shadow: 0 12px 34px rgba(0,0,0,.5); }
.tema-notte .ch-scatto .ch-firma { color: #8C8697; }

/* ── Riquadri e sezioni ───────────────────────────────────── */
.tema-notte .ch-carta { background: var(--ch-crema); border-color: var(--ch-bordo); }
.tema-notte .ch-carta:hover { border-color: transparent; box-shadow: var(--ch-ombra-2); }
.tema-notte .ch-passo-num { background: var(--ch-crema); border-color: var(--ch-bordo); }
.tema-notte .ch-passo:not(:last-child)::after { border-top-color: var(--ch-bordo); }

/* ── Casi d'uso ───────────────────────────────────────────── */
.tema-notte .ch-caso { background: var(--ch-crema); border-color: var(--ch-bordo); }
.tema-notte .ch-caso-cima { filter: saturate(1.15); }

/* ── Telefono illustrativo ────────────────────────────────── */
.tema-notte .ch-telefono { box-shadow: 0 24px 54px rgba(0,0,0,.6), 0 1px 3px rgba(255,255,255,.16) inset; }
.tema-notte .ch-telefono-schermo {
  background: linear-gradient(160deg, #2A2447, #191534);
}
.tema-notte .ch-telefono-schermo h4 { color: #F5F2FA; }
.tema-notte .ch-telefono-schermo small { color: #A79FC7; }

/* ── Domande frequenti ────────────────────────────────────── */
.tema-notte .ch-faq details { border-bottom-color: var(--ch-bordo); }

/* ── Richiamo finale ──────────────────────────────────────── */
.tema-notte .ch-finale {
  background: linear-gradient(140deg, var(--ch-crema), var(--ch-crema-2));
  border: 1px solid var(--ch-bordo);
}
.tema-notte .ch-finale::before { background: rgba(240,131,107,.13); }
.tema-notte .ch-finale::after  { background: rgba(127,183,156,.11); }

/* ── Piede ────────────────────────────────────────────────── */
.tema-notte .ch-piede { background: var(--ch-crema); border-top-color: var(--ch-bordo); }
.tema-notte .ch-piede-basso { border-top-color: var(--ch-bordo); }
.tema-notte .ch-piede a:hover { color: var(--ch-corallo); }

/* ── Pagine caso d'uso ────────────────────────────────────── */
.tema-notte .ch-citazione { border-left-color: var(--ch-corallo); color: var(--ch-inch); }
.tema-notte .ch-consiglio { background: var(--ch-oro-s); }

/* ── Banner cookie ────────────────────────────────────────── */
.tema-notte #cookie-banner { background: #100D20; }

/* selettore lingua sul tema scuro */
.tema-notte .ch-lingua-btn { border-color: var(--ch-bordo); color: var(--ch-inch-2); }
.tema-notte .ch-lingua-btn:hover { background: var(--ch-crema); color: var(--ch-inch); }
.tema-notte .ch-lingua-menu { background: var(--ch-crema); border-color: var(--ch-bordo); }
.tema-notte .ch-lingua-menu a.attiva { background: rgba(240,131,107,.16); color: var(--ch-corallo); }