/* ── Design Department Page ──────────────────────────────────
   Design sidebar tabs are wired via the standard deptMenuItems
   flow in ui/js/app.js. The Content Calendars tab calls
   window.renderSplitSheetTab directly from production-page.js
   so all row/card styling is inherited from production-page.css
   (.prod-deliv-* classes).

   Overrides scoped to `.design-cc-split-70-30`:
   1. 70/30 split ratio (Design 70%, Design Review 30%)
   2. Hide the per-client group header row (client name banner)
      so the sheet renders as a flat list of CC rows.
   ─────────────────────────────────────────────────────────────── */

.design-cc-split-70-30 .dept-dashboard-layout {
  gap: 12px;
}

.design-cc-split-70-30 .dept-dashboard-half:nth-child(1) {
  flex: 0 0 calc(70% - 6px);
  max-width: calc(70% - 6px);
}

.design-cc-split-70-30 .dept-dashboard-half:nth-child(2) {
  flex: 0 0 calc(30% - 6px);
  max-width: calc(30% - 6px);
}

/* Hide the client group header row — CCs render as a flat list.
   The client name is surfaced inline on each row via the custom
   typeWithClientPrefix column in design-page.js. */
.design-cc-split-70-30 .prod-deliv-client-row {
  display: none;
}

/* Push status + advance arrow to the far right of the row. The spacer
   cell between type and status flex-grows to consume free space. */
.design-cc-split-70-30 .prod-deliv-row {
  display: flex;
  align-items: center;
}
.design-cc-split-70-30 .design-a4a-spacer {
  flex: 1 1 auto;
  min-width: 0;
}

/* ── Agri for All tab overrides ─────────────────────────────────
   The A4A tab inherits the 70/30 split above but needs a visibly
   wider Design Review pane (right) so the reviewer's trimmed
   column set (eye, assignee, client, type, send-back+advance)
   doesn't feel cramped, and so the two action-arrow buttons in
   the rightmost column have comfortable horizontal space.

   Applied via the extra `.design-a4a-split` marker that
   renderDesignAgriForAllTab adds to its container — keeps the
   Content Calendars tab on its original 70/30 layout.
   ─────────────────────────────────────────────────────────────── */

/* Shift split from 70/30 → 58/42 so the Design Review card is
   visibly wider. Left pane still gets the majority of the space
   (it carries status + spacer columns that the right pane drops). */
.design-a4a-split.design-cc-split-70-30 .dept-dashboard-half:nth-child(1) {
  flex: 0 0 calc(58% - 6px);
  max-width: calc(58% - 6px);
}

.design-a4a-split.design-cc-split-70-30 .dept-dashboard-half:nth-child(2) {
  flex: 0 0 calc(42% - 6px);
  max-width: calc(42% - 6px);
}

/* Widen the rightmost action-arrow cell (`.prod-deliv-act`) inside
   the A4A panes so the back + advance arrows sit with comfortable
   spacing instead of being jammed against the row edge.

   Production's base rule is `flex: 0 0 36px` (see
   production-page.css) — that's sized for a single arrow. Our
   actionAdvanceBack column renders TWO arrows, so we need roughly
   double the width plus breathing room. */
.design-a4a-split .prod-deliv-act {
  flex: 0 0 120px;
  min-width: 120px;
  padding-left: 10px;
  padding-right: 10px;
  gap: 8px;
  justify-content: flex-end;
}