/* Pre-Paid's colours for the scripture tagger.
 *
 * scripture_tagger.css is kept exactly as it arrives from the ITMOG reader so
 * it stays diffable against the original. This file loads after it and changes
 * nothing but colour -- no layout, no sizing.
 *
 * One thing to know: the upstream sheet is LIGHT by default and paints its dark
 * mode under [data-theme="dark"]. This reader is the other way round -- dark is
 * the default and [data-theme="light"] is the exception -- so the base rules
 * here are the dark ones, and the light overrides come after.
 */

/* ---- the reference itself, sitting in the prose --------------------------- */
a.scripture-ref,
[data-theme="dark"] a.scripture-ref {
  color: var(--amber, #6d93ff);
  text-decoration-color: rgba(109, 147, 255, .38);
  text-underline-offset: 3px;
}
a.scripture-ref:hover,
[data-theme="dark"] a.scripture-ref:hover {
  color: var(--amber-bright, #8fadff);
  text-decoration-color: rgba(143, 173, 255, .8);
}
a.scripture-ref:focus {
  outline: 2px solid rgba(109, 147, 255, .45);
}

/* ---- the popover ---------------------------------------------------------- */
.scripture-tagger-tooltip,
[data-theme="dark"] .scripture-tagger-tooltip {
  background: var(--panel, #121826);
  border-color: rgba(109, 147, 255, .28);
  box-shadow: 0 18px 50px rgba(0, 0, 0, .6), 0 0 0 1px rgba(109, 147, 255, .06);
  font-family: var(--serif, 'Lora', Georgia, serif);
}

.scripture-tooltip-header,
[data-theme="dark"] .scripture-tooltip-header {
  background: linear-gradient(180deg, #2f51a8, #24408a);
  border-bottom: 1px solid rgba(109, 147, 255, .3);
}
.scripture-tooltip-reference,
.scripture-tooltip-chapter-header {
  font-family: var(--stamp, 'Oswald', 'Arial Narrow', sans-serif);
  letter-spacing: .08em;
  color: #fff;
}
.scripture-tooltip-abbrev,
[data-theme="dark"] .scripture-tooltip-abbrev,
.scripture-tooltip-translation {
  color: #c9d8ff;
}

.scripture-tooltip-content,
[data-theme="dark"] .scripture-tooltip-content {
  background: var(--night-2, #0e1320);
  color: var(--read, #ded3bf);
}
.scripture-tooltip-text { color: var(--read, #ded3bf); }
.scripture-tooltip-text sup,
[data-theme="dark"] .scripture-tooltip-text sup {
  color: var(--hazel, #b4c07a);   /* the verse numbers, in her green */
  font-family: var(--stamp, 'Oswald', sans-serif);
}
.scripture-tooltip-verse + .scripture-tooltip-verse { border-color: rgba(109, 147, 255, .12); }
.scripture-tooltip-chapter-break { border-color: rgba(109, 147, 255, .18); }

.scripture-tooltip-footer,
[data-theme="dark"] .scripture-tooltip-footer {
  background: var(--panel, #121826);
  border-top: 1px solid rgba(109, 147, 255, .18);
  color: var(--muted-2, #6f7891);
}
.scripture-tooltip-brand,
.scripture-tooltip-powered { color: var(--muted-2, #6f7891); }
.scripture-tooltip-loading { color: var(--muted, #9aa3b8); }
.scripture-tooltip-error { color: #eec3ba; }

/* ---- light theme ---------------------------------------------------------- */
[data-theme="light"] a.scripture-ref {
  color: var(--amber, #3a63c4);
  text-decoration-color: rgba(58, 99, 196, .4);
}
[data-theme="light"] a.scripture-ref:hover {
  color: var(--amber-deep, #2f51a8);
  text-decoration-color: rgba(47, 81, 168, .75);
}
[data-theme="light"] .scripture-tagger-tooltip {
  background: #fff;
  border-color: rgba(58, 99, 196, .3);
  box-shadow: 0 18px 44px rgba(30, 44, 80, .18);
}
[data-theme="light"] .scripture-tooltip-header {
  background: linear-gradient(180deg, #3a63c4, #2f51a8);
}
[data-theme="light"] .scripture-tooltip-content {
  background: #f7f8fb;
  color: var(--read, #232a3b);
}
[data-theme="light"] .scripture-tooltip-text { color: var(--read, #232a3b); }
[data-theme="light"] .scripture-tooltip-text sup { color: var(--hazel, #5f7326); }
[data-theme="light"] .scripture-tooltip-footer {
  background: #fff;
  border-top-color: rgba(58, 99, 196, .18);
  color: var(--muted-2, #8590a6);
}