/* =====================================================================
   CADENCE — Tracker chase-tool treatment (WP03 / T012 / FR-009).
   mission tracker-chase-tool-01KYBEEA

   ALL-NEW classes only. The already-working Tracker classes
   (.tracker-table, .tracker-table--matrix, .state-chip--*,
   .tracker-days--red/--amber, .ts-letter-divider, .tracker-legend, …)
   live inline in index.html and are NOT restyled here — this file only
   adds the chase-tool layer they plug into. Uses the same CSS custom
   properties as the inline Tracker CSS, so light/dark theme parity is
   inherited (no hard-coded surface/text colours). The two accent hues
   reuse the existing red #dc2626 / amber #b45309 from
   .tracker-days--red/--amber.
   ===================================================================== */

/* ---------------------------------------------------------------------
   Shared row treatment modifier + urgency accent bar.
   A 3px left border is the row-level triage cue; it is paired with the
   text Needs-chips (never colour-only) so the state is legible without
   relying on the colour alone.
   --------------------------------------------------------------------- */
.tracker-table--chase {
    font-size: 13px;
}
.tracker-table--chase tbody td,
.tracker-table--chase tbody th {
    padding: 6px 10px;          /* ~32px rows at 13px/1.3 line-height */
    line-height: 1.3;
    vertical-align: middle;
}

.tracker-row--urgent > td:first-child,
.tracker-row--attention > td:first-child,
.tracker-row--ok > td:first-child {
    border-left-width: 3px;
    border-left-style: solid;
}
.tracker-row--urgent > td:first-child {
    border-left-color: #dc2626;  /* reuse .tracker-days--red */
}
.tracker-row--attention > td:first-child {
    border-left-color: #b45309;  /* reuse .tracker-days--amber */
}
.tracker-row--ok > td:first-child {
    border-left-color: transparent;
}

/* ---------------------------------------------------------------------
   Two-line identity block (generalises .ts-mission-id-line): a bold
   primary link (SC id) over a muted sub line (client / seniority).
   --------------------------------------------------------------------- */
