/*
 * arc-event-reg confirmation page screen styles (v1.22.0).
 *
 * All rules scoped under .arc-event-reg-confirmation. The shortcode renders
 * inside Elementor and other page-builder contexts; never write rules that
 * escape the wrapper class.
 *
 * Visual system mirrors the v1.19.0 / v1.20.0 email templates — Poppins-only
 * typography (no Abril Fatface on the web page), palette + type-scale tokens
 * defined on the wrapper class so descendants can reference them via var().
 */

.arc-event-reg-confirmation {
    --arc-orange:      #EA7125;
    --arc-blue:        #005E85;
    --arc-text:        #1a1f24;
    --arc-muted:       #5a6671;
    --arc-rule:        #d8dde2;
    --arc-tint-orange: #fff8f1;
    --arc-tint-gray:   #f3f5f7;

    /* Type scale — v1.50.0 design pass tightened the scale.
       --arc-h1 and --arc-h2 intentionally share 26px: "You're registered."
       comes down to h2 size. Keep both tokens — the <h1>/<h2> elements stay
       semantically distinct — and do not "fix" the matching values. */
    --arc-h1:         26px;  /* was 40px */
    --arc-h2:         26px;  /* was 28px */
    --arc-body-heavy: 24px;  /* HOLD — event title, ticket name, button label */
    --arc-body:       19px;  /* was 22px */
    --arc-secondary:  18px;  /* was 20px */
    --arc-pill:       14px;  /* HOLD — floor */

    max-width: 720px;
    margin: 0 auto;
    padding: 28px 22px 56px;
    font-family: Poppins, Helvetica, Arial, sans-serif;
    color: var(--arc-text);
    font-size: var(--arc-body);
    line-height: 1.55;
}

.arc-event-reg-confirmation h1,
.arc-event-reg-confirmation h2 {
    font-family: Poppins, Helvetica, Arial, sans-serif;
    color: var(--arc-text);
}

.arc-event-reg-confirmation h1 {
    font-size: var(--arc-h1);
    line-height: 1.15;
    font-weight: 700;
    margin: 0 0 10px;
}

.arc-event-reg-confirmation h2 {
    font-size: var(--arc-h2);
    line-height: 1.25;
    font-weight: 600;
    margin: 0 0 14px;
}

.arc-event-reg-confirmation a {
    color: var(--arc-blue);
}

/* ─── Block 1: Reassurance header + email indicator ─────────────────────── */

.arc-event-reg-confirmation__reassurance {
    margin: 0 0 30px;
}

.arc-event-reg-confirmation__reassurance-title {
    /* H1 styles inherited from .arc-event-reg-confirmation h1 */
    margin: 0 0 12px;
}

.arc-event-reg-confirmation__email-indicator {
    display: flex;
    align-items: flex-start;   /* was center — icon now pins to first line */
    gap: 10px;                  /* was 8px */
    font-size: var(--arc-secondary);
    color: var(--arc-muted);
    background: var(--arc-tint-gray);
    padding: 8px 14px;
    border-radius: 4px;
    margin: 0;
}
.arc-event-reg-confirmation__email-indicator .fas {
    flex-shrink: 0;
    margin-top: 0.2em;          /* optical-align to first-line cap height */
}

/* ─── Block 2: Event block (title + WHEN/WHERE) ─────────────────────────── */

.arc-event-reg-confirmation__event-block {
    margin: 0 0 30px;
}

.arc-event-reg-confirmation__event-title {
    font-size: var(--arc-body-heavy);
    font-weight: 600;
    line-height: 1.25;
    margin: 0 0 24px;
    color: var(--arc-text);
}

.arc-event-reg-confirmation__event-title a {
    color: inherit;
    text-decoration: none;
}

.arc-event-reg-confirmation__event-title a:hover,
.arc-event-reg-confirmation__event-title a:focus {
    text-decoration: underline;
}

.arc-event-reg-confirmation__when-where {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 24px;
}

@media (max-width: 600px) {
    .arc-event-reg-confirmation__when-where {
        grid-template-columns: 1fr;
        gap: 18px;
    }
}

.arc-event-reg-confirmation__ww-col > div {
    margin: 0 0 2px;
}

.arc-event-reg-confirmation__ww-label {
    font-size: var(--arc-secondary);
    font-weight: 600;
    color: var(--arc-text);
    text-transform: uppercase;
    letter-spacing: 0.06em;
    margin-bottom: 8px;
}

.arc-event-reg-confirmation__ww-sub {
    color: var(--arc-muted);
    font-size: var(--arc-secondary);
    margin-top: 6px;
}

/* ─── Group-only orange explainer callout ───────────────────────────────── */

