/* =====================================================================================
 *  Lobby display (.ld-root) — Queue Front Office Screen 4 (Phase 7). Verbatim Signal translation of
 *  Queue Front Office.dc.html lines 726-1076. Tokens (light + dark, the design's tokens()) are applied inline via
 *  rootStyle so they follow the shell's theme; every size is inline, as the design. This file carries only the hooks
 *  the ported markup needs: the font @import, the design's scrollbar and hover rules, focus rings, and the clerk's
 *  disabled controls (their reason shows on the parent's tip). The drawer's qfo-slide keyframes are global
 *  (queueAdminConfig.css).
 * ===================================================================================== */
@import url('https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@400;500;600;700;800&family=IBM+Plex+Mono:wght@400;500;600;700&display=swap');

.ld-root * { box-sizing: border-box; }
.ld-root ::selection { background: #C2CCFB; }
.ld-root button, .ld-root input, .ld-root select, .ld-root textarea { font-family: 'Plus Jakarta Sans', sans-serif; }
.ld-root select:focus, .ld-root input:focus, .ld-root textarea:focus { outline: 2px solid var(--brand-200); outline-offset: 1px; }
.ld-root button:focus-visible { outline: 2px solid var(--brand-400); outline-offset: 2px; border-radius: 8px; }
.ld-root .qfoScrl::-webkit-scrollbar { width: 10px; height: 10px; }
.ld-root .qfoScrl::-webkit-scrollbar-thumb { background: #cfd4e4; border-radius: 99px; border: 2px solid transparent; background-clip: content-box; }
.ld-root.dark .qfoScrl::-webkit-scrollbar-thumb { background: #38436F; }

/* the design's style-hover (card 753) */
.ld-root .ld-card:hover { border-color: var(--brand-200) !important; }

/* a control a clerk cannot use: greyed, and the hover reaches the parent that carries the reason (data-tip) */
.ld-root button:disabled, .ld-root select:disabled, .ld-root input:disabled { cursor: default; opacity: .55; pointer-events: none; }
.ld-root input[data-test="ld-dwell"]:disabled { opacity: 1; color: var(--text-2); }

/* the Monitor view's TV: as wide as the page, never taller than the window leaves room for */
.ld-root .ld-monbox { max-width: max(480px, calc((100vh - 230px) * 16 / 9)); }

@media (prefers-reduced-motion: reduce) { .ld-root * { animation-duration: .001ms !important; } }