/*
 * Transfer Center redesign — skin-AGNOSTIC UX layer (2026-07-04).
 *
 * SOURCE: Claude Design project cf6a41fd, "Transfer Center.dc.html", Turn 4/5.
 *   T3 established the invariant surface (one layout, emphasis shifts,
 *   nothing relocates); T5 refined it. This sheet carries the skin-agnostic
 *   refinements on the REAL production DOM: zero markup relocation, zero
 *   id/data-field changes — the redesign fits our functionality, never the
 *   reverse.
 *
 * ACTIVATION: flag ENABLE_TC_REDESIGN loads this sheet. Every rule here is
 *   unscoped (applies under stock and any Roast Ladder theme alike), so the
 *   flag stays the single kill-switch.
 *
 * SKINS MOVED OUT (P4-4, 2026-08-04): the body[data-tc-skin] token blocks,
 *   skin-scoped component rules and the .tc-skin-toggle cycle button are
 *   gone — reborn as the global Roast Ladder themes night-dispatch /
 *   phosphor in static/css/roast-ladder-skins.css (theme-unification
 *   handoff). Legacy localStorage('tc-skin') picks migrate to the account
 *   theme in static/js/census/roast-ladder.js.
 */

/* ==========================================================================
   T5 UX REFINEMENTS (2026-07-06) — design source: TRANSFER-CENTER-UX-HANDOFF.md
   (Claude Design cf6a41fd, T5). Skin-AGNOSTIC layer: these rules are unscoped
   (apply under stock/night-dispatch/phosphor alike) but live in THIS sheet so
   ENABLE_TC_REDESIGN stays the single kill-switch — the sheet only loads
   flag-ON, and all companion markup/JS behavior is gated on the same flag.
   Token-based throughout, so active skins restyle every surface for free.
   ========================================================================== */
@keyframes tc-pulse { 0%, 100% { opacity: 1; } 50% { opacity: 0.35; } }

/* --- S-DG · DAY GLANCE — rail decision board (also needs disposition flag) --
   Every call = a dot on the 06:00–18:00 track colored by disposition, plus a
   density bar. Renderer: renderDayGlance() in transfer-list.js. */