.arc-event-reg-confirmation__group-callout {
    background: var(--arc-tint-orange);
    border-left: 4px solid var(--arc-orange);
    border-radius: 0 4px 4px 0;
    padding: 22px 26px;
    margin: 28px 0 0;
    font-size: var(--arc-body);
    line-height: 1.55;
}

/* ─── Block 3: Tickets ──────────────────────────────────────────────────── */

.arc-event-reg-confirmation__ticket-block {
    margin: 30px 0;
}

.arc-event-reg-confirmation__ticket-summary {
    font-size: var(--arc-body);
    color: var(--arc-muted);
    margin: 0 0 14px;
    line-height: 1.55;
}

.arc-event-reg-confirmation__section-label {
    font-size: var(--arc-secondary);
    font-weight: 600;
    color: var(--arc-text);
    text-transform: uppercase;
    letter-spacing: 0.06em;
    margin: 26px 0 10px;
}

.arc-event-reg-confirmation__ticket {
    background: #ffffff;
    border: 1px solid var(--arc-rule);
    border-radius: 6px;
    padding: 24px 26px;
    margin: 0 0 14px;
}

.arc-event-reg-confirmation__ticket--yours {
    background: var(--arc-tint-orange);
    border-color: var(--arc-orange);
}

.arc-event-reg-confirmation__pill {
    display: inline-block;
    background: var(--arc-orange);
    color: #ffffff;
    font-size: var(--arc-pill);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    padding: 4px 12px;
    border-radius: 999px;
    margin: 0 0 14px;
}

.arc-event-reg-confirmation__ticket-label {
    font-size: var(--arc-secondary);
    font-weight: 600;
    color: var(--arc-muted);
    text-transform: uppercase;
    letter-spacing: 0.06em;
    margin: 0 0 8px;
}

.arc-event-reg-confirmation__ticket-name {
    font-size: var(--arc-body-heavy);
    font-weight: 600;
    color: var(--arc-text);
    line-height: 1.25;
    margin: 0 0 4px;
}

.arc-event-reg-confirmation__ticket-email {
    font-size: var(--arc-secondary);
    color: var(--arc-muted);
    margin: 0 0 6px;
    word-break: break-word;
}

.arc-event-reg-confirmation__ticket-meta {
    font-size: var(--arc-secondary);
    color: var(--arc-muted);
    margin: 0 0 18px;
}

.arc-event-reg-confirmation a.arc-event-reg-confirmation__ticket-join {
    display: block;
    background: var(--arc-orange);
    color: #ffffff;
    text-decoration: none;
    padding: 16px 20px;
    font-size: var(--arc-body-heavy);
    font-weight: 600;
    border-radius: 8px;                                   /* was 4px */
    text-align: center;
    box-sizing: border-box;
    margin: 0 0 16px;
    box-shadow: 0 2px 6px rgba(234, 113, 37, 0.35);
    transition: box-shadow 0.15s ease, transform 0.15s ease, background 0.15s ease;
}
.arc-event-reg-confirmation a.arc-event-reg-confirmation__ticket-join:hover,
.arc-event-reg-confirmation a.arc-event-reg-confirmation__ticket-join:focus {
    background: #d3631d;
    color: #ffffff;
    text-decoration: none;
    box-shadow: 0 4px 10px rgba(234, 113, 37, 0.45);
    transform: translateY(-1px);
}
.arc-event-reg-confirmation a.arc-event-reg-confirmation__ticket-join:focus-visible {
    outline: 3px solid #ffd9bf;
    outline-offset: 2px;
}

/* v1.50.0 — Join-button icon (inline camera SVG on Zoom, FA pin in-person)
   sized to the button label and spaced from it. */
.arc-event-reg-confirmation__ticket-join svg,
.arc-event-reg-confirmation__ticket-join .fas {
    width: 1em;
    height: 1em;
    vertical-align: -0.125em;
    margin-right: 0.5em;
    flex-shrink: 0;
}

.arc-event-reg-confirmation__ticket-tech-support {
    font-size: var(--arc-secondary);
    color: var(--arc-muted);
    line-height: 1.55;
    margin: 0 0 16px;
}

.arc-event-reg-confirmation__ticket-actions {
    font-size: var(--arc-secondary);
    line-height: 1.55;
    margin: 0;
}

.arc-event-reg-confirmation__ticket-actions a {
    color: var(--arc-blue);
    text-decoration: underline;
}

.arc-event-reg-confirmation__ticket-actions .sep {
    color: var(--arc-muted);
    padding: 0 6px;
}

/* v1.50.0 — leading FA icons on action links (Calendar/Transfer/Cancel),
   sized to the link text and inheriting its blue via currentColor. */
.arc-event-reg-confirmation__ticket-actions .fas,
.arc-event-reg-confirmation__plans-change-actions .fas {
    margin-right: 0.4em;
    font-size: 0.95em;
}

