/*
 * Free trial sign-up — the terminal screens at /trial.
 *
 * Spec: plans/specs/Free-Teacher-Trial-Jul-21-26.md §4.3.4, §4.6, §4.7.3
 *
 * The five screens a teacher can END on rather than pass through: welcome,
 * blocked domain, already trialled, already has an account, and neither
 * provider works. Split from free-trial-signup.css because that file is the
 * offer and the form, and together they ran past the 300-line ceiling in
 * how_to_work.md.
 *
 * Loaded by /trial alongside free-trial-signup.css, which owns the shared card
 * shell these sit inside. Gated on `.trial-page` for the same reason.
 */

.trial-page .stop-mark {
    width: 56px;
    height: 56px;
    border-radius: 14px;
    margin: 0 auto 16px;
    display: grid;
    place-items: center;
    background: #EEF6EE;
    color: var(--brand-600, #2F7D32);
}

.trial-page .stop-mark svg { width: 30px; height: 30px; display: block; }
.trial-page .stop-mark--warn { background: #FFF7ED; color: #B45309; }

.trial-page .stop-title {
    font-size: 22px;
    font-weight: 700;
    margin: 0 0 10px;
    text-align: center;
    color: var(--text-primary-900, #111827);
}

.trial-page .stop-body {
    font-size: 15px;
    color: var(--text-secondary, #4b5563);
    line-height: 1.55;
    margin: 0 0 22px;
    text-align: center;
}

.trial-page .stop-body strong { color: var(--text-primary-900, #111827); }
.trial-page .stop-actions { display: flex; flex-direction: column; gap: 10px; }

/*
 * Two gaps in the shared stylesheets that only show up on this page.
 *
 * `.btn-secondary` is used across the app but DEFINED NOWHERE in frontend/css —
 * every other page that uses it carries its own copy in an inline <style>, and
 * this page has none. Without this rule the secondary actions render as bare
 * browser-default buttons.
 *
 * And these actions are anchors, not buttons, because they navigate. No loaded
 * stylesheet resets anchor decoration, so "Bring Shepherd to my school" came out
 * as underlined text inside a green button and "Open my workspace" as plain blue
 * link text.
 */
.trial-page .stop-actions .cta-button,
.trial-page .stop-actions .btn {
    display: block;
    width: 100%;
    text-align: center;
    text-decoration: none;
    box-sizing: border-box;
}

.trial-page .btn-secondary {
    background: var(--bg-primary, #fff);
    color: var(--brand-600, #2F7D32);
    border: 2px solid var(--brand-600, #2F7D32);
    border-radius: 8px;
    padding: 12px 20px;
    font-family: inherit;
    font-size: 16px;
    font-weight: 600;
    cursor: pointer;
}

.trial-page .btn-secondary:hover { background: #EEF6EE; }

.trial-page .welcome-days {
    display: block;
    width: fit-content;
    margin: 0 auto 16px;
    background: #EEF6EE;
    border: 1px solid #C6E3C7;
    color: #15803d;
    font-weight: 700;
    border-radius: 999px;
    padding: 6px 16px;
    font-size: 14px;
}