/* Meletan — bandeau, pied de page et couleurs du mode sombre
   Le contenu des pages (#pb-acc…) n'est pas touché : on ne fait ici
   que redéfinir ses couleurs quand le mode sombre est actif. */

:root{
  --b-bg:#FFFFFF; --b-ink:#1E2433; --b-muted:#5B6273; --b-line:#DDE1E8;
  --b-btn:#14171C; --b-btn-ink:#FFFFFF; --b-accent:#2B3A67; --b-accent-ink:#FFFFFF;
  --b-sans:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  --b-serif:"Iowan Old Style","Palatino Linotype",Palatino,Georgia,serif;
  color-scheme:light;
}
:root[data-mode="dark"]{
  --b-bg:#1A1816; --b-ink:#E6E0D4; --b-muted:#A39C90; --b-line:#3A3631;
  --b-btn:#E6E0D4; --b-btn-ink:#1A1816; --b-accent:#93A9DD; --b-accent-ink:#14171C;
  color-scheme:dark;
}

html{-webkit-text-size-adjust:100%; scroll-padding-top:140px}
@media (max-width:860px){html{scroll-padding-top:80px}}
body{margin:0; background:var(--b-bg); color:var(--b-ink); font-family:var(--b-sans); font-size:17px; line-height:1.5;
  -webkit-font-smoothing:antialiased; transition:background-color .25s, color .25s}
@media (prefers-reduced-motion:reduce){body{transition:none}}
:focus-visible{outline:2px solid currentColor; outline-offset:3px}

/* ---------- Bandeau ---------- */
.mb-head{position:sticky; top:0; z-index:20; background:var(--b-bg); border-bottom:1px solid var(--b-line)}
.mb-in{max-width:1148px; margin:0 auto; padding:16px 16px 12px; display:flex; align-items:center; justify-content:space-between; gap:18px}
.mb-logo{display:flex; align-items:baseline; gap:12px; color:var(--b-ink); text-decoration:none; white-space:nowrap}
.mb-logo-1{font-family:var(--b-serif); font-size:1.55rem; line-height:1; letter-spacing:-.01em}
.mb-logo-2{font-size:.82rem; color:var(--b-muted); padding-left:12px; border-left:1px solid var(--b-line)}
.mb-tools{display:flex; align-items:center; gap:10px}

/* Deuxième ligne : le menu, aligné sur le contenu de la page */
.mb-row{max-width:1148px; margin:0 auto; padding:0 16px}
.mb-nav{display:flex; flex-wrap:wrap; gap:4px 30px; margin:0; padding:10px 0 12px; list-style:none; border-top:1px solid var(--b-line)}
.mb-nav a{position:relative; display:inline-block; padding:4px 0; font-size:.72rem; font-weight:600; letter-spacing:.09em; text-transform:uppercase; color:var(--b-muted); text-decoration:none; white-space:nowrap}
.mb-nav a:hover,.mb-nav a[aria-current="page"]{color:var(--b-ink)}
.mb-nav a::after{content:""; position:absolute; left:0; right:0; bottom:-1px; height:2px; background:var(--b-accent); transform:scaleX(0); transform-origin:left; transition:transform .2s}
.mb-nav a:hover::after,.mb-nav a[aria-current="page"]::after{transform:scaleX(1)}
@media (prefers-reduced-motion:reduce){.mb-nav a::after{transition:none}}

/* Espace participants : bouton plein, couleur de la page */
.mb-cta{display:inline-flex; align-items:center; gap:8px; margin-left:6px; padding:9px 18px 9px 14px; border-radius:999px; background:var(--b-accent); color:var(--b-accent-ink);
  font-size:.9rem; font-weight:600; text-decoration:none; white-space:nowrap; transition:filter .2s}
.mb-cta svg{width:17px; height:17px}
.mb-cta:hover{filter:brightness(1.15)}
:root[data-mode="dark"] .mb-cta:hover{filter:brightness(1.08)}

.mb-ly{font-size:.72rem; font-weight:600; letter-spacing:.09em; text-transform:uppercase; color:var(--b-muted); text-decoration:none; padding:8px 12px; border:1px solid var(--b-line); border-radius:999px; white-space:nowrap}
.mb-ly:hover,.mb-ly[aria-current="page"]{color:var(--b-ink); border-color:var(--b-ink)}
@media (max-width:860px){.mb-ly{display:none}}
.theme-toggle{appearance:none; width:34px; height:34px; padding:0; border-radius:50%; border:1px solid var(--b-line); background:transparent; color:var(--b-muted);
  display:inline-grid; place-items:center; cursor:pointer}
