/* ==========================================================================
   Return nudge — "Welcome back 👋" login-link card (assets/js/return-nudge.js)
   Shown to logged-out visitors arriving from a member-only campaign
   (utm_campaign=return-nudge). The hub mounts it in place of the guest
   one-door section; exercise pages auto-mount it above the widget.
   UX-STANDARDS §5.3 (≥44px targets), §6.1 (every state declared — the
   Elementor kit repaints undeclared buttons), §6.3 (no !important).
   Fleet tokens: green = the primary door (same green as the guest door),
   blue = identity/info frame. D-040 (less is more).
   ========================================================================== */

.as-rn-card {
    --rn-blue: #185FA5;
    --rn-green: #1a7f4e;
    --rn-green-dark: #156a41;
    --rn-text: #1d2433;
    --rn-muted: #5b6475;
    --rn-border: #bfdbfe;
    --rn-bg: #ffffff;
    --rn-error: #b91c1c;

    box-sizing: border-box;
    width: 100%;
    max-width: 560px;
    margin: 8px auto 18px;
    padding: 18px 18px 14px;
    background: var(--rn-bg);
    border: 2px solid var(--rn-border);
    border-radius: 16px;
    box-shadow: 0 6px 18px rgba(24, 95, 165, 0.12);
    color: var(--rn-text);
    text-align: left;
    font-size: 16px;
    line-height: 1.45;
}

/* Exercise-page mount sits above the widget inside the Elementor column. */
.as-rn-card--page {
    margin: 12px auto 16px;
}

/* Hub mount: the member door takes the guest door's slot and spacing. */
.practice-home-root .ph-member-door {
    display: flex;
    flex-direction: column;
    gap: 14px;
    padding: 6px 0 12px;
}
.practice-home-root .ph-member-door .as-rn-card {
    margin: 0 auto;
}

.as-rn-card .as-rn-head {
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 0 0 10px;
}

.as-rn-card .as-rn-head .as-rn-emoji {
    font-size: 28px;
    line-height: 1;
}

.as-rn-card .as-rn-title {
    margin: 0;
    font-size: 21px;
    font-weight: 700;
    line-height: 1.2;
    color: var(--rn-text);
}

.as-rn-card .as-rn-title:focus {
    outline: none;
}

.as-rn-card .as-rn-lines {
    list-style: none;
    margin: 0 0 14px;
    padding: 0;
}

.as-rn-card .as-rn-row {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    margin: 0 0 6px;
    padding: 0;
}

.as-rn-card .as-rn-row .as-rn-emoji {
    flex: 0 0 24px;
    width: 24px;
    text-align: center;
    font-size: 18px;
    line-height: 1.45;
}

.as-rn-card .as-rn-row-text {
    color: var(--rn-text);
}

.as-rn-card .as-rn-form {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin: 0;
}

.as-rn-card .as-rn-label {
    font-size: 15px;
    font-weight: 700;
    color: var(--rn-text);
}

.as-rn-card .as-rn-input {
    box-sizing: border-box;
    width: 100%;
    min-height: 52px;
    padding: 12px 14px;
    font-size: 18px;
    line-height: 1.3;
    color: var(--rn-text);
    background: #ffffff;
    border: 2px solid #cbd5e1;
    border-radius: 12px;
    -webkit-appearance: none;
    appearance: none;
}

.as-rn-card .as-rn-input:focus {
    border-color: var(--rn-blue);
    outline: 3px solid rgba(24, 95, 165, 0.35);
    outline-offset: 1px;
}

/* Honeypot: off-screen, never display:none (some bots skip hidden fields). */
.as-rn-card .as-rn-hp {
    position: absolute;
    left: -9999px;
    width: 1px;
    height: 1px;
    overflow: hidden;
}

/* One green primary action (green = door, gold stays for Premium). */
.as-rn-card .as-rn-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    box-sizing: border-box;
    width: 100%;
    min-height: 56px;
    margin: 4px 0 0;
    padding: 14px 20px;
    border: none;
    border-radius: 12px;
    background: var(--rn-green);
    color: #ffffff;
    font-size: 18px;
    font-weight: 700;
    line-height: 1.2;
    text-transform: none;
    letter-spacing: normal;
    cursor: pointer;
    touch-action: manipulation;
    -webkit-tap-highlight-color: transparent;
    box-shadow: 0 6px 16px rgba(26, 127, 78, 0.28);
    transition: background-color 0.15s ease, box-shadow 0.15s ease;
}

.as-rn-card .as-rn-btn:hover,
.as-rn-card .as-rn-btn:active {
    background: var(--rn-green-dark);
    color: #ffffff;
    box-shadow: 0 8px 20px rgba(26, 127, 78, 0.38);
}

.as-rn-card .as-rn-btn:focus {
    color: #ffffff;
    background: var(--rn-green);
}

.as-rn-card .as-rn-btn:focus-visible {
    outline: 3px solid var(--rn-blue);
    outline-offset: 2px;
}

.as-rn-card .as-rn-btn:disabled,
.as-rn-card .as-rn-btn.is-sending {
    background: var(--rn-green);
    color: #ffffff;
    opacity: 0.7;
    cursor: default;
    box-shadow: none;
}

.as-rn-card .as-rn-error {
    margin: 4px 0 0;
    font-size: 15px;
    font-weight: 600;
    color: var(--rn-error);
}

/* Quiet secondary door for genuine guests — never dead-end (§9.5). */
.as-rn-card .as-rn-alt {
    display: block;
    box-sizing: border-box;
    width: 100%;
    min-height: 44px;
    margin: 6px 0 0;
    padding: 12px;
    text-align: center;
    font-size: 15px;
    font-weight: 600;
    color: var(--rn-blue);
    background: transparent;
    text-decoration: underline;
    border-radius: 8px;
}

.as-rn-card .as-rn-alt:hover {
    color: #134B84;
    background: #f8fafc;
}

.as-rn-card .as-rn-alt:focus-visible {
    outline: 3px solid var(--rn-blue);
    outline-offset: 2px;
}

/* Sent state: same frame, green accent so the change of state is unmistakable. */
.as-rn-card.is-sent {
    border-color: #86efac;
    background: #f0fdf4;
}

@media (min-width: 768px) {
    .as-rn-card {
        padding: 22px 24px 16px;
    }
    .as-rn-card .as-rn-title {
        font-size: 23px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .as-rn-card .as-rn-btn {
        transition: none;
    }
}

/* The guest gate's "Get my login link" is a <button> (the signup door was an
   <a>): buttons don't inherit the font family by default. */
.guest-gate button.guest-gate-btn,
.session-summary button.ss-signup-btn {
    font-family: inherit;
}
