/**
 * The light Let's Talk surface — behind NLD_LIGHT_TALK (?light_talk=1).
 *
 * Scoped to `body.light-talk #screen-1`, so the forest palette is untouched
 * everywhere this is off.
 *
 * This is the SMALLEST of the four surfaces by a wide margin, and the reason is
 * worth writing down: the Wellspring was already a light screen. Its own comment
 * in nld.css calls it a "cream stage" — white composer, dark ink, sand and cream
 * bubbles. What made it look like part of a dark app was the shell around it,
 * not the screen. So this file mostly moves cream to paper and forest to teal,
 * and it needs no !important at all: every colour it changes lives in a
 * stylesheet rather than in an inline style, which is what the reading surface
 * had to fight.
 *
 * The bubbles do change sides in a sense. They were sand-on-cream and
 * cream-on-cream, distinguished mostly by which edge they hugged. Here the
 * believer's own words are the filled ones and Pastor Pauly answers on white —
 * the convention every messaging app has taught, and it survives being read
 * quickly by someone upset.
 */

body.light-talk #screen-1 {
    /* Paul, 15 Aug: "too white" — the same note he made about the shell, and
       the same fix in miniature. #fbfcfd was a hair off pure white, not a
       pastel — nld-shell-light.css's own fix for that exact complaint
       (--bg-top et al, #f7fcfb -> #e8f7f0) is the reference here, adapted
       rather than copied: one flat mint-blue tint instead of a gradient plus
       four corner glows, because glows would be visual noise on a bordered
       stage box this size, and pulled a touch lighter than the shell's own
       numbers since this paper sits nested inside the page rather than being
       the page itself.

       --talk-card stays #ffffff — see "the two voices" below. Pastor Pauly's
       bubble is meant to read as white paper, not a colour left unfinished. */
    --talk-paper: #e9f5f1;
    --talk-card: #ffffff;
    --talk-ink: #1b2b33;
    --talk-rule: #e4edf1;

    /* Carries every tokenised colour on the screen — and this blade is 23 token
       references to 2 literals, so it carries nearly all of it. */
    --primary: #2f7d8c;
    --primary-rgb: 47, 125, 140;

    /* These two are cream in :root, for a dark shell. Left alone they would be
       near-invisible on light paper — the header sub, the composer's active
       title, the history labels and the crisis line all read through them. */
    --text-main: #1b2b33;
    --text-muted: #55707c;
}

/* ── The stage ───────────────────────────────────────────────────────────── */

body.light-talk #screen-1 .wellspring-transcript {
    background: var(--talk-paper);
    border: 1px solid var(--talk-rule);
    box-shadow: none;
}

/* The one literal in the blade: a dark-green sub that assumed a light backing
   and now needs to agree with the rest of the ink. */
body.light-talk #screen-1 #wellspring-sub {
    color: var(--talk-ink) !important;
    opacity: 0.72;
}

/* ── The two voices ──────────────────────────────────────────────────────── */

/* The believer's own words: filled, so their side of the conversation is the
   one that reads as theirs. */
body.light-talk #screen-1 .wellspring-bubble-user .wellspring-bubble-body {
    background: linear-gradient(180deg, #3a97a8 0%, var(--primary) 100%);
    border: none;
    color: #fff;
    box-shadow: 0 3px 10px rgba(var(--primary-rgb), 0.22);
}

/* Pastor Pauly answers on white — the quieter of the two, deliberately. He is
   replying to them, not competing with them. */
body.light-talk #screen-1 .wellspring-bubble-pauly .wellspring-bubble-body,
body.light-talk #screen-1 .wellspring-bubble-polly .wellspring-bubble-body {
    background: var(--talk-card);
    border: 1px solid var(--talk-rule);
    color: var(--talk-ink);
    box-shadow: 0 2px 8px rgba(27, 43, 51, 0.05);
}

/* ── The composer ────────────────────────────────────────────────────────── */

body.light-talk #screen-1 .wellspring-composer {
    background: var(--talk-card);
    border: 1px solid var(--talk-rule);
    box-shadow: 0 4px 14px rgba(27, 43, 51, 0.06);
}

body.light-talk #screen-1 .wellspring-composer:focus-within {
    border-color: rgba(var(--primary-rgb), 0.5);
    box-shadow: 0 0 0 4px rgba(var(--primary-rgb), 0.1);
}

body.light-talk #screen-1 .wellspring-composer textarea {
    color: var(--talk-ink);
}

body.light-talk #screen-1 .wellspring-send {
    background: linear-gradient(180deg, #3a97a8 0%, var(--primary) 100%);
    box-shadow: 0 4px 12px rgba(var(--primary-rgb), 0.28);
}

/* Softened for the same reason as the reading's Speak it, and guarded the same
   way: recording paints this button inline, and :not(.is-recording) is what
   keeps the calm version off the state that has to be unmistakable. The class
   comes from recorder.js, which both surfaces share. */
body.light-talk #screen-1 .wellspring-mic:not(.is-recording) {
    background: rgba(224, 122, 95, 0.12);
    border: 1px solid rgba(224, 122, 95, 0.42);
    box-shadow: none;
}

/* ── History, and the promise ────────────────────────────────────────────── */

body.light-talk #screen-1 .wellspring-history {
    background: var(--talk-paper);
    border: 1px solid var(--talk-rule);
}

body.light-talk #screen-1 .wellspring-history-item {
    background: var(--talk-card);
    border: 1px solid var(--talk-rule);
}

/* "Keep this between us" is meant to be findable without advertising itself, so
   it stays quiet here too — a white card rather than a call to action. */
body.light-talk #screen-1 #wellspring-private-start {
    background: var(--talk-card) !important; /* inline rgba(255,255,255,0.55) */
    border-color: var(--talk-rule) !important;
}