.theme-toggle:hover{color:var(--b-ink); border-color:var(--b-ink)}
.theme-toggle svg{width:17px; height:17px}
.theme-toggle .moon{display:none}
:root[data-mode="dark"] .theme-toggle .sun{display:none}
:root[data-mode="dark"] .theme-toggle .moon{display:block}

.mb-lang{display:inline-flex; border:1px solid var(--b-line); border-radius:17px; overflow:hidden; font-size:.72rem; font-weight:600; letter-spacing:.06em}
.mb-lang a{padding:9px 10px; line-height:1; color:var(--b-muted); text-decoration:none}
.mb-lang a:hover{color:var(--b-ink)}
.mb-lang a[aria-current="true"]{background:var(--b-ink); color:var(--b-bg)}

/* Menu du téléphone */
.mb-menu{display:none; position:relative}
.mb-menu summary{list-style:none; cursor:pointer; width:34px; height:34px; display:grid; place-items:center; border-radius:50%; border:1px solid var(--b-line); color:var(--b-ink)}
.mb-menu summary::-webkit-details-marker{display:none}
.mb-menu summary svg{width:18px; height:18px}
.mb-menu[open] summary{background:var(--b-ink); color:var(--b-bg)}
.mb-drop{position:absolute; right:0; top:44px; width:min(84vw,320px); background:var(--b-bg); border:1px solid var(--b-line); border-radius:12px;
  box-shadow:0 14px 34px rgba(20,23,28,.16); padding:10px; display:grid; gap:2px}
.mb-drop a{padding:11px 12px; border-radius:8px; color:var(--b-ink); text-decoration:none; font-size:.98rem}
.mb-drop a:hover{background:color-mix(in srgb,var(--b-ink) 8%,transparent)}
.mb-drop a.mb-drop-cta{margin-top:6px; background:var(--b-accent); color:var(--b-accent-ink); border-radius:999px; text-align:center; font-weight:600}

@media (max-width:860px){
  .mb-row{display:none}
  .mb-cta{margin-left:0; padding:0; width:34px; height:34px; justify-content:center}
  .mb-cta span{position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0)}
  .mb-menu{display:block}
  .mb-in{padding:12px 16px}
}
@media (max-width:520px){.mb-logo-2{display:none}}

/* ---------- Pied ---------- */
.mb-foot{max-width:1148px; width:calc(100% - 32px); margin:0 auto; padding:22px 0 34px; border-top:1px solid var(--b-line); display:flex; flex-wrap:wrap; gap:6px 22px;
  font-size:.88rem; color:var(--b-muted)}
.mb-foot a{color:inherit; text-underline-offset:3px}

/* ==========================================================
   MODE SOMBRE DE LA PAGE D'ACCUEIL (#pb-acc)
   Fond brun-noir chaud, texte ivoire, couleurs des activités
   éclaircies quand elles servent de texte, assombries quand
   elles servent de fond.
   ========================================================== */
:root[data-mode="dark"] #pb-acc{
  --ink:#E6E0D4; --muted:#A39C90; --line:#3A3631; --panel:#211F1C; --bg:#1A1816; --accent:#93A9DD;
  --card:#22201D;
}
/* couleur d'activité lisible sur fond sombre (calculée sur chaque élément) */
:root[data-mode="dark"] #pb-acc *{--ct:color-mix(in srgb,var(--c) 45%,#EDE7DB)}
/* Tuiles des quatre activités */
:root[data-mode="dark"] #pb-acc .pb-tile{background:var(--card)}
:root[data-mode="dark"] #pb-acc .pb-tile:hover{border-color:var(--ct); box-shadow:0 12px 30px rgba(0,0,0,.35)}
:root[data-mode="dark"] #pb-acc .pb-art{background:linear-gradient(140deg, color-mix(in srgb,var(--c) 62%,#1A1816) 0%, color-mix(in srgb,var(--c) 26%,#1A1816) 75%)}
:root[data-mode="dark"] #pb-acc .pb-tile .pb-wm{color:var(--ct); opacity:.22}
:root[data-mode="dark"] #pb-acc .pb-pic{background:#2A2723; color:var(--ct); box-shadow:0 4px 14px rgba(0,0,0,.35)}
:root[data-mode="dark"] #pb-acc .pb-go{color:var(--ct)}
:root[data-mode="dark"] #pb-acc .pb-tile li::before{background:var(--ct)}
:root[data-mode="dark"] #pb-acc .pb-x{background:var(--card); color:var(--ct)}
:root[data-mode="dark"] #pb-acc .pb-x:hover{border-color:var(--ct)}

