/* ily-panel.css — base comune dei pannelli prenotazioni (Redesign, Fase 1: estratta da booking-slot.css).
 *
 * Variabili --ily-* (nomi IDENTICI alle variabili Figma, file "Interlyo — Pannello slot", pagina
 * Foundations), struttura (sidebar, barra in alto, barra in basso, pannello Altro), toast, modali,
 * campi, interruttori, conferma, drawer, testate delle impostazioni, accesso.
 * Regole spostate senza modifiche e nel loro ordine relativo; il CSS del pannello (es. booking-slot.css)
 * si carica DOPO questo file.
 *
 * Breakpoint: telefono < 768px · tablet 768–1199px (sidebar a icone) · desktop >= 1200px.
 * Icone: SVG in /widget/icons usati come MASCHERA (colore da currentColor).
 */

/* ── 1. VARIABILI (Figma) ───────────────────────────────────────────────── */
:root{
  --ily-bg-page:#f5f3f7;
  --ily-bg-surface:#ffffff;
  --ily-bg-brand:#6d2f66;
  --ily-bg-brand-hover:#4e1d49;
  --ily-bg-brand-subtle:#f3eaf2;
  --ily-bg-sidebar:#4e1d49;
  --ily-bg-sidebar-active:#6d2f66;
  --ily-accent:#a31f34;
  --ily-text-primary:#2d2d2d;
  --ily-text-muted:#6c757d;
  --ily-text-brand:#6d2f66;
  --ily-text-on-brand:#ffffff;
  --ily-text-on-sidebar-muted:#f3eaf2;
  --ily-border-default:#e8e0ec;
  --ily-border-brand:#6d2f66;
  --ily-status-busy-fg:#dc2626;   --ily-status-busy-bg:#fef2f2;
  --ily-status-free-fg:#16a34a;   --ily-status-free-bg:#f0fdf4;
  --ily-status-soon-fg:#f59e0b;   --ily-status-soon-bg:#fef3c7;
  --ily-status-closed-fg:#9ca3af; --ily-status-closed-bg:#f3f4f6;
  --ily-status-lock-fg:#4b5563;   --ily-status-lock-bg:#f3f4f6;
  --ily-note-fg:#f59e0b;          --ily-note-bg:#fef3c7;
  --ily-spacing-2xs:4px;
  --ily-spacing-xs:8px;
  --ily-spacing-sm:12px;
  --ily-spacing-md:16px;
  --ily-spacing-lg:20px;
  --ily-radius-sm:8px;
  --ily-radius-md:12px;
  --ily-radius-lg:16px;
  --ily-radius-full:999px;
  /* Effetti Figma: Shadow/Card, Shadow/Raised */
  --ily-shadow-card:0 1px 2px rgba(46,20,46,.06), 0 2px 8px rgba(46,20,46,.05);
  --ily-shadow-raised:0 4px 16px rgba(46,20,46,.10);
  --ily-font:'DM Sans', -apple-system, 'Segoe UI', Roboto, sans-serif;
  /* Struttura (non da Figma: misure derivate dai frame) */
  --ily-sidebar-w:248px;
  --ily-tabbar-h:66px;              /* 10 + 28 + 4 + 16 + 8, senza safe-area */
  /* Bootstrap eredita il font del design */
  --bs-body-font-family:var(--ily-font);
  --bs-body-color:var(--ily-text-primary);
  --bs-body-bg:var(--ily-bg-page);
  /* compatibilita' con lo CSS delle sezioni (usa ancora --mwa-*) */
  --mwa-primary:var(--ily-bg-brand);
  --mwa-primary-dark:var(--ily-bg-brand-hover);
}

/* ── 2. STRUTTURA ───────────────────────────────────────────────────────── */

body{ background:var(--ily-bg-page); font-family:var(--ily-font); color:var(--ily-text-primary); }

/* Icone (maschera sugli SVG di Figma) */
.ily-ic{ display:inline-block; width:20px; height:20px; flex:0 0 auto; background:currentColor;
  -webkit-mask:var(--ic) center/contain no-repeat; mask:var(--ic) center/contain no-repeat; }
.ily-ic-18{ width:18px; height:18px; }
.ily-ic-16{ width:16px; height:16px; }
.ily-ic--grid{ --ic:url(icons/layout-grid.svg); }
.ily-ic--calendar{ --ic:url(icons/calendar.svg); }
.ily-ic--list{ --ic:url(icons/list.svg); }
.ily-ic--box{ --ic:url(icons/box.svg); }
.ily-ic--layers{ --ic:url(icons/layers.svg); }
.ily-ic--tag{ --ic:url(icons/tag.svg); }
.ily-ic--clock{ --ic:url(icons/clock.svg); }
.ily-ic--sliders{ --ic:url(icons/sliders.svg); }
.ily-ic--arrow-left{ --ic:url(icons/arrow-left.svg); }
.ily-ic--chevron-down{ --ic:url(icons/chevron-down.svg); }
.ily-ic--chevron-left{ --ic:url(icons/chevron-left.svg); }
.ily-ic--chevron-right{ --ic:url(icons/chevron-right.svg); }
.ily-ic--lock{ --ic:url(icons/lock.svg); }
.ily-ic--plus{ --ic:url(icons/plus.svg); }

/* Involucro: sidebar fissa + colonna principale fluida (nessun contenitore a larghezza fissa) */
#app.ily-app{ display:flex; min-height:100vh; min-height:100dvh; }
.ily-main{ flex:1 1 auto; min-width:0; display:flex; flex-direction:column; }
.ily-content{ flex:1 1 auto; min-width:0; padding:28px 32px var(--ily-fab-space); }
/* Fondo del contenuto = ingombro della bolla guida "?" (guide-bubble.js: 58px a 22px dal fondo) + 16px di
   margine: in fondo alle pagine lunghe l'ultima riga (es. la paginazione) non finisce sotto la bolla. */
:root{ --ily-fab-space:calc(22px + 58px + 16px); }

/* Sidebar */
.ily-sidebar{ position:sticky; top:0; height:100vh; height:100dvh; flex:0 0 var(--ily-sidebar-w); width:var(--ily-sidebar-w);
  background:var(--ily-bg-sidebar); display:flex; flex-direction:column; gap:var(--ily-spacing-2xs);
  padding:24px 12px; overflow-y:auto; z-index:1025; }
.ily-logo{ display:flex; align-items:center; gap:10px; padding:0 0 20px 12px; }
.ily-logo-mark{ width:32px; height:32px; border-radius:10px; background:var(--ily-bg-brand); color:var(--ily-text-on-brand);
  display:flex; align-items:center; justify-content:center; font-size:20px; font-weight:600; line-height:28px; flex:0 0 auto; }
.ily-logo-text{ display:flex; flex-direction:column; white-space:nowrap; }
.ily-logo-name{ font-size:16px; line-height:24px; font-weight:600; color:var(--ily-text-on-brand); }
.ily-logo-sub{ font-size:12px; line-height:16px; color:var(--ily-text-on-sidebar-muted); }
.ily-nav-label{ padding:16px 0 6px 12px; font-size:11px; line-height:16px; font-weight:600; letter-spacing:.06em;
  text-transform:uppercase; color:var(--ily-text-on-sidebar-muted); opacity:.7; white-space:nowrap; }
.ily-nav-item{ display:flex; align-items:center; gap:var(--ily-spacing-sm); width:100%; height:40px; flex:0 0 auto;
  padding:var(--ily-spacing-xs) var(--ily-spacing-sm); border:0; border-radius:var(--ily-radius-sm); background:transparent;
  color:var(--ily-text-on-sidebar-muted); font-size:14px; line-height:20px; font-weight:400; text-align:left;
  text-decoration:none; white-space:nowrap; cursor:pointer; }
.ily-nav-item:hover{ background:rgba(255,255,255,.07); color:var(--ily-text-on-brand); }
.ily-nav-item.active{ background:var(--ily-bg-sidebar-active); color:var(--ily-text-on-brand); font-weight:600; }
.ily-nav-item:focus-visible, .ily-tab:focus-visible, .ily-btn:focus-visible, .ily-iconbtn:focus-visible{
  outline:2px solid var(--ily-border-brand); outline-offset:2px; }
.ily-sidebar .ily-nav-item:focus-visible{ outline-color:var(--ily-text-on-brand); }
.ily-spacer{ flex:1 1 auto; min-height:12px; }