.tc-list-panel {
    --tc-dispo-accept:    var(--term-status-ready);
    --tc-dispo-pending:   var(--term-status-editing);
    --tc-dispo-advice:    var(--term-blue, #5B9BD5);
    --tc-dispo-decline:   var(--term-red, #E55A50);
    --tc-dispo-undecided: var(--term-fg-muted);
}
.tc-day-glance {
    padding: var(--term-space-md) var(--term-space-md) var(--term-space-sm);
    border-bottom: 1px solid var(--term-border-default);
    background: var(--term-bg-header);
}
.tc-day-glance[hidden] { display: none; }
.tc-day-glance-head {
    display: flex; justify-content: space-between; align-items: baseline;
    gap: var(--term-space-sm);
    margin-bottom: var(--term-space-sm);
}
.tc-day-glance-kicker {
    min-width: 0;
    overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
    font-family: var(--term-font-mono); font-size: var(--term-text-xs);
    letter-spacing: var(--term-tracking-wider); text-transform: uppercase;
    color: var(--term-gold);
}
/* Phase 1 (2026-08-01): the count ("…4 call…" clipped) was the flex item that
   absorbed the squeeze and hard-clipped — pin it whole, let the kicker yield. */
.tc-day-glance-count {
    flex: 0 0 auto;
    white-space: nowrap;
    font-family: var(--term-font-mono); font-size: var(--term-text-xs);
    color: var(--term-fg-muted);
}
.tc-day-glance-track { position: relative; height: 14px; margin: 0 2px; }
.tc-day-glance-track::before {
    content: ''; position: absolute; left: 0; right: 0; top: 50%;
    height: 1px; background: var(--term-border-default);
}
.tc-day-dot {
    position: absolute; top: 50%; transform: translate(-50%, -50%);
    width: 7px; height: 7px; border-radius: 50%;
    background: var(--tc-dispo-undecided);
}
.tc-day-dot[data-disposition="accept"]             { background: var(--tc-dispo-accept); }
.tc-day-dot[data-disposition="pending_specialist"] { background: var(--tc-dispo-pending); }
.tc-day-dot[data-disposition="local_mgmt_advice"]  { background: var(--tc-dispo-advice); }
.tc-day-dot[data-disposition="decline"]            { background: var(--tc-dispo-decline); opacity: 0.55; }
.tc-day-dot.is-selected {
    width: 11px; height: 11px;
    background: var(--term-live);
    box-shadow: var(--term-glow-accent);
}
.tc-day-glance-bar {
    display: flex; height: 4px; margin: 6px 2px 0;
    border-radius: 2px; overflow: hidden; background: var(--term-bg-input);
}
.tc-day-seg[data-disposition="accept"]             { background: var(--tc-dispo-accept); }
.tc-day-seg[data-disposition="pending_specialist"] { background: var(--tc-dispo-pending); }
.tc-day-seg[data-disposition="local_mgmt_advice"]  { background: var(--tc-dispo-advice); }
.tc-day-seg[data-disposition="decline"]            { background: var(--tc-dispo-decline); opacity: 0.55; }
.tc-day-seg[data-disposition="undecided"]          { background: var(--tc-dispo-undecided); opacity: 0.4; }

/* --- S-CB · CAPTURE BAR — live intake scoreboard (also disposition-gated) --
   One 6-segment bar = the call agenda at arm's length. Segment states mirror
   the old intake cards; writer: updateLiveIntakeFromDom() in call-recorder.js. */
.tc-capture-bar { display: flex; gap: 3px; height: 5px; margin: var(--term-space-sm) 0; }
.tc-capture-seg { flex: 1; border-radius: 1px; background: var(--term-bg-input); }
.tc-capture-seg.is-captured,
.tc-capture-seg.is-confirmed { background: var(--term-live); }
.tc-capture-seg.is-manual    { background: var(--term-gold); }
.tc-capture-seg.is-preview   { background: var(--term-live-dim); animation: tc-pulse calc(var(--tc-motion-slow) * 5) var(--tc-ease-soft) infinite; }
.tc-capture-bar.has-critical .tc-capture-seg.is-missing {
    background: color-mix(in srgb, var(--term-red, #E55A50) 30%, var(--term-bg-input));
    animation: tc-pulse calc(var(--tc-motion-slow) * 5.5) var(--tc-ease-soft) infinite;
}

/* --- R3 · GAP LINE ESCALATION — impossible to miss before hang-up ----------
   is-critical: recording + callback/clinical still missing → red pulse.
   is-clear (existing convention): all captured → ready-green. */
.tc-live-gaps.is-critical {
    color: var(--term-red, #E55A50); font-weight: 600;
    animation: tc-pulse calc(var(--tc-motion-slow) * 5.5) var(--tc-ease-soft) infinite;
}

/* --- S-NT · NOTE TAB + DRAWER DOCKING (R4) ---------------------------------
   Persistent reopen affordance in the workspace footer once a note exists; at
   ≥1560px an open drawer docks beside the workspace instead of covering chart
   materials. Below 1560px the fixed overlay is unchanged. */
:root { --tc-note-drawer-w: 480px; }
.tc-note-tab {
    display: inline-flex; align-items: center; gap: 6px;
    padding: 8px 14px;
    background: var(--term-gold-ghost);
    border: 1px dashed var(--term-gold-dim);
    border-radius: 2px;
    color: var(--term-gold);
    font-family: var(--term-font-mono); font-size: var(--term-text-xs);
    letter-spacing: var(--term-tracking-wide); cursor: pointer;
    white-space: nowrap;
}
/* Author display beats the UA [hidden] rule — restore it explicitly (same
   documented bug class as .tc-empty-state[hidden] in transfer-center.css). */
.tc-note-tab[hidden] { display: none; }
.tc-note-tab:hover { border-style: solid; background: var(--term-gold-subtle); }
@media (min-width: 1560px) {
    /* Drawer docks beside the workspace — chart materials stays visible. */
    body.tc-note-open .tc-workspace {
        margin-right: var(--tc-note-drawer-w, 480px);
    }
}

/* --- R5 · INVARIANT-SURFACE STATE (T3) -------------------------------------
   Call-end is a STATE change — emphasis shifts, nothing relocates. Classes set
   by call-recorder.js start/stop. Motion budget: pulses are LIVE-ONLY; wrap-up
   freezes every pulse in place and promotes the one next action (Generate). */
.tc-workspace-form.is-wrapup .tc-rec-dot-pulse,
.tc-workspace-form.is-wrapup .tc-capture-seg,
/* higher-specificity twin: the has-critical missing-seg pulse (0,4,0) would
   otherwise outrank a plain .is-wrapup freeze */
.tc-workspace-form.is-wrapup .tc-capture-bar.has-critical .tc-capture-seg.is-missing,
.tc-workspace-form.is-wrapup .tc-live-gaps { animation: none; }
.tc-workspace-form.is-wrapup .tc-generate-btn {
    background: var(--term-status-editing);
    border-color: var(--term-status-editing);
    color: var(--term-fg-inverse);
}

/* ==========================================================================
   T3 COMPLETION · wrap-up emphasis deltas beyond R5 (2026-07-07)
   Design: cf6a41fd T3 — call-end is a page-level STATE; emphasis shifts,
   nothing relocates. These extend the shipped R5 block (freeze + Generate
   promotion) with the remaining per-element deltas from the T3 spec that map
   to REAL DOM. State class comes from call-recorder.js (is-wrapup).
   ========================================================================== */
/* Gap seams stop asking: red-dashed → solid, settled */
.tc-workspace-form.is-wrapup .tc-field-gap {
    border-style: solid;
    animation: none;
}
/* Promoted ACCEPT lane: gold "asking" → olive "decided" (stock + every theme;
   the roast-scoped twins in roast-ladder-skins.css outrank the R0 amber skin
   rule under the two Transfer-lineage skin themes) */
.tc-workspace-form.is-wrapup #tcAcceptBlock.tc-lane-promote {
    background: rgba(148, 158, 78, 0.10);
    border-color: rgba(148, 158, 78, 0.35);
    border-left: 4px solid #949E4E;
    box-shadow: inset 0 0 0 1px rgba(148, 158, 78, 0.30), 0 2px 16px rgba(0, 0, 0, 0.35);
}
/* Guideline cards: unresolved REQUIRE stays visible but static; resolved
   recede — the wrap-up question is "what's still open", not history */
.tc-workspace-form.is-wrapup .tc-gl-card { animation: none; }
.tc-workspace-form.is-wrapup .tc-gl-card--resolved { opacity: 0.45; }
/* Note affordance: dashed promise → solid artifact */
.tc-workspace-form.is-wrapup .tc-note-tab { border-style: solid; }
/* Transcript status reads as finalizing chrome (text itself is owned by the
   enhancement pipeline: receiving → Enhancing… → Enhanced ready) */
.tc-workspace-form.is-wrapup .tc-transcript-status {
    color: var(--term-gold);
}

/* T5 2a DECISION-BOARD RAIL (.tc-rail-bay, .tc-card-decision-line,
   .tc-card-dispo-word, .tc-card-call-time, legacy-badge hide): MIGRATED to
   transfer-unified.css (slice 2, 2026-08-02). The --tc-dispo-* tokens above
   stay defined here while day-glance still consumes them. */

/* ==========================================================================
   T5 2a · CHART-MATERIALS FORMATTING LAYER (2026-07-07)
   Read-only formatted view over the paste well (chart-materials-view.js).
   The lane stays a paste target: click/Enter swaps back to the raw textarea.
   ========================================================================== */
.tc-chart-raw-hidden {
    position: absolute !important;
    width: 1px; height: 1px;
    opacity: 0;
    pointer-events: none;
}
.tc-chart-view {
    font-family: var(--term-font-mono);
    font-size: var(--term-text-xs);
    line-height: 1.55;
    background: var(--term-bg-input);
    border: 1px solid var(--term-border-default);
    border-radius: 3px;
    padding: 8px 10px;
    max-height: 260px;      /* ≈ the rows=10 textarea it replaces */
    overflow-y: auto;
    cursor: text;
    color: var(--term-fg-secondary);
}
.tc-chart-view[hidden] { display: none; }
.tc-chart-view:focus-visible { outline: 2px solid var(--term-gold); }
.tcv-header {
    margin: 8px 0 2px;
    padding-top: 6px;
    border-top: 1px solid var(--term-border-subtle);
    font-weight: 700;
    letter-spacing: var(--term-tracking-wide);
    color: var(--term-gold);
}
.tcv-header:first-child { margin-top: 0; padding-top: 0; border-top: none; }
.tcv-blank { height: 6px; }
.tcv-hi { color: var(--term-red, #E55A50); font-weight: 600; }
.tcv-lo { color: var(--term-blue, #5B9BD5); font-weight: 600; }
.tcv-hint {
    margin-top: 8px;
    font-size: 0.5rem;
    color: var(--term-fg-muted);
}

/* ==========================================================================
   T5 R6 · CALL-ACTIVITY TIMELINE (2026-07-07) — turns × rules × extractions
   on the call clock. Fills live; freezes at END (motion budget: live-only —
   the only animation is the open-REQUIRE pulse, gated on .is-call-live).
   ========================================================================== */
.tc-call-activity {
    margin-top: var(--term-space-sm);
    padding: 8px 10px;
    background: var(--term-bg-header);
    border: 1px solid var(--term-border-subtle);
    border-radius: 3px;
}
.tc-call-activity[hidden] { display: none; }
.tca-head {
    display: flex; justify-content: space-between; align-items: baseline;
    margin-bottom: 6px;
}
.tca-title {
    font-family: var(--term-font-mono); font-size: 0.5rem; font-weight: 700;
    letter-spacing: var(--term-tracking-wider); color: var(--term-gold);
}
.tca-clock {
    font-family: var(--term-font-mono); font-size: 0.5625rem;
    color: var(--term-live);
}
.tca-clock.is-ended { color: var(--term-fg-muted); }
.tca-lane {
    display: grid; grid-template-columns: 34px 1fr; gap: 8px;
    align-items: center; padding: 2px 0;
}
.tca-lane-label {
    font-family: var(--term-font-mono); font-size: 0.4375rem; font-weight: 700;
    letter-spacing: 0.08em; color: var(--term-fg-muted); text-align: right;
}
.tca-track {
    position: relative; height: 10px;
    border-bottom: 1px solid var(--term-border-subtle);
}
.tca-mark {
    position: absolute; top: 50%; transform: translate(-50%, -50%);
}
.tca-turn {
    width: 2px; height: 7px; border-radius: 1px;
    background: var(--term-live-dim);
}
.tca-extract {
    width: 4px; height: 4px; border-radius: 50%;
    background: var(--term-live);
}
/* Rules are diamonds, colored by action */
.tca-rule {
    width: 6px; height: 6px;
    transform: translate(-50%, -50%) rotate(45deg);
}
.tca-rule--require   { background: var(--term-status-editing); }
.tca-rule--flag      { background: var(--term-red, #E55A50); }
.tca-rule--recommend { background: var(--term-live); }
.tca-rule--resolved  { background: var(--term-fg-muted); opacity: 0.5; }
/* Open REQUIRE pulses only while the call is live (R5 motion budget) */
.tc-workspace-form.is-call-live ~ * .tca-rule--require,
.tc-workspace-form.is-call-live .tca-rule--require {
    animation: tc-pulse calc(var(--tc-motion-slow) * 5) var(--tc-ease-soft) infinite;
}
