/* ─────────────────────────────────────────────────────────────────────────────
   avails-page.css — Avails page local styles.

   Built 2026-09-09 (feature_avails_intake.md Round 3, S2) as a reskin of
   EXISTING components, not a new design — the page composes `.ig-workspace`
   / `.ig-rail` / `.ig-rail-gutter` / `.ig-grouprow` (dc-components.css),
   `.ig-canvas-head` / `.ig-seg` / `.ig-sb` (dc-components.css), `dc_table`
   (dc-table.css) and the canonical film drawer (drawer.css) exactly as
   Intake and Curation do. The rail rows ARE `.ig-grouprow`, unchanged — no
   page-local row style was needed.

   SHARED WITH CURATION. The Votes / Voted-by / Film columns reuse Curation's
   `dcVotes`/`dcPeople`/`dcFilmPlain` formatters and, with them, the
   `.cur-vote*` / `.cur-people*` / `.cur-idc*` rules in curation-page.css —
   see that file's own header note. Nothing here duplicates them.

   The one genuinely local surface is the rail-foot import strip (the two
   "Import…" buttons `_avails_actions_html` used to render in Library's top
   bar, now living at the bottom of this page's rail instead) — `.ig-sb`'s
   own styling assumes a 34px horizontal strip (`.ig-bar`/`.ig-canvas-head`/
   `.ig-rail__filters`), which is too cramped for two full-label buttons
   side by side at 340px rail width, so these get their own stacked shell.

   S3 (same day) adds two more local surfaces: the `.av-gap*` agent
   hand-off block, and a small reset for the app's first `ui.download_button`
   instances so they sit in the `.ig-sb` register unchanged.
   ──────────────────────────────────────────────────────────────────────────── */

.av-rail__import {
  display: flex;
  flex-direction: column;
  gap: 6px;
  flex: none;
  padding: 10px 12px;
  border-top: 1px solid var(--dc-line);
  background: var(--dc-panel);
}

.av-rail__import-btn {
  display: flex;
  align-items: center;
  gap: 6px;
  height: 28px;
  padding: 0 10px;
  border: 1px solid var(--dc-line);
  border-radius: var(--dc-radius-lg);
  background: var(--dc-panel-2);
  color: var(--dc-ink);
  font-size: 12px;
  font-weight: var(--dc-fw-medium);
  cursor: pointer;
}
.av-rail__import-btn:hover {
  background: var(--dc-primary-soft);
  border-color: var(--dc-primary-line);
  color: var(--dc-primary);
}
.av-rail__import-btn i { font-size: 12px; flex: none; }

/* Vendor rail table (2026-11-02): the rail is a dc_table (Vendor | Films).
   A small warn dot beside a film count says some of that vendor's licences
   expire soon (the tooltip has the number). */
.av-rail-table { flex: 1 1 auto; min-height: 0; min-width: 0; }
.dc-count-warn { display: inline-flex; align-items: center; gap: 5px; }
.dc-count-warn__dot { font-size: 6px; color: var(--dc-warn); }

/* Open-Schedule-A marker on a vendor rail row (`.ig-grouprow__top`,
   unchanged shape) — the small-pill treatment the batch state pill uses.
   Was `.av-rail-contracted` on the per-list rail (2026-09-15,
   feature_vendor_catalogue.md). */
.av-rail-pill { font-size: 10px; padding: 1px 7px; }

/* ── Contract dropdown, one per row (2026-09-16) ───────────────────────────
   `dcContractSelect` (dc-table.js) writes through avails_selection.py::
   set_licence — the same call the drawer's licence editor makes. Inline
   EDITING stays off (dc_table strips `editor`); this is an interactive
   formatter, the pattern dcCheck/dcVotes already use.

   Chromeless until hovered or focused, so a table of these reads as a
   column of values rather than a column of form controls — the treatment
   the drawer's own `.ig-kv--edit` fields use.

   The `.av-gap*` agent hand-off bar that used to live here was removed the
   same day: the Festivals column now shows per row what the bar summarised,
   and its picker can select "No festivals" directly. */
.av-contract-select { width: 100%; max-width: 100%; font: inherit; font-size: 12px;
  color: var(--dc-ink); background: transparent; border: 1px solid transparent;
  padding: 1px 2px; border-radius: var(--dc-radius-sm); cursor: pointer;
  transition: background var(--dc-dur-fast), border-color var(--dc-dur-fast); }
