/* Community News & Event request form — [news-events-request-form] */

/*
 * The parent theme bundles Bootstrap 3, which sets html { font-size: 10px }.
 * Every length below is em-relative to --nerf-base so the component is immune
 * to whatever the document root happens to be. To scale this inside the app
 * shell instead, override --nerf-base to 1rem and it follows --hva-font-scale.
 */

.nerf {
    --nerf-base: 16px;

    --nerf-navy: #1a2f6e;
    --nerf-navy-soft: #eef1f9;
    --nerf-ink: #1f2937;
    --nerf-muted: #6b7280;
    --nerf-line: #d5dae4;
    --nerf-line-soft: #e8ecf3;
    --nerf-surface: #fff;
    --nerf-canvas: #f7f8fb;
    --nerf-danger: #b42318;
    --nerf-danger-soft: #fef3f2;
    --nerf-radius: 12px;
    --nerf-gap: 1.25em;

    max-width: 46em;
    margin: 0 auto;
    padding: 0 1em;
    font-family:
        -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial,
        sans-serif;
    font-size: var(--nerf-base);
    line-height: 1.5;
    color: var(--nerf-ink);
    -webkit-font-smoothing: antialiased;
}

.nerf *,
.nerf *::before,
.nerf *::after {
    box-sizing: border-box;
}

.nerf fieldset {
    margin: 0;
    padding: 0;
    border: 0;
    min-width: 0;
}

.nerf legend {
    float: none;
    width: auto;
    padding: 0;
    border: 0;
    font-size: inherit;
    line-height: inherit;
    color: inherit;
}

.nerf p {
    margin: 0;
}

/* ── Blocks ──────────────────────────────────────────────────────────── */

.nerf__block {
    padding: 1.5em 0;
    border-top: 1px solid var(--nerf-line-soft);
}

.nerf__block--type {
    border-top: 0;
    padding-top: 0;
}

/* With the switcher hidden by ?form_focus, its divider would strand at the top. */
.nerf__block--type[hidden] + .nerf__block {
    border-top: 0;
    padding-top: 0;
}

.nerf__block[hidden],
.nerf__field[hidden],
.nerf__subblock[hidden],
.nerf__preview[hidden],
.nerf__chosen[hidden],
.nerf__combo-list[hidden],
.nerf__actions[hidden],
.nerf__summary[hidden],
.nerf__linkbar[hidden] {
    display: none;
}

/* Doubled class specificity throughout beats the theme's bare element selectors. */

.nerf .nerf__heading {
    margin: 0 0 1.25em;
    font-family: inherit;
    font-size: 1.375em;
    font-weight: 700;
    line-height: 1.25;
    letter-spacing: normal;
    text-transform: none;
    color: var(--nerf-navy);
}

.nerf .nerf__legend {
    display: block;
    width: auto;
    margin-bottom: 0.875em;
    padding: 0;
    font-family: inherit;
    font-size: 1.375em;
    font-weight: 700;
    line-height: 1.25;
    letter-spacing: normal;
    text-transform: none;
    color: var(--nerf-navy);
    border: 0;
}

.nerf__subblock {
    margin-top: 0.75em;
    padding: 1.125em 1.125em 0.375em;
    background: var(--nerf-canvas);
    border: 1px solid var(--nerf-line-soft);
    border-radius: var(--nerf-radius);
}

/* ── Fields ──────────────────────────────────────────────────────────── */

.nerf__field {
    margin-bottom: var(--nerf-gap) !important;
    min-width: 0;
}

.nerf__field:last-child {
    margin-bottom: 0;
}

.nerf .nerf__label {
    display: block;
    width: auto;
    margin-bottom: 0.25em;
    padding: 0;
    font-family: inherit;
    font-size: 0.9375em;
    font-weight: 600;
    line-height: 1.4;
    color: var(--nerf-ink);
    border: 0;
}

.nerf__req {
    color: var(--nerf-danger);
    font-weight: 400;
}

.nerf__help {
    margin: 0 0 0.5em;
    font-size: 0.875em;
    line-height: 1.45;
    color: var(--nerf-muted);
}

.nerf__help--block {
    margin-bottom: 1.125em;
}

.nerf__row {
    display: flex;
    flex-wrap: wrap;
    gap: 0 1em;
}

.nerf__row > * {
    flex: 1 1 11em;
}

