/* KBIBLE Bible reader highlight refinement v22 — 2026-08-15
   Clean focus treatment for selected / TTS-tracked Scripture text.
   Loaded after all legacy reader/theme styles.
*/

/* Keep the whole verse location visible, but do not flood the entire verse with color. */
html body.kb-bible-v5[data-reader-highlight] .verse-row.is-selected {
  background:color-mix(in srgb,var(--kb-track) 4%,transparent) !important;
  box-shadow:inset 3px 0 0 color-mix(in srgb,var(--kb-track) 72%,transparent) !important;
}
html body.kb-bible-v5[data-reader-highlight] .verse-row.is-reading {
  background:color-mix(in srgb,var(--kb-track) 5%,transparent) !important;
  box-shadow:inset 3px 0 0 var(--kb-track) !important;
}

/* Active sentence: thin translucent marker band + crisp underline.
   No glow, no pulsing, no saturation/filter, and never override the Scripture text color. */
html body.kb-bible-v5[data-reader-highlight] .sentence-unit {
  border-radius:.12em !important;
  padding:.01em .035em .025em !important;
  margin:0 -.005em !important;
  box-decoration-break:clone !important;
  -webkit-box-decoration-break:clone !important;
  transition:background-color .14s ease,box-shadow .14s ease !important;
}
html body.kb-bible-v5[data-reader-highlight] .sentence-unit.is-reading-sentence {
  color:inherit !important;
  text-shadow:none !important;
  filter:none !important;
  animation:none !important;
  background:linear-gradient(
    180deg,
    transparent 0%,
    transparent 57%,
    color-mix(in srgb,var(--kb-track) 18%,transparent) 57%,
    color-mix(in srgb,var(--kb-track) 18%,transparent) 94%,
    transparent 94%,
    transparent 100%
  ) !important;
  box-shadow:inset 0 -2px 0 color-mix(in srgb,var(--kb-track) 72%,transparent) !important;
}

/* Dark Scripture paper needs slightly more marker density, while retaining crisp text. */
html body.kb-bible-v5[data-reader-paper="dark"][data-reader-highlight] .sentence-unit.is-reading-sentence {
  color:var(--kb-paper-text) !important;
  background:linear-gradient(
    180deg,
    transparent 0%,
    transparent 55%,
    color-mix(in srgb,var(--kb-track) 24%,transparent) 55%,
    color-mix(in srgb,var(--kb-track) 24%,transparent) 94%,
    transparent 94%,
    transparent 100%
  ) !important;
  box-shadow:inset 0 -2px 0 color-mix(in srgb,var(--kb-track) 82%,transparent) !important;
}

/* Verse number remains a quiet location cue instead of becoming another large color block. */
html body.kb-bible-v5[data-reader-highlight] .v-num {
  color:color-mix(in srgb,var(--kb-track) 76%,var(--kb-paper-text) 24%) !important;
}
html body.kb-bible-v5[data-reader-highlight] .v-num span {
  background:color-mix(in srgb,var(--kb-track) 10%,transparent) !important;
  border:1px solid color-mix(in srgb,var(--kb-track) 20%,transparent) !important;
}

/* Browsers without color-mix still get a clean, non-glowing focus marker. */
@supports not (color:color-mix(in srgb, black 50%, white)) {
  html body.kb-bible-v5[data-reader-highlight] .verse-row.is-selected,
  html body.kb-bible-v5[data-reader-highlight] .verse-row.is-reading {
    background:transparent !important;
    box-shadow:inset 3px 0 0 var(--kb-track) !important;
  }
  html body.kb-bible-v5[data-reader-highlight] .sentence-unit.is-reading-sentence {
    color:inherit !important;
    background:var(--kb-track-soft) !important;
    box-shadow:inset 0 -2px 0 var(--kb-track) !important;
    text-shadow:none !important;
    filter:none !important;
    animation:none !important;
  }
}