/* Voci riservate alle impostazioni: visibili solo con il permesso (classe su body) */
body:not(.ily-can-settings) [data-perm="settings"]{ display:none !important; }
/* Voci per ruolo */
body:not(.ily-owner) [data-role="owner"]{ display:none !important; }
body.ily-owner [data-role="operator"]{ display:none !important; }

/* Barra in alto */
.ily-topbar{ position:sticky; top:0; z-index:1020; background:var(--ily-bg-surface); border-bottom:1px solid var(--ily-border-default);
  display:flex; align-items:center; justify-content:space-between; gap:12px; padding:14px 24px; min-height:67px; }
.ily-tb-left, .ily-tb-right{ display:flex; align-items:center; min-width:0; }
.ily-tb-left{ gap:12px; }
.ily-tb-right{ gap:10px; flex:0 0 auto; }
.ily-site{ position:relative; min-width:0; }
/* Sito del pannello: uno solo per sessione, mostrato come testo (niente tendina) */
.ily-site-name{ display:block; max-width:280px; font-size:15px; line-height:22px; font-weight:600; color:var(--ily-text-primary);
  text-overflow:ellipsis; white-space:nowrap; overflow:hidden; }
/* Nessun sito scelto (scelta del sito, sito non valido, nessun sito del tipo): niente navigazione */
body.ily-no-sites .ily-sidebar [data-sec], body.ily-no-sites .ily-nav-label, body.ily-no-sites .ily-tabbar,
body.ily-no-sites .ily-tb-new, body.ily-no-sites .ily-ops-actions{ display:none !important; }
/* M5 (pannello clienti, opt-in): zero siti -> via solo le voci del sito, l'account resta (classe diversa da ily-no-sites) */
body.ily-no-site [data-scope="site"]{ display:none !important; }
.ily-site-pick{ display:flex; flex-direction:column; gap:8px; max-width:560px; }
.ily-site-pick-item{ display:grid; grid-template-columns:minmax(0,1fr) auto; grid-template-areas:"name ic" "dom ic"; align-items:center;
  column-gap:12px; width:100%; padding:14px 16px; text-align:left; background:var(--ily-bg-surface); border:1px solid var(--ily-border-default);
  border-radius:var(--ily-radius-md); box-shadow:var(--ily-shadow-card); font-family:inherit; color:var(--ily-text-primary); cursor:pointer; }
