/* Referințe biblice legate de Biblia de pe site (paginile de predici): legătura în text (.ref), lista „Texte biblice din predică” (.texte)
   și popover-ul cu textul versetelor (.ref-pop; pe telefon, foaie jos). Textul vine din /assets/data/biblie/<carte>.json (Cornilescu). */
.ref { color: inherit; text-decoration: none; border-bottom: 1px dotted var(--rosu); transition: color .12s ease, border-color .12s ease; }
.ref:hover, .ref:focus-visible { color: var(--rosu); border-bottom-style: solid; outline: none; }
.ref--titlu { border-bottom-width: 2px; }
.predica__baza .ref { color: var(--p-text); }

.texte__nota { margin: -6px 0 16px; font-family: var(--font-text); font-size: .9375rem; line-height: 1.5; color: var(--p-text-3); }
.texte { display: flex; flex-wrap: wrap; gap: 8px 10px; margin: 0; padding: 0; list-style: none; }
.texte__rand { display: inline-flex; align-items: stretch; overflow: hidden; font: .9375rem/1 var(--font-text); border: 1px solid var(--p-linie-2); border-radius: 999px; }
.texte__rand--baza { border-color: var(--rosu); }
.texte__ref { display: inline-flex; align-items: center; padding: 9px 12px; font-weight: 600; color: var(--p-text); border: 0; transition: background-color .12s ease, color .12s ease; }
.texte__ref:hover, .texte__ref:focus-visible { color: var(--rosu); background: var(--p-fundal-2); }
.texte__eticheta { display: inline-flex; align-items: center; padding: 0 12px 0 0; font-size: .6875rem; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--rosu); }
.texte__moment { display: inline-flex; align-items: center; gap: 5px; padding: 9px 12px 9px 10px; color: var(--p-text-3); text-decoration: none; border-left: 1px solid var(--p-linie-2); font-variant-numeric: tabular-nums; transition: background-color .12s ease, color .12s ease; }
.texte__moment:hover, .texte__moment:focus-visible { color: var(--rosu); background: var(--p-fundal-2); }
.texte__moment svg { width: 11px; height: 11px; }

.ref-pop { position: absolute; z-index: 60; width: 440px; max-width: calc(100vw - 16px); padding: 14px 16px 12px; font-family: var(--font-text); background: #fff; border: 1px solid var(--p-linie-2); border-radius: 8px; filter: drop-shadow(0 12px 28px rgba(0, 0, 0, .16)); opacity: 0; transform: translateY(4px); transition: opacity .12s ease, transform .12s ease; }
.ref-pop[hidden] { display: none; }
.ref-pop.este-vizibil { opacity: 1; transform: none; }
.ref-pop__cap { position: relative; display: flex; justify-content: space-between; align-items: baseline; gap: 10px; padding-right: 30px; font-size: 1rem; color: var(--p-text); }
.ref-pop__inchide { position: absolute; top: -6px; right: -8px; display: grid; place-items: center; width: 32px; height: 32px; padding: 0; color: var(--p-text-3); background: none; border: 0; border-radius: 50%; cursor: pointer; }
.ref-pop__inchide:hover { background: var(--p-fundal-2); }
.ref-pop__text { max-height: 46vh; margin: 10px 0 0; overflow: auto; }
.ref-pop__text p { margin: 0 0 6px; font-family: var(--font-serif); font-size: 1.0625rem; line-height: 1.5; color: var(--p-text-2); }
.ref-pop__text sup { margin-right: 3px; font: 600 .6875rem/1 var(--font-text); color: var(--rosu); }
.ref-pop__mai { color: var(--p-text-3); }
.ref-pop__sursa { margin-top: 8px !important; font: .6875rem/1 var(--font-text) !important; letter-spacing: .1em; text-transform: uppercase; color: var(--p-text-3) !important; }
.ref-pop__jos { margin: 10px 0 0; padding-top: 10px; font-size: .9375rem; border-top: 1px solid var(--p-linie); }
.ref-pop__jos a { font-weight: 600; color: var(--p-text); text-decoration: none; }
.ref-pop__jos a:hover { color: var(--rosu); }
.ref-pop__scrim { position: fixed; inset: 0; z-index: 59; background: rgba(20, 20, 20, .38); }
.ref-pop__scrim[hidden] { display: none; }
.ref-pop--foaie { position: fixed; top: auto; right: 0; bottom: 0; left: 0; width: auto; max-width: none; max-height: 76vh; overflow: auto; padding: 16px 18px calc(14px + env(safe-area-inset-bottom)); border-radius: 16px 16px 0 0; border-width: 1px 0 0; transform: translateY(16px); }
.ref-pop--foaie .ref-pop__text { max-height: none; }
@media (max-width: 760px) {
  .texte__rand { font-size: .875rem; }
  .texte__ref { padding: 8px 10px; }
  .texte__moment { padding: 8px 10px 8px 9px; }
}
@media print { .ref-pop, .ref-pop__scrim { display: none !important; } .ref { border-bottom: 0; } }
