/* bulk-select S3: shared lightweight modal (.v05-modal). * * A centred dialog over a scrim, reused by the orders-list assign-transporter * modal (S3) and the read-only order preview modal (S4). Behaviour (open/close, * role=dialog + aria-modal, focus trap, Escape, focus restore, scroll lock) * lives in modal.js; this file is presentation only. * * Tokens only (--enroute-*, --bg-*, --fg-*, --border-*, --radius-*, --shadow-*, * --focus-ring). No literals. * * Markup contract: * */ /* modal.js adds this to while a modal is open (scroll-lock). */ body.v05-modal-open { overflow: hidden; } .v05-modal { position: fixed; inset: 0; z-index: 1000; display: flex; align-items: center; justify-content: center; padding: 16px; background: rgba(10, 13, 11, 0.48); /* --enroute-ink-900 @ 48% scrim */ } .v05-modal[hidden] { display: none; } .v05-modal__dialog { width: 100%; max-width: 460px; max-height: calc(100vh - 32px); display: flex; flex-direction: column; background: var(--bg-paper); border-radius: var(--radius-lg); box-shadow: var(--shadow-md); overflow: hidden; } .v05-modal__head { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 16px 18px; border-bottom: 1px solid var(--border-1); } .v05-modal__title { margin: 0; font-size: 16px; font-weight: 600; letter-spacing: -0.01em; color: var(--fg-1); } .v05-modal__close { appearance: none; cursor: pointer; display: inline-flex; align-items: center; justify-content: center; width: 44px; /* ADR 0005: >=44px tap target */ height: 44px; margin: -10px -10px -10px 0; /* keep the visual box tight while the hit area stays 44px */ border: 0; border-radius: var(--radius-md); background: transparent; color: var(--fg-3); transition: background 100ms, color 100ms; } .v05-modal__close:hover { background: var(--enroute-ink-100); color: var(--fg-1); } .v05-modal__close:focus-visible { outline: 0; box-shadow: var(--focus-ring); } .v05-modal__close svg { width: 16px; height: 16px; } .v05-modal__body { padding: 18px; overflow-y: auto; color: var(--fg-2); font-size: 14px; line-height: 1.5; } .v05-modal__foot { display: flex; align-items: center; justify-content: flex-end; gap: 8px; padding: 14px 18px; border-top: 1px solid var(--border-1); background: var(--bg-canvas); } /* doc-preview-release-boxes: the document PREVIEW modal is wide — it frames a PDF or image and should take up a good portion of the screen while keeping scrim margins. Relative units so it scales to the viewport; capped so it never grows absurd on ultra-wide displays. Tokens only. */ .v05-modal--preview .v05-modal__dialog { max-width: min(1400px, 94vw); } /* schedule-board draft modal: wider than the 460px default so the deliveries repeater (location · product · volume · remove) fits on one row without clipping. Board-local layout lives in pages/calendar.css. */ .v05-modal--draft .v05-modal__dialog { max-width: min(660px, 94vw); } .doc-preview__frame { width: 100%; height: min(84vh, 1200px); border: 0; } .doc-preview__img { max-width: 100%; max-height: min(84vh, 1200px); display: block; margin: 0 auto; } .doc-preview__fallback { margin: 0; padding: var(--space-8) var(--space-4); text-align: center; color: var(--fg-3); } /* pdf-js-preview (ADR 0050): PDF.js renders each page onto its own