/* Content Calendar — the replacement for the "Client Content Calendars" sheet.
 *
 * One row per client per month. Everything is namespaced .ccal-* so nothing
 * leaks. Same visual language as Client Retention and the deliverable dashboard:
 * white cards, 1px #e5e7eb borders, 12-14px radii, the #10141b command strip,
 * #2563eb as the single primary, uppercase 10.5px table headers, 999px pills.
 *
 * NOTE — this file also owns the .ccal-sched-* block near the bottom, which
 * styles the Scheduling card RENDERED BY pages/deliverable-dashboard/
 * deliverable-dashboard.js. The prefix is deliberate: the card belongs to this
 * feature, so its styles live with the feature rather than being buried in the
 * dashboard's own 3000-line stylesheet. index.html loads every page stylesheet
 * up front, so the card is styled regardless of which page is open.
 */

.ccal-page {
  display: flex;
  flex-direction: column;
  gap: 18px;
  padding: 24px;
  box-sizing: border-box;
  width: 100%;
  max-width: 100%;
  height: 100%;
  min-height: 0;
  overflow-y: auto;
  overflow-x: hidden;
}

/* Everything under the header. .ccal-page is a fixed-height column that scrolls,
   so its children must be told NOT to shrink: a flex child defaults to
   flex-shrink:1 and would otherwise be compressed to fit the viewport, which
   clipped the bottom of the table rather than letting the page scroll. */
.ccal-page > * { flex-shrink: 0; }
.ccal-body { display: flex; flex-direction: column; gap: 18px; }
.ccal-body > * { flex-shrink: 0; }