/* À la une */
:root[data-mode="dark"] #pb-acc .pb-u{background:color-mix(in srgb,var(--c) 88%,#000)}
:root[data-mode="dark"] #pb-acc .pb-u-light{background:#2A2620; color:#C9D3EE; border-left-color:#C9A24A}
:root[data-mode="dark"] #pb-acc .pb-u-light .pb-u-k{color:#D9B762}
:root[data-mode="dark"] #pb-acc .pb-u-light svg circle[fill="#F3EEE3"]{fill:#2A2620}
:root[data-mode="dark"] #pb-acc .pb-u-light svg path[stroke="#F3EEE3"]{stroke:#2A2620}

/* Avis de révision */
:root[data-mode="dark"] #pb-acc .pb-notice{background:#2A2418; border-color:#5A4826; color:#E3C98F}

/* Bandeau « visio en cours » */
:root[data-mode="dark"] #pb-acc .pb-live{background:#0F1115; box-shadow:inset 0 0 0 1px var(--line)}
:root[data-mode="dark"] #pb-acc .pb-live.soon{background:var(--panel); color:var(--ink); border-left-color:var(--ink)}
:root[data-mode="dark"] #pb-acc .pb-live.soon .pb-live-dot{background:var(--ink)}
:root[data-mode="dark"] #pb-acc .pb-live-go{background:#E6E0D4; color:#14171C}

/* Cycles et prédications */
:root[data-mode="dark"] #pb-acc .pb-feat{background:color-mix(in srgb,var(--c) 85%,#000); box-shadow:inset 0 0 0 1px rgba(255,255,255,.06)}
:root[data-mode="dark"] #pb-acc .pb-feat a{color:color-mix(in srgb,var(--c) 85%,#000)}
:root[data-mode="dark"] #pb-acc .pb-feat a:hover{color:#fff}

/* Prochains rendez-vous */
:root[data-mode="dark"] #pb-acc .pb-next a{background:var(--card)}
:root[data-mode="dark"] #pb-acc .pb-next a:hover{box-shadow:0 4px 14px rgba(0,0,0,.35)}
:root[data-mode="dark"] #pb-acc .pb-badge{background:color-mix(in srgb,var(--c) 30%,#1A1816); color:var(--ct)}
:root[data-mode="dark"] #pb-acc .pb-next li.pb-none{background:var(--card)}

/* Études hors cycles */
:root[data-mode="dark"] #pb-acc .pb-hc{background:var(--card); border-top-color:var(--ct)}
:root[data-mode="dark"] #pb-acc .pb-hc-list li{background:color-mix(in srgb,var(--c) 12%,#1A1816); border-color:color-mix(in srgb,var(--c) 30%,#1A1816)}
:root[data-mode="dark"] #pb-acc .pb-hc-ref,
:root[data-mode="dark"] #pb-acc .pb-hc-n,
:root[data-mode="dark"] #pb-acc .pb-hc-foot a{color:var(--ct)}
:root[data-mode="dark"] #pb-acc .pb-hc-more{color:var(--ct); border-color:var(--ct)}
:root[data-mode="dark"] #pb-acc .pb-hc-more:hover{background:var(--ct); color:#1A1816}

/* Bandeau grec et duo d'annonces (déjà sombres : un ton plus profond) */
:root[data-mode="dark"] #pb-acc .pb-ribbon{background:#2A2620; color:#C9D3EE}
:root[data-mode="dark"] #pb-acc .pb-ribbon .pb-r-s,
:root[data-mode="dark"] #pb-acc .pb-ribbon .pb-r-c{color:#A39C90}
:root[data-mode="dark"] #pb-acc .pb-dc-expo{background:#123130}
:root[data-mode="dark"] #pb-acc .pb-dc-rdr{background:#56314F}

main{padding-top:clamp(20px,3vw,36px)}

/* ==========================================================
   MODE SOMBRE DE LA PAGE ÉVÉNEMENTS (#pb-ev)
   ========================================================== */
