/* =========================================================================
   DC SCHEDULING PAGE — Release Scheduling + Calendar
   =========================================================================
   All tokens are --dc-* from colors_and_type.css.
   All spacing is on the 4px scale (2·4·6·8·12·16·20·24).
   No hardcoded hex/rgb/oklch — every color is var(--dc-*).

   dc_table conversion 2026-07-14:
     - Film rail uses dc_table (Tabulator 6.5) — .dc-sched-filmrow block removed.
     - Status filter + search bar moved client-side to Tabulator header filters.
     - Dead drawer form CSS (tab nav, lock/edit mode, meta-grid) removed.
     - New: .sched-date-cell variants + .dc-sched-check-col for dc_table formatters.

   dc-components port (SCHEDULING.md, 2026-07-26):
     - The hand-rolled .dc-calendar/.dc-cal-day/.dc-cal-chip/.dc-cal-overflow-
       popover month grid + .dc-cal-nav header are RETIRED — the calendar
       canvas is now a dc_calendar (FullCalendar v6) output; its visual
       system (.sc-cal / .sc-chip / .ig-bar.sc-cal-toolbar / .ig-sb-select)
       lives in dc-components.css, not here.
     - .sched-date-cell variants retired — the rail Date column's three
       states are now .sc-date-cell--warn/--unset (dc-components.css) via
       the new dcDateWarn formatter (dc-table.js).
     - .dc-sched-list__head / .sched-rail-filters retired — the rail header
       is now .ig-rail__label.sc-rail-head (dc-components.css); only the
       Shiny-widget integration (platform-tint, sizing) for the platform
       <select> stays here, rescoped to .sc-platform-picker.
     - .sched-bulk-bar retired — the bulk panel markup now uses the gallery's
       .sc-bulk-panel/.ig-bar.sc-bulk-bar (dc-components.css) verbatim (see
       the native-date/time-inputs note below for how the date/time/Apply
       row is bound to the server as of 2026-07-27).
     - .sc-sched-clear-wrap/.sc-sched-clear-link and #sched-drawer's generic
       .shiny-input-container/.ddb2-form-2 rules retired — the canonical
       drawer's own .ig-kv-value--edit input styling (drawer.css) + the new
       .sc-clear-row/.sc-datetime-row (dc-components.css) cover the Schedule
       section now.

   Native date/time inputs (2026-07-27, operator feedback "date picker UI
   is not matching the style guide"):
     - The Schedule section's edit-state date/time (.sc-datetime-row) and
       the bulk-schedule panel's date/time row (.sc-bulk-bar) now render
       real <input class="ig-input" type=date|time> elements copied
       straight from dc-components.html, not Shiny's ui.input_date/
       ui.input_text (which rendered a Bootstrap-datepicker JS widget with
       wrapper markup that never matched the design system). The
       .shiny-input-container/.form-control integration shims that used to
       live in both sections below are REMOVED — dc-components.css's own
       `.sc-datetime-row`/`.sc-bulk-bar .ig-input` rules already target
       bare inputs directly, which is what's rendered now. Binding to the
       server is generic (dc-components.js's `_dcBindDateTimeInput`,
       delegated on `input.ig-input[type=date|time]`), not page-specific.

   Calendar full height (2026-07-27, operator feedback "the calendar is
   not full height"):
     - dc_calendar's mount now runs in FILL MODE on this page
       (pages/scheduling.py passes height="100%") instead of the old fixed
       560px, which left an empty band below the grid in every view. See
       the #SCHED-CAL flex-chain rules below (.sched-center →
       .sched-center__scroll → .dc-calendar-output--fill → .sc-cal-wrap →
       .sc-cal) and dc-calendar.js's `height: "parent"` FullCalendar
       option. .sched-center__scroll's own overflow-y:auto was removed —
       the calendar now always reaches the panel bottom, and FullCalendar
       handles its own internal scrolling where a view legitimately needs
       it (multiMonthYear).

   --dc-platform-yt / --dc-platform-pt tokens are defined in
   colors_and_type.css (promoted 2026-06-22) so Export Groups can share them.
   ========================================================================= */