/*
 * Bottom-aligns the inputs when only some columns carry help text above them.
 * :not([hidden]) is load-bearing — without it this rule ties on specificity with
 * .nerf__field[hidden] and, coming later in the file, wins and unhides the field.
 */
.nerf__row > .nerf__field:not([hidden]) {
    display: flex;
    flex-direction: column;
}

.nerf__row > .nerf__field > .nerf__input,
.nerf__row > .nerf__field > .nerf__combo {
    margin-top: auto;
}

/*
 * Plain input+error grouping inside a row, e.g. the organizer phone/email/website
 * trio. Deliberately NOT .nerf__field — that class opts into the top-alignment
 * rule above, which is built for label/help asymmetry and would misalign these
 * (no label above) the moment only one column shows an error.
 */
.nerf__inline-field {
    min-width: 0;
}

/* ── Inputs ──────────────────────────────────────────────────────────── */

.nerf .nerf__input {
    display: block;
    width: 100%;
    height: auto;
    padding: 0.625em 0.75em;
    font-family: inherit;
    font-size: 1em;
    line-height: 1.4;
    color: var(--nerf-ink);
    background: var(--nerf-surface);
    border: 1px solid var(--nerf-line);
    border-radius: 8px;
    box-shadow: none;
    transition:
        border-color 0.15s,
        box-shadow 0.15s;
}

.nerf .nerf__input:focus,
.nerf .nerf__input:focus-visible {
    outline: none;
    border-color: var(--nerf-navy);
    box-shadow: 0 0 0 3px rgba(26, 47, 110, 0.15);
}

.nerf__input--select {
    appearance: none;
    -webkit-appearance: none;
    padding-right: 2.25em;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath fill='none' stroke='%236b7280' stroke-width='2' d='M1 1l5 5 5-5'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 0.875em center;
    background-size: 0.75em;
}

.nerf .nerf__input.is-invalid {
    border-color: var(--nerf-danger);
    background-color: var(--nerf-danger-soft);
}

.nerf__count {
    margin: 0.375em 0 0;
    font-size: 0.8125em;
    color: var(--nerf-muted);
    text-align: right;
}

.nerf__count.is-near {
    color: #b54708;
}

.nerf__count.is-full {
    color: var(--nerf-danger);
    font-weight: 600;
}

/* ── Rich text editor ────────────────────────────────────────────────── */

.nerf__editor {
    background: var(--nerf-surface);
    border: 1px solid var(--nerf-line);
    border-radius: 8px;
    transition:
        border-color 0.15s,
        box-shadow 0.15s;
}

.nerf__editor.is-focused {
    border-color: var(--nerf-navy);
    box-shadow: 0 0 0 3px rgba(26, 47, 110, 0.15);
}

.nerf__editor.is-invalid {
    border-color: var(--nerf-danger);
}

.nerf__toolbar {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.25em;
    padding: 0.375em;
    border-bottom: 1px solid var(--nerf-line-soft);
}

.nerf .nerf__tool {
    min-width: 2em;
    height: 2em;
    padding: 0 0.5em;
    font-family: inherit;
    font-size: 0.875em;
    line-height: 1;
    color: var(--nerf-ink);
    background: transparent;
    border: 1px solid transparent;
    border-radius: 6px;
    cursor: pointer;
    transition: background 0.12s;
}

.nerf .nerf__tool svg {
    display: block;
    width: 1.15em;
    height: 1.15em;
    margin: 0 auto;
}

.nerf .nerf__tool:hover {
    background: var(--nerf-canvas);
}

.nerf .nerf__tool:focus-visible {
    outline: none;
    border-color: var(--nerf-navy);
    box-shadow: 0 0 0 2px rgba(26, 47, 110, 0.2);
}

.nerf .nerf__tool[aria-pressed="true"] {
    background: var(--nerf-navy-soft);
    border-color: #c9d2e8;
    color: var(--nerf-navy);
}

.nerf__tool-sep {
    width: 1px;
    height: 1.25em;
    margin: 0 0.25em;
    background: var(--nerf-line-soft);
}

.nerf__linkbar {
    display: flex;
    align-items: center;
    gap: 0.5em;
    padding: 0.5em;
    background: var(--nerf-canvas);
    border-bottom: 1px solid var(--nerf-line-soft);
}

.nerf .nerf__linkbar-input {
    flex: 1;
    padding: 0.375em 0.5em;
    font-size: 0.875em;
}