.arc-event-reg-confirmation__ticket-cal-secondary {
    font-size: var(--arc-pill);
    color: var(--arc-muted);
    margin: 6px 0 0;
    line-height: 1.55;
}

.arc-event-reg-confirmation__ticket-cal-secondary a {
    color: var(--arc-blue);
}

/* ─── Block 4: Plans Change panel ───────────────────────────────────────── */

.arc-event-reg-confirmation__plans-change {
    background: none;                             /* was var(--arc-tint-gray) fill */
    border-top: 1px solid var(--arc-rule);
    border-radius: 0;
    padding: 22px 0 0;                            /* was 28px 32px */
    margin: 30px 0 0;
}

.arc-event-reg-confirmation__plans-change h2 {
    font-size: var(--arc-body);                  /* was --arc-h2 — demote, keep sentence-case warmth */
    font-weight: 600;
    color: var(--arc-text);
    margin: 0 0 8px;
}

.arc-event-reg-confirmation__plans-change-prose {
    font-size: var(--arc-secondary);             /* was --arc-body */
    color: var(--arc-muted);                     /* was default text */
    line-height: 1.55;
    margin: 0 0 10px;
}

.arc-event-reg-confirmation__plans-change-prose:last-child {
    margin-bottom: 0;
}

.arc-event-reg-confirmation__plans-change-actions {
    font-size: var(--arc-secondary);
    margin: 0;
    line-height: 1.55;
}

.arc-event-reg-confirmation__plans-change-actions a {
    color: var(--arc-blue);
    text-decoration: underline;
}

.arc-event-reg-confirmation__plans-change-actions .sep {
    color: var(--arc-muted);
    padding: 0 8px;
}

.arc-event-reg-confirmation a.arc-event-reg-confirmation__group-cancel-button {
    display: block;
    background: #ffffff;
    color: var(--arc-blue);
    border: 1px solid var(--arc-rule);
    text-decoration: none;
    padding: 16px 20px;
    font-size: var(--arc-body-heavy);
    font-weight: 600;
    border-radius: 8px;                                   /* was 4px */
    text-align: center;
    box-sizing: border-box;
    margin: 18px 0 0;
}

.arc-event-reg-confirmation a.arc-event-reg-confirmation__group-cancel-button:hover,
.arc-event-reg-confirmation a.arc-event-reg-confirmation__group-cancel-button:focus {
    background: var(--arc-tint-gray);
    color: var(--arc-blue);
    text-decoration: none;
}

/* ─── Prep notes ────────────────────────────────────────────────────────── */

.arc-event-reg-confirmation__prep-notes {
    margin: 30px 0 0;
}

.arc-event-reg-confirmation__prep-notes > div {
    font-size: var(--arc-body);
    line-height: 1.55;
}

/* ─── Cancellation-window indicator (single + group, untouched markup) ─── */

.arc-event-reg-confirmation .arc-cancel-window {
    font-size: var(--arc-secondary);
    color: var(--arc-muted);
    margin: 12px 0 0;
    line-height: 1.55;
}

.arc-event-reg-confirmation .arc-cancel-window--partial {
    color: #8a5a00;
}

.arc-event-reg-confirmation .arc-cancel-window__how {
    display: inline-block;
    margin-left: 0.25rem;
    font-size: var(--arc-pill);
}

.arc-event-reg-confirmation .arc-cancel-window__how summary {
    display: inline;
    cursor: pointer;
    color: var(--arc-blue);
    text-decoration: underline;
    list-style: none;
}

.arc-event-reg-confirmation .arc-cancel-window__how[open] summary {
    margin-bottom: 0.25rem;
}

.arc-event-reg-confirmation .arc-cancel-window__how span {
    display: block;
    margin-top: 0.25rem;
    color: var(--arc-muted);
}

/* ─── Block 5: Page bottom (reassurance + Save-as-PDF) ──────────────────── */

.arc-event-reg-confirmation__page-bottom {
    margin-top: 38px;
    padding-top: 26px;
    border-top: 1px solid var(--arc-rule);
}

/* Still used by the invoice / group-pending branch's page-bottom (its own
   "We're sending you an email with your invoice attached..." line). The
   v1.50.0 success-branch page-bottom dropped its reassurance line, but this
   branch keeps one. */
.arc-event-reg-confirmation__email-reassurance {
    font-size: var(--arc-body);
    color: var(--arc-text);
    margin: 0 0 10px;
}

.arc-event-reg-confirmation__pdf-link {
    font-size: var(--arc-secondary);
    margin: 0;
}

.arc-event-reg-confirmation__pdf-link a {
    color: var(--arc-blue);
    text-decoration: underline;
    cursor: pointer;
    background: none;
    border: 0;
    padding: 0;
    font: inherit;
}