/* =========================================================================
   SCHED-WRAP — outer wrapper; the actual flex row is .dc-split (#scheduling-split)
   which the global Split.js manager in app.py manages.
   Full height, no overflow (each child handles its own scroll).
   ========================================================================= */
.sched-wrap {
  display: flex;
  flex-direction: column;
  height: 100%;
  overflow: hidden;
  background: var(--dc-bg);
  font-family: var(--dc-font-sans);
  font-size: var(--dc-fs-base);
  color: var(--dc-ink);
}

/* The outer Split.js container fills all available height.
   dc-theme.css's .dc-gutter rule (14px wide dot-grip) handles the shared
   outer gutter between .split-table and .split-detail. */
#scheduling-split {
  flex: 1 1 auto;
  min-height: 0;
}

/* =========================================================================
   SCHED-LEFT-PANEL — merged left panel: [rail | rail-gutter | calendar]
   This element is the .split-table child of #scheduling-split.
   Split.js sets its width via inline flex-basis; we only need height + inner layout.
   Flush — no border/radius of its own (flush chrome pass 2026-07-14).
   app.py inline CSS handles split-table flush globally.

   NOTE: app.py inline <style> sets .split-table { flex-direction:column } and
   wins over linked stylesheets on source order.  The #scheduling-split prefix
   adds ID specificity so .sched-left-panel.split-table wins back row layout.
   ========================================================================= */
#scheduling-split .sched-left-panel {
  /* Split.js owns the flex-basis (width) — do NOT set flex:1 here; it fights Split.js. */
  min-width: 0;
  height: 100%;
  display: flex;          /* rail | rail-gutter | calendar side-by-side */
  flex-direction: row;    /* overrides .split-table { flex-direction:column } */
  background: var(--dc-panel);
  overflow: hidden;
  box-sizing: border-box;
}

/* Vertical gutter inside the left panel (rail ↔ calendar) — restyled
   2026-07-27 (operator: "does not match the dc components designs
   [inner gutter] should be same as for the drawer") to be visually
   IDENTICAL to the shared Split.js outer gutter (`.gutter.gutter-
   horizontal` in app.py's inline <style>, injected between .split-table
   and .split-detail on every master-detail page). Verified live against
   the actual rendered outer gutter (not the stale "14px" comment in
   app.py, which no longer matches its own gutterSize:6 config): 6px
   width, --dc-panel-2 background, --dc-line borders, a 2px×23px dot grip.
   Vanilla-JS drag mechanics are UNCHANGED (nesting a second Split.js
   instance inside an already Split.js-managed panel is a known failure
   — see the module docstring) — only the visual is mirrored here. */
/* The element carries BOTH `.dc-gutter` and `.dc-gutter--vertical`, and
   `.dc-gutter` (dc-theme.css) already supplies the full shape: 6px width,
   flanking hairlines, panel-2 zone, and the 5-dot grip. A verbatim COPY of
   all of that lived here and silently won on specificity — which is why this
   handle kept its old blurred grip after the theme's was fixed
   (operator 2026-08-10: "the drag to resize should be the same as on
   encoding (dotted handle)"). Only the genuinely page-specific drag tint
   stays. */
.dc-gutter--vertical.is-dragging {
  background: var(--dc-primary-soft);
  border-color: var(--dc-primary-line);
}
.dc-gutter--vertical.is-dragging::after {
  background-color: var(--dc-primary);
}


/* =========================================================================
   DC-SCHED-LIST — left rail: header + dc_table film list
   Fixed 340px initial width (resizable). 268 → 340 (operator 2026-08-03:
   "not operational on a 14 inch screen, just make it wider" — matches the
   .ig-rail bump in dc-components.css).
   Bug 5: max-width capped at 50% of left panel — JS enforces this exactly
   during drag (reads left panel pixel width). Was 33%, raised 2026-08-03:
   on a small window 33% equalled the DEFAULT width, so dragging wider was
   a silent no-op exactly when more room was needed most.
   ========================================================================= */