/* ── header ──────────────────────────────────────────────────────────────── */
.ccal-head { display: flex; align-items: flex-start; gap: 16px; flex-wrap: wrap; }
.ccal-head-titles { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.ccal-title { margin: 0; font-size: 22px; font-weight: 700; letter-spacing: -0.01em; color: var(--text-primary, #1a1a1a); }
.ccal-sub { font-size: 13px; color: var(--text-muted, #666); max-width: 74ch; line-height: 1.45; }
.ccal-head-actions { margin-left: auto; display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }

/* ── buttons ─────────────────────────────────────────────────────────────── */
.ccal-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  border: 1px solid var(--border-color, #e5e7eb);
  background: var(--card-bg, #fff);
  color: var(--text-primary, #1a1a1a);
  border-radius: 8px;
  padding: 8px 16px;
  font: inherit;
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
  white-space: nowrap;
  transition: background .15s ease, border-color .15s ease;
}
.ccal-btn:hover { background: #f8fafc; border-color: #cbd5e1; }
.ccal-btn:focus-visible { outline: 2px solid #2563eb; outline-offset: 2px; }
.ccal-btn:disabled { opacity: .55; cursor: default; }
.ccal-btn:disabled:hover { background: var(--card-bg, #fff); border-color: var(--border-color, #e5e7eb); }
.ccal-btn-primary { background: #2563eb; border-color: #2563eb; color: #fff; }
.ccal-btn-primary:hover { background: #1d4ed8; border-color: #1d4ed8; }
.ccal-btn-primary:disabled:hover { background: #2563eb; border-color: #2563eb; }
.ccal-btn-sm { padding: 5px 11px; font-size: 12px; border-radius: 7px; }
.ccal-btn-danger { color: #b91c1c; border-color: #fecaca; }
.ccal-btn-danger:hover { background: #fef2f2; border-color: #fca5a5; }
/* The one-time setup pass. Muted on purpose: it must not read as a routine
   action sitting next to Refresh, because pressing it every month is wrong. */
.ccal-btn-setup { border-style: dashed; color: var(--text-muted, #666); font-weight: 600; }
.ccal-btn-setup:hover { background: #f8fafc; border-color: #94a3b8; color: var(--text-primary, #1a1a1a); }
.ccal-setup-badge {
  font-size: 9px; font-weight: 800; text-transform: uppercase; letter-spacing: .06em;
  background: #10141b; color: #fff; border-radius: 5px; padding: 2px 5px;
}

/* ── command strip ───────────────────────────────────────────────────────── */
.ccal-cmd {
  background:
    radial-gradient(120% 140% at 100% 0%, rgba(37, 99, 235, 0.22), transparent 55%),
    #10141b;
  border: 1px solid #10141b;
  border-radius: 16px;
  padding: 20px 24px;
  display: flex;
  align-items: center;
  gap: 28px;
  flex-wrap: wrap;
}
.ccal-cmd-lead { display: flex; flex-direction: column; gap: 3px; flex-shrink: 0; min-width: 220px; }
.ccal-cmd-kicker { font-size: 10px; text-transform: uppercase; letter-spacing: 0.14em; font-weight: 700; color: #8b95a5; }
.ccal-cmd-figure { display: flex; align-items: baseline; gap: 10px; }
.ccal-cmd-num { font-size: 46px; font-weight: 800; line-height: 1; letter-spacing: -0.03em; color: #fff; font-feature-settings: "tnum"; }
.ccal-cmd-num-l { font-size: 13px; font-weight: 600; color: #aeb6c2; }
.ccal-cmd-note { font-size: 11.5px; color: #7c8798; max-width: 40ch; line-height: 1.35; }
.ccal-cmd-vitals { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 10px; flex: 1; min-width: 0; }
.ccal-vital {
  background: rgba(255, 255, 255, 0.05);
  border: 1px solid rgba(255, 255, 255, 0.06);
  border-radius: 11px;
  padding: 11px 12px;
  display: grid;
  grid-template-columns: auto 1fr;
  grid-template-rows: auto auto;
  column-gap: 8px;
  align-items: center;
  min-width: 0;
}
.ccal-vital-dot { width: 8px; height: 8px; border-radius: 999px; grid-row: 1; grid-column: 1; align-self: center; }
.ccal-vital-n { grid-row: 1; grid-column: 2; font-size: 22px; font-weight: 800; line-height: 1; color: #fff; font-feature-settings: "tnum"; }
.ccal-vital-l { grid-row: 2; grid-column: 1 / -1; font-size: 10px; text-transform: uppercase; letter-spacing: 0.05em; color: #8b95a5; font-weight: 700; margin-top: 5px; }
.ccal-vital.is-alarm { background: rgba(217, 119, 6, 0.18); border-color: rgba(251, 191, 36, 0.42); }
.ccal-vital.is-alarm .ccal-vital-l { color: #fcd34d; }
.ccal-dot-green { background: #16a34a; }
.ccal-dot-amber { background: #d97706; }
.ccal-dot-blue { background: #2563eb; }
.ccal-dot-slate { background: #64748b; }

/* ── "the plan is a client property" band ────────────────────────────────── */
/* Deliberately loud, because re-entering the platform ticks every month is the
   exact habit this page exists to break. */
.ccal-explain {
  display: flex;
  align-items: center;
  gap: 16px;
  border: 1px solid #cddffb;
  background: linear-gradient(180deg, #f5f9ff, #fff);
  border-radius: 14px;
  padding: 15px 18px;
  flex-wrap: wrap;
}
.ccal-explain-ic {
  width: 38px; height: 38px; border-radius: 11px; flex-shrink: 0;
  display: inline-flex; align-items: center; justify-content: center;
  background: #dbeafe; color: #1d4ed8;
}
.ccal-explain-txt { flex: 1; min-width: 220px; display: flex; flex-direction: column; gap: 3px; }
.ccal-explain-t { font-size: 13.5px; font-weight: 700; color: var(--text-primary, #1a1a1a); }
.ccal-explain-b { font-size: 12.5px; color: var(--text-secondary, #444); line-height: 1.5; max-width: 88ch; }
.ccal-explain-b b { color: #1d4ed8; }

/* ── toolbar ─────────────────────────────────────────────────────────────── */
.ccal-bar { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 10px; }
.ccal-field { display: flex; flex-direction: column; gap: 5px; min-width: 0; }
.ccal-flabel { font-size: 10.5px; text-transform: uppercase; letter-spacing: .03em; color: var(--text-muted, #666); font-weight: 700; }
.ccal-input, .ccal-select {
  border: 1px solid var(--border-color, #d1d5db); background: #fff; color: var(--text-primary, #1a1a1a);
  border-radius: 8px; padding: 8px 10px; font: inherit; font-size: 13px; box-sizing: border-box;
}
.ccal-select { cursor: pointer; max-width: 240px; }
.ccal-input:focus, .ccal-select:focus { outline: none; border-color: #2563eb; box-shadow: 0 0 0 3px rgba(37,99,235,.12); }
.ccal-search { position: relative; flex: 1 1 220px; min-width: 0; display: flex; align-items: center; }
.ccal-search-ic { position: absolute; left: 10px; display: inline-flex; color: #94a3b8; pointer-events: none; }
.ccal-search-input {
  width: 100%; box-sizing: border-box; padding: 8px 12px 8px 32px;
  border: 1px solid var(--border-color, #d1d5db); border-radius: 9px;
  font: inherit; font-size: 13px; background: #fff; color: var(--text-primary, #1a1a1a);
}
.ccal-search-input:focus { outline: none; border-color: #2563eb; box-shadow: 0 0 0 3px rgba(37,99,235,.12); }
.ccal-bar-spacer { margin-left: auto; }

/* ── table ───────────────────────────────────────────────────────────────── */
.ccal-tablewrap { width: 100%; overflow-x: auto; border: 1px solid var(--border-color, #e5e7eb); border-radius: 12px; background: #fff; }
.ccal-table { width: 100%; border-collapse: collapse; font-size: 12.5px; background: #fff; min-width: 1260px; }
.ccal-table th {
  background: #f8fafc; text-align: left; padding: 10px 12px;
  font-size: 10.5px; font-weight: 700; text-transform: uppercase; letter-spacing: .03em;
  color: var(--text-muted, #666); border-bottom: 1px solid var(--border-color, #e5e7eb); white-space: nowrap;
}
.ccal-table th.ccal-th-num { text-align: right; }
.ccal-table td { padding: 10px 12px; border-bottom: 1px solid var(--border-color, #eef0f2); color: var(--text-secondary, #444); vertical-align: middle; }
.ccal-table td.ccal-td-num { text-align: right; font-feature-settings: "tnum"; font-weight: 700; color: var(--text-primary, #1a1a1a); }
.ccal-table tr:last-child td { border-bottom: 0; }
.ccal-table tbody tr.ccal-row:hover td { background: #fbfcfe; }
.ccal-td-client { font-weight: 700; color: var(--text-primary, #1a1a1a); }
.ccal-td-act { white-space: nowrap; text-align: right; }
.ccal-td-act .ccal-btn + .ccal-btn { margin-left: 6px; }
.ccal-muted { color: #94a3b8; }
.ccal-month { font-feature-settings: "tnum"; white-space: nowrap; color: var(--text-primary, #1a1a1a); font-weight: 600; }

/* platform pills, sourced from the channel plan (never re-entered per month) */
.ccal-plats { display: flex; flex-wrap: wrap; gap: 4px; max-width: 260px; }
.ccal-plat {
  display: inline-flex; align-items: center; gap: 4px;
  font-size: 10.5px; font-weight: 700; padding: 2px 8px; border-radius: 999px;
  background: #f1f5f9; color: #475569; white-space: nowrap;
}
.ccal-plat-ico { display: inline-flex; align-items: center; }
.ccal-plat-facebook  { background: #e7f0fe; color: #1558c0; }
.ccal-plat-instagram { background: #fdeaf3; color: #a12a6d; }
.ccal-plat-stories   { background: #f3ecfd; color: #6d28d9; }
.ccal-plat-linkedin  { background: #e5f1f8; color: #075295; }
.ccal-plat-x         { background: #e8eaed; color: #10141b; }
.ccal-plat-tiktok    { background: #e8eaed; color: #10141b; }
.ccal-plat-youtube   { background: #fdecec; color: #b91c1c; }
.ccal-plat-threads   { background: #e8eaed; color: #10141b; }
.ccal-plat-pinterest { background: #fdecec; color: #9f0712; }
.ccal-plat-noplan {
  background: #fff; border: 1px dashed #cbd5e1; color: #94a3b8; font-weight: 600;
}

/* artwork readiness gate */
.ccal-art {
  display: inline-flex; align-items: center; gap: 5px;
  border: 0; font: inherit;
  font-size: 10px; font-weight: 800; text-transform: uppercase; letter-spacing: .03em;
  padding: 3px 9px; border-radius: 999px; white-space: nowrap;
}
.ccal-art-ready { background: #dcfce7; color: #15803d; }
.ccal-art-gap { background: #fef3c7; color: #92600e; cursor: pointer; }
.ccal-art-gap:hover { background: #fde68a; }
.ccal-art-gap:focus-visible { outline: 2px solid #2563eb; outline-offset: 2px; }
.ccal-art-none { background: #f1f5f9; color: #64748b; }
/* An unreadable gate reads as a problem, not as a neutral state: readiness is
   unknown and the month is not confirmed schedulable. */
.ccal-art-err { background: #fee2e2; color: #b91c1c; cursor: help; }
.ccal-art-caret { font-size: 9px; transition: transform .12s ease; }
.ccal-art-gap.is-open .ccal-art-caret { transform: rotate(90deg); }

/* ── Team column: one initials avatar per assignable department ──────────── */
.ccal-team { display: flex; align-items: center; gap: 4px; }
.ccal-av {
  width: 26px; height: 26px; flex-shrink: 0;
  border-radius: 999px; border: 1px solid transparent;
  background: #e2e8f0; color: #64748b;
  font: inherit; font-size: 10px; font-weight: 800; letter-spacing: .01em;
  display: inline-flex; align-items: center; justify-content: center;
  cursor: pointer; padding: 0;
  transition: transform .12s ease, box-shadow .12s ease;
}
.ccal-av:hover { transform: translateY(-1px); box-shadow: 0 2px 6px rgba(15, 23, 42, .18); }
.ccal-av:focus-visible { outline: 2px solid #2563eb; outline-offset: 2px; }
.ccal-av.is-empty {
  background: #fff; border: 1px dashed #cbd5e1; color: #94a3b8; font-size: 13px; font-weight: 600;
}
.ccal-av.is-busy { opacity: .5; cursor: default; }
.ccal-av-fallback { margin-left: 6px; max-width: 190px; }
@media (prefers-reduced-motion: reduce) { .ccal-av { transition: none; } }

/* the expanded chase row: which post is missing which size */
.ccal-detail-row td { background: #fffdf5; border-bottom: 1px solid var(--border-color, #eef0f2); }
.ccal-detail {
  display: flex; flex-direction: column; gap: 8px; padding: 4px 2px 6px;
}
.ccal-detail-t { font-size: 11px; font-weight: 800; text-transform: uppercase; letter-spacing: .04em; color: #92600e; }
.ccal-detail-list { display: flex; flex-direction: column; gap: 5px; }
.ccal-detail-item { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; font-size: 12.5px; }
.ccal-detail-idx {
  display: inline-flex; align-items: center; justify-content: center;
  min-width: 26px; height: 22px; padding: 0 6px; border-radius: 6px;
  background: #10141b; color: #fff; font-size: 11px; font-weight: 800; flex-shrink: 0;
}
.ccal-detail-miss { display: flex; flex-wrap: wrap; gap: 4px; }
.ccal-miss {
  display: inline-flex; align-items: center; gap: 4px;
  font-size: 10.5px; font-weight: 700; padding: 2px 8px; border-radius: 999px;
  background: #fee2e2; color: #b91c1c; white-space: nowrap;
}
/* A missing post date is a planning gap, not a design gap, so it does not wear
   the same red as a missing resize. */
.ccal-miss-date { background: #e2e8f0; color: #334155; }
.ccal-detail-note { font-size: 11.5px; color: var(--text-muted, #666); line-height: 1.45; }

/* deliverable status pill — colour comes inline from PRODUCTION_STATUS_OPTIONS */
.ccal-status {
  display: inline-flex; align-items: center; gap: 5px;
  font-size: 10.5px; font-weight: 700; padding: 3px 9px; border-radius: 999px;
  background: #f1f5f9; color: #475569; white-space: nowrap;
}
.ccal-status-dot { width: 6px; height: 6px; border-radius: 999px; flex-shrink: 0; background: currentColor; }

/* scheduling state */
.ccal-sched { display: flex; flex-direction: column; gap: 3px; }
.ccal-sched-pill {
  display: inline-flex; align-items: center; gap: 5px; align-self: flex-start;
  font-size: 10px; font-weight: 800; text-transform: uppercase; letter-spacing: .03em;
  padding: 3px 9px; border-radius: 999px; white-space: nowrap;
}
.ccal-sched-none { background: #f1f5f9; color: #64748b; }
.ccal-sched-queued { background: #e0f2fe; color: #075985; }
.ccal-sched-scheduled { background: #dbeafe; color: #1d4ed8; }
.ccal-sched-published { background: #dcfce7; color: #15803d; }
.ccal-sched-failed { background: #fee2e2; color: #b91c1c; }
.ccal-sched-cancelled { background: #e2e8f0; color: #334155; }
.ccal-sched-sub { font-size: 10.5px; color: var(--text-muted, #666); font-feature-settings: "tnum"; }
/* the failure reason, on the sheet, so nobody opens a drawer to learn why */
.ccal-sched-why-row { display: flex; flex-direction: column; gap: 1px; max-width: 260px; }
.ccal-sched-reason {
  font-size: 10.5px; line-height: 1.35; color: #b91c1c;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.ccal-sched-reason.is-blank { color: #94a3b8; font-style: italic; }

/* ── drawer (channel plan editor) ────────────────────────────────────────── */
.ccal-drawer-backdrop {
  position: fixed; inset: 0; z-index: 1000;
  background: rgba(15, 23, 42, .42);
  display: flex; justify-content: flex-end;
}
.ccal-drawer {
  background: #fff; width: 520px; max-width: 100%; height: 100%;
  display: flex; flex-direction: column; min-height: 0;
  box-shadow: -20px 0 50px rgba(15, 23, 42, .22);
  animation: ccal-slide .18s ease-out;
}
@keyframes ccal-slide { from { transform: translateX(24px); opacity: .4; } to { transform: none; opacity: 1; } }
@media (prefers-reduced-motion: reduce) {
  .ccal-drawer { animation: none; }
  .ccal-btn, .ccal-art-caret, .ccal-search-input, .ccal-input, .ccal-select { transition: none; }
}
.ccal-drawer-hd {
  display: flex; align-items: flex-start; gap: 12px;
  padding: 20px 22px 14px; border-bottom: 1px solid var(--border-color, #e5e7eb); flex-shrink: 0;
}
.ccal-drawer-titles { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.ccal-drawer-title { font-size: 17px; font-weight: 700; color: var(--text-primary, #1a1a1a); margin: 0; }
.ccal-drawer-sub { font-size: 12.5px; color: var(--text-muted, #666); line-height: 1.5; }
.ccal-drawer-x {
  margin-left: auto; flex-shrink: 0;
  width: 30px; height: 30px; border-radius: 8px;
  border: 1px solid var(--border-color, #e5e7eb); background: #fff; color: #64748b;
  font-size: 17px; line-height: 1; cursor: pointer;
}
.ccal-drawer-x:hover { background: #f8fafc; }
.ccal-drawer-x:focus-visible { outline: 2px solid #2563eb; outline-offset: 2px; }
.ccal-drawer-body { flex: 1; min-height: 0; overflow-y: auto; padding: 18px 22px; display: flex; flex-direction: column; gap: 20px; }
.ccal-drawer-foot {
  padding: 14px 22px; border-top: 1px solid var(--border-color, #e5e7eb);
  display: flex; align-items: center; gap: 10px; justify-content: flex-end; flex-shrink: 0; background: #fff;
}
.ccal-drawer-msg { margin-right: auto; font-size: 12px; font-weight: 600; }
.ccal-drawer-msg.err { color: #dc2626; }
.ccal-drawer-msg.ok { color: #16a34a; }

.ccal-sec { display: flex; flex-direction: column; gap: 10px; }
.ccal-sec-hd { display: flex; align-items: baseline; gap: 8px; }
.ccal-sec-t { font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: var(--text-muted, #666); }
.ccal-sec-help { font-size: 12px; color: var(--text-muted, #666); line-height: 1.5; }

/* plan rows */
.ccal-planrow {
  display: grid; grid-template-columns: 22px 1fr 78px 78px; gap: 10px; align-items: center;
  border: 1px solid var(--border-color, #e5e7eb); border-radius: 11px; padding: 10px 12px;
}
.ccal-planrow.is-off { background: #fafbfc; }
.ccal-planrow.is-off .ccal-planrow-nm { color: #94a3b8; }
.ccal-planrow input[type="checkbox"] { width: 16px; height: 16px; accent-color: #2563eb; cursor: pointer; }
.ccal-planrow-nm { display: flex; align-items: center; gap: 7px; font-size: 13px; font-weight: 600; color: var(--text-primary, #1a1a1a); min-width: 0; }
.ccal-num-in {
  width: 100%; box-sizing: border-box; padding: 6px 8px; text-align: right;
  border: 1px solid var(--border-color, #d1d5db); border-radius: 7px;
  font: inherit; font-size: 12.5px; background: #fff; color: var(--text-primary, #1a1a1a);
}
.ccal-num-in:focus { outline: none; border-color: #2563eb; box-shadow: 0 0 0 3px rgba(37,99,235,.12); }
.ccal-num-in:disabled { background: #f8fafc; color: #cbd5e1; }
.ccal-planhead { display: grid; grid-template-columns: 22px 1fr 78px 78px; gap: 10px; padding: 0 12px; }
.ccal-planhead span {
  font-size: 9.5px; font-weight: 800; text-transform: uppercase; letter-spacing: .04em; color: #94a3b8; text-align: right;
}
.ccal-planhead span:nth-child(1), .ccal-planhead span:nth-child(2) { text-align: left; }

/* the artwork half of a plan row: size token + which platform it reuses */
/* Sits directly under its platform row, indented to line up past the tick box.
   Its own box rather than a bottom-joined one, so the .ccal-planrow rule stays
   untouched (the plan picker reuses that class for its client list). */
.ccal-artrow {
  display: grid; grid-template-columns: auto 1fr auto 1fr; gap: 8px; align-items: center;
  margin: -4px 0 2px 32px; padding: 8px 12px;
  border: 1px solid var(--border-color, #eef0f2); border-radius: 10px; background: #fbfcfe;
}
.ccal-artrow.is-off { background: #fafbfc; }
.ccal-artrow-l { font-size: 9.5px; font-weight: 800; text-transform: uppercase; letter-spacing: .04em; color: #94a3b8; }
.ccal-artrow-in, .ccal-artrow-sel {
  min-width: 0; box-sizing: border-box; width: 100%; padding: 5px 8px;
  border: 1px solid var(--border-color, #d1d5db); border-radius: 7px;
  font: inherit; font-size: 12px; background: #fff; color: var(--text-primary, #1a1a1a);
}
.ccal-artrow-in:focus, .ccal-artrow-sel:focus { outline: none; border-color: #2563eb; box-shadow: 0 0 0 3px rgba(37,99,235,.12); }
.ccal-artrow-in:disabled, .ccal-artrow-sel:disabled { background: #f8fafc; color: #cbd5e1; }
.ccal-artrow-note {
  grid-column: 1 / -1; font-size: 11px; color: #6d28d9; font-weight: 600;
}
/* Its own piece is the ordinary case, so it stays quiet; a reuse is the one
   worth noticing, because it is what makes the artwork count differ from the
   platform count. */
.ccal-artrow-note.is-own { color: #94a3b8; font-weight: 500; }
/* A reuse whose target is not ticked resolves to no piece at all. */
.ccal-artrow-note.is-broken { color: #b91c1c; }

/* ── artwork jobs card ──────────────────────────────────────────────────────
   The count, at the top of the plan drawer. Ticks and drawing jobs are not the
   same number because sizes are shared between platforms, and this is where
   that is said out loud. Borrowed styling from .ccal-setup-note so it reads as
   the same family of "read this first" panel rather than a new invention. */
.ccal-jobs {
  border: 1px solid #cddffb; border-radius: 12px;
  background: linear-gradient(180deg, #f5f9ff, #fff);
  padding: 13px 15px; display: flex; flex-direction: column; gap: 10px;
}
/* An unresolved reuse changes the count, so the panel changes colour with it. */
.ccal-jobs.has-warn { border-color: #f3d3a0; background: linear-gradient(180deg, #fffaf1, #fff); }
.ccal-jobs-t {
  font-size: 10.5px; font-weight: 800; text-transform: uppercase; letter-spacing: .04em;
  color: #64748b;
}
.ccal-jobs-line {
  font-size: 14.5px; font-weight: 700; line-height: 1.45;
  color: var(--text-primary, #1a1a1a); font-feature-settings: "tnum";
}
.ccal-jobs-slots { display: flex; flex-wrap: wrap; gap: 8px; }
.ccal-jobs-slot {
  flex: 1 1 190px; min-width: 0;
  border: 1px solid var(--border-color, #e5e7eb); border-radius: 10px;
  background: #fff; padding: 9px 11px;
  display: flex; flex-direction: column; gap: 6px;
}
.ccal-jobs-slot-h { display: flex; align-items: baseline; gap: 7px; flex-wrap: wrap; }
.ccal-jobs-slot-nm { font-size: 13px; font-weight: 700; color: var(--text-primary, #1a1a1a); }
.ccal-jobs-slot-dim {
  font-size: 11px; color: var(--text-muted, #666); font-feature-settings: "tnum"; white-space: nowrap;
}
.ccal-jobs-slot-p { display: flex; flex-wrap: wrap; gap: 4px; }
.ccal-jobs-slot-n { font-size: 11px; color: var(--text-muted, #666); line-height: 1.4; }
.ccal-jobs-warn { font-size: 11.5px; color: #92400e; line-height: 1.45; font-weight: 600; }

/* one-time setup drawer */
.ccal-setup-note {
  border: 1px solid #cddffb; background: linear-gradient(180deg, #f5f9ff, #fff);
  border-radius: 12px; padding: 13px 15px; display: flex; flex-direction: column; gap: 4px;
}
.ccal-setup-note-t { font-size: 13px; font-weight: 700; color: var(--text-primary, #1a1a1a); }
.ccal-setup-note-b { font-size: 12.5px; color: var(--text-secondary, #444); line-height: 1.5; }
.ccal-setup-result { display: flex; flex-direction: column; gap: 8px; }
.ccal-setup-row {
  display: grid; grid-template-columns: 1fr auto; gap: 10px; align-items: center;
  border: 1px solid var(--border-color, #e5e7eb); border-radius: 10px; padding: 9px 12px;
}
.ccal-setup-new {
  display: inline-flex; align-items: center;
  font-size: 10.5px; font-weight: 700; padding: 2px 8px; border-radius: 999px;
  background: #dcfce7; color: #15803d; white-space: nowrap;
}
/* Why a client was passed over, shown rather than flattened into "nothing". */
.ccal-setup-skip {
  display: inline-flex; align-items: center;
  font-size: 10.5px; font-weight: 600; padding: 2px 8px; border-radius: 999px;
  background: #f1f5f9; color: #64748b; white-space: nowrap;
}

/* resize matrix rows */
.ccal-mxrow {
  display: grid; grid-template-columns: 22px 1fr 66px 66px; gap: 10px; align-items: center;
  border: 1px solid var(--border-color, #e5e7eb); border-radius: 11px; padding: 10px 12px;
}
.ccal-mxrow.is-off { background: #fafbfc; }
.ccal-mxrow input[type="checkbox"] { width: 16px; height: 16px; accent-color: #2563eb; cursor: pointer; }
.ccal-mx-key { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.ccal-mx-nm { font-size: 13px; font-weight: 600; color: var(--text-primary, #1a1a1a); }
.ccal-mx-sub { font-size: 10.5px; color: #94a3b8; font-family: ui-monospace, SFMono-Regular, Menlo, monospace; }

/* ── flash + states ──────────────────────────────────────────────────────── */
.ccal-flash { border-radius: 11px; padding: 11px 14px; font-size: 13px; font-weight: 600; }
.ccal-flash-ok { background: #e7f6ec; border: 1px solid #b7e3c6; color: #166534; }
.ccal-flash-err { background: #fef2f2; border: 1px solid #fca5a5; color: #b91c1c; }
.ccal-loading, .ccal-empty { padding: 22px 4px; font-size: 13px; color: var(--text-muted, #666); }
.ccal-empty-card {
  border: 1px dashed #cbd5e1; border-radius: 14px; background: #fcfdff;
  padding: 26px 22px; display: flex; flex-direction: column; gap: 8px; align-items: flex-start;
}
.ccal-empty-title { font-size: 15px; font-weight: 700; color: var(--text-primary, #1a1a1a); }
.ccal-empty-body { font-size: 13px; color: var(--text-secondary, #444); line-height: 1.55; max-width: 78ch; }
.ccal-error { display: flex; flex-direction: column; align-items: flex-start; gap: 12px; padding: 22px; }
.ccal-error-msg { font-size: 13.5px; color: #b91c1c; }

.ccal-spin {
  width: 13px; height: 13px; border-radius: 999px;
  border: 2px solid #dbeafe; border-top-color: #2563eb;
  display: inline-block; animation: ccal-spin .7s linear infinite;
}
.ccal-btn-primary .ccal-spin { border-color: rgba(255,255,255,.45); border-top-color: #fff; }
@keyframes ccal-spin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .ccal-spin { animation-duration: 2.4s; } }

/* ── responsive ──────────────────────────────────────────────────────────── */
/* The lead block does not shrink, so once the strip is narrow the vitals grid
   is squeezed to a sliver and the boxes pile on top of each other. Below this
   width the vitals take a full row of their own instead of competing for what
   is left beside the lead. */
@media (max-width: 1100px) {
  .ccal-cmd-lead { flex: 1 1 100%; }
  .ccal-cmd-vitals { flex: 1 0 100%; }
  .ccal-cmd-note { max-width: none; }
}
@media (max-width: 860px) {
  .ccal-cmd-vitals { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 720px) {
  .ccal-cmd-vitals { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ccal-head-actions { margin-left: 0; width: 100%; }
  .ccal-bar-spacer { margin-left: 0; }
}
@media (max-width: 620px) {
  .ccal-page { padding: 14px; gap: 14px; }
  .ccal-title { font-size: 19px; }
  .ccal-cmd { padding: 16px 18px; gap: 18px; }
  .ccal-cmd-num { font-size: 38px; }
  .ccal-cmd-lead { min-width: 0; }
  .ccal-select, .ccal-input { max-width: 100%; }
  .ccal-field { flex: 1 1 140px; }
  .ccal-drawer-body { padding: 16px; }
  .ccal-drawer-hd { padding: 16px 16px 12px; }
  .ccal-drawer-foot { padding: 12px 16px; }
  .ccal-planrow, .ccal-planhead, .ccal-mxrow { grid-template-columns: 20px 1fr 62px 62px; gap: 7px; padding-left: 10px; padding-right: 10px; }
  .ccal-artrow { grid-template-columns: auto 1fr; margin-left: 18px; }
  .ccal-setup-row { grid-template-columns: 1fr; }
  /* One slot per row rather than a two-up that would squeeze the platform
     pills onto three lines each. The sentence itself must never wrap oddly:
     it is the whole point of the panel. */
  .ccal-jobs { padding: 12px 13px; }
  .ccal-jobs-line { font-size: 13.5px; }
  .ccal-jobs-slot { flex: 1 1 100%; }
}

/* ═══════════════════════════════════════════════════════════════════════════
   Scheduling card — rendered by deliverable-dashboard.js on the
   sm-content-calendar dashboard. Lives here (not in deliverable-dashboard.css)
   because it belongs to this feature. Sits inside the dashboard's .dd-card, so
   it inherits that card's border, radius and padding and only styles its own
   internals.
   ═══════════════════════════════════════════════════════════════════════════ */

.ccal-sched-head { display: flex; align-items: center; gap: 10px; margin-bottom: 10px; flex-wrap: wrap; }
.ccal-sched-head .dd-card-title { margin: 0; }
.ccal-sched-actions { margin-left: auto; display: flex; align-items: center; gap: 8px; }

/* the gate panel: what must be true before a month can be scheduled */
.ccal-sched-gate {
  border: 1px solid var(--border-color, #e5e7eb);
  border-radius: 11px;
  padding: 11px 13px;
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-bottom: 12px;
  background: #fcfdff;
}
.ccal-sched-gate.is-pass { border-color: #b7e3c6; background: linear-gradient(180deg, #f6fdf8, #fff); }
.ccal-sched-gate.is-fail { border-color: #fcd9a5; background: linear-gradient(180deg, #fffbf3, #fff); }
.ccal-sched-checks { display: flex; flex-direction: column; gap: 6px; }
.ccal-sched-check { display: flex; align-items: flex-start; gap: 8px; font-size: 12.5px; line-height: 1.45; }
.ccal-sched-check-ic {
  width: 16px; height: 16px; border-radius: 999px; flex-shrink: 0; margin-top: 1px;
  display: inline-flex; align-items: center; justify-content: center;
  font-size: 10px; font-weight: 800; color: #fff;
}
.ccal-sched-check.ok .ccal-sched-check-ic { background: #16a34a; }
.ccal-sched-check.bad .ccal-sched-check-ic { background: #d97706; }
.ccal-sched-check.dead .ccal-sched-check-ic { background: #64748b; }
.ccal-sched-check-t { color: var(--text-secondary, #444); }
.ccal-sched-check-t b { color: var(--text-primary, #1a1a1a); font-weight: 700; }

.ccal-sched-why {
  font-size: 12px; color: #92600e; font-weight: 600; line-height: 1.45;
  background: #fef3c7; border-radius: 8px; padding: 8px 10px;
}
.ccal-sched-why.is-done { background: #dcfce7; color: #15803d; }
.ccal-sched-why.is-dead { background: #f1f5f9; color: #475569; }

/* the outcome of the last scheduling run, kept on screen */
.ccal-sched-result:empty { display: none; }
.ccal-sched-result {
  border: 1px solid var(--border-color, #e5e7eb); border-radius: 11px;
  padding: 11px 13px; margin-bottom: 12px;
  display: flex; flex-direction: column; gap: 7px;
}
.ccal-sched-result.is-ok { border-color: #b7e3c6; background: linear-gradient(180deg, #f6fdf8, #fff); }
.ccal-sched-result.is-warn { border-color: #fcd9a5; background: linear-gradient(180deg, #fffbf3, #fff); }
.ccal-sched-result.is-fail { border-color: #fca5a5; background: linear-gradient(180deg, #fff5f5, #fff); }
.ccal-sched-result-t { font-size: 12.5px; font-weight: 700; color: var(--text-primary, #1a1a1a); }
/* The line that says what did NOT go out. Deliberately the loudest thing in
   the panel: the counts above it read like success on their own. */
.ccal-sched-result-lead { font-size: 12.5px; font-weight: 700; color: #b91c1c; line-height: 1.45; }
.ccal-sched-result.is-warn .ccal-sched-result-lead { color: #92600e; }
.ccal-sched-result-note { font-size: 11.5px; color: var(--text-muted, #666); line-height: 1.45; }
.ccal-sched-result.is-ok .ccal-sched-result-note { color: #15803d; }
.ccal-sched-skiplist { display: flex; flex-direction: column; gap: 5px; }
.ccal-sched-skip { display: flex; align-items: baseline; gap: 8px; flex-wrap: wrap; font-size: 12px; }
.ccal-sched-skipwhy { color: var(--text-secondary, #444); line-height: 1.4; }

/* per-post missing-artwork list inside the card */
.ccal-sched-gaps { display: flex; flex-direction: column; gap: 5px; }
.ccal-sched-gap { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; font-size: 12.5px; }

/* the social_posts result table */
.ccal-sched-scroll { width: 100%; overflow-x: auto; border: 1px solid var(--border-color, #e5e7eb); border-radius: 10px; }
.ccal-sched-table { width: 100%; border-collapse: collapse; font-size: 12.5px; background: #fff; min-width: 640px; }
.ccal-sched-table th {
  background: #f8fafc; text-align: left; padding: 8px 10px;
  font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: .03em;
  color: var(--text-muted, #666); border-bottom: 1px solid var(--border-color, #e5e7eb); white-space: nowrap;
}
.ccal-sched-table td { padding: 8px 10px; border-bottom: 1px solid var(--border-color, #eef0f2); color: var(--text-secondary, #444); vertical-align: middle; }
.ccal-sched-table tr:last-child td { border-bottom: 0; }
.ccal-sched-table tbody tr:hover td { background: #fbfcfe; }
.ccal-sched-idx { font-weight: 800; color: #9ca3af; font-feature-settings: "tnum"; width: 40px; }
.ccal-sched-when { font-feature-settings: "tnum"; white-space: nowrap; }
.ccal-sched-link { color: #2563eb; text-decoration: none; font-weight: 600; }
.ccal-sched-link:hover { text-decoration: underline; }
.ccal-sched-err { color: #b91c1c; font-size: 11.5px; line-height: 1.4; display: block; max-width: 260px; }
.ccal-sched-rowact { text-align: right; white-space: nowrap; }
.ccal-sched-empty { font-size: 12.5px; color: var(--text-muted, #666); padding: 12px 2px; line-height: 1.5; }

/* per-platform caption overrides */
.ccal-sched-caps { margin-top: 14px; display: flex; flex-direction: column; gap: 8px; }
.ccal-sched-caps-hd { display: flex; align-items: center; gap: 8px; }
.ccal-sched-caps-help { font-size: 11.5px; color: var(--text-muted, #666); line-height: 1.45; }
.ccal-cap-post { border: 1px solid var(--border-color, #e5e7eb); border-radius: 10px; padding: 10px 12px; }
.ccal-cap-post-hd { display: flex; align-items: center; gap: 8px; margin-bottom: 8px; }
.ccal-cap-post-t { font-size: 11px; font-weight: 800; text-transform: uppercase; letter-spacing: .04em; color: #64748b; }
.ccal-cap-row { display: flex; align-items: flex-start; gap: 8px; margin-bottom: 8px; }
.ccal-cap-row:last-child { margin-bottom: 0; }
.ccal-cap-plat { flex: 0 0 108px; padding-top: 6px; }
.ccal-cap-ta {
  flex: 1; min-width: 0; box-sizing: border-box; resize: vertical; min-height: 46px;
  padding: 7px 9px; border: 1px solid var(--border-color, #d1d5db); border-radius: 8px;
  font: inherit; font-size: 12.5px; line-height: 1.45; background: #fff; color: var(--text-primary, #1a1a1a);
}
.ccal-cap-ta:focus { outline: none; border-color: #2563eb; box-shadow: 0 0 0 3px rgba(37,99,235,.12); }
.ccal-cap-ta.is-default { background: #fafbfc; color: #64748b; font-style: italic; }
.ccal-cap-reset {
  flex: 0 0 auto; align-self: flex-start; margin-top: 5px;
  border: 1px solid var(--border-color, #e5e7eb); background: #fff; color: #64748b;
  border-radius: 7px; padding: 4px 9px; font: inherit; font-size: 11.5px; font-weight: 600; cursor: pointer;
}
.ccal-cap-reset:hover { background: #f8fafc; }
.ccal-cap-reset:disabled { opacity: .45; cursor: default; }

@media (max-width: 620px) {
  .ccal-cap-row { flex-direction: column; }
  .ccal-cap-plat { flex: none; padding-top: 0; }
  .ccal-sched-actions { margin-left: 0; width: 100%; }
}

/* ── #134 dark mode overrides ───────────────────────────────────────────────
   Append-only; each rule repeats an existing selector prefixed with
   html[data-theme="dark"].

   Most of this file already reads its neutrals through var(--text-primary, …)
   / var(--border-color, …), and those flip on their own via the global token
   block in ui/css/theme.css. Only the bare literals are restated here.

   Platform, artwork-gate and scheduling pills keep their hue — each becomes a
   translucent tint of the same colour with a light saturated foreground — so a
   Facebook pill is still blue and a failed schedule is still red.
   --------------------------------------------------------------------------- */

/* Buttons */
html[data-theme="dark"] .ccal-btn:hover { background: #334155; border-color: #475569; }
html[data-theme="dark"] .ccal-btn-primary { background: #3b82f6; border-color: #3b82f6; }
html[data-theme="dark"] .ccal-btn-primary:hover,
html[data-theme="dark"] .ccal-btn-primary:disabled:hover {
  background: #2563eb;
  border-color: #2563eb;
}
html[data-theme="dark"] .ccal-btn-danger { color: #fca5a5; border-color: rgba(239, 68, 68, 0.40); }
html[data-theme="dark"] .ccal-btn-danger:hover {
  background: rgba(239, 68, 68, 0.14);
  border-color: rgba(239, 68, 68, 0.55);
}
html[data-theme="dark"] .ccal-btn-setup:hover { background: #334155; border-color: #64748b; }
html[data-theme="dark"] .ccal-setup-badge { background: #475569; color: #e2e8f0; }

/* Command strip. It is already dark, but #10141b sits BELOW the dark page
   background and so reads as a hole rather than a panel — it lifts a step and
   gains a hairline so it still reads as a raised strip. */
html[data-theme="dark"] .ccal-cmd {
  background:
    radial-gradient(120% 140% at 100% 0%, rgba(96, 165, 250, 0.20), transparent 55%),
    #1a2233;
  border-color: rgba(148, 163, 184, 0.14);
}

/* "the plan is a client property" band */
html[data-theme="dark"] .ccal-explain {
  border-color: rgba(96, 165, 250, 0.34);
  background: linear-gradient(180deg, rgba(96, 165, 250, 0.12), rgba(96, 165, 250, 0.04));
}
html[data-theme="dark"] .ccal-explain-ic { background: rgba(96, 165, 250, 0.20); color: #93c5fd; }
html[data-theme="dark"] .ccal-explain-b b { color: #93c5fd; }

/* Toolbar inputs */
html[data-theme="dark"] .ccal-input,
html[data-theme="dark"] .ccal-select,
html[data-theme="dark"] .ccal-search-input { background: #273449; }

/* Table */
html[data-theme="dark"] .ccal-tablewrap,
html[data-theme="dark"] .ccal-table,
html[data-theme="dark"] .ccal-sched-table { background: #1e293b; }
html[data-theme="dark"] .ccal-table th,
html[data-theme="dark"] .ccal-sched-table th { background: #273449; }
html[data-theme="dark"] .ccal-table tbody tr.ccal-row:hover td,
html[data-theme="dark"] .ccal-sched-table tbody tr:hover td { background: #334155; }

/* Platform pills */
html[data-theme="dark"] .ccal-plat { background: rgba(148, 163, 184, 0.16); color: #cbd5e1; }
html[data-theme="dark"] .ccal-plat-facebook  { background: rgba(59, 130, 246, 0.18); color: #93c5fd; }
html[data-theme="dark"] .ccal-plat-instagram { background: rgba(236, 72, 153, 0.18); color: #f9a8d4; }
html[data-theme="dark"] .ccal-plat-stories   { background: rgba(139, 92, 246, 0.20); color: #c4b5fd; }
html[data-theme="dark"] .ccal-plat-linkedin  { background: rgba(14, 165, 233, 0.18); color: #7dd3fc; }
html[data-theme="dark"] .ccal-plat-x,
html[data-theme="dark"] .ccal-plat-tiktok,
html[data-theme="dark"] .ccal-plat-threads   { background: rgba(148, 163, 184, 0.20); color: #e2e8f0; }
html[data-theme="dark"] .ccal-plat-youtube,
html[data-theme="dark"] .ccal-plat-pinterest { background: rgba(239, 68, 68, 0.18); color: #fca5a5; }
html[data-theme="dark"] .ccal-plat-noplan {
  background: transparent;
  border-color: #475569;
  color: #94a3b8;
}

/* Artwork readiness gate */
html[data-theme="dark"] .ccal-art-ready { background: rgba(34, 197, 94, 0.18); color: #86efac; }
html[data-theme="dark"] .ccal-art-gap { background: rgba(245, 158, 11, 0.18); color: #fcd34d; }
html[data-theme="dark"] .ccal-art-gap:hover { background: rgba(245, 158, 11, 0.30); }
html[data-theme="dark"] .ccal-art-none { background: rgba(148, 163, 184, 0.16); color: #cbd5e1; }
html[data-theme="dark"] .ccal-art-err { background: rgba(239, 68, 68, 0.18); color: #fca5a5; }

/* Team avatars */
html[data-theme="dark"] .ccal-av { background: #334155; color: #cbd5e1; }
html[data-theme="dark"] .ccal-av:hover { box-shadow: 0 2px 6px rgba(0, 0, 0, 0.5); }
html[data-theme="dark"] .ccal-av.is-empty {
  background: #1e293b;
  border-color: #475569;
  color: #94a3b8;
}

/* Expanded chase row */
html[data-theme="dark"] .ccal-detail-row td { background: rgba(245, 158, 11, 0.09); }
html[data-theme="dark"] .ccal-detail-t { color: #fcd34d; }
html[data-theme="dark"] .ccal-detail-idx { background: #475569; color: #e2e8f0; }
html[data-theme="dark"] .ccal-miss { background: rgba(239, 68, 68, 0.18); color: #fca5a5; }
html[data-theme="dark"] .ccal-miss-date { background: rgba(148, 163, 184, 0.18); color: #cbd5e1; }

/* Status + scheduling pills */
html[data-theme="dark"] .ccal-status { background: rgba(148, 163, 184, 0.16); color: #cbd5e1; }
html[data-theme="dark"] .ccal-sched-none { background: rgba(148, 163, 184, 0.16); color: #cbd5e1; }
html[data-theme="dark"] .ccal-sched-queued { background: rgba(14, 165, 233, 0.18); color: #7dd3fc; }
html[data-theme="dark"] .ccal-sched-scheduled { background: rgba(59, 130, 246, 0.18); color: #93c5fd; }
html[data-theme="dark"] .ccal-sched-published { background: rgba(34, 197, 94, 0.18); color: #86efac; }
html[data-theme="dark"] .ccal-sched-failed { background: rgba(239, 68, 68, 0.18); color: #fca5a5; }
html[data-theme="dark"] .ccal-sched-cancelled { background: rgba(148, 163, 184, 0.18); color: #cbd5e1; }
html[data-theme="dark"] .ccal-sched-reason { color: #fca5a5; }

/* Drawer */
html[data-theme="dark"] .ccal-drawer-backdrop { background: rgba(0, 0, 0, 0.62); }
html[data-theme="dark"] .ccal-drawer {
  background: #1e293b;
  box-shadow: -20px 0 50px rgba(0, 0, 0, 0.6);
}
html[data-theme="dark"] .ccal-drawer-foot { background: #1e293b; }
html[data-theme="dark"] .ccal-drawer-x { background: #273449; color: #cbd5e1; }
html[data-theme="dark"] .ccal-drawer-x:hover { background: #334155; }
html[data-theme="dark"] .ccal-drawer-msg.err { color: #fca5a5; }
html[data-theme="dark"] .ccal-drawer-msg.ok { color: #86efac; }

/* Plan / matrix / artwork rows */
html[data-theme="dark"] .ccal-planrow.is-off,
html[data-theme="dark"] .ccal-mxrow.is-off,
html[data-theme="dark"] .ccal-artrow.is-off { background: rgba(255, 255, 255, 0.03); }
html[data-theme="dark"] .ccal-artrow { background: rgba(255, 255, 255, 0.04); }
html[data-theme="dark"] .ccal-num-in,
html[data-theme="dark"] .ccal-artrow-in,
html[data-theme="dark"] .ccal-artrow-sel { background: #273449; }
html[data-theme="dark"] .ccal-num-in:disabled,
html[data-theme="dark"] .ccal-artrow-in:disabled,
html[data-theme="dark"] .ccal-artrow-sel:disabled { background: #172033; color: #64748b; }
html[data-theme="dark"] .ccal-artrow-note { color: #c4b5fd; }
html[data-theme="dark"] .ccal-artrow-note.is-broken { color: #fca5a5; }

/* Artwork-jobs + setup panels */
html[data-theme="dark"] .ccal-jobs,
html[data-theme="dark"] .ccal-setup-note {
  border-color: rgba(96, 165, 250, 0.34);
  background: linear-gradient(180deg, rgba(96, 165, 250, 0.12), rgba(96, 165, 250, 0.04));
}
html[data-theme="dark"] .ccal-jobs.has-warn {
  border-color: rgba(245, 158, 11, 0.38);
  background: linear-gradient(180deg, rgba(245, 158, 11, 0.13), rgba(245, 158, 11, 0.04));
}
html[data-theme="dark"] .ccal-jobs-t,
html[data-theme="dark"] .ccal-cap-post-t { color: #94a3b8; }
html[data-theme="dark"] .ccal-jobs-slot { background: #273449; }
html[data-theme="dark"] .ccal-jobs-warn { color: #fcd34d; }
html[data-theme="dark"] .ccal-setup-new { background: rgba(34, 197, 94, 0.18); color: #86efac; }
html[data-theme="dark"] .ccal-setup-skip { background: rgba(148, 163, 184, 0.16); color: #cbd5e1; }

/* Flash + empty / error states */
html[data-theme="dark"] .ccal-flash-ok {
  background: rgba(34, 197, 94, 0.14);
  border-color: rgba(34, 197, 94, 0.38);
  color: #86efac;
}
html[data-theme="dark"] .ccal-flash-err {
  background: rgba(239, 68, 68, 0.14);
  border-color: rgba(239, 68, 68, 0.40);
  color: #fca5a5;
}
html[data-theme="dark"] .ccal-empty-card {
  border-color: #475569;
  background: rgba(255, 255, 255, 0.03);
}
html[data-theme="dark"] .ccal-error-msg { color: #fca5a5; }
html[data-theme="dark"] .ccal-spin {
  border-color: rgba(96, 165, 250, 0.25);
  border-top-color: #60a5fa;
}

/* Scheduling card (rendered by deliverable-dashboard.js, styled here) */
html[data-theme="dark"] .ccal-sched-gate,
html[data-theme="dark"] .ccal-sched-result { background: rgba(255, 255, 255, 0.03); }
html[data-theme="dark"] .ccal-sched-gate.is-pass,
html[data-theme="dark"] .ccal-sched-result.is-ok {
  border-color: rgba(34, 197, 94, 0.38);
  background: linear-gradient(180deg, rgba(34, 197, 94, 0.14), rgba(34, 197, 94, 0.04));
}
html[data-theme="dark"] .ccal-sched-gate.is-fail,
html[data-theme="dark"] .ccal-sched-result.is-warn {
  border-color: rgba(245, 158, 11, 0.38);
  background: linear-gradient(180deg, rgba(245, 158, 11, 0.14), rgba(245, 158, 11, 0.04));
}
html[data-theme="dark"] .ccal-sched-result.is-fail {
  border-color: rgba(239, 68, 68, 0.40);
  background: linear-gradient(180deg, rgba(239, 68, 68, 0.14), rgba(239, 68, 68, 0.04));
}
html[data-theme="dark"] .ccal-sched-why { background: rgba(245, 158, 11, 0.18); color: #fcd34d; }
html[data-theme="dark"] .ccal-sched-why.is-done { background: rgba(34, 197, 94, 0.18); color: #86efac; }
html[data-theme="dark"] .ccal-sched-why.is-dead { background: rgba(148, 163, 184, 0.16); color: #cbd5e1; }
html[data-theme="dark"] .ccal-sched-result-lead { color: #fca5a5; }
html[data-theme="dark"] .ccal-sched-result.is-warn .ccal-sched-result-lead { color: #fcd34d; }
html[data-theme="dark"] .ccal-sched-result.is-ok .ccal-sched-result-note { color: #86efac; }
html[data-theme="dark"] .ccal-sched-link { color: #60a5fa; }
html[data-theme="dark"] .ccal-sched-err { color: #fca5a5; }

/* Per-platform caption overrides */
html[data-theme="dark"] .ccal-cap-ta { background: #273449; }
html[data-theme="dark"] .ccal-cap-ta.is-default { background: #172033; color: #94a3b8; }
html[data-theme="dark"] .ccal-cap-reset { background: #273449; color: #cbd5e1; }
html[data-theme="dark"] .ccal-cap-reset:hover { background: #334155; }