.zb-widget{--zb-accent:var(--zp-accent,#1c2840);font-family:var(--zp-font,system-ui,-apple-system,Segoe UI,Roboto,sans-serif);max-width:1100px;margin:0 auto}
.zb-bar{display:flex;gap:10px;align-items:stretch;flex-wrap:wrap}
.zb-cell{position:relative;flex:1;min-width:170px;background:var(--zp-bg-soft,#f5f6f8);border:1px solid var(--zp-border,#e2e6ed);border-radius:8px;padding:10px 40px 10px 14px}
.zb-label{font-size:12px;color:var(--zp-muted,#5c7794);margin-bottom:2px}
.zb-date-disp{font-size:17px;font-weight:700;color:var(--zp-text,#1c2032)}
/* Il campo data nativo sta sotto il numero grande, invisibile: col mouse si
   usa il calendario, ma è QUESTO che la tastiera trova e con cui si scrive la
   data. Invisibile e col fuoco sopra sarebbe peggio di niente — non si vede
   cosa si sta scrivendo — quindi quando prende il fuoco torna visibile. */
.zb-date input[type=date]{position:absolute;inset:0;opacity:0;width:100%;height:100%;border:0;pointer-events:none;font:inherit}
.zb-date input[type=date]:focus{opacity:1;pointer-events:auto;background:var(--zp-bg,#fff);padding:0 40px 0 14px}
.zb-cell:focus-within{outline:2px solid var(--zp-accent,#1c2840);outline-offset:2px}
.zb-cal{position:absolute;right:8px;top:50%;transform:translateY(-50%);font-size:18px;opacity:.6;
  background:none;border:0;padding:4px;cursor:pointer;line-height:1}
.zb-cal:hover{opacity:1}
.zb-persone-disp{display:block;width:100%;text-align:left;font:inherit;font-size:16px;font-weight:600;
  color:var(--zp-text,#1c2032);cursor:pointer;background:none;border:0;padding:0}
.zb-pop{display:none;position:absolute;z-index:30;top:100%;left:0;right:0;margin-top:6px;background:#fff;border:1px solid var(--zp-border,#e2e6ed);border-radius:10px;box-shadow:0 10px 30px rgba(0,0,0,.12);padding:8px 12px}
.zb-pop.open{display:block}
.zb-step{display:flex;justify-content:space-between;align-items:center;padding:8px 0;font-size:14px;color:var(--zp-text,#1c2032)}
.zb-step+.zb-step{border-top:1px solid #eef1f5}
.zb-step>div{display:flex;align-items:center;gap:12px}
.zb-step button{width:30px;height:30px;border-radius:7px;border:1px solid #d0d6e4;background:#fff;font-size:18px;cursor:pointer;line-height:1}
.zb-step b{min-width:18px;text-align:center}
.zb-go{flex:0 0 auto;border:0;border-radius:8px;background:var(--zb-accent);color:#fff;font-weight:700;letter-spacing:.04em;padding:0 26px;cursor:pointer;font-size:14px}
.zb-go:hover{filter:brightness(1.1)}
.zb-results{margin-top:18px;display:flex;flex-direction:column;gap:12px}
.zb-room{display:flex;align-items:center;gap:16px;border:1px solid var(--zp-border,#e2e6ed);border-radius:10px;padding:14px 16px;background:#fff}
.zb-room-main{flex:1;min-width:0}
.zb-room-name{font-size:17px;font-weight:700;color:var(--zp-text,#1c2032)}
.zb-room-meta{font-size:13px;color:var(--zp-muted,#5c7794)}
.zb-room-price{text-align:right}
.zb-room-price .tot{font-size:22px;font-weight:800;color:var(--zb-accent)}
.zb-room-price .pn{font-size:12px;color:var(--zp-muted,#5c7794)}
.zb-book{border:0;border-radius:8px;background:var(--zb-accent);color:#fff;font-weight:700;padding:10px 18px;cursor:pointer;white-space:nowrap}
.zb-msg{padding:18px;text-align:center;color:var(--zp-text-soft,#5a6478);background:var(--zp-bg-soft,#f5f6f8);border-radius:10px}
/* Calendario disponibilità */
.zbc-pop{margin-top:10px;border:1px solid var(--zp-border,#e2e6ed);border-radius:12px;background:#fff;box-shadow:0 10px 30px rgba(0,0,0,.12);padding:12px}
.zbc-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px}
.zbc-nav{width:32px;height:32px;border:1px solid #d0d6e4;background:#fff;border-radius:8px;cursor:pointer;font-size:18px;line-height:1}
.zbc-legend{font-size:12px;color:var(--zp-muted,#5c7794)}
.zbc-lf,.zbc-lx{display:inline-block;width:12px;height:12px;border-radius:3px;vertical-align:middle}
.zbc-lf{background:#dff3e6;border:1px solid #58c07f}.zbc-lx{background:#fae3e1;border:1px solid #e0857a}
.zbc-months{display:flex;gap:18px;flex-wrap:wrap}
.zbc-month{flex:1;min-width:230px}
.zbc-mt{text-align:center;font-weight:700;color:var(--zp-text,#1c2032);margin-bottom:6px;font-size:14px}
.zbc-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:3px}
.zbc-wd{font-size:10px;color:#9aa3b2;text-align:center;font-weight:700;padding-bottom:2px}
/* I giorni sono pulsanti (la tastiera deve poterli scegliere): si tolgono gli
   stili che il browser dà ai button, non il contorno del fuoco. */
.zbc-day{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:42px;padding:4px 0;font-size:13px;border-radius:7px;border:1px solid transparent;cursor:default;
  width:100%;background:none;font-family:inherit;color:inherit}
.zbc-day[disabled]{cursor:default}
.zbc-n{line-height:1.1}
.zbc-p{font-size:10px;font-weight:700;opacity:.85;margin-top:1px}
.zbc-free{background:#dff3e6;color:#1b7c44;border-color:#bfe6cd;cursor:pointer}
.zbc-free:hover{background:#1b7c44;color:#fff}
.zbc-free:hover .zbc-p{opacity:1}
.zbc-full{background:#fae3e1;color:#b85c50;border-color:#f2c4be;cursor:pointer}
.zbc-full:hover{background:#b85c50;color:#fff}
.zbc-past,.zbc-out{color:#c7ccd6}
.zbc-sel{background:var(--zp-accent,#1c2840) !important;color:#fff !important;border-color:var(--zp-accent,#1c2840)}
.zbc-in{background:#cfe0ff !important;color:var(--zp-accent,#1c2840) !important}
/* Dove si trova la tastiera si deve vedere: `:focus-visible` lo mostra a chi
   naviga così e non a chi usa il mouse. Senza, il calendario si usa alla cieca. */
.zb-widget :focus-visible,.zbc-pop :focus-visible,.zlb :focus-visible{
  outline:3px solid var(--zp-accent,#1c2840);outline-offset:2px;border-radius:6px}
.zlb :focus-visible{outline-color:#fff}
/* Lightbox (ingrandimento + slideshow) */
.zlb{position:fixed;inset:0;z-index:99999;background:rgba(0,0,0,.9);display:flex;align-items:center;justify-content:center}
.zlb-img{max-width:92vw;max-height:88vh;object-fit:contain;border-radius:6px;box-shadow:0 10px 40px rgba(0,0,0,.5)}
.zlb-x{position:absolute;top:16px;right:20px;width:44px;height:44px;border:0;border-radius:50%;background:rgba(255,255,255,.15);color:#fff;font-size:26px;cursor:pointer;line-height:1}
.zlb-prev,.zlb-next{position:absolute;top:50%;transform:translateY(-50%);width:52px;height:52px;border:0;border-radius:50%;background:rgba(255,255,255,.15);color:#fff;font-size:30px;cursor:pointer;line-height:1}
.zlb-prev{left:16px}.zlb-next{right:16px}
.zlb-x:hover,.zlb-prev:hover,.zlb-next:hover{background:rgba(255,255,255,.3)}
.zlb-count{position:absolute;bottom:18px;left:0;right:0;text-align:center;color:#fff;font-size:13px;opacity:.85}
@media(max-width:680px){.zlb-prev,.zlb-next{width:42px;height:42px;font-size:24px}}