.dc-sched-list {
  /* A third of the panel by default (operator 2026-09-08); the page's JS
     writes the operator's own drag width inline over this. */
  width: 33.333%;
  flex: 0 0 33.333%;
  min-width: 180px; /* Bug 5: never narrower than 180px */
  max-width: 50%;   /* never wider than half the left panel */
  height: 100%;
  display: flex;
  flex-direction: column;
  background: var(--dc-panel);
  position: relative;
  overflow: hidden;
}

/* Rail header — .ig-rail__label.sc-rail-head (dc-components.css) carries
   the layout/spacing; only the Shiny-widget integration for the platform
   <select> (sizing + platform-tint) lives here, since Shiny wraps the
   real <select> in a .shiny-input-container the gallery's static markup
   didn't have to account for.

   Full-height (operator live-review, 2026-08-03: "make all drop-downs
   full height like the drop-down on the scheduling page [calendar year
   top right corner]") — that reference is `.ig-sb-select` (dc-components.
   css), a real `height:100%` inside an `align-items:stretch` `.ig-bar`.
   This picker instead sits inside `.ig-rail__label`, which uses
   `align-items:center` (the eyebrow label needs vertical centering, not
   stretch) — so percentage heights on the nested Shiny-wrapper chain
   would resolve against an `auto`-height ancestor and do nothing. Pinned
   to the row's own fixed `--dc-topbar-h` directly instead (explicit
   height needs no stretch context), then `height:100%` cascades down
   from that single definite anchor through `.shiny-input-container` to
   the real `<select>` — same "fill the strip" result as `.ig-sb-select`,
   different mechanism because the surrounding layout differs. Shared by
   Encoding/Scheduling/Delivery's rail heads (all three use this same
   .sc-platform-picker wrapper) — one fix covers all three pages.

   Live-DOM gotcha caught in Playwright verification: `ui.input_select()`
   renders `.shiny-input-container > <label> + <div><select>...</select>
   </div>` — an UNCLASSED plain `<div>` between `.shiny-input-container`
   and the `<select>` that the gallery's own static markup (a bare
   `<select>`) has no equivalent for. That div has no explicit height, so
   it's `auto` (content-driven) — a percentage height on the `<select>`
   inside it resolves against that `auto` ancestor and is ignored per the
   CSS spec (this is NOT the same "no stretch context" gap the comment
   above already covers; it's one level deeper). `> div` closes it. */
/* In the rail's own filter band (below search, 2026-08-10) the two selects
   share the width evenly instead of keeping the fixed 122/118px they need
   when they sit beside a text label in the head. */
/* Left-aligned at their own width in the filter band (operator 2026-08-10:
   "dropdowns left alignes"), not stretched to fill it. */
.ig-rail__filters .sc-platform-picker,
.ig-rail__filters .enc-schedule-picker { flex: 0 0 auto; }
/* Strip size in the rail HEAD (2026-09-14): `--dc-strip-ctl-h` (30px) like
   every other primary-strip control; the filter band below keeps 24px. */
.ig-rail__label.sc-rail-head .sc-platform-picker,
.ig-rail__label.sc-rail-head .enc-schedule-picker { height: var(--dc-strip-ctl-h); }