.arc-event-reg-confirmation__pdf-link .fas {
    margin-right: 0.4em;
}

/* ─── Pending-bank + error-state branches (token refresh) ───────────────── */

.arc-event-reg-confirmation__header {
    font-size: var(--arc-h1);
    line-height: 1.15;
    margin: 0 0 24px;
    font-weight: 700;
}

.arc-event-reg-confirmation__body > * {
    margin: 0 0 16px;
}

.arc-event-reg-confirmation__greeting {
    font-size: var(--arc-body);
}

.arc-event-reg-confirmation__opening-line,
.arc-event-reg-confirmation__payment-line,
.arc-event-reg-confirmation__lunch-line {
    font-size: var(--arc-body);
    line-height: 1.55;
}

.arc-event-reg-confirmation__whats-next {
    font-style: italic;
    color: var(--arc-muted);
    font-size: var(--arc-secondary);
}

.arc-event-reg-confirmation__event-info,
.arc-event-reg-confirmation__attendee-info,
.arc-event-reg-confirmation__cancellation,
.arc-event-reg-confirmation__signoff {
    border-top: 1px solid var(--arc-rule);
    padding-top: 22px;
    margin-top: 26px;
}

.arc-event-reg-confirmation__section-title {
    font-size: var(--arc-h2);
    font-weight: 600;
    margin: 0 0 14px;
    color: var(--arc-text);
}

.arc-event-reg-confirmation__details {
    display: grid;
    grid-template-columns: max-content 1fr;
    gap: 8px 18px;
    margin: 0;
}

.arc-event-reg-confirmation__details dt {
    font-size: var(--arc-secondary);
    font-weight: 600;
    color: var(--arc-text);
    text-transform: uppercase;
    letter-spacing: 0.06em;
}

.arc-event-reg-confirmation__details dd {
    margin: 0;
    font-size: var(--arc-body);
}

.arc-event-reg-confirmation__description {
    margin-top: 18px;
    font-size: var(--arc-body);
    line-height: 1.55;
}

.arc-event-reg-confirmation__special-instructions {
    margin: 12px 0 0 22px;
    padding: 0;
    font-size: var(--arc-body);
    line-height: 1.55;
}

.arc-event-reg-confirmation__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 14px 18px;
    align-items: center;
    margin: 28px 0 22px;
}

.arc-event-reg-confirmation__add-to-calendar {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.arc-event-reg-confirmation__button {
    display: inline-block;
    padding: 12px 20px;
    border-radius: 4px;
    border: 1px solid transparent;
    font-weight: 600;
    text-decoration: none;
    cursor: pointer;
    line-height: 1.2;
    font-size: var(--arc-secondary);
    background: #ffffff;
    color: var(--arc-text);
    font-family: Poppins, Helvetica, Arial, sans-serif;
}

.arc-event-reg-confirmation__button--primary {
    background: var(--arc-orange);
    color: #ffffff;
    border-color: var(--arc-orange);
}

.arc-event-reg-confirmation__button--primary:hover,
.arc-event-reg-confirmation__button--primary:focus {
    background: #d3631d;
    border-color: #d3631d;
    color: #ffffff;
}

.arc-event-reg-confirmation__button--secondary {
    border-color: var(--arc-rule);
    color: var(--arc-blue);
}

.arc-event-reg-confirmation__button--secondary:hover,
.arc-event-reg-confirmation__button--secondary:focus {
    background: var(--arc-tint-gray);
}

.arc-event-reg-confirmation__button--outline {
    background: #ffffff;
    color: var(--arc-text);
    border-color: var(--arc-rule);
}

.arc-event-reg-confirmation__button--outline:hover,
.arc-event-reg-confirmation__button--outline:focus {
    background: var(--arc-tint-gray);
    border-color: var(--arc-text);
}

.arc-event-reg-confirmation__calendar-links {
    font-size: var(--arc-pill);
    color: var(--arc-muted);
}

.arc-event-reg-confirmation__calendar-links a {
    color: var(--arc-blue);
}

.arc-event-reg-confirmation__cancellation p,
.arc-event-reg-confirmation__signoff p {
    margin: 0 0 10px;
    font-size: var(--arc-body);
    line-height: 1.55;
}

.arc-event-reg-confirmation__registration-id {
    color: var(--arc-muted);
    font-size: var(--arc-secondary);
}

.arc-event-reg-confirmation__also-emailed {
    margin-top: 30px;
    color: var(--arc-muted);
    text-align: center;
    font-size: var(--arc-secondary);
}

.arc-event-reg-confirmation__entry-ref {
    margin-top: 8px;
    color: var(--arc-muted);
    font-size: var(--arc-secondary);
}

.arc-event-reg-confirmation__cancel-link {
    font-size: var(--arc-secondary);
    color: var(--arc-blue);
    text-decoration: underline;
}