.tracker-identity {
    display: flex;
    flex-direction: column;
    gap: 1px;
    min-width: 0;
}
.tracker-identity__primary {
    font-weight: 700;
    font-size: 13px;
    color: var(--color-text);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.tracker-identity__primary a,
.tracker-identity__primary .tracker-link {
    color: var(--color-primary);
    text-decoration: none;
}
.tracker-identity__primary a:hover,
.tracker-identity__primary .tracker-link:hover {
    text-decoration: underline;
}
.tracker-identity__sub {
    font-size: 11px;
    font-weight: 400;
    color: var(--color-text-muted);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* ---------------------------------------------------------------------
   Needs column — a vertical stack of chase-chips. Each chip reuses the
   shared .state-chip--* palette (applied by the renderer); this only
   lays them out and adds the click affordance + the "✓ clear" empty state.
   --------------------------------------------------------------------- */
.tracker-needs {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    align-items: center;
}
.tracker-needs .state-chip {
    cursor: pointer;
}
.tracker-needs .state-chip:focus-visible {
    outline: 2px solid var(--color-primary);
    outline-offset: 1px;
}
.tracker-needs--empty {
    color: var(--color-success, #10b981);
    font-size: 12px;
    font-weight: 600;
    opacity: 0.75;
}

/* ---------------------------------------------------------------------
   Inline-editable working cell (the affordance layer; the display↔edit
   swap markup is emitted by js/tracker_cell.js from WP02). Dotted
   underline invites the click; hover reveals a ✎; empty shows a faint ＋.
   --------------------------------------------------------------------- */
.tracker-cell--editable {
    position: relative;
    cursor: text;
}
/* The filled value: a subtle dashed underline appears only on row hover, so a
   full column of working values reads clean, not busy. */
.tracker-cell__value {
    display: inline-block;
    border-bottom: 1px dashed transparent;
    padding-bottom: 1px;
    color: var(--color-text);
}
tr:hover .tracker-cell--editable .tracker-cell__value {
    border-bottom-color: var(--color-border-strong, #cbd5e1);
}
.tracker-cell--editable:hover .tracker-cell__value {
    border-bottom-color: var(--color-primary);
}
/* The empty "add value" affordance: HIDDEN until the row is hovered or the cell
   is focused, so empty columns are not a wall of ＋ glyphs. */
.tracker-cell__add {
    color: var(--color-text-muted);
    font-size: 12px;
    opacity: 0;
    transition: opacity 0.12s ease;
}
tr:hover .tracker-cell__add,
.tracker-cell--editable:focus-within .tracker-cell__add,
.tracker-cell--editable:hover .tracker-cell__add {
    opacity: 0.5;
}
.tracker-cell__input,
.tracker-cell--editable .entity-edit__input,
.tracker-cell--editable .entity-edit__select,
.tracker-cell--editable .entity-edit__textarea {
    font-size: 13px;
    width: 100%;
    box-sizing: border-box;
}
/* Save-state feedback: a left ring — green on success (fades), red on error. */
.tracker-cell--saving .tracker-cell__value,
.tracker-cell--saving .tracker-cell__add {
    opacity: 0.5;
}
.tracker-cell--saved {
    box-shadow: inset 3px 0 0 var(--color-success, #10b981);
    transition: box-shadow 0.9s ease;
}
.tracker-cell--error {
    box-shadow: inset 3px 0 0 #dc2626;
}
.tracker-cell--error .tracker-cell__input,
.tracker-cell--error .entity-edit__input {
    border-color: #dc2626;
}

/* ---------------------------------------------------------------------
   Triage toolbar — reuses .table-controls input + the .tracker-subtab-btn
   look (both live inline in index.html). This only lays the bar out.
   --------------------------------------------------------------------- */
.tracker-toolbar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px 16px;
    padding: 10px 16px;
    background: var(--color-surface);
    border-bottom: 1px solid var(--color-border);
}
.tracker-toolbar__group {
    display: inline-flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 4px;
}
.tracker-toolbar__label {
    font-size: 12px;
    font-weight: 600;
    color: var(--color-text-muted);
    margin-right: 2px;
}
.tracker-toolbar__search {
    min-width: 200px;
}
/* Compact variant of the reused subtab button for the toolbar rows. */
.tracker-toolbar .tracker-subtab-btn {
    padding: 5px 11px;
    font-size: 12px;
}
/* Quick-filter — a subtab-btn that reads as a filter toggle. */
.tracker-quickfilter.is-active {
    background: var(--color-primary);
    color: #ffffff;
    border-color: var(--color-primary);
}

/* ---------------------------------------------------------------------
   Group-by divider row (generalises .ts-letter-divider): a full-width
   band that names the current Owner/Client group; stays sticky-left so
   it reads as a header while scrolling horizontally.
   --------------------------------------------------------------------- */
.tracker-group-divider > td.tracker-group-divider__cell {
    background: var(--color-surface-2, #f1f5f9);
    color: var(--color-text-soft, #475569);
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 0.03em;
    padding: 6px 16px;
    border-top: 2px solid var(--color-border-strong, #cbd5e1);
    border-bottom: 1px solid var(--color-border, #e2e8f0);
    position: sticky;
    left: 0;
    text-align: left;
}
.tracker-group-divider {
    z-index: 2;
}

/* ---------------------------------------------------------------------
   Sticky top header for the LIST tabs (Orders / Delivery / Extensions)
   ONLY — scoped with :not(.tracker-table--matrix) so it NEVER double-
   applies to the matrix tabs (Documents / Timesheets), which keep their
   own inline .tracker-table--matrix sticky rules.

   NO sticky-LEFT column on the list tabs: pinning a mid-table column
   (Status, not the identity) made an ugly frozen column during
   horizontal scroll. The header row stays put on vertical scroll; the
   whole row scrolls together horizontally. Every header cell — including
   the first — keeps the dark header background (the earlier bug was a
   sticky-left white background out-specifying the dark header).
   --------------------------------------------------------------------- */
.tracker-table--chase:not(.tracker-table--matrix) thead th {
    position: sticky;
    top: 0;
    z-index: 3;
    background: var(--color-table-head, #495057);
    color: #ffffff;
}