.av-contract-select:hover { background: var(--dc-panel); border-color: var(--dc-line); }
.av-contract-select:focus { outline: none; background: var(--dc-panel);
  border-color: var(--dc-primary); }

/* First download buttons in the app (S3) — `ui.download_button` renders an
   `<a class="btn btn-default shiny-download-link">`; `.ig-sb`'s own rules
   (dc-components.css) already win on border/background/padding at equal or
   higher specificity than Bootstrap's `.btn`/`.btn-default`, but the anchor
   still carries Bootstrap's underline-free-but-`disabled`-flagged default
   look until the client has a real href, so this neutralises the leftover
   bits `.ig-sb` doesn't already own. */
/* `.ig-bar` joined `.ig-canvas-head` on 2026-10-05: Acquisitions' Export
   pick list / Export Schedule A sit in the band under the head. */
.ig-canvas-head .shiny-download-link.ig-sb,
.ig-bar .shiny-download-link.ig-sb { text-decoration: none; box-shadow: none; }
.ig-canvas-head .shiny-download-link.ig-sb.disabled,
.ig-bar .shiny-download-link.ig-sb.disabled { opacity: 0.35; cursor: not-allowed; }

/* Queue drag grip (operator 2026-09-22) — the `rowHandle` cell. Dimmed
   while the table is sorted by anything but Queue (`dc-rowmove-off`,
   toggled by dc-table.js); grabbing it then sorts by Queue. */
.dc-queue-grip { color: var(--dc-muted); cursor: grab; font-size: 14px; }
.tabulator-row:hover .dc-queue-grip { color: var(--dc-ink); }
.dc-rowmove-off .dc-queue-grip { opacity: 0.35; cursor: pointer; }


/* One top strip (operator, 2026-10-05): the band (buttons / action bar /
   Status meta) fills the left, Weights + Selection | Status sit right. The
   band keeps its own markup (.ig-bar); inside the strip it drops its own
   frame so the two read as one row. */
.av-strip { display: flex; align-items: center; gap: 8px; }
.av-strip__left { flex: 1 1 auto; min-width: 0; display: flex; align-items: center; }
.av-strip__right { flex: none; display: flex; align-items: center; gap: 6px; margin-left: auto; }
.av-strip .ig-bar { border: 0; background: transparent; padding: 0; min-height: 0; flex: 1 1 auto; }

/* Open / All band (operator 2026-11-02): a full strip like the canvas head
   beside it — same 48px height and background, the segment centred at the
   strip-control size, so the two top strips read as one line. */
.av-page .ig-rail__filters {
  height: var(--dc-strip-h);
  background: var(--dc-panel-2);
}
/* Segment size and padding: dc-strip.css (one rule for every strip). */


/* ══ Contract view (feature_contract_tracking.md S2, 2026-11-04) ═══════════
   Ported from the approved frame claude-design/skills/dc-skill/
   dc-acquisitions-contract.html. Tokens only — light and dark follow the
   theme. The frame's "Batch" is "Deal" here (D2): .ct-batch → .ct-deal-label,
   .ct-batchmenu → .ct-dealmenu. Frame-scoped rules (.ct-frame …) are scoped
   to .av-contract instead. */

/* Which canvas shows: the view dropdown carries data-view / data-scope. */
.av-strip__view { flex: none; display: flex; align-items: center; gap: 6px; }
.av-contract { display: none; flex: 1 1 auto; min-height: 0; flex-direction: column; background: var(--dc-bg); }
.av-page:has(.av-viewsel[data-view="contract"]) #av_view_selection,
.av-page:has(.av-viewsel[data-view="contract"]) #av_weights_row { display: none !important; }
.av-page:has(.av-viewsel[data-view="contract"][data-scope="all"]) #av_view_deals,
.av-page:has(.av-viewsel[data-view="contract"][data-scope="one"]) #av_view_contract { display: flex; }
/* Vendor view (vendor portal S4): the vendor's own page for the selected
   vendor; with All vendors chosen, the deals table as in Contract. */