.nerf .nerf__linkbar-add,
.nerf .nerf__linkbar-cancel {
    padding: 0.4em 0.75em;
    font-family: inherit;
    font-size: 0.8125em;
    font-weight: 600;
    border-radius: 6px;
    border: 1px solid transparent;
    cursor: pointer;
}

.nerf .nerf__linkbar-add {
    color: #fff;
    background: var(--nerf-navy);
}

.nerf .nerf__linkbar-cancel {
    color: var(--nerf-muted);
    background: transparent;
    border-color: var(--nerf-line);
}

.nerf__editable {
    min-height: 9em;
    max-height: 30em;
    padding: 0.75em;
    overflow-y: auto;
    font-size: 1em;
    line-height: 1.6;
    outline: none;
}

.nerf__editable:empty::before {
    content: attr(data-placeholder);
    color: #9ca3af;
    pointer-events: none;
}

.nerf__editable > *:first-child {
    margin-top: 0;
}

.nerf__editable > *:last-child {
    margin-bottom: 0;
}

.nerf__editable p {
    margin: 0 0 0.75em;
}

.nerf__editable ul,
.nerf__editable ol {
    margin: 0 0 0.75em;
    padding-left: 1.5em;
}

.nerf__editable li {
    margin-bottom: 0.25em;
}

.nerf__editable a {
    color: var(--nerf-navy);
    text-decoration: underline;
}

.nerf__editable blockquote {
    margin: 0 0 0.75em;
    padding-left: 0.875em;
    border-left: 3px solid var(--nerf-line);
    color: var(--nerf-muted);
}

/* ── Type cards ──────────────────────────────────────────────────────── */

.nerf__cards {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75em;
}

.nerf__card {
    flex: 1 1 12em;
    position: relative;
    display: block;
    margin: 0;
    font-weight: 400;
    cursor: pointer;
}

.nerf__card input {
    position: absolute;
    opacity: 0;
    width: 1px;
    height: 1px;
    margin: 0;
}

.nerf__card-body {
    display: block;
    padding: 1.125em 1.25em;
    background: var(--nerf-surface);
    border: 2px solid var(--nerf-line);
    border-radius: var(--nerf-radius);
    transition:
        border-color 0.15s,
        background 0.15s;
}

.nerf__card:hover .nerf__card-body {
    border-color: #b9c1d2;
}

.nerf__card input:checked + .nerf__card-body {
    border-color: var(--nerf-navy);
    background: var(--nerf-navy-soft);
}

.nerf__card input:focus-visible + .nerf__card-body {
    box-shadow: 0 0 0 3px rgba(26, 47, 110, 0.2);
}

.nerf__card-title {
    display: block;
    font-size: 1.125em;
    font-weight: 700;
    line-height: 1.3;
}

.nerf__card-desc {
    display: block;
    margin-top: 0.125em;
    font-size: 0.875em;
    color: var(--nerf-muted);
}

/* ── Checkboxes ──────────────────────────────────────────────────────── */

.nerf__checks {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5em;
}

.nerf__check {
    display: flex;
    align-items: flex-start;
    gap: 0.5em;
    margin: 0;
    padding: 0.5em 0.875em;
    font-size: 0.9375em;
    font-weight: 400;
    background: var(--nerf-surface);
    border: 1px solid var(--nerf-line);
    border-radius: 2em;
    cursor: pointer;
    transition:
        border-color 0.15s,
        background 0.15s;
}

.nerf__check:has(input:checked) {
    border-color: var(--nerf-navy);
    background: var(--nerf-navy-soft);
}

.nerf__check:has(input:focus-visible) {
    box-shadow: 0 0 0 3px rgba(26, 47, 110, 0.15);
}

.nerf__check input {
    flex: none;
    width: 1.0625em;
    height: 1.0625em;
    margin: 0.1875em 0 0;
    accent-color: var(--nerf-navy);
}

.nerf__check--standalone {
    align-items: flex-start;
    padding: 0.875em 1em;
    border-radius: var(--nerf-radius);
    line-height: 1.45;
}

/* ── Switch ──────────────────────────────────────────────────────────── */

.nerf__switch {
    display: inline-flex;
    align-items: center;
    gap: 0.75em;
    margin: 0;
    font-size: 0.9375em;
    font-weight: 400;
    cursor: pointer;
}