.sc-rail-head .sc-platform-picker {
  width: 122px;
  flex: none;
  /* 24px inset, not --dc-topbar-h (2026-08-10 strip rework). These are
     dropdowns, so they belong in the ACTION register with every other strip
     control — full height left them towering over the inset search box
     directly below in the same rail. */
  height: 24px;
  align-self: center;
  box-sizing: border-box;
}
.sc-rail-head .sc-platform-picker .shiny-input-container {
  margin-bottom: 0 !important;
  width: 100% !important;
  height: 100%;
}
.sc-rail-head .sc-platform-picker .shiny-input-container > div {
  height: 100%;
}
.sc-rail-head .sc-platform-picker label.control-label {
  display: none;
}
.sc-rail-head .sc-platform-picker .form-select {
  font-size: 12.5px;
  height: 100%;
  box-sizing: border-box;
  border-radius: var(--dc-radius-lg);   /* shared strip-control radius */
  padding-top: 0;
  padding-bottom: 0;
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23868686' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e");
  background-repeat: no-repeat;
  background-position: right 8px center;
  background-size: 12px 10px;
  padding-right: 28px;
  appearance: none;
  -webkit-appearance: none;
}

/* Encoding rail head's SECOND select — was a readiness-state "status"
   filter (ENCODING.md §1), repurposed 2026-08-03 (walkthrough feedback,
   item 5 — "status on the film select panel is a dropdown but also a
   sort by, so it has two functions colliding") into a SCHEDULE filter
   (Scheduled/Unscheduled/All, filtering on whether the film's per-
   platform film_status.release_date is set — see data/encoding_films.py::
   get_encoding_rail_films' `schedule` param). Renamed .enc-status-picker
   -> .enc-schedule-picker to match; CSS unchanged, still mirrors
   .sc-platform-picker's .form-select treatment (height/font/radius/
   chevron) minus the platform-tint coloring, which is meaningless for a
   schedule filter. Kept in this shared, every-page stylesheet (not
   dc-components.css's .enc-* block) because it styles the SAME rail-head
   Shiny-select-wrapping pattern .sc-platform-picker already owns here,
   not new Encoding-only vocabulary — any future page needing a second
   rail-head select can reuse it. Full-height treatment matches
   .sc-platform-picker above (same reasoning). */
.sc-rail-head .enc-schedule-picker {
  width: 118px;
  flex: none;
  /* 24px inset, not --dc-topbar-h (2026-08-10 strip rework). These are
     dropdowns, so they belong in the ACTION register with every other strip
     control — full height left them towering over the inset search box
     directly below in the same rail. */
  height: 24px;
  align-self: center;
  box-sizing: border-box;
}
.sc-rail-head .enc-schedule-picker .shiny-input-container {
  margin-bottom: 0 !important;
  width: 100% !important;
  height: 100%;
}
.sc-rail-head .enc-schedule-picker .shiny-input-container > div {
  height: 100%;
}
.sc-rail-head .enc-schedule-picker label.control-label {
  display: none;
}
.sc-rail-head .enc-schedule-picker .form-select {
  font-size: 12.5px;
  height: 100%;
  box-sizing: border-box;
  border-radius: var(--dc-radius-lg);   /* shared strip-control radius */
  padding-top: 0;
  padding-bottom: 0;
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23868686' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e");
  background-repeat: no-repeat;
  background-position: right 8px center;
  background-size: 12px 10px;
  padding-right: 28px;
  appearance: none;
  -webkit-appearance: none;
}

/* Platform dropdown: a NORMAL dropdown (operator 2026-08-10: "remove the
   red color from the platform picker just normal dropdown please across all
   pages"). It used to tint itself per platform — red fill/border/chevron for
   YouTube, amber for Pluto TV — which made the one control that is simply
   "which platform am I looking at" read as a warning state, and made it the
   only dropdown in the app that didn't look like the others. The
   `data-platform` attribute stays (the JS still sets it, and the drawer's
   own `.sc-platform-value--yt/--pt` text colours are unaffected); nothing
   keys off it visually here any more. The base rule above already supplies
   the shared grey chevron. */


/* Rail check-column HEADER checkbox (dcSchedHeaderCheck, dc-table.js) —
   select-all lives HERE now, per the gallery's .ig-films-table spec
   (SCHEDULING.md §3) — not the retired standalone "Select all / Clear"
   row above the table (operator 2026-07-27: "the clear button at the top
   is not following dc component design scheme"). Centers + sizes to
   match the row checkboxes (.sched-row-checkbox below). */