.ily-site-pick-item:hover{ border-color:var(--ily-border-brand); background:var(--ily-bg-brand-subtle); }
.ily-site-pick-name{ grid-area:name; font-size:15px; line-height:22px; font-weight:600; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.ily-site-pick-dom{ grid-area:dom; font-size:13px; line-height:18px; color:var(--ily-text-muted); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.ily-site-pick-item .ily-ic{ grid-area:ic; color:var(--ily-text-muted); }
/* M3 — Selettore del sito (pannello clienti, piu' siti per sessione). Opt-in: esiste solo dove la pagina mette
   un .ily-site-sel e chiama siteSelRender (ily-panel.js); i pannelli prenotazioni restano su .ily-site-name. */
.ily-ic--check{ --ic:url(icons/check-white.svg); }
.ily-site-sel{ position:relative; min-width:0; }
.ily-site-sel-btn{ display:flex; align-items:center; gap:10px; min-width:0; max-width:340px; padding:6px 10px 6px 8px; border:1px solid var(--ily-border-default);
  border-radius:var(--ily-radius-sm); background:var(--ily-bg-surface); font-family:inherit; color:var(--ily-text-primary); text-align:left; cursor:pointer; }
.ily-site-sel-btn:hover, .ily-site-sel.is-open .ily-site-sel-btn{ border-color:var(--ily-border-brand); background:var(--ily-bg-brand-subtle); }
.ily-site-sel-btn:focus-visible{ outline:2px solid var(--ily-border-brand); outline-offset:2px; }
.ily-site-sel-txt{ display:flex; flex-direction:column; min-width:0; }
.ily-site-sel-name{ font-size:15px; line-height:20px; font-weight:600; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.ily-site-sel-dom{ font-size:12px; line-height:16px; color:var(--ily-text-muted); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.ily-site-sel-btn > .ily-ic{ color:var(--ily-text-muted); transition:transform .15s; }
.ily-site-sel.is-open .ily-site-sel-btn > .ily-ic{ transform:rotate(180deg); }
.ily-site-dot{ width:12px; height:12px; border-radius:50%; flex:0 0 auto; box-shadow:inset 0 0 0 1px rgba(0,0,0,.08); }
.ily-site-sel-menu{ position:absolute; top:calc(100% + 6px); left:0; z-index:1060; width:340px; max-width:calc(100vw - 32px); max-height:70vh; overflow-y:auto;
  padding:8px; background:var(--ily-bg-surface); border:1px solid var(--ily-border-default); border-radius:var(--ily-radius-md); box-shadow:var(--ily-shadow-raised); }
.ily-site-sel-head{ padding:6px 8px 8px; color:var(--ily-text-muted); }
.ily-site-sel-item, .ily-site-sel-link{ display:flex; align-items:center; gap:10px; width:100%; padding:9px 8px; border:0; border-radius:var(--ily-radius-sm);
  background:none; font-family:inherit; color:var(--ily-text-primary); text-align:left; cursor:pointer; }
.ily-site-sel-item:hover, .ily-site-sel-link:hover{ background:var(--ily-bg-brand-subtle); }
.ily-site-sel-item.is-cur{ background:var(--ily-bg-brand-subtle); }
.ily-site-sel-item .ily-site-sel-txt{ flex:1 1 auto; }
.ily-site-sel-item b{ font-size:14px; line-height:20px; font-weight:600; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.ily-site-sel-item small{ font-size:12px; line-height:16px; color:var(--ily-text-muted); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.ily-site-sel-item > .ily-ic--check{ width:16px; height:16px; color:var(--ily-text-brand); }
.ily-site-sel-st{ display:inline-flex; align-items:center; gap:4px; margin-left:6px; }
.ily-site-sel-st i{ width:7px; height:7px; border-radius:50%; background:var(--ily-status-lock-fg); }
.ily-site-sel-st.is-zero i{ background:var(--ily-status-busy-fg); }
.ily-site-sel-sep{ height:1px; margin:6px 0; background:var(--ily-border-default); }
.ily-site-sel-link{ font-size:14px; line-height:20px; font-weight:500; color:var(--ily-text-brand); }
.ily-site-sel-link .bi{ width:16px; text-align:center; }
/* Nessun sito: al posto del selettore un testo di due righe */
.ily-site-sel-empty{ display:flex; flex-direction:column; min-width:0; }
.ily-site-sel-empty b{ font-size:15px; line-height:20px; font-weight:600; }
.ily-site-sel-empty span{ font-size:12px; line-height:16px; color:var(--ily-text-muted); }
.ily-iconbtn{ width:36px; height:36px; display:flex; align-items:center; justify-content:center; flex:0 0 auto;
  border:1px solid var(--ily-border-default); border-radius:var(--ily-radius-sm); background:var(--ily-bg-surface);
  color:var(--ily-text-primary); padding:0; cursor:pointer; }
.ily-iconbtn:hover{ background:var(--ily-bg-brand-subtle); }
.ily-ops-actions{ display:flex; align-items:center; gap:10px; }
.ily-btn{ display:inline-flex; align-items:center; gap:var(--ily-spacing-xs); padding:var(--ily-spacing-xs) var(--ily-spacing-md);
  border-radius:var(--ily-radius-sm); font-family:inherit; font-size:14px; line-height:20px; font-weight:600; white-space:nowrap;
  cursor:pointer; border:1px solid transparent; }
.ily-btn--primary{ background:var(--ily-bg-brand); color:var(--ily-text-on-brand); border:0; }
.ily-btn--primary:hover{ background:var(--ily-bg-brand-hover); }
.ily-btn--secondary{ background:var(--ily-bg-surface); color:var(--ily-text-primary); border-color:var(--ily-border-default); }
.ily-btn--secondary:hover{ background:var(--ily-bg-brand-subtle); }
.ily-divider{ width:1px; height:28px; background:var(--ily-border-default); flex:0 0 auto; }
.ily-lang{ border:0; background:none; padding:4px; font-family:inherit; font-size:12px; line-height:16px; font-weight:500;
  color:var(--ily-text-muted); cursor:pointer; text-transform:uppercase; }
.ily-lang:hover{ color:var(--ily-text-brand); }
.ily-user{ display:flex; align-items:center; gap:10px; min-width:0; }
.ily-avatar{ width:36px; height:36px; border-radius:18px; flex:0 0 auto; background:var(--ily-bg-brand-subtle); color:var(--ily-text-brand);
  display:flex; align-items:center; justify-content:center; font-size:12px; line-height:16px; font-weight:500; }
.ily-user-meta{ display:flex; flex-direction:column; font-size:12px; line-height:16px; white-space:nowrap; min-width:0; }
.ily-user-name{ font-weight:500; color:var(--ily-text-primary); overflow:hidden; text-overflow:ellipsis; max-width:180px; }
.ily-user-role{ color:var(--ily-text-muted); }
/* M4 — Menu utente (pannello clienti, opt-in): .ily-user col suo .ily-user-btn apre la tendina (userMenuToggle) */
.ily-user.has-menu{ position:relative; }
.ily-user-btn{ display:flex; align-items:center; gap:10px; min-width:0; padding:2px 6px 2px 2px; border:0; border-radius:var(--ily-radius-md);
  background:none; font-family:inherit; color:inherit; text-align:left; cursor:pointer; }
.ily-user-btn:hover, .ily-user.is-open .ily-user-btn{ background:var(--ily-bg-brand-subtle); }
.ily-user-btn:focus-visible{ outline:2px solid var(--ily-border-brand); outline-offset:2px; }
.ily-user-menu{ position:absolute; top:calc(100% + 8px); right:0; z-index:1060; width:264px; max-width:calc(100vw - 32px); padding:8px;
  background:var(--ily-bg-surface); border:1px solid var(--ily-border-default); border-radius:var(--ily-radius-md); box-shadow:var(--ily-shadow-raised); }
.ily-user-menu-head{ display:flex; flex-direction:column; min-width:0; padding:6px 8px 10px; margin-bottom:6px; border-bottom:1px solid var(--ily-border-default); }
.ily-user-menu-head b{ font-size:14px; line-height:20px; font-weight:600; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.ily-user-menu-head span{ font-size:12px; line-height:16px; color:var(--ily-text-muted); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.ily-user-menu-item{ display:flex; align-items:center; gap:10px; width:100%; min-height:40px; padding:8px; border:0; border-radius:var(--ily-radius-sm);
  background:none; font-family:inherit; font-size:14px; line-height:20px; color:var(--ily-text-primary); text-align:left; cursor:pointer; }
.ily-user-menu-item:hover{ background:var(--ily-bg-brand-subtle); }
.ily-user-menu-item .bi, .ily-user-menu-lang .bi{ width:18px; font-size:16px; text-align:center; }
.ily-user-menu-item.is-danger{ color:var(--ily-accent); }
.ily-user-menu-lang{ display:flex; align-items:center; justify-content:space-between; gap:12px; min-height:40px; padding:4px 8px; font-size:14px; }
.ily-user-menu-lang > span:first-child{ display:flex; align-items:center; gap:10px; }
.ily-user-menu-sep{ height:1px; margin:6px 0; background:var(--ily-border-default); }

/* Barra in basso, "+" nella barra in alto e pannello Altro: solo telefono */
.ily-tabbar, .ily-tb-new{ display:none; }
.ily-sheet-ov{ position:fixed; inset:0; z-index:1070; background:rgba(15,18,30,.5); display:flex; align-items:flex-end; }
.ily-sheet{ width:100%; background:var(--ily-bg-surface); border-radius:var(--ily-radius-lg) var(--ily-radius-lg) 0 0;
  padding:8px 16px calc(16px + env(safe-area-inset-bottom)); max-height:85vh; overflow-y:auto; box-shadow:var(--ily-shadow-raised); }
.ily-sheet-handle{ width:40px; height:4px; border-radius:2px; background:var(--ily-border-default); margin:4px auto 12px; }
.ily-sheet-title{ font-size:16px; line-height:24px; font-weight:600; margin:0 4px 8px; }
.ily-sheet .ily-nav-label{ color:var(--ily-text-muted); opacity:1; padding:12px 0 4px 4px; }
.ily-sheet-item{ display:flex; align-items:center; gap:12px; width:100%; min-height:48px; padding:12px 8px; border:0; background:none;
  border-radius:var(--ily-radius-sm); color:var(--ily-text-primary); font-family:inherit; font-size:14px; line-height:20px; text-align:left; }
.ily-sheet-item:hover, .ily-sheet-item.active{ background:var(--ily-bg-brand-subtle); }
.ily-sheet-item.active{ color:var(--ily-text-brand); font-weight:600; }
.ily-sheet-item .bi{ font-size:18px; width:20px; text-align:center; }
.ily-sheet-lang{ display:flex; align-items:center; justify-content:space-between; gap:12px; padding:8px; min-height:48px; font-size:14px; }
.ily-seg{ display:inline-flex; border:1px solid var(--ily-border-default); border-radius:var(--ily-radius-sm); padding:3px; gap:2px; }
.ily-seg button{ border:0; background:none; border-radius:6px; padding:4px 14px; font-family:inherit; font-size:12px; font-weight:600; color:var(--ily-text-muted); }
.ily-seg button.active{ background:var(--ily-bg-brand); color:var(--ily-text-on-brand); }
.ily-sheet-sep{ height:1px; background:var(--ily-border-default); margin:8px 0; }

/* ── TABLET 768–1199: sidebar a sole icone, barra in alto ridotta ── */
@media (max-width:1199.98px){
  :root{ --ily-sidebar-w:72px; }
  .ily-sidebar{ align-items:center; padding:24px 12px; }
  .ily-logo{ padding:0 0 20px; }
  .ily-logo-text, .ily-sidebar .ily-nav-label, .ily-sidebar .ily-nav-text{ display:none; }
  .ily-sidebar .ily-nav-item{ width:44px; height:36px; justify-content:center; padding:var(--ily-spacing-xs) var(--ily-spacing-sm); }
  .ily-topbar{ padding:14px 20px; }
  .ily-divider, .ily-lang, .ily-user-meta{ display:none !important; }
  .ily-content{ padding:20px 24px var(--ily-fab-space); }
}

/* Sotto i 1100px i due bottoni diventano solo icona, altrimenti la barra non ci sta */
@media (min-width:768px) and (max-width:1099.98px){
  .ily-btn .ily-btn-text{ display:none; }
  .ily-btn{ padding:var(--ily-spacing-xs); }
}

/* ── TELEFONO < 768: niente sidebar, barra compatta in alto, barra in basso ── */
@media (max-width:767.98px){
  html, body{ overflow-x:hidden; }   /* regola: mai scorrimento orizzontale della pagina */
  .ily-sidebar{ display:none; }
  .ily-topbar{ display:grid; grid-template-columns:minmax(0,1fr) auto auto; grid-template-areas:"site new user" "date date date";
    gap:12px; padding:calc(12px + env(safe-area-inset-top)) 16px 12px; min-height:0; }
  .ily-tb-left, .ily-tb-right{ display:contents; }
  .ily-site{ grid-area:site; align-self:center; justify-self:start; max-width:100%; }
  .ily-site-sel{ grid-area:site; align-self:center; justify-self:start; max-width:100%; }
  .ily-site-sel-btn{ max-width:calc(100vw - 32px); }
  .ily-user{ grid-area:user; }
  /* "+" Nuova prenotazione: pulsante-icona accanto all'avatar (al posto del vecchio "+" flottante), stessa azione (fabAction) */
  .ily-tb-new{ display:flex; grid-area:new; align-self:center; background:var(--ily-bg-brand); border-color:var(--ily-bg-brand); color:var(--ily-text-on-brand); }
  .ily-tb-new:hover{ background:var(--ily-bg-brand-hover); }
  /* M6 (opt-in, pannello clienti): il "+" solo dove la sezione ha un'azione (setFabFor) */
  body.ily-fab-opt:not(.ily-fab-set) .ily-tb-new{ display:none !important; }
  .ily-ops-actions, .ily-divider, .ily-lang, .ily-user-meta{ display:none !important; }
  .ily-site-name{ font-size:16px; line-height:24px; max-width:calc(100vw - 80px); }
  .ily-avatar{ width:32px; height:32px; border-radius:16px; }
  .ily-iconbtn{ width:40px; height:40px; border-radius:10px; }
  .ily-content{ padding:16px 16px calc(var(--ily-tabbar-h) + env(safe-area-inset-bottom) + 16px + 58px + 16px); }

  .ily-tabbar{ display:flex; position:fixed; left:0; right:0; bottom:0; z-index:1030; justify-content:space-between;
    background:var(--ily-bg-surface); border-top:1px solid var(--ily-border-default);
    padding:10px 12px calc(8px + env(safe-area-inset-bottom)); }
  .ily-tab{ flex:1 1 0; max-width:84px; min-width:0; display:flex; flex-direction:column; align-items:center; gap:4px;
    border:0; background:none; padding:0; font-family:inherit; font-size:12px; line-height:16px; font-weight:400;
    color:var(--ily-text-muted); white-space:nowrap; cursor:pointer; }
  .ily-tab-pill{ width:56px; height:28px; border-radius:14px; display:flex; align-items:center; justify-content:center; }
  .ily-tab.active{ color:var(--ily-text-brand); font-weight:500; }
  .ily-tab.active .ily-tab-pill{ background:var(--ily-bg-brand-subtle); }

  /* Bolla guida (guide-bubble.js, invariato): in basso a destra, sopra la barra in basso (il "+" ora sta
     nella barra in alto). Il fondo del contenuto (padding di .ily-content: 16 + 58 + 16px sopra la barra)
     resta piu' alto del "?", cosi' l'ultima scheda non finisce sotto. Specificita' > quella dello script. */
  body.ily-shell .gb-fab{ bottom:calc(var(--ily-tabbar-h) + env(safe-area-inset-bottom) + 16px); right:16px; }
  body.ily-shell .gb-panel{ bottom:calc(var(--ily-tabbar-h) + env(safe-area-inset-bottom) + 16px + 66px);
    max-height:calc(100vh - var(--ily-tabbar-h) - 200px); }
}

/* ── 3. TOAST E MODALE DI BASE ──────────────────────────────────────────── */

.ib-toast { position:fixed; top:18px; left:50%; transform:translateX(-50%); z-index:1200; min-width:260px;
  max-width:90%; box-shadow:0 6px 20px rgba(0,0,0,.18); }
/* ── Modale manuale service-aware ── */
.mm-ov{ position:fixed; inset:0; z-index:1090; background:rgba(15,18,30,.5); display:flex;
  align-items:flex-start; justify-content:center; padding:24px 12px; overflow:auto; }
.mm-card{ background:#fff; border-radius:14px; padding:18px; width:100%; max-width:440px;
  box-shadow:0 12px 40px rgba(0,0,0,.25); }
.mm-h{ display:flex; justify-content:space-between; align-items:center; margin-bottom:10px; }

/* ── 4. PEZZI COMUNI (testata, densita, chip, badge, drawer, link) ──────── */

.ily-muted{ color:var(--ily-text-muted); }
.ily-caps{ font-size:11px; line-height:16px; font-weight:600; letter-spacing:.06em; text-transform:uppercase; }

/* Intestazione di pagina */
.ily-page-head{ margin-bottom:24px; }
.ily-page-title{ font-size:32px; line-height:40px; font-weight:700; color:var(--ily-text-primary); margin:0; }
.ily-page-sub{ font-size:14px; line-height:20px; color:var(--ily-text-muted); margin:4px 0 0; }

.ily-density{ display:inline-flex; gap:2px; padding:3px; background:var(--ily-bg-surface); border:1px solid var(--ily-border-default); border-radius:10px; }
.ily-density button{ border:0; background:none; border-radius:var(--ily-radius-sm); padding:6px 12px; font-family:inherit;
  font-size:12px; line-height:16px; font-weight:400; color:var(--ily-text-muted); cursor:pointer; white-space:nowrap; }
.ily-density button:hover{ color:var(--ily-text-brand); }
.ily-density button.active{ background:var(--ily-bg-brand); color:var(--ily-text-on-brand); font-weight:500; }
.ily-btn-sm{ display:inline-flex; align-items:center; gap:var(--ily-spacing-xs); padding:var(--ily-spacing-2xs) var(--ily-spacing-sm);
  border:1px solid var(--ily-border-default); border-radius:var(--ily-radius-sm); background:var(--ily-bg-surface);
  font-family:inherit; font-size:12px; line-height:16px; font-weight:500; color:var(--ily-text-primary); cursor:pointer; white-space:nowrap; }
.ily-btn-sm .bi{ font-size:14px; line-height:1; }
.ily-btn-sm:hover{ background:var(--ily-bg-brand-subtle); }
.ily-btn-sm.active{ background:var(--ily-bg-brand); border-color:var(--ily-bg-brand); color:var(--ily-text-on-brand); }
.ily-ic--x{ --ic:url(icons/x.svg); }

/* Chip di stato e badge */
.ily-chip{ display:inline-flex; align-items:center; gap:var(--ily-spacing-xs); padding:var(--ily-spacing-2xs) var(--ily-spacing-sm);
  border-radius:var(--ily-radius-full); font-size:12px; line-height:16px; font-weight:500; color:var(--ily-text-primary);
  align-self:flex-start; max-width:100%; white-space:nowrap; min-width:0; }
.ily-chip-text{ overflow:hidden; text-overflow:ellipsis; }
.ily-chip-dot{ width:8px; height:8px; flex:0 0 auto; }
.ily-chip-lock{ width:14px; height:14px; flex:0 0 auto; }
.ily-chip--busy{ background:var(--ily-status-busy-bg); }
.ily-chip--soon{ background:var(--ily-status-soon-bg); }
.ily-chip--free{ background:var(--ily-status-free-bg); }
.ily-chip--closed{ background:var(--ily-status-closed-bg); }
.ily-chip--lock{ background:var(--ily-status-lock-bg); }
.ily-badge{ display:inline-flex; align-items:center; gap:var(--ily-spacing-2xs); padding:var(--ily-spacing-2xs) var(--ily-spacing-xs);
  border-radius:var(--ily-radius-full); font-size:12px; line-height:16px; font-weight:500; white-space:nowrap; max-width:100%; }
.ily-badge img{ width:14px; height:14px; flex:0 0 auto; }
.ily-badge--pax{ background:var(--ily-status-closed-bg); color:var(--ily-text-muted); }
.ily-badge--join{ background:var(--ily-bg-brand-subtle); color:var(--ily-text-brand); }
.ily-badge--note{ background:var(--ily-note-bg); color:var(--ily-text-primary); }

/* Drawer risorsa */
.ily-drawer-ov{ position:fixed; inset:0; z-index:1080; background:rgba(46,20,46,.28); display:flex; justify-content:flex-end; }
.ily-drawer{ width:480px; max-width:100%; height:100%; background:var(--ily-bg-surface); box-shadow:0 12px 40px rgba(46,20,46,.18);
  display:flex; flex-direction:column; overflow:hidden; animation:ily-drawer-in .18s ease-out; }
@keyframes ily-drawer-in{ from{ transform:translateX(24px); opacity:.6; } to{ transform:none; opacity:1; } }
body.ily-drawer-open{ overflow:hidden; }
body.ily-drawer-open .gb-fab, body.ily-drawer-open .gb-panel{ display:none !important; }
.ily-drawer-head{ flex:0 0 auto; display:flex; flex-direction:column; gap:16px; padding:28px 28px 20px; border-bottom:1px solid var(--ily-border-default); }
.ily-drawer-top{ display:flex; align-items:flex-start; justify-content:space-between; gap:12px; }
.ily-drawer-titles{ display:flex; flex-direction:column; align-items:flex-start; gap:8px; min-width:0; }
.ily-drawer-name-row{ display:flex; align-items:center; gap:10px; min-width:0; flex-wrap:wrap; }
.ily-drawer-name{ font-size:24px; line-height:32px; font-weight:700; color:var(--ily-text-primary); margin:0; }
.ily-drawer-actions{ display:flex; gap:10px; flex-wrap:wrap; }
.ily-drawer-body{ flex:1 1 auto; overflow-y:auto; display:flex; flex-direction:column; gap:20px; padding:24px 28px 28px; }
.ily-drawer-body > div:empty{ display:none; }
.ily-link{ border:0; background:none; padding:0; font-family:inherit; font-size:12px; line-height:16px; font-weight:500; color:var(--ily-text-brand); cursor:pointer; }
.ily-link:hover{ text-decoration:underline; }
.ily-link--danger{ color:var(--ily-accent); }

/* KPI (Redesign clienti Fase 3): parte comune di booking-slot.css e booking-stay.css, che restano e
   si caricano dopo (le loro regole vincono: 5 colonne e sotto-testo su una riga nello slot). Colonne
   con --ily-kpi-cols (4 di base); il sotto-testo va a capo fino a due righe, niente testo nascosto. */
.ily-kpis{ display:grid; grid-template-columns:repeat(var(--ily-kpi-cols,4),minmax(0,1fr)); gap:16px; margin-bottom:24px; }
.ily-kpi{ background:var(--ily-bg-surface); border:1px solid var(--ily-border-default); border-radius:var(--ily-radius-md);
  box-shadow:var(--ily-shadow-card); padding:var(--ily-spacing-md) var(--ily-spacing-lg); display:flex; flex-direction:column;
  gap:var(--ily-spacing-2xs); min-width:0; }
.ily-kpi-head{ display:flex; align-items:center; gap:8px; font-size:12px; line-height:16px; font-weight:500; color:var(--ily-text-muted); white-space:nowrap; }
.ily-kpi-head img{ width:8px; height:8px; flex:0 0 auto; }
.ily-kpi-value{ font-size:28px; line-height:32px; font-weight:700; color:var(--ily-text-primary); white-space:nowrap; font-variant-numeric:tabular-nums; }
.ily-kpi-value small{ font-size:16px; line-height:20px; font-weight:600; color:var(--ily-text-muted); }
.ily-kpi-sub{ font-size:12px; line-height:16px; color:var(--ily-text-muted); overflow:hidden; display:-webkit-box;
  -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow-wrap:anywhere; }
.ily-kpi.is-loading .ily-kpi-value{ color:var(--ily-border-default); }

/* Tablet 768–1199: KPI 2 per riga (l'ultima a tutta riga), elenco piu' stretto */
@media (max-width:1199.98px){
  .ily-kpis{ grid-template-columns:repeat(2,minmax(0,1fr)); }
  .ily-page-sub{ display:none; }
  .ily-page-head{ margin-bottom:20px; }
}

/* Telefono < 768: KPI 1 per riga, filtri a capo, drawer a tutto schermo dal basso */
@media (max-width:767.98px){
  .ily-kpis{ grid-template-columns:minmax(0,1fr); gap:10px; margin-bottom:16px; }
  .ily-page-title{ font-size:24px; line-height:32px; }
  .ily-page-head{ margin-bottom:16px; }
  .ily-drawer-ov{ align-items:flex-end; }
  .ily-drawer{ width:100%; animation-name:ily-drawer-up; }
  @keyframes ily-drawer-up{ from{ transform:translateY(40px); opacity:.6; } to{ transform:none; opacity:1; } }
  .ily-drawer-head{ padding:calc(16px + env(safe-area-inset-top)) 16px 16px; }
  .ily-drawer-body{ padding:16px 16px calc(24px + env(safe-area-inset-bottom)); }
}

/* ── 5. MODALI, CAMPI, INTERRUTTORI, CONFERMA ───────────────────────────── */

body.ily-modal-open{ overflow:hidden; }
/* La bolla guida (z 99998) non deve coprire i modali: come col drawer, sparisce */
body.ily-modal-open .gb-fab, body.ily-modal-open .gb-panel{ display:none !important; }
/* ...e nemmeno il foglio "Altro" (telefono): la bolla torna alla chiusura (openMore/closeMore) */
body.ily-sheet-open .gb-fab, body.ily-sheet-open .gb-panel{ display:none !important; }

.ily-search{ display:flex; align-items:center; gap:8px; margin:0 0 0 auto; width:320px; max-width:100%; height:40px; padding:0 12px;
  background:var(--ily-bg-surface); border:1px solid var(--ily-border-default); border-radius:var(--ily-radius-sm); cursor:text; }
.ily-search:focus-within{ border-color:var(--ily-border-brand); box-shadow:0 0 0 3px var(--ily-bg-brand-subtle); }
.ily-search img{ width:16px; height:16px; flex:0 0 auto; }
.ily-search input{ flex:1 1 auto; min-width:0; border:0; outline:0; background:none; font-family:inherit; font-size:14px; line-height:20px; color:var(--ily-text-primary); }
.ily-search input::placeholder{ color:var(--ily-text-muted); }
.ily-switch{ display:inline-flex; align-items:center; gap:10px; margin:0; font-size:14px; line-height:20px; color:var(--ily-text-primary); cursor:pointer; user-select:none; }
.ily-switch input{ position:absolute; opacity:0; width:1px; height:1px; pointer-events:none; }
.ily-switch-ui{ position:relative; width:36px; height:20px; flex:0 0 auto; border-radius:10px; background:#d1d5db; transition:background .15s; }
.ily-switch-ui::after{ content:""; position:absolute; top:2px; left:2px; width:16px; height:16px; border-radius:8px; background:#fff;
  box-shadow:0 1px 2px rgba(0,0,0,.2); transition:transform .15s; }
.ily-switch input:checked + .ily-switch-ui{ background:var(--ily-bg-brand); }
.ily-switch input:checked + .ily-switch-ui::after{ transform:translateX(16px); }
.ily-switch input:focus-visible + .ily-switch-ui{ box-shadow:0 0 0 3px var(--ily-bg-brand-subtle); }

/* Modali: stesso scheletro per tutti (testata · corpo · piede) */
.mm-ov--full, .mm-ov--sheet{ align-items:center; padding:24px 16px; }
.mm-card--f4{ padding:0; border-radius:var(--ily-radius-lg); display:flex; flex-direction:column; max-height:calc(100vh - 48px);
  overflow:hidden; box-shadow:0 20px 50px rgba(46,20,46,.22); }
.mm-card--sm{ max-width:440px; }
.mm-card--md{ max-width:520px; }
.mm-card--lg{ max-width:640px; }
.mm-handle{ display:none; }
.mm-head{ display:flex; align-items:flex-start; gap:12px; padding:28px 28px 4px; }
.mm-head-txt{ flex:1 1 auto; min-width:0; }
.mm-title{ margin:0; font-size:24px; line-height:32px; font-weight:700; color:var(--ily-text-primary); }
.mm-sub{ margin:4px 0 0; font-size:14px; line-height:20px; color:var(--ily-text-muted); }
.mm-x{ width:36px; height:36px; flex:0 0 auto; margin:-2px -8px 0 0; display:flex; align-items:center; justify-content:center;
  border:0; background:none; border-radius:var(--ily-radius-sm); cursor:pointer; }
.mm-x:hover{ background:var(--ily-bg-brand-subtle); }
.mm-x img{ width:22px; height:22px; }
.mm-body{ flex:1 1 auto; overflow-y:auto; padding:20px 28px 24px; }
.mm-body:has(> .mc){ padding:0; }
.mm-foot{ display:flex; align-items:center; gap:12px; padding:16px 28px; background:var(--ily-bg-page); border-top:1px solid var(--ily-border-default); }
.mm-foot-btns{ display:flex; gap:10px; margin-left:auto; }
.mm-foot .ily-btn{ padding:9px 16px; }
.ily-btn:disabled{ opacity:.6; cursor:default; }
.ily-btn--lg{ justify-content:center; padding:11px 16px; }
.ily-btn--danger{ background:var(--ily-accent); color:#fff; border:0; }
.ily-btn--danger:hover{ background:#86192b; }
/* Campi */
.ily-field{ margin-bottom:16px; min-width:0; }
.ily-label{ display:block; margin-bottom:6px; font-size:13px; line-height:18px; color:var(--ily-text-muted); }
.ily-input{ display:block; width:100%; height:42px; padding:0 12px; border:1px solid var(--ily-border-default); border-radius:var(--ily-radius-sm);
  background:var(--ily-bg-surface); font-family:inherit; font-size:15px; line-height:20px; color:var(--ily-text-primary); }
.ily-input:focus{ outline:0; border-color:var(--ily-border-brand); box-shadow:0 0 0 3px var(--ily-bg-brand-subtle); }
.ily-input::placeholder{ color:#9ca3af; }
.ily-input:disabled{ background:#f7f6f8; color:var(--ily-text-muted); }
.ily-input--sm{ height:34px; width:96px; font-size:14px; }
.ily-textarea{ height:auto; min-height:72px; padding:10px 12px; resize:vertical; }
.ily-sel{ position:relative; }
.ily-sel select.ily-input{ appearance:none; -webkit-appearance:none; padding-right:38px; cursor:pointer; }
.ily-sel select.ily-input:disabled{ cursor:default; }
.ily-sel-chev{ position:absolute; right:12px; top:50%; transform:translateY(-50%); pointer-events:none; color:var(--ily-text-muted); }
.ily-datef-txt{ display:flex; align-items:center; padding-right:38px; overflow:hidden; white-space:nowrap; }
.ily-datef-short{ display:none; }
.ily-datef input[type=date]{ position:absolute; inset:0; width:100%; height:100%; opacity:0; cursor:pointer; border:0; padding:0; }
.ily-datef:focus-within .ily-datef-txt{ border-color:var(--ily-border-brand); box-shadow:0 0 0 3px var(--ily-bg-brand-subtle); }
.ily-check{ display:inline-flex; align-items:center; gap:10px; margin:0; font-size:14px; line-height:20px; color:var(--ily-text-primary); cursor:pointer; user-select:none; }
.ily-check input{ position:absolute; opacity:0; width:1px; height:1px; pointer-events:none; }
.ily-check-ui{ width:20px; height:20px; flex:0 0 auto; border:1.5px solid #c9c2cf; border-radius:5px; background:var(--ily-bg-surface) center/12px no-repeat; }
.ily-check input:checked + .ily-check-ui{ background-color:var(--ily-bg-brand); border-color:var(--ily-bg-brand); background-image:url(icons/check-white.svg); }
.ily-check input:focus-visible + .ily-check-ui{ box-shadow:0 0 0 3px var(--ily-bg-brand-subtle); }
.ily-check.is-disabled{ opacity:.5; cursor:default; }
.ily-info{ display:flex; align-items:center; gap:10px; padding:12px 14px; border-radius:var(--ily-radius-sm); background:var(--ily-status-closed-bg);
  font-size:14px; line-height:20px; color:var(--ily-text-primary); }
.ily-info img{ width:16px; height:16px; flex:0 0 auto; }
.ily-info--warn{ background:var(--ily-note-bg); }
/* Conferma (annulla / riapri / elimina) */
.mc{ text-align:center; padding:28px 28px 20px; }
.mc-ic{ width:52px; height:52px; margin:0 auto 16px; border-radius:26px; display:flex; align-items:center; justify-content:center; background:#fdecee; }
.mc-ic img{ width:24px; height:24px; }
.mc-ic--neutral{ background:var(--ily-status-closed-bg); }
.mc-title{ margin:0; font-size:20px; line-height:28px; font-weight:600; color:var(--ily-text-primary); overflow-wrap:anywhere; }
.mc-sum{ display:inline-block; margin-top:14px; padding:8px 14px; border-radius:var(--ily-radius-sm); background:var(--ily-bg-page);
  font-size:13px; line-height:18px; color:var(--ily-text-muted); }
.mc-note{ margin:12px 0 0; font-size:13px; line-height:18px; color:var(--ily-text-muted); }
.mc-acts{ display:flex; flex-direction:column; gap:10px; margin-top:20px; }
.mc-acts .ily-btn{ width:100%; }
.mc-back{ align-self:center; margin-top:2px; padding:6px 10px; border:0; background:none; font-family:inherit; font-size:13px; line-height:18px; color:var(--ily-text-brand); cursor:pointer; }
.mc-back:hover{ text-decoration:underline; }

/* Telefono: niente griglia (elenco dei giorni), schede, modali a tutto schermo o dal basso */
@media (max-width:767.98px){

  .ily-search{ order:-1; width:100%; margin:0; height:42px; }
  .ily-search input{ font-size:16px; }   /* 16px: niente zoom automatico su iOS */

  .mm-ov--full{ padding:0; align-items:stretch; }
  .mm-ov--full .mm-card--f4{ max-width:none; width:100%; height:100%; max-height:none; border-radius:0; }
  .mm-ov--full .mm-head{ align-items:center; padding:calc(10px + env(safe-area-inset-top)) 12px 10px; border-bottom:1px solid var(--ily-border-default); }
  .mm-ov--full .mm-head::after{ content:""; width:36px; flex:0 0 auto; }
  .mm-ov--full .mm-x{ order:-1; margin:0; }
  .mm-ov--full .mm-title{ font-size:17px; line-height:24px; font-weight:600; text-align:center; }
  .mm-ov--full .mm-sub{ display:none; }
  .mm-ov--full .mm-body{ padding:16px; }
  .mm-ov--full .mm-foot{ flex-direction:column; align-items:stretch; gap:10px; padding:12px 16px calc(12px + env(safe-area-inset-bottom)); background:var(--ily-bg-surface); }
  .mm-ov--full .mm-foot .ily-check{ font-size:13px; }
  .mm-ov--full .mm-foot-btns{ margin:0; }
  .mm-ov--full .mm-cancel{ display:none; }
  .mm-ov--full .mm-foot-btns .ily-btn--primary{ width:100%; justify-content:center; min-height:52px; border-radius:var(--ily-radius-md); font-size:16px; }
  .ily-input{ font-size:16px; }
  .ily-datef-long{ display:none; } .ily-datef-short{ display:inline; }

  .mm-ov--sheet{ padding:0; align-items:flex-end; }
  .mm-ov--sheet .mm-card--f4{ max-width:none; width:100%; max-height:90vh; border-radius:20px 20px 0 0; }
  .mm-ov--sheet .mm-handle{ display:block; width:40px; height:4px; border-radius:2px; background:var(--ily-border-default); margin:10px auto 0; flex:0 0 auto; }
  .mm-ov--sheet .mm-head{ padding:12px 20px 4px; }
  .mm-ov--sheet .mm-title{ font-size:20px; line-height:28px; }
  .mm-ov--sheet .mm-body{ padding:16px 20px calc(20px + env(safe-area-inset-bottom)); }
  .mm-ov--sheet .mm-foot{ padding:12px 20px calc(12px + env(safe-area-inset-bottom)); }
  .mm-ov--sheet .mm-body:has(> .mc){ padding:0; }
  .mc{ padding:12px 20px calc(20px + env(safe-area-inset-bottom)); }
  .mc-ic{ display:none; }
  .mc-sum{ margin-top:8px; padding:0; background:none; }
  .mc-acts .ily-btn{ min-height:52px; border-radius:var(--ily-radius-md); font-size:15px; }
  .mc-back{ font-size:15px; font-weight:600; }
}

/* ── 6. IMPOSTAZIONI: testate, barre, drawer dei moduli, configurazione ─── */

.ily-ic--link{ --ic:url(icons/link.svg); }
.set-back{ display:none; }
.set-bar{ display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:24px; min-height:36px; }
.set-count{ display:flex; align-items:baseline; flex-wrap:wrap; gap:4px 12px; font-size:12px; line-height:16px; color:var(--ily-text-muted); }
.set-count b{ font-size:15px; line-height:20px; font-weight:600; color:var(--ily-text-primary); }
.set-count-sub{ font-size:12px; line-height:16px; color:var(--ily-text-muted); white-space:nowrap; }
.set-hint{ margin:6px 0 0; font-size:12px; line-height:16px; color:var(--ily-text-muted); }
.set-tag{ display:inline-flex; align-items:center; padding:4px 10px; border-radius:var(--ily-radius-full); background:#f3f1f5;
  font-size:12px; line-height:16px; color:var(--ily-text-primary); white-space:nowrap; }
.set-pill{ display:inline-flex; align-items:center; margin-left:8px; padding:1px 8px; border-radius:var(--ily-radius-full);
  background:var(--ily-status-closed-bg); color:var(--ily-text-muted); font-size:11px; line-height:16px; font-weight:500; vertical-align:middle; }
.set-chip{ display:inline-flex; align-items:center; gap:6px; padding:3px 10px; border-radius:var(--ily-radius-full); background:var(--ily-bg-brand-subtle);
  color:var(--ily-text-brand); font-size:12px; line-height:16px; font-weight:500; white-space:nowrap; }
.set-chip .ily-ic{ width:12px; height:12px; }
.ily-btn--sm{ padding:5px 12px !important; font-size:13px; line-height:18px; gap:6px; }
.ily-switch--solo{ gap:0; flex:0 0 auto; }
.set-empty{ background:var(--ily-bg-surface); border:1px solid var(--ily-border-default); border-radius:var(--ily-radius-lg);
  padding:48px 24px; text-align:center; }
.set-empty-ic{ width:56px; height:56px; margin:0 auto 16px; border-radius:28px; background:var(--ily-bg-brand-subtle); color:var(--ily-text-brand);
  display:flex; align-items:center; justify-content:center; }
.set-empty-ic .ily-ic{ width:26px; height:26px; }
.set-empty h2{ margin:0; font-size:18px; line-height:26px; font-weight:600; color:var(--ily-text-primary); }
.set-empty p{ max-width:460px; margin:8px auto 20px; font-size:14px; line-height:20px; color:var(--ily-text-muted); }
.set-empty .ily-btn{ display:inline-flex; }
/* Riquadro con interruttore (Risorsa attiva, Disdetta online...) */
.set-toggle-box{ display:flex; align-items:center; justify-content:space-between; gap:16px; padding:14px 16px; border-radius:var(--ily-radius-md);
  background:var(--ily-bg-page); margin-bottom:16px; }
.set-toggle-box b{ display:block; font-size:15px; line-height:20px; font-weight:600; color:var(--ily-text-primary); }
.set-toggle-box span{ display:block; font-size:12px; line-height:16px; color:var(--ily-text-muted); }
.set-num{ display:flex; align-items:center; gap:10px; }
.set-num .ily-input{ width:120px; flex:0 0 auto; }
.set-num span{ font-size:14px; line-height:20px; color:var(--ily-text-muted); white-space:nowrap; }
.set-label-row{ display:flex; align-items:baseline; justify-content:space-between; gap:12px; }
.set-check-list{ border:1px solid var(--ily-border-default); border-radius:var(--ily-radius-md); overflow:hidden; max-height:360px; overflow-y:auto; }
.set-check-row{ display:flex; align-items:center; gap:12px; margin:0; padding:12px 14px; border-top:1px solid var(--ily-border-default); cursor:pointer; }
.set-check-row:first-child{ border-top:0; }
.set-check-row:hover{ background:var(--ily-bg-page); }
.set-check-row input{ position:absolute; opacity:0; width:1px; height:1px; pointer-events:none; }
.set-check-row input:checked + .ily-check-ui{ background-color:var(--ily-bg-brand); border-color:var(--ily-bg-brand); background-image:url(icons/check-white.svg); }
.set-check-row input:focus-visible + .ily-check-ui{ box-shadow:0 0 0 3px var(--ily-bg-brand-subtle); }
.set-check-row.is-off .set-check-name{ color:var(--ily-text-muted); }
.set-check-name{ flex:1 1 auto; min-width:0; font-size:14px; line-height:20px; font-weight:600; }
.set-check-meta{ font-size:12px; line-height:16px; color:var(--ily-text-muted); white-space:nowrap; }
.set-chip-checks{ display:flex; flex-wrap:wrap; gap:8px; }
.set-chip-check{ margin:0; cursor:pointer; }
.set-chip-check input{ position:absolute; opacity:0; width:1px; height:1px; pointer-events:none; }
.set-chip-check > span{ display:inline-flex; align-items:center; gap:6px; padding:7px 12px; border:1px solid var(--ily-border-default); border-radius:var(--ily-radius-full);
  background:var(--ily-bg-surface); font-size:13px; line-height:18px; font-weight:500; color:var(--ily-text-primary); }
.set-chip-check > span .ily-ic{ width:14px; height:14px; color:var(--ily-text-muted); }
.set-chip-check small{ font-size:12px; color:var(--ily-text-muted); font-weight:400; }
.set-chip-check input:checked + span{ background:var(--ily-bg-brand-subtle); border-color:var(--ily-border-brand); color:var(--ily-text-brand); }
.set-chip-check input:checked + span .ily-ic{ color:var(--ily-text-brand); }
.set-chip-check input:focus-visible + span{ box-shadow:0 0 0 3px var(--ily-bg-brand-subtle); }
.set-chip-check.is-off > span{ opacity:.6; }
.mc-list{ list-style:none; margin:14px 0 0; padding:8px 14px; max-height:180px; overflow-y:auto; text-align:left; border-radius:var(--ily-radius-sm);
  background:var(--ily-bg-page); font-size:13px; line-height:18px; color:var(--ily-text-primary); }
.mc-list li{ padding:5px 0; border-top:1px solid var(--ily-border-default); overflow-wrap:anywhere; }
.mc-list li:first-child{ border-top:0; }

/* Drawer dei moduli: 520px da destra, Annulla · Salva nel piede */
.sd{ width:520px; }
.sd-head{ flex:0 0 auto; display:flex; align-items:center; justify-content:space-between; gap:12px; padding:24px 28px 20px; border-bottom:1px solid var(--ily-border-default); }
.sd-title{ margin:0; min-width:0; font-size:24px; line-height:32px; font-weight:700; color:var(--ily-text-primary); overflow-wrap:anywhere; }
.sd-body{ flex:1 1 auto; overflow-y:auto; padding:24px 28px 28px; }
.sd-foot{ flex:0 0 auto; display:flex; justify-content:flex-end; gap:10px; padding:16px 28px; background:var(--ily-bg-page); border-top:1px solid var(--ily-border-default); }
.sd-foot .ily-btn{ padding:9px 16px; }
.sd-head--x{ flex-direction:column; align-items:stretch; gap:12px; padding-bottom:0; }
.sd-head-row{ display:flex; align-items:flex-start; justify-content:space-between; gap:12px; }
.sd-foot-start{ margin-right:auto; display:flex; align-items:center; }

.sd-body .set-hint + .set-toggle-box{ margin-bottom:20px; }

/* Gruppi di tavoli */
.grp-info{ display:flex; gap:14px; padding:16px 20px; margin-bottom:24px; border-radius:var(--ily-radius-md); background:var(--ily-bg-brand-subtle); }
.grp-info > .ily-ic{ width:22px; height:22px; margin-top:10px; color:var(--ily-text-brand); }
.grp-info b{ display:block; font-size:14px; line-height:20px; font-weight:600; color:var(--ily-text-brand); }
.grp-info p{ margin:2px 0 0; font-size:14px; line-height:20px; color:var(--ily-text-primary); }

/* Configurazione: riquadri in griglia (affiancati se ci stanno, 2 o piu' colonne da 520px),
   dentro ogni riquadro titolo e spiegazione in alto e campi sotto; stessa altezza per riga */
.cfg-grid{ display:grid; grid-template-columns:repeat(auto-fit, minmax(520px, 1fr)); gap:24px; align-items:stretch; }
.cfg-sec{ display:flex; flex-direction:column; min-width:0; padding:28px;
  background:var(--ily-bg-surface); border:1px solid var(--ily-border-default); border-radius:var(--ily-radius-lg); }
.cfg-l{ margin-bottom:24px; }
.cfg-l p{ max-width:560px; }
.cfg-l h2{ margin:0; font-size:18px; line-height:26px; font-weight:600; color:var(--ily-text-primary); }
.cfg-l p{ margin:8px 0 0; font-size:13px; line-height:18px; color:var(--ily-text-muted); }
.cfg-r .ily-label{ font-size:14px; line-height:20px; font-weight:600; color:var(--ily-text-primary); margin-bottom:8px; }
.cfg-r .ily-sel{ max-width:560px; }   /* campo di testo lungo (fuso orario): largo ma leggibile */
.cfg-r .ily-field:last-child{ margin-bottom:0; }
.cfg-savebar{ display:none; position:fixed; left:var(--ily-sidebar-w); right:0; bottom:0; z-index:1025; align-items:center; justify-content:space-between; gap:16px;
  padding:14px 32px; background:var(--ily-bg-surface); border-top:1px solid var(--ily-border-default); box-shadow:0 -4px 16px rgba(46,20,46,.06); }
.cfg-savebar-btns{ display:flex; gap:10px; }

/* Tablet: griglie piu' strette, eccezioni sotto le schede */
@media (max-width:1199.98px){
  .cfg-grid{ grid-template-columns:minmax(0,1fr); }   /* tablet e telefono: una colonna */
  .cfg-savebar{ padding:14px 24px; }
}

/* Telefono: testata "‹ Altro", schede in colonna, "+" in basso, barra Annulla · Salva */
@media (max-width:767.98px){
  .set-head{ margin:-16px -16px 16px; padding:calc(16px + env(safe-area-inset-top)) 16px 14px; background:var(--ily-bg-surface); border-bottom:1px solid var(--ily-border-default); }
  .set-head .ily-page-sub{ display:none; }
  .set-back{ display:inline-flex; align-items:center; gap:4px; margin:0 0 6px -4px; padding:4px; border:0; background:none; font-family:inherit;
    font-size:13px; line-height:18px; font-weight:500; color:var(--ily-text-brand); cursor:pointer; }
  .set-bar{ margin-bottom:12px; min-height:0; }
  .set-count b{ font-size:13px; font-weight:500; color:var(--ily-text-muted); }
  .set-empty{ padding:32px 20px; }
  .grp-info{ padding:14px 16px; margin-bottom:16px; }
  .sd-head{ padding:calc(12px + env(safe-area-inset-top)) 16px 12px; }
  .sd-title{ font-size:18px; line-height:26px; }
  .sd-body{ padding:16px; }
  .sd-foot{ padding:12px 16px calc(12px + env(safe-area-inset-bottom)); background:var(--ily-bg-surface); }
  .sd-foot .ily-btn{ flex:1 1 0; justify-content:center; min-height:48px; border-radius:var(--ily-radius-md); font-size:15px; }
  .cfg-grid{ gap:12px; }
  .cfg-sec{ padding:18px; }
  .cfg-l{ margin-bottom:16px; }
  .cfg-r .ily-sel{ max-width:none; }
  .cfg-savebar{ left:0; z-index:1035; padding:12px 16px calc(12px + env(safe-area-inset-bottom)); }
  .cfg-savebar-btns{ width:100%; }
  .cfg-savebar-btns .ily-btn{ flex:1 1 0; justify-content:center; min-height:52px; border-radius:var(--ily-radius-md); font-size:15px; }
}

/* ── 7. ACCESSO e riquadro "Come funziona" ──────────────────────────────── */

.acc{ display:flex; min-height:100vh; min-height:100dvh; background:var(--ily-bg-surface); }
.acc-hero{ flex:1 1 50%; display:flex; align-items:center; padding:48px 64px 48px 96px; background-color:var(--ily-bg-brand-subtle);
  background-image:repeating-linear-gradient(to bottom, transparent 0, transparent 35px, rgba(109,47,102,.09) 35px, rgba(109,47,102,.09) 36px); }
.acc-hero-in{ max-width:580px; }
.acc-eyebrow{ font-size:11px; line-height:16px; font-weight:500; letter-spacing:.08em; text-transform:uppercase; color:var(--ily-text-brand); }
.acc-hl{ margin:24px 0 0; font-size:64px; line-height:68px; font-weight:700; letter-spacing:-.02em; color:#111; }
.acc-hl em{ font-style:italic; color:var(--ily-text-brand); }
.acc-lead{ margin:32px 0 0; font-size:18px; line-height:28px; color:var(--ily-text-muted); }
.acc-pills{ display:flex; flex-wrap:wrap; gap:8px; margin-top:24px; }
.acc-pills span{ padding:6px 14px; border:1px solid var(--ily-border-default); border-radius:var(--ily-radius-full); background:var(--ily-bg-surface);
  font-size:13px; line-height:18px; color:var(--ily-text-primary); }
.acc-form{ flex:1 1 50%; display:flex; align-items:center; justify-content:center; padding:48px 32px; }
.acc-card{ width:100%; max-width:400px; }
.acc-logo{ display:flex; align-items:center; gap:10px; margin-bottom:32px; font-size:20px; line-height:28px; font-weight:600; color:var(--ily-text-primary); }
.acc-logo .ily-logo-mark{ width:36px; height:36px; border-radius:8px; font-size:18px; }
.acc-title{ margin:0; font-size:32px; line-height:40px; font-weight:700; color:var(--ily-text-primary); }
.acc-sub{ margin:8px 0 24px; font-size:14px; line-height:20px; color:var(--ily-text-muted); overflow-wrap:anywhere; }
.acc-sub.d-none + .alert, .acc-sub.d-none ~ .acc-view{ margin-top:24px; }
.acc-card .alert{ font-size:14px; padding:10px 14px; margin-bottom:16px; }
.acc-input{ height:46px; }
.acc-row-end{ display:flex; justify-content:flex-end; margin:-4px 0 20px; }
.acc-row-center{ display:flex; justify-content:center; margin-top:16px; }
.acc-link{ border:0; background:none; padding:2px 0; font-family:inherit; font-size:13px; line-height:18px; font-weight:500; color:var(--ily-text-brand); cursor:pointer; }
.acc-link:hover{ text-decoration:underline; }
.acc-btn{ display:flex; align-items:center; justify-content:center; width:100%; height:48px; border:0; border-radius:var(--ily-radius-sm);
  background:var(--ily-bg-brand); color:var(--ily-text-on-brand); font-family:inherit; font-size:15px; line-height:20px; font-weight:600; cursor:pointer; }
.acc-btn:hover{ background:var(--ily-bg-brand-hover); }
.acc-btn:disabled{ opacity:.6; cursor:default; }
.acc-btn:focus-visible, .acc-link:focus-visible{ outline:3px solid var(--ily-bg-brand-subtle); outline-offset:2px; }
.acc-btn--sec{ background:var(--ily-bg-surface); color:var(--ily-text-primary); border:1px solid var(--ily-border-default); }
.acc-btn--sec:hover{ background:var(--ily-bg-brand-subtle); }
.acc-reqs{ list-style:none; display:flex; flex-wrap:wrap; gap:4px 16px; margin:-4px 0 20px; padding:0; font-size:12px; line-height:16px; color:var(--ily-text-muted); }
.acc-reqs li{ display:flex; align-items:center; gap:6px; }
.acc-reqs i{ width:7px; height:7px; border-radius:4px; background:#c9c2cf; transition:background .15s; }
.acc-reqs li.ok{ color:var(--ily-text-primary); }
.acc-reqs li.ok i{ background:var(--ily-status-free-fg); }
.acc-note{ margin-top:28px; padding:14px 16px; border-radius:var(--ily-radius-md); background:var(--ily-bg-page); font-size:13px; line-height:19px; color:var(--ily-text-muted); }
.acc-note b{ color:var(--ily-text-primary); font-weight:600; }
.acc-note a{ color:var(--ily-text-brand); font-weight:500; }
.acc-msg{ display:flex; gap:12px; align-items:flex-start; padding:16px; margin-bottom:12px; border-radius:var(--ily-radius-md); background:var(--ily-status-free-bg); }
.acc-msg p{ margin:0; font-size:14px; line-height:20px; color:var(--ily-text-primary); }
.acc-msg-ic{ width:24px; height:24px; flex:0 0 auto; border-radius:12px; background:var(--ily-status-free-fg); display:flex; align-items:center; justify-content:center; }
.acc-msg-ic img{ width:12px; height:12px; }
.acc-msg--warn{ background:var(--ily-note-bg); }
.acc-msg--warn .acc-msg-ic{ background:var(--ily-bg-surface); }
.acc-msg--warn .acc-msg-ic img{ width:16px; height:16px; }
.acc-hint{ margin:0 0 24px; font-size:13px; line-height:18px; color:var(--ily-text-muted); }
@media (max-width:1199.98px){
  .acc-hero{ padding:48px 48px 48px 56px; }
  .acc-hl{ font-size:52px; line-height:56px; }
}
@media (max-width:859.98px){
  .acc-hero{ display:none; }
  .acc-form{ align-items:flex-start; padding:96px 24px 32px; }
  .acc-card{ max-width:none; }
  .acc-logo{ margin-bottom:28px; }
  .acc-input{ font-size:16px; }   /* niente zoom automatico su iOS */
}
/* Lingua sulla schermata di accesso (correzione Fase 6) */
.acc-form{ position:relative; }
.acc-lang{ position:absolute; top:24px; right:24px; }
@media (max-width:859.98px){ .acc-lang{ top:calc(16px + env(safe-area-inset-top)); right:16px; } }
/* Riquadro "Come funziona" di Risorse, Servizi, Orari (stile di Unione risorse) */
.set-how{ position:relative; }
.set-how p a{ color:var(--ily-text-brand); font-weight:600; text-decoration:underline; text-underline-offset:2px; }
.set-how-x{ display:none; position:absolute; top:8px; right:8px; width:32px; height:32px; border:0; border-radius:var(--ily-radius-sm);
  background:none; color:var(--ily-text-muted); align-items:center; justify-content:center; cursor:pointer; }
.set-how-x:hover{ background:rgba(109,47,102,.08); color:var(--ily-text-brand); }
@media (max-width:767.98px){
  .set-head + .set-how{ margin-top:0; }
  .set-how{ padding-right:44px; }
  .set-how-x{ display:flex; }
  .set-how.is-closed{ display:none; }   /* chiuso dal telefono: resta chiuso */
}
