/* LIVE ENGINE STYLES - do not edit per hotel. Managed by the live-engine repo (scripts/sync-live.ps1). */
/* Live duty-manager call: the administrator's video replaces the avatar (live-reception.mjs). */
/* During a live call the persona row stays visible: the tapped talk button docks into it
   (male, female and Tap-to-say centered together relative to the avatar/video window),
   while the portrait/canvas/iframe wrappers and the kind badge stay hidden. */
#reception-avatar[data-live] > :not(.live-layer):not(.avatar-persona-controls) { visibility:hidden; }
/* Expanded state: the persona row sits inside the window at the bottom - during a call the
   control strip occupies that exact strip, so the row lifts above it (same no-overlap rule
   as the compact state, where the row already lives below the window). */
#reception-avatar[data-live][data-size="expanded"] .avatar-persona-controls { bottom: 60px; }
/* The video window keeps the avatar card's EXACT size in both the compact and the expanded
   state (the owner's rule): the layer ends at the card's bottom edge and the control strip
   overlays the video's bottom INSIDE the window - nothing hangs below, so the persona row
   and the size toggle keep their normal place under the window and never collide with the
   video's own buttons. */
.live-layer { position:absolute; inset:0; z-index:20; display:flex; flex-direction:column; align-items:center; justify-content:flex-end; gap:8px; padding:10px; border-radius:inherit; overflow:hidden; background:rgba(10,14,24,0.42); backdrop-filter:blur(7px) saturate(140%); -webkit-backdrop-filter:blur(7px) saturate(140%); }
.live-layer video { position:absolute; inset:0; width:100%; height:100%; object-fit:contain; background:transparent; }
.live-layer video[hidden] { display:none; }
.live-status { position:relative; margin:auto 0; padding:0 6px; color:#f3ecd2; font-size:14px; line-height:1.35; text-align:center; animation:live-pulse 1.6s ease-in-out infinite; }
.live-end,.live-sound { position:relative; padding:8px 18px; border:none; border-radius:18px; font-weight:700; cursor:pointer; }
.live-end { background:#d9463b; color:#fff; }
.live-sound { background:#f3ecd2; color:#111; }

/* Tap-to-speak button: neutral while the mic is closed, glowing green while the guest speaks. */
/* The controls strip overlays the video's bottom edge INSIDE the window (the window keeps
   the avatar card's exact size - nothing extends below it). */
.live-controls { position:absolute; left:0; right:0; bottom:0; height:56px; z-index:2; display:flex; align-items:center; justify-content:center; gap:10px; padding:6px 10px; background:rgba(10,14,24,0.42); backdrop-filter:blur(7px) saturate(140%); -webkit-backdrop-filter:blur(7px) saturate(140%); border-top:1px solid rgba(170,132,83,0.55); }
.live-controls button { flex:1 1 0; max-width:230px; margin:0; padding:8px 10px; }
.live-talk.on { background:#3f9d4e; color:#fff; }
/* Mic still closed during an active call: the button pulses so the guest can't miss that the words go nowhere. */
.live-talk.pulse { animation: live-pulse 1.1s ease-in-out infinite; }

/* Pause gate: 15 s without guest activity - the stand asks the guest to continue; the
   Tap-to-say button counts 10 -> 0 and a miss force-ends the conversation (anti-waste).
   Over the live layer the gate covers only the video area, so the End button stays clickable. */
.pause-gate { position:absolute; inset:0; z-index:40; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:16px; padding:16px; border-radius:inherit; background:rgba(10,14,24,0.55); }
.live-layer .pause-gate { inset:0 0 56px 0; }
.pause-gate[hidden] { display:none; }
.pause-gate p { margin:0; max-width:92%; color:#f3ecd2; font:600 15px/1.4 Arial,Helvetica,sans-serif; text-align:center; text-shadow:0 1px 8px #000c; }
.pause-tap { position:relative; min-height:48px; padding:12px 22px; border-radius:24px; border:2px solid #f0d99e; background:linear-gradient(180deg,#f3dc9c,#d9b25c); color:#16120a; font:700 16px/1.2 Arial,Helvetica,sans-serif; cursor:pointer; box-shadow:0 0 0 0 rgba(240,217,158,.7),0 6px 20px rgba(0,0,0,.45); animation:greeting-glow 1.4s ease-out infinite; }
@media (prefers-reduced-motion: reduce) { .pause-tap { animation:none; } }

/* Premium tap-to-start: a square icon button (a mic glyph; the full localized label lives
   in title/aria-label) sized with the avatar button scale --avatar-btn, sitting in the
   bottom-START corner of the window, one row with the gender buttons and the size toggle.
   A soft glow invites the tap; no Tavus minutes burn until then. */
.premium-tap { position:absolute; inset-inline-start:4px; bottom:4px; z-index:7; width:var(--avatar-btn,44px); height:var(--avatar-btn,44px); min-width:0; min-height:0; padding:0; border-radius:12px; border:1px solid #d9bc78; background:#252c20; color:#f0d99e; font:700 calc(var(--avatar-btn,44px) * 0.45)/1 Arial,Helvetica,sans-serif; cursor:pointer; animation:greeting-glow 1.4s ease-out infinite; }
.premium-tap[hidden] { display:none; }
@media (prefers-reduced-motion: reduce) { .premium-tap { animation:none; } }

/* Premium conversation: the custom daily-js call object renders the PAL's stream into our
   own <video> (no Daily UI at all - instant join, the prebuilt screens never load). The
   landscape 16:9 stream is center-cropped into the portrait slot by object-fit. */
.avatar-tavus-video { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; border-radius:inherit; background:#000; z-index:1; }
.avatar-tavus-video[hidden] { display:none; }

/* Premium recorded greeting (Tavus Videos API): the PAL's welcome clip plays in the slot
   while the room is closed; a tap on it opens the room. Served same-origin with immutable
   caching, so repeat greetings come from the browser cache. z-index 3 sits ABOVE the DH
   character (canvas 1 / iframe 2, which re-append on every gender switch and would else
   cover the clip again) and below the tap pill (5). The opaque background makes the
   default concierge disappear for the duration of the clip. */
.avatar-greeting-video { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; border-radius:inherit; background:#000; z-index:3; }
.avatar-greeting-video[hidden] { display:none; }
.live-layer.live-floating { position:fixed; inset:auto; left:50%; top:50%; transform:translate(-50%,-50%); width:min(320px,86vw); height:calc(min(480px, 129vw) + 56px); border:1px solid rgba(170,132,83,0.55); border-radius:16px; box-shadow:0 10px 40px #000a; }
.live-layer.live-floating video { inset:0 0 56px 0; height:auto; }
.live-indicator { position:fixed; top:10px; right:12px; z-index:50; padding:4px 10px; border-radius:12px; background:#000a; color:#ff5b4f; font:600 12px/1.4 system-ui,sans-serif; pointer-events:none; }
.live-indicator[hidden],.live-layer[hidden] { display:none; }
@keyframes live-pulse { 50% { opacity:.55; } }
@media (max-width:650px) { #reception-avatar[data-live] { width:208px; height:312px; } .live-status { font-size:12px; } .live-end { padding:6px 12px; } }

/* The microphone turns green while recording (the auto-greeting tells guests to wait for green). */
.voice-btn.recording { background:#2fa84f !important; border-color:#2fa84f !important; color:#fff !important; }
/* Auto-greeting: stand switch + glowing "tap me" prompt when Chrome still blocks sound. */
.greeting-control[hidden] { display:none; }
.greeting-tap { position:absolute; left:50%; bottom:calc(100% + 10px); z-index:30; transform:translateX(-50%); white-space:nowrap; padding:10px 18px; border-radius:24px; border:2px solid #f0d99e; background:linear-gradient(180deg,#f3dc9c,#d9b25c); color:#16120a; font:700 16px/1.2 Arial,Helvetica,sans-serif; text-transform:none; letter-spacing:0; cursor:pointer; box-shadow:0 0 0 0 rgba(240,217,158,.7),0 6px 20px rgba(0,0,0,.45); animation:greeting-glow 1.4s ease-out infinite, greeting-wiggle 1.6s ease-in-out infinite; }
.greeting-tap-floating { position:fixed; left:50%; top:22%; bottom:auto; }
.greeting-tap[hidden] { display:none; }
@keyframes greeting-glow { 0% { box-shadow:0 0 0 0 rgba(240,217,158,.75),0 6px 20px rgba(0,0,0,.45); } 70% { box-shadow:0 0 0 18px rgba(240,217,158,0),0 6px 20px rgba(0,0,0,.45); } 100% { box-shadow:0 0 0 0 rgba(240,217,158,0),0 6px 20px rgba(0,0,0,.45); } }
@keyframes greeting-wiggle { 0%,55%,100% { transform:translateX(-50%) rotate(0); } 60% { transform:translateX(-50%) rotate(-6deg) scale(1.05); } 66% { transform:translateX(-50%) rotate(6deg) scale(1.05); } 72% { transform:translateX(-50%) rotate(-4deg); } 78% { transform:translateX(-50%) rotate(3deg); } 84% { transform:translateX(-50%) rotate(0); } }
@media (prefers-reduced-motion: reduce) { .greeting-tap { animation:none; } }

/* Installed app: close button + confirmation (app-close.mjs) */
.app-close { position:fixed; top:max(3px, env(safe-area-inset-top)); inset-inline-end:3px; z-index:70; width:28px; height:28px; min-height:0; padding:0; border-radius:50%; border:1px solid #555f46; background:rgba(21,24,15,.75); color:#d2d5c9; font-size:14px; line-height:1; cursor:pointer; }
.app-close-panel { position:fixed; top:50%; left:50%; transform:translate(-50%,-50%); z-index:80; width:min(340px, calc(100vw - 32px)); padding:18px; border-radius:16px; border:1px solid #626951; background:#1d211a; color:#f3ecd2; box-shadow:0 12px 40px #000c; text-align:center; }
.app-close-panel[hidden], .app-close-panel [hidden] { display:none; }
.app-close-panel p { margin:0 0 14px; font-size:16px; line-height:1.4; }
.app-close-panel .app-close-hint { color:#d9bc78; font-size:14px; }
.app-close-panel div { display:flex; gap:10px; justify-content:center; }
.app-close-panel button { flex:1; min-height:44px; border-radius:12px; padding:8px 12px; }
.app-close-yes { background:#d9463b !important; border-color:#d9463b !important; color:#fff !important; }
.greeting-stats { position:fixed; left:6px; bottom:6px; z-index:90; white-space:pre; font:bold 10px/1.35 monospace; color:#fff; background:rgba(0,0,0,.8); padding:3px 6px; border-radius:4px; pointer-events:none; direction:ltr; }

/* Call translation on the stand: badge + subtitles of the administrator's translated speech */
.live-translate { position:absolute; top:8px; inset-inline-start:8px; z-index:2; padding:3px 9px; border-radius:10px; background:#000a; color:#f3ecd2; font:600 11px/1.4 Arial,Helvetica,sans-serif; }
.live-translate[data-state="connecting"], .live-translate[data-state="error"] { color:#d9bc78; animation:live-pulse 1.6s ease-in-out infinite; }
.live-translate[data-state="speaking"] { color:#7ee08f; }
.live-translate[hidden] { display:none; }
.live-caption { position:relative; z-index:2; align-self:stretch; margin:0; padding:6px 10px; border-radius:10px; background:rgba(0,0,0,.65); color:#fff; font-size:14px; line-height:1.35; text-align:center; max-height:40%; overflow:hidden; }
.live-caption[hidden] { display:none; }
.live-mic-muted { position:absolute; top:8px; inset-inline-end:8px; z-index:3; padding:4px 10px; border-radius:10px; background:#ff5b4f; color:#fff; font:600 11px/1.4 Arial,Helvetica,sans-serif; pointer-events:none; }
.live-mic-muted[hidden] { display:none; }

/* Administrator signed in on a browser that is not the stand: explanation + one-tap registration */
.stand-offer { position:fixed; left:50%; bottom:10px; transform:translateX(-50%); z-index:65; display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:center; width:min(720px, calc(100vw - 20px)); padding:10px 12px; border-radius:14px; border:1px solid #626951; background:#1d211a; color:#f3ecd2; font-size:13px; box-shadow:0 8px 30px #000a; }
.stand-offer span { flex:1 1 260px; }
.stand-offer button { min-height:36px; padding:6px 14px; border-radius:12px; }
.stand-offer .stand-offer-close { min-width:36px; padding:0; background:transparent; color:#d2d5c9; border:1px solid #555f46; }

/* Live-call subtitles shown as dialog messages */
.live-admin-message::before { content:"👤 " attr(data-label); display:block; margin-bottom:4px; font-size:11px; letter-spacing:.04em; text-transform:uppercase; color:#c9b37e; }