/* Body check cell centers exactly like its header does. They used two
   different strategies — the header `justify-content: center` inside 8px
   padding, the body left-aligned with a 4px right pad — so the header box
   and the row boxes sat 8px apart down the column (operator 2026-08-10:
   "check, title and status consistant spacing"). */
#sched-rail .tabulator-row .tabulator-cell[tabulator-field="check"] {
  justify-content: center;
  padding: 0;
}

#sched-rail .tabulator-col[tabulator-field="check"] .tabulator-col-content {
  display: flex;
  align-items: center;
  justify-content: center;
}
#sched-rail .dc-sched-header-check {
  width: 14px;
  height: 14px;
  accent-color: var(--dc-primary);
  cursor: pointer;
}

/* Flush-chrome button restore (code-review fix, 2026-07-26): the pre-port
   CSS squared every bare .dc-btn-line this page adds to the flush baseline
   (CHEATSHEET §2 rule 11) instead of the base dashed/rounded look — that
   rule was dropped wholesale in the dc-calendar port's CSS cleanup.
   Scoped to Schedule's Clear-date button — the only bare .dc-btn-line this
   page still adds outside the shared canonical drawer chrome (the rail's
   own Clear button was retired 2026-07-27 along with the standalone
   select-all row above) — deliberately NOT a blanket `.sched-wrap
   .dc-btn-line` override: that would also flush the drawer's own Cancel
   button here but nowhere else (Library/Intake leave it dashed/rounded). */
#sched-drawer .sc-clear-row .dc-btn-line {
  border: 1px solid var(--dc-line);
  border-radius: 0;
}
#sched-drawer .sc-clear-row .dc-btn-line:hover {
  border-color: var(--dc-faint);
}

/* dc_table rail host — fills remaining rail height below the pinned header.
   Tabulator manages its own internal scroll; we just need flex growth.
   Class is `dc-table-output` (output_dc_table() in components/dc_table.py). */
.dc-sched-list .dc-table-output {
  flex: 1 1 auto;
  min-height: 0;
  overflow: hidden;
}
.dc-sched-list .dc-table-output .tabulator {
  height: 100%;
  border: none;
  border-radius: 0;
  background: var(--dc-panel);
}

/* =========================================================================
   DC_TABLE SCHEDULING CELL STYLES
   Injected by the dcSchedCheck formatter (dc-table.js). The Date column's
   three states (.sc-date-cell--warn/--unset) are dc-components.css classes
   now, via the dcDateWarn formatter — no page-scoped CSS needed for them.
   ========================================================================= */

/* Check column — narrow, centred, no sort arrow */
.dc-sched-check-col {
  padding-left: 0 !important;
  padding-right: var(--dc-space-2) !important;
}
.dc-sched-check-cell {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  height: 100%;
}
.sched-row-checkbox {
  width: 14px;
  height: 14px;
  accent-color: var(--dc-primary);
  cursor: pointer;
}

/* THE ROW IS THE DRAG SOURCE (2026-08-31). The leftmost grip column and its
   `.dc-sched-drag-col` / `-cell` / `-handle` rules are gone: a 20px column
   existing only to be grabbed cost more width than the affordance was worth,
   and the operator asked for Curation's "just grab it and drop it".

   `data-drag-ok` is stamped on the row element by `row_data_attrs`
   (components/dc_table.py) and is absent on a released film, so the cursor
   below is also the honest signal for which rows can actually be dragged. */
.dc-sched-list .tabulator-row[data-drag-ok] { cursor: grab; }
.dc-sched-list .tabulator-row[data-drag-ok]:active { cursor: grabbing; }

