/* Assistente ospiti (guest/index.html) · layout della chat + ritocchi in stile sito.
   Si carica dopo /assets/css/dlx-design-system.css, prenota.css,
   /assets/guest-sito/mockup-sito-tokens.css e guest-sito.css.
   I token del sito rimappano quelli del foglio condiviso: l'aspetto è quello
   di deluxeapartments.it (Cormorant, Satoshi, blu #1f3065, raggio 4 px). */

html,body{height:100%}
body.chat{display:flex;flex-direction:column;height:100vh;height:100dvh;overflow:hidden;background:var(--bg)}
.site-hd{position:relative;flex:none;height:64px;z-index:60}
.hd-ttl{display:flex;flex-direction:column;min-width:0;margin-left:var(--s-2);padding-left:var(--s-4);border-left:1px solid var(--border);line-height:1.2}
.hd-ttl b,.hd-ttl span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cw{flex:1;min-height:0;display:grid;grid-template-columns:260px minmax(0,1fr);max-width:1200px;width:100%;margin:0 auto}
.cats{border-right:1px solid var(--border);padding:var(--s-5) var(--s-4);display:flex;flex-direction:column;gap:4px;overflow:auto}
.cats h2{font-size:var(--fs-13);font-weight:var(--fw-medium);color:var(--text-2);margin:0 0 var(--s-2) 8px}
.cats button{display:flex;align-items:center;gap:var(--s-3);height:44px;padding:0 12px;border:0;border-radius:var(--r-md);background:transparent;color:var(--text);font-size:var(--fs-14);font-weight:var(--fw-medium);cursor:pointer;text-align:left;white-space:nowrap}
.cats button .ic{color:var(--text-2);font-size:20px}
.cats button:hover{background:var(--surface-2)}
.cats button[aria-pressed=true]{background:var(--navy-100);color:var(--navy-900)}
.cats button[aria-pressed=true] .ic{color:var(--accent)}
.cats .sep{height:1px;background:var(--border);margin:6px 8px}
.cats .who{margin-top:auto;padding:var(--s-3) 8px 0;border-top:1px solid var(--border);font-size:var(--fs-13);color:var(--text-2);line-height:1.5}
.cats .who b{display:block;color:var(--text);font-weight:var(--fw-medium);font-size:var(--fs-14)}
.cats[hidden]{display:none}
.cw.anon{grid-template-columns:minmax(0,1fr)}
.chatc{display:flex;flex-direction:column;min-height:0;min-width:0}
.ho{margin:var(--s-3) var(--s-5) 0}
.msgs{flex:1;min-height:0;overflow-y:auto;padding:var(--s-5);display:flex;flex-direction:column;gap:var(--s-3);max-width:820px;width:100%;margin:0 auto}
.day{align-self:center;font-size:var(--fs-12);color:var(--text-2);background:transparent;border-radius:0;padding:4px 0}
.m{display:flex;flex-direction:column;max-width:min(78%,600px)}
.m .b{padding:10px 14px;border-radius:16px;font-size:var(--fs-16);line-height:1.5;overflow-wrap:anywhere}
.m.a{align-self:flex-start}
.m.a .b{background:var(--surface);border:1px solid var(--border);border-bottom-left-radius:6px}
.m.u{align-self:flex-end}
.m.u .b{background:var(--navy-900);color:#fff;border-bottom-right-radius:6px}
.m.s{align-self:flex-start}
.m.s .b{background:var(--gold-50);border:1px solid #ecd9b3;border-bottom-left-radius:6px}
.m .w{font-size:var(--fs-12);color:var(--text-2);margin:4px 6px 0;display:flex;gap:6px;align-items:center}
.m.u .w{align-self:flex-end}
.m .w .ic{font-size:14px}
.m .b a{color:inherit;text-decoration:underline;font-weight:var(--fw-medium)}
.m .b ul{margin:6px 0 0;padding-left:20px}
.m .b .ph,.m .b .photo-wrap{margin-top:8px;border-radius:var(--r-md);overflow:hidden;border:1px solid var(--border)}
.m .b .ph img,.m .b .photo-wrap img{display:block;width:100%;height:auto;cursor:pointer}
.m .b .ph span,.m .b .photo-cap{display:block;padding:6px 10px;font-size:var(--fs-13);color:var(--text-2);background:var(--surface)}
.m .b .vm,.m .b .audio-meta{display:flex;align-items:center;gap:6px;margin-top:6px;font-size:var(--fs-13);opacity:.86}
.m .b .vm .ic,.m .b .audio-meta svg{width:16px;height:16px;font-size:16px}
.m .b audio.reply-tts{display:block;width:100%;max-width:240px;margin-top:8px;height:36px}
.typing{display:inline-flex;gap:4px;padding:4px 0}
.typing i{width:7px;height:7px;border-radius:50%;background:var(--text-2);animation:tp 1.2s infinite}
.typing i:nth-child(2){animation-delay:.2s}
.typing i:nth-child(3){animation-delay:.4s}
@keyframes tp{0%,60%,100%{opacity:.3}30%{opacity:1}}
.thumbs{display:flex;gap:var(--s-2);padding:0 var(--s-5) var(--s-2);max-width:820px;width:100%;margin:0 auto}
.thumbs:empty{display:none}
.thumbs .t{position:relative;width:64px;height:64px;border-radius:var(--r-md);overflow:hidden;border:1px solid var(--border);background:var(--surface-2)}
.thumbs .t img{width:100%;height:100%;object-fit:cover;display:block}
.thumbs .t button{position:absolute;top:2px;right:2px;width:24px;height:24px;border-radius:50%;border:0;background:var(--ink-900);color:#fff;display:grid;place-items:center;cursor:pointer}
.thumbs .t button .ic{font-size:16px}
.thumbs .t.up::after{content:'';position:absolute;inset:0;background:rgba(255,255,255,.6)}
.thumbs .t.err{box-shadow:inset 0 0 0 2px var(--bad)}
.comp{position:relative;flex:none;border-top:1px solid var(--border);background:var(--surface);padding:var(--s-3) var(--s-5) calc(var(--s-3) + env(safe-area-inset-bottom))}
.comp-in{max-width:820px;margin:0 auto;display:flex;align-items:flex-end;gap:var(--s-2)}
.comp .ib{flex:none;width:44px;height:44px;border-radius:50%;border:0;background:transparent;color:var(--text-2);display:grid;place-items:center;cursor:pointer}
.comp .ib:hover{background:var(--surface-2);color:var(--text)}
.comp .ib.mic-blocked{color:var(--bad)}
.comp textarea{flex:1;min-width:0;min-height:44px;max-height:140px;resize:none;padding:10px 14px;border:1px solid var(--border-input);border-radius:22px;font-size:16px;line-height:1.4;background:var(--surface);color:var(--text)}
.comp textarea:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}
.comp .send{flex:none;width:44px;height:44px;border-radius:50%;border:0;background:var(--accent);color:#fff;display:grid;place-items:center;cursor:pointer}
.comp .send:disabled{background:var(--surface-2);color:var(--text-2);cursor:not-allowed}
.comp .rec{flex:1;min-width:0;height:44px;display:none;align-items:center;gap:var(--s-3);padding:0 14px;border-radius:22px;background:var(--bad-bg);color:var(--bad);font-size:var(--fs-14);font-weight:var(--fw-medium)}
.comp .rec .dot{width:10px;height:10px;border-radius:50%;background:var(--bad);animation:tp 1.2s infinite}
.comp .rec .tm{margin-left:auto;font-variant-numeric:tabular-nums}
.comp .rec .tm.warning{color:var(--warn)}
.comp .rec .tm.danger{font-weight:700}
.comp .proc{flex:1;min-width:0;height:44px;display:none;align-items:center;gap:var(--s-2);padding:0 14px;border-radius:22px;background:var(--surface-2);color:var(--text-2);font-size:var(--fs-14)}
.comp .proc .spinner{width:16px;height:16px}
.comp[data-st=rec] textarea,.comp[data-st=rec] #photoBtn,.comp[data-st=rec] #mic,.comp[data-st=rec] #send,.comp[data-st=proc] textarea,.comp[data-st=proc] #photoBtn,.comp[data-st=proc] #mic,.comp[data-st=proc] #send{display:none}
.comp[data-st=rec] .rec,.comp[data-st=proc] .proc{display:flex}
.comp .only-rec{display:none}
.comp[data-st=rec] .only-rec{display:grid}
.comp .stop{background:var(--bad);color:#fff}
.comp .legal{max-width:820px;margin:6px auto 0;font-size:var(--fs-12);color:var(--text-2);text-align:center}
.comp .toast{position:absolute;left:50%;bottom:calc(100% - 6px);transform:translateX(-50%);z-index:6;max-width:min(440px,calc(100% - 24px));display:flex;align-items:flex-start;gap:8px;padding:10px 12px;background:var(--surface);color:var(--text);border:1px solid var(--border);border-left:2px solid var(--bad);border-radius:var(--site-r,4px);font-size:14px;line-height:1.4;box-shadow:var(--shadow-pop)}
.comp .toast svg{width:16px;height:16px;flex:none;color:var(--bad)}
.sheet-bg{position:fixed;inset:0;z-index:80;background:var(--overlay);display:flex;align-items:flex-end;justify-content:center}
.sheet-bg[hidden]{display:none}
.sheet{width:100%;max-width:440px;background:var(--surface);border-radius:var(--r-lg) var(--r-lg) 0 0;padding:var(--s-5) var(--s-4) calc(var(--s-4) + env(safe-area-inset-bottom))}
.sheet h2{margin:0 0 4px;font-size:var(--fs-16);font-weight:var(--fw-strong)}
.sheet p{margin:0 0 var(--s-4);font-size:var(--fs-14);color:var(--text-2)}
.sheet .btn{width:100%;height:48px;justify-content:flex-start;margin-bottom:var(--s-2);font-size:var(--fs-16)}
.sheet .btn.ghost{justify-content:center}
@media (min-width:761px){
  .sheet-bg{align-items:center}
  .sheet{border-radius:var(--r-lg)}
}
@media (max-width:760px){
  .site-hd{height:56px}
  .hd-in .logo img{height:28px}
  .hd-ttl{padding-left:var(--s-3);margin-left:0}
  .cw{grid-template-columns:minmax(0,1fr);grid-template-rows:auto minmax(0,1fr)}
  .cats{flex-direction:row;border-right:0;border-bottom:1px solid var(--border);padding:var(--s-2) var(--s-4);overflow-x:auto;gap:var(--s-2);scrollbar-width:none;background:var(--surface)}
  .cats::-webkit-scrollbar{display:none}
  .cats h2,.cats .sep,.cats .who{display:none}
  .cats button{height:36px;flex:none;border:1px solid var(--border-strong);border-radius:var(--r-pill);padding:0 12px;font-size:var(--fs-14);gap:6px;background:var(--surface)}
  .cats button .ic{font-size:18px}
  .cats button[aria-pressed=true]{border-color:var(--navy-900);background:var(--navy-900);color:#fff}
  .cats button[aria-pressed=true] .ic{color:#fff}
  .msgs{padding:var(--s-4)}
  .m{max-width:88%}
  .ho,.link-note{margin:var(--s-2) var(--s-4) 0;width:calc(100% - 2 * var(--s-4))}
  .comp{padding:var(--s-2) var(--s-3) calc(var(--s-2) + env(safe-area-inset-bottom))}
  .comp .ib{width:40px}
  .thumbs{padding:0 var(--s-4) var(--s-2)}
}

/* Ritocchi del sito (sopra il layout). Il raggio, i blu e i filetti arrivano dai token. */
.cw.anon{grid-template-rows:minmax(0,1fr)}
.hd-ttl{border-left-color:var(--site-hairline)}
.hd-ttl b{font:600 19px/1.2 var(--site-serif);color:var(--site-ink)}
.hd-ttl span{font-size:13px;color:var(--site-muted)}
.cats{background:var(--site-canvas)}
.cats h2{font:500 12px/1.2 var(--site-sans);letter-spacing:.14em;text-transform:uppercase;color:var(--site-muted);margin:0 0 12px 12px}
.cats button{border-radius:var(--site-r);font:500 15px/1.2 var(--site-sans);color:var(--site-ink);position:relative}
.cats button:hover{background:var(--site-stone)}
.cats button[aria-pressed=true]{background:var(--site-surface);color:var(--site-ink);box-shadow:inset 2px 0 0 var(--site-brass)}
.cats button[aria-pressed=true] .ic{color:var(--site-primary)}
.cats .who b{font:600 20px/1.25 var(--site-serif);color:var(--site-ink);margin-bottom:2px}
.msgs{gap:16px}
.day{font:500 12px/1.2 var(--site-sans);letter-spacing:.14em;text-transform:uppercase;color:var(--site-muted)}
.m .b{border-radius:var(--site-r);font-size:16px;line-height:1.6;padding:12px 16px;color:var(--site-body)}
.m.a .b{background:var(--site-surface);border:1px solid var(--site-hairline);border-bottom-left-radius:var(--site-r)}
.m.u .b{background:var(--site-primary);color:var(--site-on-primary);border-bottom-right-radius:var(--site-r)}
.m.s .b{background:var(--site-stone);border:0;box-shadow:inset 2px 0 0 var(--site-brass);border-bottom-left-radius:var(--site-r);color:var(--site-body)}
.m.a .b strong,.m.s .b strong{color:var(--site-ink)}
.m.a .b a,.m.s .b a{color:var(--site-primary);text-underline-offset:3px}
.m.u .b a{color:var(--site-on-primary)}
.m .w{font-size:12px;color:var(--site-muted)}
.m.s .w .ic{color:var(--site-brass)}
.alert.info.ho{background:var(--site-stone);color:var(--site-ink);box-shadow:inset 2px 0 0 var(--site-brass)}
.alert.info.ho .ic{color:var(--site-brass)}
.link-note{align-items:flex-start;margin:12px 20px 0;max-width:820px;width:calc(100% - 40px);align-self:center;line-height:1.5;overflow-wrap:anywhere;color:var(--site-ink)}
.alert.warn.link-note,.alert.info.link-note{color:var(--site-ink)}
.link-note.warn{background:var(--warn-bg);box-shadow:inset 2px 0 0 var(--site-brass)}
.link-note.info{background:var(--site-stone);box-shadow:inset 2px 0 0 var(--site-brass)}
.link-note .ic{color:var(--site-brass);flex:none;margin-top:2px}
.link-note b{color:var(--site-ink)}
.link-note .ln-en,.link-note .ln-c{display:block;margin-top:6px;color:var(--site-body)}
.link-note a{color:var(--site-primary);text-decoration:underline;text-underline-offset:3px}
.comp{background:rgba(250,250,248,.96);border-top-color:var(--site-hairline)}
.comp textarea{border-radius:var(--site-r);border-color:var(--site-muted-soft);font-family:var(--site-sans)}
.comp textarea:focus{border-color:var(--site-primary);box-shadow:0 0 0 1px var(--site-primary)}
.comp .ib{border-radius:var(--site-r);color:var(--site-muted)}
.comp .ib:hover{background:var(--site-stone);color:var(--site-ink)}
.comp .send{border-radius:var(--site-r);background:var(--site-primary)}
.comp .send:hover:not(:disabled){background:var(--site-primary-active)}
.comp .send:disabled{background:var(--site-hairline);color:var(--site-muted)}
.comp .rec,.comp .proc{border-radius:var(--site-r)}
.comp .legal{color:var(--site-muted)}
.thumbs .t{border-radius:var(--site-r)}
.sheet{border-radius:var(--site-r) var(--site-r) 0 0}
.sheet h2{font:600 24px/1.2 var(--site-serif);color:var(--site-ink)}
.sheet .btn{border-color:var(--site-hairline-strong)}
.sheet .btn:hover{border-color:var(--site-ink)}
@media (min-width:761px){.sheet{border-radius:var(--site-r)}}
@media (max-width:760px){
  .site-hd{height:56px}
  .hd-in .logo img{height:18px}
  .hd-ttl b{font-size:17px}
  .cats{background:var(--site-canvas)}
  .cats button{border-radius:999px;border-color:var(--site-hairline-strong);background:transparent;font-size:14px;box-shadow:none}
  .cats button[aria-pressed=true]{background:var(--site-ink);border-color:var(--site-ink);color:var(--site-on-primary);box-shadow:none}
  .cats button[aria-pressed=true] .ic{color:var(--site-on-primary)}
}