/* Lecteur Darby — affichage public.
   Même palette et même esprit typographique que la version autonome, pour
   une identité visuelle cohérente, quel que soit le thème du site. */

.bible-reader-en{
  --bre-bg:#0E1734;
  --bre-panel:#16214A;
  --bre-panel-2:#111B3C;
  --bre-ink:#E8E4D9;
  --bre-ink-dim:#9098b3;
  --bre-line:rgba(232,228,217,.14);
  --bre-brass:#C9A227;
  --bre-gold-vif:#E7C34F;
  --bre-pomegranate:#9C3B48;
  --bre-olive:#6F7F5F;
  --bre-display:'Frank Ruhl Libre',Georgia,serif;
  --bre-body:'Cardo',Georgia,serif;
  --bre-ui:-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;

  max-width:46rem;margin:1.6rem auto;background:var(--bre-bg);
  color:var(--bre-ink);border-radius:6px;padding:1.6rem 1.8rem 2rem;
  font-family:var(--bre-ui);line-height:1.5;
  box-shadow:0 8px 30px rgba(0,0,0,.22);
}
.bible-reader-en *{box-sizing:border-box}

.bre-nav{display:flex;gap:.5rem;flex-wrap:wrap;align-items:center;margin-bottom:1.3rem}
.bre-nav select{
  background:var(--bre-panel-2);color:var(--bre-ink);border:1px solid var(--bre-line);
  border-radius:4px;padding:.45rem .6rem;max-width:15rem;font-family:var(--bre-ui);font-size:.85rem;
}
.bre-nav select optgroup{font-family:var(--bre-display);font-style:normal}
.bre-toggle{
  margin-left:auto;background:none;border:1px solid var(--bre-line);color:var(--bre-ink-dim);
  border-radius:4px;padding:.4rem .8rem;font-size:.78rem;letter-spacing:.02em;cursor:pointer;
}
.bre-toggle:hover{color:var(--bre-ink);border-color:var(--bre-brass)}

.bre-titre{
  font-family:var(--bre-display);font-weight:500;font-size:1.9rem;margin:0 0 .3rem;color:var(--bre-ink);
}
.bre-badge{display:flex;gap:.7rem;align-items:center;margin:0 0 1.5rem;font-size:.78rem;color:var(--bre-ink-dim)}
.bre-pastille{
  border:1px solid currentColor;border-radius:99px;padding:.1rem .65rem;
  font-size:.68rem;letter-spacing:.08em;text-transform:uppercase;
}
.bre-pastille.bre-at{color:var(--bre-pomegranate)}
.bre-pastille.bre-nt{color:var(--bre-olive)}

.bre-commandes{display:flex;gap:.6rem;margin-bottom:1.5rem;flex-wrap:wrap}
.bre-commandes button{
  background:var(--bre-brass);color:#12183a;border:0;border-radius:4px;
  padding:.55rem 1.1rem;font-weight:600;font-size:.85rem;cursor:pointer;
}
.bre-commandes button.bre-stop{background:none;border:1px solid var(--bre-line);color:var(--bre-ink-dim)}
.bre-commandes button:hover{filter:brightness(1.08)}

.bre-versets{list-style:none;margin:0;padding:0}
.bre-verset{
  display:grid;grid-template-columns:3px 2.1rem 1fr;gap:0 .8rem;
  padding:.4rem .5rem .4rem 0;border-radius:4px;cursor:pointer;transition:background .25s ease;
}
.bre-verset:hover{background:rgba(201,162,39,.07)}
.bre-chant{position:relative;background:rgba(201,162,39,.15);border-radius:2px;overflow:hidden}
.bre-chant i{position:absolute;left:0;right:0;bottom:0;height:0;background:var(--bre-brass);
  display:block;transition:height 1.1s ease}