:root[data-mode="dark"] #pb-ev{--ink:#E6E0D4; --muted:#A39C90; --line:#3A3631; --panel:#211F1C; background:#1A1816}
:root[data-mode="dark"] #pb-ev *{--ct:color-mix(in srgb,var(--c) 45%,#EDE7DB)}
:root[data-mode="dark"] #pb-ev .live{background:#0F1115; box-shadow:inset 0 0 0 1px var(--line)}
:root[data-mode="dark"] #pb-ev .live-go{background:#E6E0D4}
:root[data-mode="dark"] #pb-ev .filters button{background:#22201D}
:root[data-mode="dark"] #pb-ev .filters button[aria-pressed="true"]{background:#E6E0D4; color:#1A1816; border-color:#E6E0D4}
:root[data-mode="dark"] #pb-ev .filters button i{background:var(--ct)}
:root[data-mode="dark"] #pb-ev .filters button[aria-pressed="true"] i{box-shadow:0 0 0 2px #1A1816}
:root[data-mode="dark"] #pb-ev .ev{background:#22201D; border-left-color:var(--ct)}
:root[data-mode="dark"] #pb-ev .pill{background:color-mix(in srgb,var(--c) 80%,#000)}
:root[data-mode="dark"] #pb-ev .pill-off{background:#4A4640}
:root[data-mode="dark"] #pb-ev .m-visio{background:#E6E0D4; color:#1A1816; border-color:#E6E0D4}
:root[data-mode="dark"] #pb-ev .m-lieu{background:transparent; color:var(--ct); border-color:var(--ct)}
:root[data-mode="dark"] #pb-ev .acts a.go{background:#E6E0D4; border-color:#E6E0D4; color:#14171C}
:root[data-mode="dark"] #pb-ev .acts .insc a{background:transparent; border-color:var(--ct); color:var(--ct)}
:root[data-mode="dark"] #pb-ev .acts .insc a:hover,
:root[data-mode="dark"] #pb-ev .plist a.pf:hover{background:var(--ct); color:#1A1816}
:root[data-mode="dark"] #pb-ev .plist a.pf{color:var(--ct); border-color:var(--ct)}
:root[data-mode="dark"] #pb-ev .btn{background:#E6E0D4; color:#1A1816}
:root[data-mode="dark"] #pb-ev .day b{color:var(--ct)}

/* ==========================================================
   MODE SOMBRE : LIRE LA BIBLE ENSEMBLE (#pb-lire)
   ========================================================== */
:root[data-mode="dark"] #pb-lire{--ink:#E6E0D4; --muted:#A39C90; --line:#3A3631; --panel:#211F1C; --bg:#1A1816;
  --hc:#93A9DD; --theo:#C99BC0; --etude:#7FB8AD; --partage:#D9A64F}
:root[data-mode="dark"] #pb-lire .pb-card,
:root[data-mode="dark"] #pb-lire .pb-ready{background:#22201D}
:root[data-mode="dark"] #pb-lire .pb-picto{background:color-mix(in srgb,var(--c) 18%,#1A1816)}
:root[data-mode="dark"] #pb-lire .pb-note{background:color-mix(in srgb,var(--c) 10%,#1A1816)}
:root[data-mode="dark"] #pb-lire .pb-badge{color:#1A1816}
:root[data-mode="dark"] #pb-lire .pb-card:not(.is-best) .pb-badge{background:#22201D; color:var(--c)}
:root[data-mode="dark"] #pb-lire .pb-card.is-best{box-shadow:0 0 0 2px var(--c), 0 10px 26px rgba(0,0,0,.4)}
:root[data-mode="dark"] #pb-lire .pb-btn{background:transparent}
:root[data-mode="dark"] #pb-lire .pb-btn:hover,
:root[data-mode="dark"] #pb-lire .pb-card.is-best .pb-btn{background:var(--c); color:#1A1816}
:root[data-mode="dark"] #pb-lire .pb-chip span{background:#22201D}
:root[data-mode="dark"] #pb-lire .pb-chip input:checked+span{background:#E6E0D4; color:#1A1816; border-color:#E6E0D4}
:root[data-mode="dark"] #pb-lire select,
:root[data-mode="dark"] #pb-lire input[type=text],
:root[data-mode="dark"] #pb-lire input[type=email],
:root[data-mode="dark"] #pb-lire textarea{background:#22201D}
:root[data-mode="dark"] #pb-lire input[type=range]::-webkit-slider-thumb{background:#1A1816}
:root[data-mode="dark"] #pb-lire input[type=range]::-moz-range-thumb{background:#1A1816}
:root[data-mode="dark"] #pb-lire .pb-submit{color:#1A1816}
:root[data-mode="dark"] #pb-lire .pb-submit:hover{background:#93A9DD}
:root[data-mode="dark"] #pb-lire .pb-send-err,
:root[data-mode="dark"] #pb-ct .ct-err{background:#2A2418; border-color:#5A4826; color:#E3C98F}

/* MODE SOMBRE : CONTACT ET MESSAGE ENVOYÉ (#pb-ct) */
:root[data-mode="dark"] #pb-ct{--ink:#E6E0D4; --muted:#A39C90; --line:#3A3631; --bg:#1A1816; --accent:#93A9DD; --field:#22201D}
:root[data-mode="dark"] #pb-ct .ct-submit{color:#1A1816}