/* =========================================================================
   SC-BULK-PANEL / SC-BULK-BAR — batch action bar, pinned to the bottom of
   the left rail. Shows only when 1+ films are selected (controlled by
   sched_bulk_bar_ui). Markup + sizing are the gallery's own
   .sc-bulk-panel/.ig-bar.sc-bulk-bar (dc-components.css, SCHEDULING.md §3)
   verbatim — the date/time inputs are now real <input class="ig-input">
   elements (see pages/scheduling.py), not Shiny's ui.input_date/
   ui.input_text widgets, so no .shiny-input-container/.form-control
   integration shim is needed here any more (removed 2026-07-27, operator
   feedback "date picker UI is not matching the style guide" — the old
   shim was restyling Shiny's Bootstrap-datepicker wrapper to *look*
   right; the real fix is not using that widget at all). Sizing/flex for
   `.ig-input` inside `.sc-bulk-bar` lives in dc-components.css
   (`.sc-bulk-bar .ig-input` / `.sc-bulk-bar input[type="time"].ig-input`).
   ========================================================================= */
/* Apply button — matches the gallery frame's inline font-size:11px (a
   .btn-sm.btn-primary at the app's default btn-sm size read slightly big
   for this tight 3-up row, contributing to the cramping the operator
   flagged 2026-07-27; the icon that was also eating width here is gone
   now — see the plain "Apply" text label above). */
#sched-rail .sc-bulk-bar .btn-primary {
  font-size: 11px;
}

/* =========================================================================
   CENTER REGION — calendar
   flex:1 1 0 + min-width:0 so the calendar always absorbs the remaining
   space in .sched-left-panel and can shrink below its content width.
   The inner rail gutter (JS) never writes inline width/flex onto this
   element — it sizes the rail only, leaving the calendar on flex.
   ========================================================================= */
.sched-center {
  flex: 1 1 0;
  min-width: 0;   /* CRITICAL — allows flex item to shrink below content width */
  height: 100%;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  background: var(--dc-bg);
}
.sched-center__scroll {
  flex: 1 1 auto;
  min-height: 0;
  min-width: 0;   /* belt-and-suspenders: prevent horizontal bleed */
  /* overflow:hidden, NOT overflow-y:auto — the calendar (fill mode, below)
     now reaches this element's full height in every view, so this
     wrapper never needs to scroll itself; FullCalendar handles its OWN
     internal scrolling where a view legitimately needs it (multiMonthYear
     with many months stacked). A leftover overflow-y:auto here would risk
     a redundant/awkward SECOND scrollbar around the calendar's own.
     Fixed 2026-07-27, operator feedback "the calendar is not full
     height". */
  overflow: hidden;
  /* No surrounding margin — calendar fills the full panel area */
  padding: 0;
}

/* =========================================================================
   #SCHED-CAL — dc_calendar fill-mode flex chain (operator feedback
   2026-07-27, "the calendar is not full height"). Propagates height:100%
   from .sched-center down through the dc_calendar output wrapper and
   .sc-cal-wrap to the FullCalendar mount (.sc-cal), so dc-calendar.js's
   `height: "parent"` measures a real, non-auto height at every level —
   without this chain FullCalendar's "parent" mode has nothing definite to
   measure and silently falls back to its own content height, reproducing
   the same short-canvas gap. Scoped to #sched-cal (this page's calendar
   region id) — components/dc_calendar.py / dc-components.css stay
   height-agnostic so a future fixed-height calendar elsewhere isn't
   affected.
   ========================================================================= */
#sched-cal .dc-calendar-output--fill {
  display: flex;
  flex-direction: column;
  height: 100%;
  min-height: 0;
}
#sched-cal .dc-calendar-output--fill .sc-cal-wrap {
  flex: 1 1 auto;
  min-height: 0;
  display: flex;
  flex-direction: column;
}
#sched-cal .dc-calendar-output--fill /* FullCalendar's scrollgrid table draws its own top + left border, which
   doubled against the two neighbours that already own those seams: the
   `.sc-cal-toolbar` above (an `.ig-bar`, 1px bottom rule) and the resize
   gutter to its left (1px right rule). Operator 2026-08-10: "remove the fat
   grey divider from the calender top and left and use a 1px border". The
   grid's INTERNAL lines are untouched — only its outer top/left edge. */