.bre-verset.bre-en-cours{background:rgba(201,162,39,.11)}
.bre-verset.bre-en-cours .bre-chant i{height:100%}
.bre-num{font-size:.72rem;color:var(--bre-ink-dim);text-align:right;padding-top:.44rem;user-select:none}
.bre-texte{font-family:var(--bre-body);font-size:1.15rem;line-height:1.65}
.bre-verset[data-audio] .bre-num::after{content:"\266A";margin-left:.15rem;color:var(--bre-brass)}

@media(max-width:560px){
  .bible-reader-en{margin:1rem 0;padding:1.2rem 1.1rem 1.6rem;border-radius:0}
  .bre-titre{font-size:1.5rem}
  .bre-texte{font-size:1.05rem}
}
@media(prefers-reduced-motion:reduce){
  .bre-chant i{transition:none}
}

.bre-xref-inline{
  grid-column:3/-1;margin:.4rem 0 .2rem;padding:.5rem .7rem;
  background:var(--bre-panel-2);border-left:2px solid var(--bre-brass);border-radius:0 4px 4px 0;
}
.bre-xref-inline summary{
  font-size:.7rem;letter-spacing:.08em;text-transform:uppercase;color:var(--bre-brass);
  cursor:pointer;list-style:none;font-family:var(--bre-ui);font-weight:600;
}
.bre-xref-inline summary::-webkit-details-marker{display:none}
.bre-xref-inline summary::before{content:"▸ ";display:inline-block;transition:transform .15s}
.bre-xref-inline[open] summary::before{transform:rotate(90deg)}
.bre-xref-n{color:var(--bre-ink-dim);font-weight:400;letter-spacing:0;text-transform:none}
.bre-xref-liens{line-height:1.9;margin-top:.5rem}
.bre-xref-lien{
  background:var(--bre-panel);border:1px solid var(--bre-line);border-radius:99px;
  padding:.1rem .55rem;margin:0 .3rem .3rem 0;font-size:.72rem;color:var(--bre-ink-dim);
  display:inline-block;text-decoration:none;
}
.bre-xref-lien:hover{color:var(--bre-ink);border-color:var(--bre-brass)}