.nerf__switch input {
    position: absolute;
    opacity: 0;
    width: 1px;
    height: 1px;
    margin: 0;
}

.nerf__switch-track {
    flex: none;
    display: block;
    width: 2.75em;
    height: 1.625em;
    padding: 0.1875em;
    background: #c3c9d6;
    border-radius: 1em;
    transition: background 0.18s;
}

.nerf__switch-thumb {
    display: block;
    width: 1.25em;
    height: 1.25em;
    background: #fff;
    border-radius: 50%;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
    transition: transform 0.18s;
}

.nerf__switch input:checked + .nerf__switch-track {
    background: var(--nerf-navy);
}

.nerf__switch input:checked + .nerf__switch-track .nerf__switch-thumb {
    transform: translateX(1.125em);
}

.nerf__switch input:focus-visible + .nerf__switch-track {
    box-shadow: 0 0 0 3px rgba(26, 47, 110, 0.2);
}

/* ── Pills ───────────────────────────────────────────────────────────── */

.nerf__pills {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5em;
    margin-bottom: 0.75em;
}

.nerf__pill {
    position: relative;
    margin: 0;
    font-weight: 400;
    cursor: pointer;
}

.nerf__pill input {
    position: absolute;
    opacity: 0;
    width: 1px;
    height: 1px;
    margin: 0;
}

.nerf__pill span {
    display: block;
    padding: 0.5em 1.125em;
    font-size: 0.9375em;
    background: var(--nerf-surface);
    border: 1px solid var(--nerf-line);
    border-radius: 2em;
    transition:
        border-color 0.15s,
        background 0.15s;
}

.nerf__pill input:checked + span {
    border-color: var(--nerf-navy);
    background: var(--nerf-navy-soft);
    font-weight: 600;
}

.nerf__pill input:focus-visible + span {
    box-shadow: 0 0 0 3px rgba(26, 47, 110, 0.2);
}

/* ── File upload ─────────────────────────────────────────────────────── */

.nerf__file {
    display: flex;
    align-items: center;
    gap: 0.875em;
    flex-wrap: wrap;
}

.nerf__file-input {
    position: absolute;
    opacity: 0;
    width: 1px;
    height: 1px;
}

.nerf__file-button {
    display: inline-block;
    margin: 0;
    padding: 0.5em 1em;
    font-size: 0.9375em;
    font-weight: 600;
    color: var(--nerf-navy);
    background: var(--nerf-navy-soft);
    border: 1px solid #c9d2e8;
    border-radius: 8px;
    cursor: pointer;
}

.nerf__file-input:focus-visible + .nerf__file-button {
    box-shadow: 0 0 0 3px rgba(26, 47, 110, 0.2);
}

.nerf__file-name {
    font-size: 0.875em;
    color: var(--nerf-muted);
    overflow-wrap: anywhere;
}

.nerf__preview {
    margin-top: 0.875em;
}

.nerf__preview-img {
    display: block;
    max-width: 100%;
    max-height: 14em;
    border-radius: var(--nerf-radius);
    border: 1px solid var(--nerf-line-soft);
}

.nerf .nerf__preview-remove {
    margin-top: 0.5em;
    padding: 0;
    font-family: inherit;
    font-size: 0.875em;
    color: var(--nerf-danger);
    background: none;
    border: 0;
    cursor: pointer;
    text-decoration: underline;
}

/* ── Combobox ────────────────────────────────────────────────────────── */

.nerf__combo {
    position: relative;
}

.nerf__combo-list {
    position: absolute;
    z-index: 20;
    top: calc(100% + 0.25em);
    left: 0;
    right: 0;
    max-height: 15em;
    margin: 0;
    padding: 0.25em;
    overflow-y: auto;
    list-style: none;
    background: var(--nerf-surface);
    border: 1px solid var(--nerf-line);
    border-radius: 8px;
    box-shadow: 0 8px 24px rgba(16, 24, 40, 0.12);
}

.nerf__option {
    padding: 0.5em 0.625em;
    border-radius: 6px;
    cursor: pointer;
    font-size: 0.9375em;
    line-height: 1.35;
}

.nerf__option.is-active,
.nerf__option:hover {
    background: var(--nerf-navy-soft);
}

.nerf__option-meta {
    display: block;
    font-size: 0.8667em;
    color: var(--nerf-muted);
}