.sc-cal .fc-scrollgrid { border-top: none; border-left: none; }

.sc-cal {
  flex: 1 1 auto;
  min-height: 0;
}
/* Thin scrollbar for FullCalendar's own internal scroller (multiMonthYear
   with several months stacked) — matches this page's other scrollbars
   rather than the browser default. */
#sched-cal .sc-cal .fc-scroller {
  scrollbar-width: thin;
  scrollbar-color: var(--dc-line-2) transparent;
}
#sched-cal .sc-cal .fc-scroller::-webkit-scrollbar {
  width: 5px;
}
#sched-cal .sc-cal .fc-scroller::-webkit-scrollbar-thumb {
  background: var(--dc-line-2);
  border-radius: 3px;
}
#sched-cal .sc-cal .fc-scroller::-webkit-scrollbar-track {
  background: transparent;
}

/* =========================================================================
   #SCHED-DRAWER — schedule drawer (.split-detail child of #scheduling-split)

   The outer split (left panel ↔ drawer) is managed by the global Split.js
   manager in app.py.  Split.js sets the width via inline flex-basis and
   injects a .dc-gutter element between .split-table and .split-detail.
   dc-theme.css provides .split-detail border/radius/shadow.
   app.py's .split-detail rule provides: display:flex; flex-direction:column;
   height:100%; overflow:hidden; — those properties are NOT repeated here.

   CRITICAL: do NOT add display:flex (or any display value) here.
   .dc-split.drawer-hidden .split-detail { display:none } in app.py hides
   the drawer when closed.  That rule has specificity 0,3,0.  An ID rule
   (#sched-drawer) has specificity 1,0,0 and would ALWAYS WIN — permanently
   overriding display:none and keeping the drawer visible (Bug A regression).

   Only min-height:0 is added here (not in the generic .split-detail rule)
   so the drawer's internal flex children (chrome + body + footer) can scroll
   correctly without the parent's height being treated as a minimum.

   Open/close is fully handled by the global manager toggling .drawer-hidden
   on #scheduling-split — no CSS needed here for that.
   ========================================================================= */
#sched-drawer {
  min-height: 0;
}

/* Sentinel div emitted by sched_drawer_body when state is None.
   Hidden — only used to signal JS to clear the active-row highlight. */
.dc-sched-drawer--no-content {
  display: none;
}

/* Schedule section date/time edit row (.sc-datetime-row) — real
   <input class="ig-input" type=date|time> elements straight from the
   gallery markup (components/film_detail.py::_schedule_body), not Shiny's
   ui.input_date/ui.input_text (removed 2026-07-27, operator feedback
   "date picker UI is not matching the style guide"). No wrapper-div
   integration shim needed any more — dc-components.css's `.sc-datetime-row`
   rule (flex(date) / 84px mono(time)) already targets bare
   <input type=date>/<input type=time> as direct flex children, which is
   exactly what's rendered now. */

/* Drawer body — scrollable */
#sched-drawer .dc-drawer__body {
  flex: 1 1 auto;
  min-height: 0;
  overflow-y: auto;
  padding: var(--dc-space-5);
}

/* =========================================================================
   AUTO-HIDE SCROLLBARS — clean visual on the sched page panels
   ========================================================================= */
.sched-center__scroll,
#sched-drawer .dc-drawer__body {
  scrollbar-width: thin;
  scrollbar-color: var(--dc-line-2) transparent;
}
.sched-center__scroll::-webkit-scrollbar,
#sched-drawer .dc-drawer__body::-webkit-scrollbar {
  width: 5px;
}
.sched-center__scroll::-webkit-scrollbar-thumb,
#sched-drawer .dc-drawer__body::-webkit-scrollbar-thumb {
  background: var(--dc-line-2);
  border-radius: 3px;
}
.sched-center__scroll::-webkit-scrollbar-track,
#sched-drawer .dc-drawer__body::-webkit-scrollbar-track {
  background: transparent;
}