/* ============================================================================ NabGol — CHAT COMPOSER (the bottom bar: attach preview + input + send) ---------------------------------------------------------------------------- Owns EXACTLY one thing: `.chat-input` and everything inside it (including the attachment preview, `.file-preview`). Does not touch `#messages` or `.chat-header` — those are chat-canvas.css's and chat-header.css's, by the same one-owner-per-region rule. Why this file exists: same story as chat-header.css. The message area and the header now speak one visual language (chat-canvas.css / chat-header.css: hairline instead of frame, a three-level ink scale, green spent once). The composer still spoke the old one — a solid/gradient bar, a saturated green focus glow on the input pill, icon buttons in raw `#a1a1aa`/`#8b949e`. Scope decision — same exclusions as chat-header.css, plus one more: - size, padding, gap, the safe-area math, `--nabgol-composer-offset` (script.js measures this composer's real height and the typing indicator overlay positions off it — retinting colours never touches height, so this is safe by construction, not by carefulness). - `.voice-btn.recording`: a real state (the mic is live), no --nbgc-* equivalent, excluded below with `:not(.recording)` rather than left to specificity luck. - any self-painted CTA chip class (`.nabgol-live-tutor-cta`, `.suggestion-chip--live-power`) — those paint their own surface already (chip ink, not canvas ink); this file never touches those class names. `.live-call-btn--tutor`'s ring WAS on that list too, on the grounds that this file sets no box-shadow. Section 4b now does, for one declaration and one reason: the ring was a hard-coded accent that no theme switch could reach, and it is the composer's second accent element. It is re-tinted, never removed. The specificity problem — found by grepping "chat-input|input-wrapper| composer-" in chat-flagship-polish.css BEFORE writing a rule here (the lesson chat-header.css left in docs/CHAT_CANVAS_HANDOFF.md): that file already ships a light-theme unification pass for several of these exact selectors (`html[data-theme="light"] body:is(...) .chat-input .input-wrapper {...}`, `.composer-hint {...}`, `.composer-ai-disclaimer {...}`, a mobile-only `.input-wrapper` variant). Each carries an extra `[data-theme="light"]` attribute selector — one more specificity "class" than an equivalent plain rule here, so for any property BOTH files claim, a same-depth selector here LOSES even though this file loads later (a loss, not a tie load order could settle). Section 7 below duplicates each of those exact selector shapes to force a genuine tie, which this file's later load order then wins. Properties with no such competing rule (the bar itself, the attachment preview, the toolbar icons, send) don't need a duplicate — this file's own `.chat-input`-scoped selector already carries more classes than anything currently fighting it. Load order: after chat-canvas.css AND chat-header.css, in both templates. ========================================================================== */ /* --------------------------------------------------------------------------- 1) THE BAR ITSELF — hairline instead of a filled/gradient slab. --------------------------------------------------------------------------- */ body:is(.desktop-chat, .mobile-chat) .chat-input { background: none !important; background-image: none !important; border-top: 1px solid var(--nbgc-hairline) !important; } /* One font-family line, one token, owner's call: what the reader types is set in the same face as what they get back. Defined once, in chat-canvas.css. The selector has to name the field itself, not just the bar: a