/* ENOL forms: base layout. Themes override by class; nothing here is required for the markup to work. */
.enol-form { display: block; max-width: 100%; }
.enol-form__field { margin: 0 0 1.25rem; }
.enol-form__label { display: block; font-weight: 600; margin-bottom: 0.35rem; }
.enol-form__group { border: 0; margin: 0; padding: 0; min-width: 0; }
.enol-form__group .enol-form__label { padding: 0; }
.enol-form__mark { font-size: 0.8em; font-weight: 600; margin-left: 0.4em; padding: 0.1em 0.45em; border-radius: 3px; vertical-align: middle; }
.enol-form__mark--required { background: #c62828; color: #fff; }
.enol-form__mark--conditional { background: #e0e0e0; color: #333; }
/* Text outside the controls inherits the theme's colour, so the form works on light and dark pages. */
.enol-form__help { margin: 0 0 0.4rem; font-size: 0.9em; opacity: 0.8; }
.enol-form__control { display: block; width: 100%; box-sizing: border-box; padding: 0.6em 0.75em; font: inherit; color: #222; border: 1px solid #999; border-radius: 4px; background: #fff; }
.enol-form__control::placeholder { color: #888; }
.enol-form__control:focus { outline: 2px solid #1a73e8; outline-offset: 1px; }
.enol-form__control[aria-invalid="true"], .enol-form__field--invalid .enol-form__choice-control { border-color: #c62828; outline-color: #c62828; }
.enol-form__choices { display: flex; flex-wrap: wrap; gap: 0.5rem 1.25rem; }
.enol-form__choice { display: inline-flex; align-items: center; gap: 0.4em; cursor: pointer; }
.enol-form__consent .enol-form__label { display: inline; font-weight: 500; }
.enol-form__error { margin: 0.35rem 0 0; color: #c62828; font-size: 0.9em; }
.enol-form__error[hidden] { display: none; }
.enol-form__summary { border: 2px solid #c62828; border-radius: 4px; padding: 0.75rem 1rem; margin: 0 0 1.25rem; background: #fff5f5; }
.enol-form__summary-title { margin: 0 0 0.5rem; font-weight: 700; color: #c62828; }
.enol-form__summary-list { margin: 0; padding-left: 1.25rem; }
.enol-form__summary-list a { color: #c62828; }
.enol-form__actions { margin: 1.5rem 0 0; display: flex; gap: 0.75rem; flex-wrap: wrap; }
.enol-form__submit, .enol-form__back { font: inherit; padding: 0.75em 1.75em; border-radius: 4px; border: 1px solid #1a73e8; cursor: pointer; }
.enol-form__submit { background: #1a73e8; color: #fff; }
.enol-form__submit[disabled] { opacity: 0.6; cursor: progress; }
.enol-form__back { background: #fff; color: #1a73e8; }
.enol-form__review { display: grid; grid-template-columns: minmax(8em, 1fr) 3fr; gap: 0.5rem 1rem; margin: 1rem 0; }
.enol-form__review dt { font-weight: 600; }
.enol-form__review dd { margin: 0; white-space: pre-wrap; overflow-wrap: anywhere; }
.enol-form__status { margin: 1rem 0 0; min-height: 1.5em; }
.enol-form__status--error { color: #c62828; }
.enol-form__status--pending { opacity: 0.8; }
.enol-form__receipt { font-weight: 600; }
.enol-form--closed { padding: 1rem; border: 1px solid #ccc; border-radius: 4px; background: #f7f7f7; }
/* Without JavaScript the intake redirects to #<form>-complete; :target swaps the sections. */
.enol-form__step--complete:target { display: block; }
/* CMS-rendered forms keep their own markup; the completion block added after them shows the same way. */
[data-enol-nojs-complete]:target { display: block; }
/* The runtime moves focus to the confirm and complete steps for assistive technology; no ring is drawn around the block. */
.cfk-step--confirm:focus, [data-enol-nojs-complete]:focus, .enol-form__step:focus { outline: none; }
.enol-turnstile:empty { display: none; }
.enol-form:has(.enol-form__step--complete:target) .enol-form__step--input,
.enol-form:has(.enol-form__step--complete:target) .enol-form__summary { display: none; }
@media (max-width: 600px) {
  .enol-form__review { grid-template-columns: 1fr; gap: 0.15rem 0; }
  .enol-form__review dd { margin-bottom: 0.75rem; }
}