.av-page:has(.av-viewsel[data-view="vendor"]) #av_view_selection,
.av-page:has(.av-viewsel[data-view="vendor"]) #av_weights_row { display: none !important; }
.av-page:has(.av-viewsel[data-view="vendor"][data-scope="all"]) #av_view_deals,
.av-page:has(.av-viewsel[data-view="vendor"][data-scope="one"]) #av_view_vendor { display: flex; }
#av_view_vendor { overflow: hidden; }
#av_view_vendor .vp-app--team { flex: 1 1 auto; height: auto; }
#av_view_deals { background: var(--dc-panel); }
#av_view_deals .dc-table-output { flex: 1 1 auto; min-height: 0; height: 100%; }
#av_view_contract > .shiny-html-output { flex: 1 1 auto; min-height: 0; display: flex; flex-direction: column; }
.ct-canvas__body { flex: 1 1 auto; min-height: 0; overflow-y: auto; padding: 16px 20px 24px; }

/* Rail: the newest deal's stage beside the vendor (dcRailVendor). */
.av-rail-vendor { display: flex; align-items: center; gap: 6px; min-width: 0; }
/* The name keeps room to be read; the pill gives way first. */
.av-rail-vendor__name { flex: 1 1 auto; min-width: 4.5em; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.av-rail-vendor .av-rail-pill { flex: 0 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.av-rail-deals { flex: none; font-size: 11px; color: var(--dc-muted); white-space: nowrap; }

/* ── NEW 1 · .ct-stages — deal-stage stepper ──────────────────────────── */
.ct-stages { display: flex; align-items: center; margin: 14px 0 4px; }
.ct-stage { display: inline-flex; align-items: center; gap: 6px; flex: none;
  font-size: 12px; color: var(--dc-faint); white-space: nowrap; }
.ct-stage__dot { width: 18px; height: 18px; border-radius: 50%; box-sizing: border-box; flex: none;
  border: 1px solid var(--dc-line-2); background: var(--dc-panel);
  display: grid; place-items: center; font-size: 10px; line-height: 1; }
.ct-stage.is-done { color: var(--dc-muted); }
.ct-stage.is-done .ct-stage__dot { background: var(--dc-ok-soft); border-color: var(--dc-ok); color: var(--dc-ok); }
.ct-stage.is-current { color: var(--dc-ink); font-weight: 600; }
.ct-stage.is-current .ct-stage__dot { background: var(--dc-primary); border-color: var(--dc-primary); color: var(--dc-panel); }
.ct-stage.is-current.is-final .ct-stage__dot { background: var(--dc-ok); border-color: var(--dc-ok); }
.ct-stage__bar { flex: 1 1 12px; min-width: 12px; height: 1px; background: var(--dc-line-2); margin: 0 8px; }
.ct-stage__bar.is-done { background: var(--dc-ok); }

/* ── NEW 2 · .ct-films — the films of one Schedule A version ──────────── */
.ct-films { max-height: 248px; overflow: auto; border-top: 1px dashed var(--dc-line); }
.ct-films table { width: 100%; border-collapse: collapse; font-size: 12px; }
.ct-films th { position: sticky; top: 0; z-index: 1; background: var(--dc-panel-2, var(--dc-panel));
  text-align: left; font-size: 11px; font-weight: 500; color: var(--dc-muted); white-space: nowrap;
  padding: 6px 10px; border-bottom: 1px solid var(--dc-line); }
.ct-films td { padding: 5px 10px; border-bottom: 1px solid var(--dc-line); color: var(--dc-ink);
  white-space: nowrap; vertical-align: top; }
.ct-films tr:last-child td { border-bottom: 0; }
.ct-films th:first-child, .ct-films td:first-child { padding-left: 16px; }
.ct-films td.num { text-align: right; font-variant-numeric: tabular-nums; }
.ct-films th.num { text-align: right; }
.ct-films td.ct-films__title { font-weight: 600; }
.ct-films td.is-faint { color: var(--dc-muted); }
.ct-editbtn { width: 26px; height: 26px; font-size: 13px; }
.ct-films.is-edit td { padding: 3px 4px; }
.ct-films.is-edit td:first-child { padding-left: 12px; }
.ct-in { width: 100%; min-width: 64px; font: inherit; font-size: 12px; color: var(--dc-ink); background: var(--dc-panel);
  border: 1px solid var(--dc-line-2); border-radius: var(--dc-radius-ctl, 999px); padding: 3px 10px; }
.ct-in:focus { outline: none; border-color: var(--dc-primary); }
.ct-in--title { min-width: 180px; font-weight: 600; }
.ct-films__foot { display: flex; align-items: center; gap: 8px; padding: 8px 12px 8px 16px; background: var(--dc-panel);
  border: 1px solid var(--dc-line); border-top: 1px dashed var(--dc-line); }

/* ── NEW 3 · .ct-note — one quiet line (read-only hint, empty state) ──── */
.ct-note { display: flex; align-items: center; gap: 8px; font-size: 12px; color: var(--dc-muted); line-height: 1.45; }
.ct-note i { color: var(--dc-faint); flex: none; }
.ct-note--warn i { color: var(--dc-warn); }

/* Deal label beside the vendor name; the Deal dropdown's menu */
.ct-deal-label { font-size: 12px; font-weight: 500; color: var(--dc-muted); font-family: var(--dc-font-mono); }
.ct-dealmenu { min-width: 260px; }
.ct-dealmenu .lib-vopt { display: flex; align-items: center; gap: 6px; }
.ct-dealmenu__pill { margin-left: auto; padding-left: 12px; }
.ct-dealmenu .ct-dealmenu__new { border-top: 1px solid var(--dc-line); color: var(--dc-primary); }

/* ── Layout glue (the frame's .ct-frame rules, scoped to .av-contract) ── */
.ct-deal__top { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.ct-deal__title { font-size: 16px; font-weight: 700; margin: 0; display: flex; gap: 8px; align-items: baseline; }
.ct-deal__title .dc-mono { font-size: 12px; color: var(--dc-muted); font-weight: 600; }
.ct-deal__actions { margin-left: auto; display: flex; gap: 8px; align-items: center; }
.ct-sec { margin-top: 20px; }
.ct-sec__head { display: flex; align-items: center; gap: 8px; margin-bottom: 8px; }
.ct-sec__head .dc-label { margin: 0; }
.ct-sec__head .ct-sec__right { margin-left: auto; display: flex; gap: 8px; align-items: center; }
.av-contract .dc-row { margin-top: 6px; background: var(--dc-panel); }
.av-contract .dc-row:first-of-type { margin-top: 0; }
.ct-vrow { display: flex; flex-direction: column; margin-top: 6px; }
.ct-vrow > .dc-row { margin-top: 0; }
.ct-vrow > .ct-films { background: var(--dc-panel); border: 1px solid var(--dc-line); border-top: 1px dashed var(--dc-line); }
.ct-file { font-family: var(--dc-font-mono); font-size: 12px; color: var(--dc-ink); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ct-meta { font-size: 12px; color: var(--dc-muted); white-space: nowrap; }
.ct-folder { display: flex; align-items: center; gap: 8px; font-size: 12px; color: var(--dc-muted); margin: 0 0 8px; }
.ct-readonly { display: inline-flex; align-items: center; gap: 6px; font-size: 11px; color: var(--dc-muted); margin-left: auto; padding-right: 4px; }
.av-contract .dc-stat-row { margin: 14px 0 0; }
.av-contract .dc-stat { flex: 1 1 0; min-width: 0; background: var(--dc-panel); }
.av-contract .dc-stat__value { font-size: 20px; }
.av-contract .dc-stat__value.is-faint { color: var(--dc-faint); }
.ct-sign { display: flex; gap: 14px; align-items: center; }
.ct-sign__text { flex: 1; min-width: 0; }
.ct-sign__text > b:first-child { display: block; font-size: 13px; color: var(--dc-ink); }
.ct-sign__text > span { font-size: 12px; color: var(--dc-muted); line-height: 1.45; }
/* D9: older versions stay listed, greyed */
.ct-old .ct-file, .ct-old .dc-row__title, .ct-old .ct-meta { color: var(--dc-faint); }

/* All vendors: Next step (bold when it is our move) and the cells */
.ct-next { color: var(--dc-ink); font-weight: 600; }
.ct-next.is-wait { color: var(--dc-muted); font-weight: 400; }
.ct-next.is-done { color: var(--dc-faint); font-weight: 400; }
.ct-col-muted { color: var(--dc-muted); }
#av_view_deals .ct-meta { margin-left: 4px; }
.ct-code { font-weight: 600; margin-right: 8px; }
.ct-zero { color: var(--dc-faint); }

/* Sign dialog summary (the frame's .ct-dialog) */
.ct-signdlg .ct-sum { margin: 12px 0 0; border: 1px solid var(--dc-line); }
.ct-signdlg .ct-sum > div { display: flex; gap: 8px; align-items: center; padding: 8px 12px; font-size: 12.5px; border-top: 1px solid var(--dc-line); }
.ct-signdlg .ct-sum > div:first-child { border-top: 0; }
.ct-signdlg .ct-sum .k { color: var(--dc-muted); width: 120px; flex: none; }
.ct-signdlg .ct-sum .v { color: var(--dc-ink); }
.ct-signdlg .dc-modal__prose b { font-weight: 700; }
.ct-sign-sub { color: var(--dc-muted); margin-top: 4px; }
/* The rows that keep the vendor's own licence window — the exceptions
   that matter, flagged first (operator 2026-11-04). */
.ct-signdlg .ct-own { margin-top: 12px; padding: 10px 12px 12px;
  border: 1px solid var(--dc-line); border-left: 3px solid var(--dc-warn);
  background: var(--dc-warn-soft); }
.ct-own__head { display: flex; align-items: center; gap: 8px; font-size: 12.5px; color: var(--dc-ink); }
.ct-own__head i { color: var(--dc-warn); }
.ct-signdlg .ct-own--bad { border-left-color: var(--dc-danger); background: var(--dc-danger-soft); }
.ct-own--bad .ct-own__head i { color: var(--dc-danger); }
/* A Schedule A cell whose date-like text was not read */
.ct-films td.ct-unread { color: var(--dc-warn); }
.ct-own__sub { font-size: 12px; color: var(--dc-muted); margin: 2px 0 0 22px; }
.ct-signdlg .ct-own .ct-sum { margin-top: 8px; background: var(--dc-panel); }
.ct-signdlg .ct-own .ct-sum .k { width: auto; flex: 1 1 auto; color: var(--dc-ink); font-weight: 600; }

/* ── Step 1 · Pick list (S3) ─────────────────────────────────────────── */
/* The answer picker (frame .ct-in--sel) */
.ct-in--sel { width: auto; min-width: 150px; padding-right: 24px; }
/* D20: the two limit boxes in the step head (the frame predates them) */
.ct-sec__head .ct-sec__right { flex-wrap: wrap; justify-content: flex-end; }
.ct-limit { display: inline-flex; align-items: center; gap: 6px; margin: 0;
  font-size: 12px; color: var(--dc-muted); white-space: nowrap; }
.ct-limit .ct-limit__in { width: 64px; min-width: 0; text-align: right; padding: 3px 10px; }
/* A marked film past the limits: not on the next sheet */
.ct-films tr.ct-unsent td { color: var(--dc-muted); }
.ct-films tr.ct-unsent td.ct-films__title { font-weight: 400; }

/* ── Vendors drawer: the Contract line (frame "Vendors page lines") ──── */
.vnd-contract-body .dd-list-row { padding: 9px 0; }
.vnd-contract-body .ct-fact { font-size: 12.5px; color: var(--dc-ink); white-space: nowrap; }
.vnd-contract-body .ct-link { margin-left: auto; font-size: 12px; color: var(--dc-primary); text-decoration: none;
  white-space: nowrap; display: inline-flex; gap: 5px; align-items: center; }
.vnd-contract-body .ct-link:hover { text-decoration: underline; }
.vnd-contract-body .ct-ghostlink { margin-left: auto; font-size: 12px; color: var(--dc-faint); white-space: nowrap; }

/* Pick list: ten films before it scrolls (operator, 2026-11-05). */
.ct-films.ct-films--pl { max-height: 352px; }

/* Vendor rail wider by default so the stage tags show whole
   (operator 2026-11-05). */
.av-page .ig-rail { width: 420px; flex: 0 0 420px; }

/* ── Vendor portal on the Contract view (S4, pages/contract_portal.py) ──
   Layout glue only: existing pills, table and pill box. */
.ct-deal__top .dc-pill .bi { margin-right: 4px; }
.ct-portal-tag { border: 0; cursor: pointer; }
.ct-portal-tag:disabled { cursor: default; opacity: .6; }
.ct-terr { display: flex; align-items: center; gap: 4px; min-width: 160px; }
.ct-terr .ct-in { flex: 1 1 auto; }
.ct-terr__text { flex: 1 1 auto; min-width: 0; font-size: 12px; color: var(--dc-ink);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ct-terr-row > td { padding: 8px 10px 12px; background: var(--dc-panel-2); }
.ct-vcx td { vertical-align: top; }
.ct-vcx__act { white-space: nowrap; text-align: right; }
.ct-vcx__act .btn + .btn { margin-left: 6px; }