/* ══════════════════════════════════════════════════════════════════════════
   canon-multiday.css — the "Bill more than one day?" chooser.

   The modal is built by js/books/doc-from-job.js, which raises a draft from a
   scheduled job for BOTH the Books editors and the dispatch board's job
   inspector. Its markup therefore appears on pages that share no other
   stylesheet, so these rules moved out of canon-invoices.css and are loaded
   wherever that drafter is.
   ══════════════════════════════════════════════════════════════════════════ */

@layer components {
  :root.canon-v5 .bk-modal .md-day,
  :root.canon-v5 .bk-modal .md-opt {
    display: flex; align-items: center; gap: 11px; margin-top: 6px; padding: 10px 12px;
    border: 1px solid var(--c-border); border-radius: 8px; cursor: pointer; transition: background var(--dur) var(--ease);
  }
  :root.canon-v5 .bk-modal .md-opt { align-items: flex-start; }
  :root.canon-v5 .bk-modal .md-day:hover, :root.canon-v5 .bk-modal .md-opt:hover { background: var(--c-card-2); }
  /* The modal's field rule would draw these as text boxes. */
  :root.canon-v5 .bk-modal .md-day input,
  :root.canon-v5 .bk-modal .md-opt input {
    flex: none; width: 16px; height: 16px; margin: 0; padding: 0; border: 0; background: none; accent-color: var(--c-accent); cursor: pointer;
  }
  :root.canon-v5 .bk-modal .md-opt input { margin-top: 2px; }
  :root.canon-v5 .md-day-main { min-width: 0; }
  :root.canon-v5 .md-day-name { display: block; overflow: hidden; font-size: 13px; font-weight: 600; text-overflow: ellipsis; white-space: nowrap; }
  :root.canon-v5 .md-day-sub { display: block; font-size: 12px; color: var(--c-muted); font-variant-numeric: tabular-nums; }
  :root.canon-v5 .md-opt strong { display: block; font-size: 13px; font-weight: 600; }
  :root.canon-v5 .md-opt em { display: block; margin-top: 1px; font-size: 12px; font-style: normal; color: var(--c-muted); }
}