/* Standalone demo styling; playback and stored configuration are unchanged. */
:root{--bg:#040b1c;--surface:#101a2d;--cyan:#559eff;--yellow:#a9cdff;--text:#e6efff;--muted:#b8cce8}
#app-viewport,#dashboard-canvas{background:radial-gradient(ellipse at 50% 4%,#142c70 0,transparent 56%),radial-gradient(ellipse at 52% 100%,#142e65 0,transparent 60%),#040b1c}
#dashboard-canvas{padding:48px 72px 114px;grid-template-columns:432px minmax(0,1fr);grid-template-rows:minmax(0,1fr) 148px;gap:24px 40px}
#sidebar{background:transparent;border:0;overflow:hidden}#sidebar:before{display:none}
#sidebar-content{padding:0;display:flex;flex-direction:column;gap:16px}
.sidebar-section,.sidebar-section:first-child,.sidebar-section:last-child{padding:14px 24px 16px;border:1px solid rgba(163,180,208,.48);border-radius:24px;background:linear-gradient(155deg,rgba(7,14,29,.78),rgba(15,23,35,.64) 56%,rgba(53,61,74,.75));box-shadow:inset 0 1px 0 #ffffff07;flex-shrink:0}
.section-heading{gap:12px;margin:0 0 9px;color:var(--muted);font-size:21px;line-height:1.45}
.section-heading svg{box-sizing:content-box;flex:0 0 22px;width:22px;height:22px;padding:8px;border:1px solid #b8cce8;border-radius:50%;background:#194ce0;color:#fff;stroke-width:1.5}
.section-body{font-size:14px;line-height:1.9;color:var(--muted)}
.section-clock{width:260px;margin-right:auto;min-height:128px;overflow:visible}.section-clock .section-heading,.clock-accent{display:none}
.clock-time{font-size:48px;letter-spacing:0;text-align:center;line-height:1.2;color:#f4f7ff}.clock-date{text-align:center;color:var(--cyan);font-size:19px;margin-top:9px}
.section-clock:after{content:'WAITCAST\Aنمایشگر هوشمند';white-space:pre;position:absolute;left:280px;top:34px;width:152px;text-align:center;color:var(--cyan);font-size:23px;line-height:1.6;font-weight:700;letter-spacing:1px}
.admissions-row{justify-content:flex-start;gap:8px}.admissions-count{font-size:44px}.admissions-unit{font-size:21px;color:var(--text)}
.queue-current{font-size:24px;line-height:1.4;margin:5px 0 12px;color:var(--cyan)}.queue-label{font-size:14px;margin-bottom:7px}.queue-list{gap:5px}
.queue-person{justify-content:flex-start;font-size:14px;color:var(--muted)}.queue-person svg{width:14px;height:14px}.host-name{font-size:23px;color:var(--cyan)}.host-specialty{font-size:14px}
#media-stage{border:1px solid #7f8ca7;border-radius:36px;background:#293243;padding:16px;box-shadow:0 16px 48px #0003}
#media-fallback,#media-image,.media-video{inset:16px;width:calc(100% - 32px);height:calc(100% - 32px);border-radius:22px;background:#071022;object-fit:contain}
#bottom-rail{border:1px solid rgba(163,180,208,.48);border-radius:24px;background:linear-gradient(155deg,#0b1428,#263552);box-shadow:inset 0 1px 0 #ffffff07}.rail-slide{background:transparent}.rail-slide img{object-fit:fill}
#ticker{position:absolute;left:0;right:0;bottom:0;height:80px;grid-column:auto;grid-row:auto;border-top:1px solid #7f8ca7;background:linear-gradient(165deg,#101e3b,#415b91)}
.ticker-badge{flex-basis:280px;font-size:25px;background:#1945e6;box-shadow:none;gap:15px}.ticker-badge svg{width:32px;height:32px}.ticker-item{font-size:20px;color:#dbe8ff}.ticker-dot{background:#b6d4ff}
/* Keep demo actions together outside the scaled television canvas. */
#demo-screen-actions{position:fixed;z-index:20;top:24px;right:24px;display:flex;align-items:stretch;gap:12px;direction:rtl}
#request-demo-button{position:static;min-width:228px;min-height:64px;height:auto;padding:12px 22px;gap:14px;border:1px solid #92baff;border-radius:18px;background:linear-gradient(135deg,#2867ed,#1645d7);color:#fff;font-size:21px;line-height:1.5;box-shadow:0 8px 28px #0006,0 0 0 5px #559eff14;transform:none}
#request-demo-button .request-copy{display:flex;flex-direction:column;align-items:flex-start}#request-demo-button small{font-size:12px;font-weight:400;color:#e1ebff}#request-demo-button svg{width:25px;height:25px;flex-shrink:0}
#request-demo-button:hover{background:#306ff3;transform:translateY(-2px)}#request-demo-button:focus-visible{outline:3px solid #fff;outline-offset:4px;background:#235bdd}
.demo-journey-settings{top:auto;bottom:12px;background:#111e36;color:#dbe8ff;border-color:#7f8ca7}
/* Palette-only overrides preserve the existing canvas, media and sidebar geometry. */
:root{--bg:var(--demo-background,#050B1D);--surface:var(--demo-surface,#0A1224);--cyan:var(--demo-primary,#559EFF);--text:var(--demo-text,#EEF4FF);--muted:var(--demo-muted,#B8CCE8)}
#app-viewport,#dashboard-canvas{background:radial-gradient(ellipse at 50% 4%,var(--demo-backgroundGlow,#172D69),transparent 60%),var(--bg)}
.sidebar-section,.sidebar-section:first-child,.sidebar-section:last-child{background:linear-gradient(155deg,var(--surface),var(--demo-surfaceEnd,#2A3241));border-color:var(--demo-border,#7F8CA7)}
.section-heading svg{background:var(--demo-accent,#1945E6);color:var(--demo-onAccent,#FFFFFF);border-color:var(--demo-border,#7F8CA7)}
.clock-time,.ticker-item{color:var(--text)}
#media-stage{border-color:var(--demo-border,#7F8CA7);background:var(--demo-frame,#293243)}
#bottom-rail{background:var(--surface);border-color:var(--demo-border,#7F8CA7)}
#ticker{background:linear-gradient(165deg,var(--demo-ticker,#101E3B),var(--demo-tickerEnd,#415B91));border-color:var(--demo-border,#7F8CA7)}
.ticker-badge{background:var(--demo-accent,#1945E6);color:var(--demo-onAccent,#FFFFFF)}
.sidebar-collapse-note{display:none}
.sidebar-section.sidebar-is-collapsed{width:100%;min-height:0;padding:8px 14px;border-radius:16px;overflow:hidden}
.sidebar-is-collapsed>:not(.section-heading):not(.sidebar-collapse-note){display:none!important}
.sidebar-is-collapsed .section-heading{display:flex!important;font-size:16px;line-height:1.3;margin:0;white-space:nowrap;overflow:hidden}
.sidebar-is-collapsed .section-heading svg{width:16px;height:16px;flex-basis:16px;padding:3px}
.sidebar-is-collapsed .sidebar-collapse-note{display:block;font-size:11px;line-height:1.4;color:var(--muted);margin-top:2px}
.sidebar-is-collapsed:after{display:none}
#demo-theme-toggle{position:static;display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;min-width:108px;min-height:48px;padding:10px 20px;font-family:inherit;font-weight:600;border:1px solid var(--demo-border,#7F8CA7);border-radius:12px;background:var(--surface);color:var(--text);cursor:pointer;font-size:17px}
#demo-theme-toggle:focus-visible{outline:3px solid var(--cyan);outline-offset:3px}


.sidebar-section.sidebar-is-collapsed{display:flex;align-items:center;gap:8px}
.sidebar-is-collapsed .section-heading{flex:1;min-width:0}
.sidebar-is-collapsed .sidebar-collapse-note{flex:0 0 auto;white-space:nowrap;margin:0}

.section-clock[data-content-language="en"]:after{content:"WAITCAST\A Smart display"}.section-clock[data-content-language="ar"]:after{content:"WAITCAST\A شاشة ذكية"}

/* Scale one coordinate system uniformly; never squash cards or rotate only media. */
#demo-screen-shell{position:fixed;inset:0;width:100%;height:100%;overflow:hidden}
#dashboard-canvas{transform:translate3d(-50%,-50%,0) scale(var(--canvas-scale,1));width:var(--canvas-w);height:var(--canvas-h)}
@media(orientation:portrait){#demo-screen-shell{inset:auto;left:50%;top:50%;width:100vh;height:100vw;width:100dvh;height:100dvw;transform:translate(-50%,-50%) rotate(90deg);transform-origin:center}}
@media(max-height:540px),(max-width:700px){#demo-screen-actions{top:8px;right:8px;gap:8px}#request-demo-button{min-width:0;min-height:36px;height:36px;padding:5px 10px;border-radius:10px;font-size:12px;gap:6px;box-shadow:0 3px 10px #0005}#request-demo-button small{display:none}#request-demo-button svg{width:16px;height:16px}#demo-theme-toggle{min-width:76px;min-height:36px;font-size:14px;padding:5px 12px}}



/* Match the original TV 5.0.0 composition; use one 16:9 media column. */
#dashboard-canvas{padding:0;grid-template-columns:var(--sidebar-w) minmax(0,1fr);grid-template-rows:var(--media-h) var(--rail-h);gap:0}
#sidebar-content{padding:24px 20px 18px;gap:10px}
.section-clock{width:244px;min-height:128px}.section-clock:after{left:264px;width:116px;font-size:20px}
#ticker{height:var(--ticker-h)}
#media-fallback,#media-image,.media-video{left:1.05263158%;top:1.05263158%;right:auto;bottom:auto;width:97.89473684%;height:97.89473684%;object-fit:contain}
.rail-slide img{object-fit:cover}
