/*
 * This is a manifest file that'll be compiled into application.css.
 *
 * With Propshaft, assets are served efficiently without preprocessing steps. You can still include
 * application-wide styles in this file, but keep in mind that CSS precedence will follow the standard
 * cascading order, meaning styles declared later in the document or manifest will override earlier ones,
 * depending on specificity.
 *
 * Consider organizing styles into separate files for maintainability.
 */

/* The full reader keeps controls in view without crowding its transcript. */
.transcript-reader [data-transcript-target="line"] {
  margin-inline: 0;
  padding: 10px 12px;
  border: 1px solid transparent;
  scroll-margin-block: calc(var(--header-height) + 7rem) 7rem;
}
.transcript-reader ol { margin-top: 12px; gap: 4px; }
.transcript-reader [data-transcript-target="line"][data-seek-row] { cursor: pointer; }
.transcript-reader [data-transcript-target="line"][data-seek-row]:hover { background: #faf8ff; }
.transcript-reader [data-transcript-target="line"][data-current] { background: #f5f0ff; border-color: #ddd6fe; }
.transcript-reader [data-current] > button { color: #7008e7; }