/* SMS program disclosure page (/Home/SmsTerms) — the Website opt-in URL for the toll-free verification
 * application (#182). Layered on legal-pages.css, which supplies the page frame and typography; this file
 * only adds the three things that page can't express: the program summary grid, a faithful reproduction of
 * the in-app consent control, and message bubbles.
 * Colors come from the shared --et-* tokens in brand.css — nothing here hardcodes a hex value. */

.sms-summary {
    width: 100%;
    border-collapse: collapse;
    margin-bottom: 1.5rem;
}

.sms-summary th,
.sms-summary td {
    text-align: left;
    vertical-align: top;
    padding: 0.6rem 0.75rem;
    border-bottom: 1px solid var(--et-divider);
}

.sms-summary th {
    width: 34%;
    font-weight: 700;
    color: var(--et-text);
    white-space: nowrap;
}

/* Quotes the disclosure shown above the "Text me a code" button, so this page reproduces the actual point
   of opt-in rather than describing it second-hand.
   ⚠️ No checkbox, by design. The toll-free reviewer rejected the earlier design twice — once for a
   pre-selected consent checkbox, once for tying consent to account creation ("consent for messaging is a
   requirement for service"). Under request-as-opt-in the button tap is the affirmative act, so there is
   nothing to tick. Do not reintroduce one. */
.consent-card {
    background: var(--et-card);
    border: 1px solid var(--et-divider);
    border-left: 3px solid var(--et-accent);
    border-radius: 12px;
    padding: 1rem 1.1rem;
    margin-bottom: 1.25rem;
}

.consent-card p {
    margin: 0;
    font-size: 0.95rem;
}

.sms-thread {
    background: var(--et-card);
    border: 1px solid var(--et-divider);
    border-radius: 12px;
    padding: 1.1rem;
    margin-bottom: 1.25rem;
}

.sms-thread .sms-from {
    font-weight: 700;
    font-size: 0.9rem;
    color: var(--et-text-muted);
    margin-bottom: 0.85rem;
    padding-bottom: 0.6rem;
    border-bottom: 1px solid var(--et-divider);
}

.sms-bubble {
    background: var(--et-background);
    border-radius: 16px;
    padding: 0.75rem 1rem;
    margin-bottom: 0.4rem;
    max-width: 34rem;
    line-height: 1.6;
}

.sms-bubble + .sms-caption {
    font-size: 0.85rem;
    color: var(--et-text-muted);
    margin: 0 0 1.1rem 0.25rem;
}

.sms-thread .sms-bubble:last-of-type,
.sms-thread .sms-caption:last-child {
    margin-bottom: 0;
}

/* Reply keywords (STOP / HELP) read as commands, so they are set apart from prose. */
.sms-keyword {
    font-family: var(--bs-font-monospace, monospace);
    font-weight: 700;
    background: var(--et-background);
    border: 1px solid var(--et-divider);
    border-radius: 5px;
    padding: 0.05rem 0.4rem;
}