.bre-recherche{position:relative;margin:-.6rem 0 1.2rem}
.bre-recherche-bouton{
  background:var(--bre-panel-2);border:1px solid var(--bre-line);border-radius:4px;
  padding:.4rem .7rem;font-size:.95rem;cursor:pointer;color:var(--bre-ink);line-height:1;
}
.bre-recherche-bouton:hover{border-color:var(--bre-brass)}
.bre-recherche-panneau{
  position:absolute;z-index:5;top:calc(100% + 6px);left:0;width:min(30rem,90vw);
  background:var(--bre-panel);border:1px solid var(--bre-brass);border-radius:6px;
  padding:.8rem;box-shadow:0 10px 30px rgba(0,0,0,.3);
}
.bre-recherche-champ{
  width:100%;background:var(--bre-panel-2);color:var(--bre-ink);border:1px solid var(--bre-line);
  border-radius:4px;padding:.5rem .7rem;font-size:.9rem;
}
.bre-recherche-barre{display:flex;gap:.4rem;align-items:stretch}
.bre-recherche-champ{
  flex:1;background:var(--bre-panel-2);color:var(--bre-ink);border:1px solid var(--bre-line);
  border-radius:4px;padding:.5rem .7rem;font-size:.9rem;
}
.bre-recherche-micro{
  background:var(--bre-panel-2);border:1px solid var(--bre-line);border-radius:4px;
  padding:0 .6rem;font-size:1rem;cursor:pointer;color:var(--bre-ink);flex:none;
}
.bre-recherche-micro:hover{border-color:var(--bre-brass)}
.bre-recherche-micro-actif{background:var(--bre-pomegranate);border-color:var(--bre-pomegranate);
  color:#fff;animation:bre-pouls 1.1s infinite}
@keyframes bre-pouls{50%{opacity:.55}}
.bre-recherche-resultats{max-height:19rem;overflow-y:auto;margin-top:.6rem}
.bre-recherche-ligne{
  display:flex;align-items:center;gap:.4rem;border-bottom:1px solid var(--bre-line);
}
.bre-recherche-ligne:hover{background:rgba(201,162,39,.08)}
.bre-recherche-item{
  display:block;flex:1;min-width:0;padding:.5rem .3rem;
  text-decoration:none;color:inherit;
}
.bre-recherche-ecouter{
  flex:none;background:none;border:0;font-size:1rem;cursor:pointer;color:var(--bre-ink-dim);
  padding:.3rem .5rem;
}
.bre-recherche-ecouter:hover{color:var(--bre-brass)}
.bre-recherche-ref{
  display:block;font-family:var(--bre-ui);font-size:.7rem;letter-spacing:.05em;
  color:var(--bre-brass);text-transform:uppercase;margin-bottom:.15rem;
}
.bre-recherche-texte{font-family:var(--bre-body);font-size:.92rem;color:var(--bre-ink-dim);line-height:1.5}
.bre-recherche-attente,.bre-recherche-vide{font-size:.82rem;color:var(--bre-ink-dim);padding:.4rem .2rem}

.bre-bulle{
  position:absolute;z-index:60;max-width:22rem;background:#fff;
  border:1px solid var(--bre-brass);border-radius:4px;padding:.6rem .8rem;
  font-family:var(--bre-body);font-size:.88rem;line-height:1.55;color:#1a1a1a;
  box-shadow:0 8px 22px rgba(0,0,0,.28);pointer-events:none;
}

.bre-mention{
  font-size:.72rem;line-height:1.5;color:var(--bre-ink-dim);
  margin:0 0 1rem;padding-bottom:.7rem;border-bottom:1px solid var(--bre-line);
}

.bre-glossaire{position:relative;margin:0 0 1.2rem}
.bre-glossaire-bouton{
  background:var(--bre-panel-2);border:1px solid var(--bre-line);border-radius:4px;
  padding:.4rem .8rem;font-size:.85rem;cursor:pointer;color:var(--bre-ink);
}
.bre-glossaire-bouton:hover{border-color:var(--bre-brass)}
.bre-glossaire-panneau{
  position:absolute;z-index:5;top:calc(100% + 6px);left:0;width:min(30rem,90vw);
  background:var(--bre-panel);border:1px solid var(--bre-brass);border-radius:6px;
  padding:.8rem;box-shadow:0 10px 30px rgba(0,0,0,.3);
}
.bre-glossaire-champ{
  flex:1;background:var(--bre-panel-2);color:var(--bre-ink);border:1px solid var(--bre-line);
  border-radius:4px;padding:.5rem .7rem;font-size:.9rem;
}
.bre-glossaire-fermer{
  background:var(--bre-panel-2);border:1px solid var(--bre-line);border-radius:4px;
  padding:0 .6rem;font-size:.9rem;cursor:pointer;color:var(--bre-ink);flex:none;
}
.bre-glossaire-fermer:hover{border-color:var(--bre-brass)}
.bre-glossaire-liste{max-height:22rem;overflow-y:auto;margin-top:.6rem}
.bre-glossaire-item{padding:.55rem .3rem;border-bottom:1px solid var(--bre-line)}
.bre-glossaire-terme{
  display:block;font-family:var(--bre-display);font-size:1rem;font-weight:500;
  color:var(--bre-brass);margin-bottom:.2rem;
}
.bre-glossaire-def{display:block;font-family:var(--bre-body);font-size:.9rem;color:var(--bre-ink-dim);line-height:1.5}
/* ---- clickable words ----
   The selector is deliberately heavy, and !important is used on the visual
   properties only: WordPress themes style <button> with a higher specificity
   (.entry-content button, .wp-block-* button and the like), which otherwise
   wins — boxing every word and painting it in the theme's own colour. */
.bible-reader-en button.bre-nom,
.bible-reader-en .bre-texte button.bre-nom{
  background:none !important;
  border:0 !important;
  border-bottom:1px solid rgba(231,195,79,.6) !important;
  border-radius:0 !important;
  padding:0 .05em !important;
  margin:0 !important;
  font:inherit !important;
  text-transform:none !important;
  letter-spacing:inherit !important;
  line-height:inherit !important;
  box-shadow:none !important;
  text-decoration:none !important;
  cursor:pointer;
  color:var(--bre-gold-vif) !important;
  min-height:0 !important;
  width:auto !important;
}
.bible-reader-en button.bre-nom:hover,
.bible-reader-en button.bre-nom:focus{
  color:#FFE58A !important;
  border-bottom-color:#FFE58A !important;
  background:rgba(231,195,79,.16) !important;
  border-radius:2px !important;
  outline:none;
}
/* Divine names stand apart without shouting. */
.bible-reader-en button.bre-nom-divine{font-weight:600 !important}
/* Terms get a dotted underline: "what does this word mean?" reads
   differently at a glance from "who is this?". */
.bible-reader-en button.bre-nom-term{
  border-bottom:0 !important;
  text-decoration:underline !important;
  text-decoration-style:dotted !important;
  text-decoration-color:rgba(231,195,79,.75) !important;
  text-underline-offset:3px;
}
.bible-reader-en button.bre-nom-term:hover{
  text-decoration-color:#FFE58A !important;
}
.bre-bulle-nom{
  position:absolute;z-index:70;background:#fff;border:1px solid var(--bre-brass);
  border-radius:5px;padding:.7rem .95rem;box-shadow:0 8px 22px rgba(0,0,0,.28);
  text-align:center;min-width:9rem;pointer-events:none;
}
.bre-bulle-heb{
  display:block;font-size:1.7rem;line-height:1.35;color:#1a1a1a;
  font-family:'Frank Ruhl Libre',serif;
}
.bre-bulle-phon{
  display:block;margin-top:.25rem;font-size:1rem;color:#7a5c10;font-style:italic;
}
.bre-bulle-fr{
  display:block;margin-top:.3rem;padding-top:.3rem;border-top:1px solid #e6e6e6;
  font-size:.78rem;color:#666;
}
.bre-bulle-sens{
  display:block;margin-top:.45rem;padding-top:.45rem;border-top:1px solid #e6e6e6;
  font-size:.86rem;line-height:1.5;color:#2b2b2b;text-align:left;max-width:22rem;
}
.bre-bulle-nom{max-width:24rem}


/* ---- browsable lexicon ---- */
.bre-lexique{position:relative;display:inline-block;margin:0 0 1.2rem .4rem}
.bre-lexique-bouton{
  background:var(--bre-panel-2);border:1px solid var(--bre-line);border-radius:4px;
  padding:.4rem .8rem;font-size:.85rem;cursor:pointer;color:var(--bre-ink);
}
.bre-lexique-bouton:hover{border-color:var(--bre-gold-vif);color:var(--bre-gold-vif)}
.bre-lexique-panneau{
  position:absolute;z-index:8;top:calc(100% + 6px);left:0;width:min(38rem,92vw);
  background:var(--bre-panel);border:1px solid var(--bre-gold-vif);border-radius:6px;
  padding:.85rem;box-shadow:0 12px 34px rgba(0,0,0,.42);
}
.bre-lexique-champ{
  flex:1;background:var(--bre-panel-2);color:var(--bre-ink);border:1px solid var(--bre-line);
  border-radius:4px;padding:.5rem .7rem;font-size:.9rem;
}
.bre-lexique-fermer{
  background:var(--bre-panel-2);border:1px solid var(--bre-line);border-radius:4px;
  padding:0 .6rem;font-size:.9rem;cursor:pointer;color:var(--bre-ink);flex:none;
}
.bre-lexique-filtres{display:flex;flex-wrap:wrap;gap:.3rem;margin:.6rem 0 .4rem}
.bre-lexique-filtre{
  background:var(--bre-panel-2);border:1px solid var(--bre-line);border-radius:99px;
  padding:.15rem .7rem;font-size:.72rem;color:var(--bre-ink-dim);cursor:pointer;
}
.bre-lexique-filtre:hover{color:var(--bre-ink)}
.bre-lexique-filtre-actif{
  background:rgba(231,195,79,.18);border-color:var(--bre-gold-vif);color:var(--bre-gold-vif);
}
.bre-lexique-etat{font-size:.72rem;color:var(--bre-ink-dim);margin:.15rem 0 .35rem}
.bre-lexique-liste{max-height:26rem;overflow-y:auto}
.bre-lex-item{padding:.6rem .3rem;border-bottom:1px solid var(--bre-line)}
.bre-lex-tete{display:flex;flex-wrap:wrap;align-items:baseline;gap:.55rem}
.bre-lex-mot{font-family:var(--bre-display);font-size:1.05rem;color:var(--bre-gold-vif);font-weight:600}
.bre-lex-heb{font-size:1.15rem;color:var(--bre-ink)}
.bre-lex-phon{font-style:italic;font-size:.85rem;color:var(--bre-ink-dim)}
.bre-lex-cat{
  margin-left:auto;font-size:.64rem;letter-spacing:.06em;text-transform:uppercase;
  color:var(--bre-ink-dim);border:1px solid var(--bre-line);border-radius:99px;padding:.05rem .45rem;
}
.bre-lex-sens{margin:.3rem 0 0;font-size:.87rem;line-height:1.55;color:var(--bre-ink-dim)}


/* ---- share ---- */
.bre-partage{position:relative;display:inline-block;margin:0 0 1.2rem .4rem}
.bre-partage-bouton{
  background:var(--bre-panel-2);border:1px solid var(--bre-line);border-radius:4px;
  padding:.4rem .8rem;font-size:.85rem;cursor:pointer;color:var(--bre-ink);
}
.bre-partage-bouton:hover{border-color:var(--bre-gold-vif);color:var(--bre-gold-vif)}
.bre-partage-panneau{
  position:absolute;z-index:9;top:calc(100% + 6px);left:0;width:min(24rem,92vw);
  background:var(--bre-panel);border:1px solid var(--bre-gold-vif);border-radius:6px;
  padding:.85rem;box-shadow:0 12px 34px rgba(0,0,0,.42);
}
.bre-partage-quoi{margin:0 0 .6rem;font-size:.76rem;color:var(--bre-ink-dim);line-height:1.45}
.bre-partage-liens{display:flex;flex-wrap:wrap;gap:.4rem}
.bre-partage-liens a,.bre-partage-liens button{
  background:var(--bre-panel-2);border:1px solid var(--bre-line);border-radius:99px;
  padding:.28rem .8rem;font-size:.8rem;color:var(--bre-ink);cursor:pointer;
  text-decoration:none;display:inline-block;
}
.bre-partage-liens a:hover,.bre-partage-liens button:hover{
  border-color:var(--bre-gold-vif);color:var(--bre-gold-vif);
}
.bre-partage-natif{
  background:rgba(231,195,79,.16) !important;border-color:var(--bre-gold-vif) !important;
  color:var(--bre-gold-vif) !important;flex-basis:100%;text-align:center;
}
.bre-partage-etat{margin:.55rem 0 0;font-size:.76rem;color:var(--bre-gold-vif);min-height:1em}

/* Les définitions du glossaire acceptent une mise en forme : on lui donne
   de quoi respirer plutôt que de la laisser en bloc compact. */
.bre-glossaire-def p{margin:0 0 .5rem}
.bre-glossaire-def p:last-child{margin-bottom:0}
.bre-glossaire-def ul,.bre-glossaire-def ol{margin:.35rem 0 .5rem 1.2rem;padding:0}
.bre-glossaire-def li{margin:.15rem 0}
.bre-glossaire-def strong,.bre-glossaire-def b{color:var(--bre-ink)}
.bre-glossaire-def a{color:var(--bre-gold-vif);text-decoration:underline}
.bre-glossaire-def a:hover{color:#FFE58A}

/* ---- lisibilité des boutons de commande ----
   Mêmes précautions que pour les mots cliquables : les thèmes stylent les
   <button> avec une spécificité supérieure, et leur couleur passait devant
   la nôtre — le libellé se fondait alors dans le fond sombre. */
.bible-reader-en button.bre-glossaire-bouton,
.bible-reader-en button.bre-lexique-bouton,
.bible-reader-en button.bre-partage-bouton,
.bible-reader-en button.bre-toggle{
  background:var(--bre-panel-2) !important;
  border:1px solid rgba(231,195,79,.55) !important;
  border-radius:4px !important;
  color:var(--bre-gold-vif) !important;
  font-weight:600 !important;
  text-transform:none !important;
  letter-spacing:normal !important;
  text-decoration:none !important;
  box-shadow:none !important;
  padding:.42rem .85rem !important;
  font-size:.88rem !important;
  line-height:1.25 !important;
  min-height:0 !important;
  width:auto !important;
  text-shadow:none !important;
}
.bible-reader-en button.bre-glossaire-bouton:hover,
.bible-reader-en button.bre-lexique-bouton:hover,
.bible-reader-en button.bre-partage-bouton:hover,
.bible-reader-en button.bre-toggle:hover,
.bible-reader-en button.bre-glossaire-bouton:focus,
.bible-reader-en button.bre-lexique-bouton:focus,
.bible-reader-en button.bre-partage-bouton:focus,
.bible-reader-en button.bre-toggle:focus{
  background:rgba(231,195,79,.16) !important;
  border-color:#FFE58A !important;
  color:#FFE58A !important;
  outline:none;
}

/* ---- lisibilité du panneau Glossaire ----
   Les définitions étaient servies en --bre-ink-dim, une encre volontairement
   effacée destinée aux mentions secondaires. Pour un texte qu'on vient lire,
   c'est trop discret : on passe à l'encre pleine, et le terme au doré vif.
   Les couleurs choisies dans l'éditeur restent prioritaires, puisqu'elles
   sont posées en style direct sur les mots concernés. */
.bible-reader-en .bre-glossaire-panneau{
  background:var(--bre-panel) !important;
  border-color:var(--bre-gold-vif) !important;
}
.bible-reader-en .bre-glossaire-terme{
  color:var(--bre-gold-vif) !important;
  font-weight:700 !important;
  font-size:1.02rem !important;
}
.bible-reader-en .bre-glossaire-def{
  color:var(--bre-ink) !important;
  font-size:.94rem !important;
  line-height:1.6 !important;
}
.bible-reader-en .bre-glossaire-def strong,
.bible-reader-en .bre-glossaire-def b{ color:#FFFFFF !important; }
.bible-reader-en .bre-glossaire-def em,
.bible-reader-en .bre-glossaire-def i{ color:var(--bre-ink) !important; }
.bible-reader-en .bre-glossaire-def li{ color:var(--bre-ink) !important; }
.bible-reader-en .bre-glossaire-item{ border-bottom-color:rgba(232,228,217,.22) !important; }
.bible-reader-en .bre-glossaire-champ{
  color:var(--bre-ink) !important;
  background:var(--bre-panel-2) !important;
  border-color:rgba(231,195,79,.45) !important;
}
.bible-reader-en .bre-glossaire-champ::placeholder{ color:var(--bre-ink-dim) !important; opacity:1; }
.bible-reader-en .bre-glossaire-etat{ color:var(--bre-ink-dim) !important; }