/* One-email check page: additions to village-apps.css and email-decision-record-product.css (no inline style, per the CSP).
   Colours come from the shared theme tokens, so light, dark and the theme toggle apply without change here. */
.sc-narrow { max-width: 46rem; margin-inline: auto; }
.sc-narrow h2 { font-size: var(--t-xl, 1.7rem); letter-spacing: -.01em; margin: 0 0 var(--s4, 1rem); }
.sc-narrow h3 { font-size: var(--t-l, 1.25rem); margin: 0 0 var(--s2, .5rem); }
.sc-facts { margin: 0 0 var(--s4, 1rem); padding-left: 1.2em; }
.sc-facts li { margin-bottom: var(--s2, .5rem); }

/* The notice: set apart from the text around it by a thick edge and a raised background, not by colour alone. */
.sc-notice { margin: var(--s4, 1rem) 0; padding: .8em 1em; border: 1px solid var(--line, #ccc); border-left: .45rem solid var(--ink, #222); border-radius: var(--r-s, .5rem); background: var(--bg-raise, #fff); font-weight: 650; overflow-wrap: anywhere; }
.sc-notice:empty { display: none; }

.sc-consent { display: flex; align-items: flex-start; gap: .6em; margin: var(--s4, 1rem) 0 0; }
.sc-consent input { flex: none; width: 1.3rem; height: 1.3rem; margin-top: .15rem; }
.sc-consent label { cursor: pointer; }

.sc-fields { border: 0; margin: 0; padding: 0; min-width: 0; }
.sc-fields:disabled { opacity: .55; }
.sc-help { margin-bottom: var(--s6, 1.5rem); }
.sc-details { border: 1px solid var(--line, #ccc); border-radius: var(--r-s, .5rem); background: var(--bg-raise, #fff); margin: 0 0 var(--s2, .5rem); padding: 0 1em; }
.sc-details summary { cursor: pointer; padding: .7em 0; font-weight: 650; }
.sc-details p { margin: 0 0 .8em; }
.sc-field { margin-bottom: var(--s4, 1rem); }
.sc-field label { display: block; font-weight: 650; margin-bottom: .35em; }
.sc-field input[type="file"] { max-width: 100%; }
.sc-field textarea { display: block; width: 100%; box-sizing: border-box; min-height: 12rem; padding: .7em .8em; border: 1px solid var(--ink-soft, #666); border-radius: var(--r-s, .5rem); background: var(--bg-raise, #fff); color: var(--ink, #222); font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: .9rem; line-height: 1.45; resize: vertical; }
.sc-hint { margin: .35em 0 0; color: var(--ink-soft, #555); font-size: var(--t-s, .9rem); }

input:focus-visible, textarea:focus-visible, summary:focus-visible, select:focus-visible { outline: 2px solid var(--c-know, #10608f); outline-offset: 2px; }

.sc-altcha { margin: var(--s4, 1rem) 0; max-width: 100%; }
.sc-altcha altcha-widget { display: block; max-width: 100%; }
.sc-actions { display: flex; flex-wrap: wrap; gap: var(--s3, .75rem); margin: var(--s4, 1rem) 0 0; }
.sc-actions .btn { cursor: pointer; border: 1px solid var(--line, #ccc); font: inherit; font-weight: 650; }
.sc-actions .btn-primary { border-color: var(--ink, #222); }
.sc-actions .btn:disabled { cursor: not-allowed; opacity: .5; }
.sc-actions .btn:disabled:hover { transform: none; }

.sc-banner, .sc-error { margin: var(--s4, 1rem) 0; padding: .8em 1em; border: 1px solid var(--line, #ccc); border-left: .45rem solid var(--c-ground, #7a5a38); border-radius: var(--r-s, .5rem); background: var(--c-ground-soft, #f2e7d8); color: var(--ink, #222); }
.sc-error { border-left-color: var(--c-connect, #8f4f00); background: var(--c-connect-soft, #ffedd2); font-weight: 650; }
.sc-banner[hidden], .sc-error[hidden], #result[hidden], #sc-messages[hidden] { display: none; }

/* Result list: each check has its label, a status chip with a word and a shape, and its plain-text detail lines. */
.sc-items { list-style: none; margin: 0 0 var(--s4, 1rem); padding: 0; display: grid; gap: var(--s3, .75rem); }
.sc-item { border: 1px solid var(--line, #ccc); border-radius: var(--r-s, .5rem); background: var(--bg-raise, #fff); padding: .8em 1em; }
.sc-item-head { display: flex; flex-wrap: wrap; align-items: center; gap: .4em .8em; justify-content: space-between; }
.sc-item-label { font-weight: 650; overflow-wrap: anywhere; flex: 1 1 14rem; }
.sc-chip { display: inline-flex; align-items: center; gap: .4em; padding: .15em .7em; border: 2px solid var(--ink-soft, #555); border-radius: 999px; font-size: var(--t-s, .9rem); font-weight: 650; white-space: nowrap; background: var(--bg, #fff); }
.sc-chip-shape { font-size: 1em; line-height: 1; }
.sc-st-flagged, .sc-st-reported_fail { border-color: var(--c-connect, #8f4f00); background: var(--c-connect-soft, #ffedd2); }
.sc-st-nothing_flagged, .sc-st-reported_pass { border-color: var(--c-work, #176a49); background: var(--c-work-soft, #d9f3e5); }
.sc-st-failed { border-style: dashed; border-color: var(--c-decide, #5b45b4); background: var(--c-decide-soft, #ece6ff); }
.sc-st-not_checked, .sc-st-skipped, .sc-st-reported_none, .sc-st-reported_neutral { border-style: dotted; }
.sc-detail { margin: .5em 0 0; padding-left: 1.2em; font-size: var(--t-s, .9rem); }
.sc-detail li { overflow-wrap: anywhere; word-break: break-word; }
.sc-hop { margin: 0 0 var(--s2, .5rem); }
.sc-keep { margin: var(--s2, .5rem) 0; overflow-wrap: anywhere; }
.sc-url { display: block; margin-top: .3em; padding: .5em .7em; border: 1px solid var(--line, #ccc); border-radius: var(--r-s, .5rem); background: var(--bg-raise, #fff); font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: .85rem; overflow-wrap: anywhere; word-break: break-all; user-select: all; }

@media (prefers-reduced-motion: reduce) {
  .sc-details, .sc-chip, .btn { transition: none !important; animation: none !important; }
}