.nerf__option--new {
    border-top: 1px solid var(--nerf-line-soft);
    margin-top: 0.25em;
    padding-top: 0.625em;
    color: var(--nerf-navy);
    font-weight: 600;
}

.nerf__chosen {
    display: flex;
    align-items: center;
    gap: 0.75em;
    flex-wrap: wrap;
    margin: 0.5em 0 0;
    padding: 0.625em 0.875em;
    font-size: 0.9375em;
    background: var(--nerf-navy-soft);
    border-radius: 8px;
}

.nerf .nerf__chosen-clear {
    margin-left: auto;
    padding: 0;
    font-family: inherit;
    font-size: 0.9333em;
    color: var(--nerf-navy);
    background: none;
    border: 0;
    cursor: pointer;
    text-decoration: underline;
}

/* ── Errors ──────────────────────────────────────────────────────────── */

.nerf__error {
    margin: 0.375em 0 0;
    font-size: 0.875em;
    font-weight: 500;
    color: var(--nerf-danger);
}

.nerf__error:empty {
    display: none;
}

.nerf__summary {
    margin-bottom: 1.5em;
    padding: 1em 1.125em;
    background: var(--nerf-danger-soft);
    border: 1px solid #fca19b;
    border-radius: var(--nerf-radius);
}

.nerf__summary:focus-visible {
    outline: 2px solid var(--nerf-danger);
    outline-offset: 2px;
}

.nerf__summary-title {
    margin: 0 0 0.5em;
    font-weight: 700;
    color: var(--nerf-danger);
}

.nerf__summary-list {
    margin: 0;
    padding-left: 1.25em;
    font-size: 0.9375em;
}

.nerf__summary-list a {
    color: var(--nerf-danger);
}

/* ── Success ─────────────────────────────────────────────────────────── */

.nerf__done {
    padding: 2em 1.5em;
    text-align: center;
    background: #f0fdf4;
    border: 1px solid #86cfa4;
    border-radius: var(--nerf-radius);
    outline: none;
}

.nerf .nerf__done-title {
    margin: 0 0 0.375em;
    font-size: 1.25em;
    font-weight: 700;
    color: #14532d;
}

.nerf .nerf__done-text {
    margin: 0;
    font-size: 1em;
    color: #166534;
}

/* ── Honeypot ────────────────────────────────────────────────────────── */

.nerf__hp {
    position: absolute;
    left: -9999px;
    width: 1px;
    height: 1px;
    overflow: hidden;
}

/* ── Actions ─────────────────────────────────────────────────────────── */

.nerf__actions {
    padding: 1.5em 0 0;
    border-top: 1px solid var(--nerf-line-soft);
}

.nerf .nerf__submit {
    width: 100%;
    padding: 0.875em 1.5em;
    font-family: inherit;
    font-size: 1.0625em;
    font-weight: 700;
    color: #fff;
    background: var(--nerf-navy);
    border: 0;
    border-radius: 10px;
    cursor: pointer;
    transition:
        background 0.15s,
        opacity 0.15s;
}

.nerf .nerf__submit:hover:not(:disabled) {
    background: #142457;
}

.nerf .nerf__submit:focus-visible {
    outline: none;
    box-shadow: 0 0 0 3px rgba(26, 47, 110, 0.35);
}

.nerf .nerf__submit:disabled {
    opacity: 0.6;
    cursor: default;
}

.nerf__status {
    margin: 0.75em 0 0;
    font-size: 0.9375em;
    text-align: center;
    color: var(--nerf-muted);
}

.nerf__status:empty {
    display: none;
}

.nerf__status.is-error {
    color: var(--nerf-danger);
}

/*
 * The Gravity Forms reCAPTCHA add-on hides every badge on the site with an inline
 * style, ours included. !important is the only thing that outranks that, and this
 * stylesheet only loads on pages carrying the form shortcode, so Gravity's own
 * forms elsewhere are untouched.
 */
.grecaptcha-badge {
    visibility: visible !important;
}

.nerf .nerf__legal {
    margin: 1em 0 0;
    font-size: 0.8125em;
    line-height: 1.45;
    text-align: center;
    color: var(--nerf-muted);
}

.nerf .nerf__legal a {
    color: inherit;
    text-decoration: underline;
}

@media (min-width: 40em) {
    .nerf .nerf__submit {
        width: auto;
        min-width: 14em;
    }
}

@media (prefers-reduced-motion: reduce) {
    .nerf * {
        transition: none !important;
    }
}