/* ========== JSON / Prayers HTML content (day + night) ========== */
/* Variables de thème */
:root{
  --vr-color: #7a1b28;         /* Bordeaux par défaut (fond clair) */
  --text-color: inherit;
  --text-leading: 1.50;
  --preces-leading: 1.34;
  --preces-gap: .00em;         /* pas d'espace entre lignes de préces */
  --symbol-width: .9em;
}

.day-mode{
  --vr-color: #7a1b28;         /* Bordeaux profond sur blanc */
  --text-color: #222;
  --text-leading: 1.55;
  --preces-leading: 1.28;
  --symbol-width: .95em;
}

.night-mode{
  --vr-color: #c23a3a;         /* Bordeaux + lumineux la nuit */
  --text-color: #eaeaea;
  --text-leading: 1.45;
  --preces-leading: 0.86;
  --symbol-width: .9em;
}

/* ---------- Conteneur principal ---------- */
#text{
  white-space: pre-wrap;                           /* conserve les \n des JSON */
  line-height: var(--text-leading);
  font-size: clamp(1rem, 0.96rem + 0.28vw, 1.08rem);
  color: var(--text-color);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

/* ---------- Ajustements par section ---------- */
#text.section-in-principio{
  line-height: 1.40;             /* un peu plus compact pour l'intro */
}
#text.section-in-principio p{
  margin: .25em 0;               /* resserre les blocs de l'intro */
}

#text.section-in-fine{
  line-height: 1.42;
}
#text.section-in-fine .preces-line{
  margin: 0;
  line-height: 1.24;             /* V/R très serrés en fin */
}

/* ---------- Espacements HTML standard ---------- */
#text p{ margin: .35em 0; }
#text blockquote{ margin: .6em 1em; }
#text ul, #text ol{ margin: .35em 1.25em; }

/* ---------- Inline génériques ---------- */
#text em, #text i{ font-style: italic; }
#text strong, #text b{ font-weight: 600; }
#text small{ font-size: .9em; opacity: .9; }
#text sup{ vertical-align: super; font-size: .75em; }
#text sub{ vertical-align: sub;   font-size: .75em; }

/* ---------- Clausules (« Quem/Qui… ») ---------- */
#text .clausula{
  font-style: italic;
  opacity: .96;
}

/* ---------- Rubriques optionnelles ---------- */
#text .rubric{
  color: #8f2a2a;
  font-style: italic;
}

/* ---------- Utilitaires ---------- */
#text .center{ display:block; text-align:center; }
#text .muted{ opacity:.85; }
#text .spacer{ display:block; height:.5rem; }

/* ========== Verset / Répons (V / R) ========== */
/* Symboles ℣ / ℟ : bordeaux, gras, alignés en colonne fine */
#text .v, #text .r,
#text .versiculus, #text .responsum{
  color: var(--vr-color);
  font-weight: 700;
  letter-spacing: .01em;
  display: inline-block;
  width: var(--symbol-width);
  text-align: left;
}

/* Lignes de préces : aucune marge, une phrase par ligne */
#text .preces-line{
  margin: var(--preces-gap) 0;
  line-height: var(--preces-leading);
}

/* Italique uniquement pour le Répons (℟) */
#text .preces-line .r + em,
#text .preces-line .r ~ em{
  font-style: italic;
}

/* Variante encore plus serrée pour le bloc post-decem (si classe posée côté JS) */
#text.prayer-post-decem .preces-line{
  margin: 0;
  line-height: 1.22;
}

/* Lisibilité nuit : léger halo sur l’italique des préces */
.night-mode #text .preces-line em{
  text-shadow: 0 0 .5px rgba(255,255,255,.15);
}

/* ---------- Finissions typos mobiles ---------- */
@media (max-width: 480px){
  #text{ font-size: clamp(.98rem, .96rem + 0.6vw, 1.02rem); }
  #text .preces-line{ line-height: 1.24; }
}
/* In fine > Oremus pro fidelibus defunctis : 3 lignes compactes */
#text.section-in-fine p:not(.preces-line){
  margin: .08em 0;         /* quasi aucun espace entre les 3 lignes */
  line-height: 1.22;       /* bien serré mais lisible */
}

/* Sur mobile, on resserre un poil plus */
@media (max-width: 480px){
  #text.section-in-fine p:not(.preces-line){
    margin: .06em 0;
    line-height: 1.20;
  }
}
#text.section-in-fine p:not(.preces-line){
  margin: 0 !important;
  line-height: 1.20 !important;
}
@media (max-width: 480px){
  #text.section-in-fine p:not(.preces-line){
    line-height: 1.18 !important;
  }
}
/* ==== In fine : force ultra-compact sur les 3 premières phrases ==== */
/* 1) Resserre vraiment les preces-line en In fine */
#text.section-in-fine .preces-line{
  margin: 0 !important;
  line-height: 1.10 !important;   /* plus serré qu'avant */
  padding: 0 !important;
}

/* 2) Si un drop cap / lettrine est défini pour le 1er <p>,
      on l'annule strictement pour les preces-line */
#text.section-in-fine .preces-line::first-letter{
  font-family: inherit !important;
  font-size: inherit !important;
  font-weight: inherit !important;
  line-height: inherit !important;
  float: none !important;
  margin: 0 !important;
}

/* Cas où ton thème cible le tout premier paragraphe du bloc */
#text.section-in-fine p.preces-line:first-of-type::first-letter{
  font-family: inherit !important;
  font-size: inherit !important;
  font-weight: inherit !important;
  line-height: inherit !important;
  float: none !important;
  margin: 0 !important;
}

/* 3) Annule toute règle globale de type p + p { margin-top: ... } */
#text .preces-line + .preces-line{
  margin-top: 0 !important;
}

/* 4) Mobile : encore un poil plus serré */
@media (max-width: 480px){
  #text.section-in-fine .preces-line{
    line-height: 1.08 !important;
  }
}