/* ewproof's own styles, on EW UI v1 tokens (ew-ui-v1/ew-ui.css). Everything is prefixed ewp-. */

/* The hidden attribute always wins: a component's own display (grid, flex) must not show it. */
.ew-app [hidden] { display: none !important; }

.ewp-signout { display: inline; }
.ewp-chapters { display: grid; gap: 6px; padding-left: 1.2em; }

/* Segments: the translation's text is shown exactly as stored, line breaks and non-breaking spaces kept, so
   a selection's offsets are the stored text's. */
.ewp-segments { margin-block: var(--ew-s3); }
.ewp-head > * { padding-block: 8px; }
.ewp-key { display: block; font-size: .72rem; letter-spacing: .04em; color: var(--ew-muted); margin-bottom: 4px; }
.ewp-text { white-space: pre-wrap; overflow-wrap: anywhere; line-height: 1.55; }
.ewp-verse .ewp-text { font-weight: 700; color: var(--ew-navy); }
.ewp-verse { background: var(--ew-surface-2); }
.ewp-open { margin-top: 8px; }
.ew-compare-row.is-selected { background: var(--ew-blue-soft); }

.ewp-suggestions { list-style: none; margin: 10px 0 0; padding: 0; display: grid; gap: 8px; }
.ewp-sug { border: 1px solid var(--ew-line); border-radius: 8px; padding: 8px 10px; background: var(--ew-surface); }
.ewp-meta { font-size: .8rem; color: var(--ew-muted); }
.ewp-change { margin-top: 4px; white-space: pre-wrap; overflow-wrap: anywhere; }
.ewp-decide { margin-top: 6px; display: grid; gap: 6px; }
.ewp-reason { margin: 4px 0 0; font-size: .9rem; color: var(--ew-ink); }

/* The editor panel opens under the row it belongs to. */
.ewp-editor { margin: 8px 0 16px; padding: var(--ew-s3); display: grid; gap: 12px; border: 2px solid var(--ew-blue); }
.ewp-editor-title { font-size: 1.05rem; margin: 0; }
.ewp-passage { white-space: pre-wrap; background: var(--ew-surface-2); }
.ewp-scope { border: 0; padding: 0; margin: 0; display: grid; gap: 6px; }
.ewp-status { min-height: 1.3em; margin: 0; }
.ewp-status.is-error { color: var(--ew-st-err-fg); }
.ewp-status.is-ok { color: var(--ew-st-ok-fg); }
.ewp-refused { margin: .5em 0 0; padding-left: 1.2em; }
.ewp-refused-item { margin-bottom: .5em; overflow-wrap: anywhere; }

.ewp-count { border: 1px solid var(--ew-line); border-radius: 8px; padding: 8px 10px; display: grid; gap: 4px; }
.ewp-count-head { font-weight: 700; }
.ewp-listed { border-left: 4px solid var(--ew-st-rev-fg); padding-left: 8px; }
.ewp-listed ul { margin: 4px 0 0; padding-left: 1.2em; }

.ewp-preview { display: grid; gap: 8px; }
.ewp-words { white-space: pre-wrap; overflow-wrap: anywhere; border: 1px solid var(--ew-line); border-radius: 8px; padding: 8px 10px; }
.ewp-frame { width: 100%; min-height: 90px; border: 1px solid var(--ew-line); border-radius: 8px; background: #fff; }
.ewp-html { font-size: .78rem; max-height: 12em; overflow: auto; white-space: pre-wrap; overflow-wrap: anywhere; background: var(--ew-surface-2); padding: 8px; border-radius: 8px; margin: 0; }
.ewp-html del, .ewp-html ins { text-decoration: none; }

@media (max-width: 720px) {
  .ew-compare-rows > .ewp-head { display: none; }
  .ew-header .ew-user-text { display: none; }
  .ewp-editor { position: sticky; bottom: 0; max-height: 85vh; overflow: auto; z-index: 5; }
}

/* S9: the "Check now" button inside the open-write notice */
.ewp-check { margin-top: 8px; }