/* Inter unica famiglia del cockpit. Pesi importati 300..800: 800 è usato dai
   titoli onboarding/consumo (prima non importato → fallback silenzioso a 700). */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap');

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

:root {
  --purple-1: #7c4dff;
  --purple-2: #9b6bff;
  --purple-3: #b48aff;
  --purple-dark: #5533cc;
  --purple-bg: #f3efff;
  --bg: #0f0f14;
  --bg-2: #16161f;
  --bg-3: #1e1e2a;
  --bg-4: #252535;
  --bg-elevated: #151521;
  --border: #2a2a3d;
  --border-soft: rgba(180,138,255,0.16);
  --border-strong: rgba(180,138,255,0.34);
  --text: #e8e8f0;
  --text-2: #a0a0b8;
  --text-3: #606078;
  --surface: rgba(22,22,31,0.88);
  --surface-2: rgba(30,30,42,0.74);
  --surface-glass: linear-gradient(135deg, rgba(255,255,255,0.055), rgba(124,77,255,0.045)), rgba(22,22,31,0.76);
  --surface-glass-strong: linear-gradient(135deg, rgba(255,255,255,0.07), rgba(124,77,255,0.065)), rgba(15,15,20,0.88);
  --surface-accent: linear-gradient(135deg, rgba(124,77,255,0.18), rgba(53,198,255,0.07)), rgba(22,22,31,0.78);
  --shadow-soft: 0 18px 60px rgba(0,0,0,0.24);
  --shadow-card: 0 12px 34px rgba(0,0,0,0.18);
  --shadow-glass: 0 22px 70px rgba(0,0,0,0.28), 0 1px 0 rgba(255,255,255,0.06) inset;
  --glass-blur: blur(18px) saturate(145%);
  --success: #22c55e;
  --danger: #ef4444;
  --warning: #f59e0b;
  --sidebar-w: 240px;
  --topbar-h: 60px;
  /* Colonna di contenuto desktop: stessa max-width centrata usata da topbar E body,
     così su schermi larghi/ultrawide header e contenuto restano allineati. */
  --content-max: 1400px;
  --content-pad: 28px;
}

html, body {
  height: 100%;
  font-family: 'Inter', sans-serif;
  background:
    linear-gradient(135deg, rgba(124,77,255,0.08), rgba(53,198,255,0.035) 38%, transparent 64%),
    linear-gradient(180deg, var(--bg) 0%, var(--bg-elevated) 100%);
  color: var(--text);
  font-size: 14px;
}

/* ===== LOGIN ===== */
.login-page {
  min-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(135deg, #0f0f14 0%, #1a1028 100%);
}
.login-card {
  background: var(--bg-2);
  border: 1px solid var(--border);
  border-radius: 16px;
  padding: 40px;
  width: 100%;
  max-width: 380px;
  box-shadow: 0 20px 60px rgba(124,77,255,0.15);
}
.login-logo {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 32px;
}
.login-logo img { width: 40px; height: 40px; object-fit: contain; }
.login-logo-text { font-size: 18px; font-weight: 700; background: linear-gradient(135deg, var(--purple-1), var(--purple-3)); -webkit-background-clip: text; -webkit-text-fill-color: transparent; }
.login-title { font-size: 22px; font-weight: 700; margin-bottom: 6px; }
.login-sub { color: var(--text-2); font-size: 13px; margin-bottom: 28px; }
.form-group { margin-bottom: 16px; }
.form-group label { display: block; font-size: 12px; font-weight: 600; color: var(--text-2); text-transform: uppercase; letter-spacing: 0.5px; margin-bottom: 6px; }
.form-control {
  width: 100%; padding: 10px 14px;
  background: var(--bg-3); border: 1px solid var(--border);
  border-radius: 8px; color: var(--text); font-size: 14px; font-family: inherit;
  transition: border-color 0.2s;
  outline: none;
}
.form-control:focus { border-color: var(--purple-1); box-shadow: 0 0 0 3px rgba(124,77,255,0.15); }
.btn-primary {
  width: 100%; padding: 11px; border: none; border-radius: 8px;
  background: linear-gradient(135deg, var(--purple-1), var(--purple-dark));
  color: #fff; font-size: 14px; font-weight: 600; cursor: pointer;
  transition: opacity 0.2s, transform 0.1s;
}
.btn-primary:hover { opacity: 0.9; }
.btn-primary:active { transform: scale(0.98); }
.alert-error { background: rgba(239,68,68,0.1); border: 1px solid rgba(239,68,68,0.3); border-radius: 8px; padding: 10px 14px; color: #fca5a5; font-size: 13px; margin-bottom: 16px; }

/* ===== LAYOUT ===== */
.app-layout { display: flex; height: 100vh; overflow: hidden; }

/* SIDEBAR */
.sidebar {
  width: var(--sidebar-w);
  background: var(--surface-glass-strong);
  border-right: 1px solid var(--border-soft);
  box-shadow: var(--shadow-soft);
  display: flex;
  flex-direction: column;
  flex-shrink: 0;
  height: 100vh;
  position: fixed;
  left: 0; top: 0;
  z-index: 100;
  transition: transform 0.25s ease;
}
.sidebar-logo {
  height: var(--topbar-h);
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 0 18px;
  border-bottom: 1px solid var(--border);
  flex-shrink: 0;
}
.sidebar-logo img { width: 30px; height: 30px; object-fit: contain; }
.sidebar-brand { font-size: 15px; font-weight: 700; background: linear-gradient(135deg, var(--purple-1), var(--purple-3)); -webkit-background-clip: text; -webkit-text-fill-color: transparent; }
.sidebar-nav { flex: 1; overflow-y: auto; padding: 12px 0; }
.nav-section { padding: 8px 18px 4px; font-size: 10px; font-weight: 600; color: var(--text-2); text-transform: uppercase; letter-spacing: 1px; }
.nav-item {
  display: flex; align-items: center; gap: 10px;
  padding: 9px 18px; color: var(--text-2); text-decoration: none;
  font-size: 13.5px; font-weight: 500;
  border-radius: 0;
  transition: background 0.15s, color 0.15s;
  cursor: pointer;
}
.nav-item:hover { background: rgba(124,77,255,0.10); color: var(--text); }
.nav-item.active { background: linear-gradient(90deg, rgba(124,77,255,0.22), rgba(124,77,255,0.06)); color: var(--purple-2); border-right: 3px solid var(--purple-1); }
.nav-item.disabled { opacity: 0.35; cursor: not-allowed; pointer-events: none; }
.nav-item svg { width: 16px; height: 16px; flex-shrink: 0; }
.nav-sub-item { padding-left: 36px; font-size: 12.5px; color: var(--text-2); }
/* label + sottotitolo della voce (es. Appuntamenti -> "Richieste di consulenza") */
.nav-item-text { display: flex; flex-direction: column; min-width: 0; line-height: 1.25; }
.nav-item-text .nav-item-sub { font-size: 10.5px; font-weight: 400; color: var(--text-3); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.nav-badge { margin-left: auto; font-size: 10px; font-weight: 600; background: rgba(124,77,255,0.15); border: 1px solid rgba(124,77,255,0.3); border-radius: 999px; padding: 1px 7px; color: var(--purple-2); font-variant-numeric: tabular-nums; }
.nav-tools { margin-top: 10px; border-top: 1px solid var(--border-soft); padding-top: 8px; }
.nav-tools > summary { list-style: none; }
.nav-tools > summary::-webkit-details-marker { display: none; }
.nav-tools-trigger { width: 100%; }
.nav-tools-chevron { margin-left: auto; transition: transform 0.18s ease; }
.nav-tools[open] .nav-tools-chevron { transform: rotate(90deg); }
.nav-tools-list { padding: 2px 0 8px; }
.nav-tools-list .nav-section { padding-left: 30px; }
.nav-tool-item { padding-left: 30px; font-size: 13px; }
.sidebar-utility-nav { margin: -4px -18px 10px; padding-bottom: 10px; border-bottom: 1px solid var(--border-soft); }
.sidebar-utility-nav .nav-item { padding-top: 7px; padding-bottom: 7px; }
.sidebar-footer { padding: 14px 18px; border-top: 1px solid var(--border-soft); }
.sidebar-user {
  display: flex; align-items: center; gap: 8px;
  width: 100%; min-width: 0; margin-bottom: 4px; padding: 8px 10px;
  background: var(--surface-2); border: 1px solid var(--border-soft);
  border-radius: 8px; color: var(--text-2); font-size: 12px;
  overflow: hidden;
}
.sidebar-user-icon { flex: 0 0 auto; }
.sidebar-user-copy { display: flex; flex-direction: column; min-width: 0; line-height: 1.25; }
.sidebar-user-name {
  min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.sidebar-user-role {
  color: var(--text-3); font-size: 10.5px;
}
.sidebar-logout {
  width: 100%; background: none; border: none; color: var(--text-2);
  font: inherit; text-align: left;
}
.sidebar-logout svg { width: 16px; height: 16px; }

/* TOPBAR */
/* main-wrap deve RIEMPIRE lo spazio del viewport accanto alla sidebar (fixed).
   La sidebar è position:fixed → fuori dal flusso, quindi main-wrap è l'unico
   figlio in-flow di .app-layout: senza flex-grow la sua larghezza collassava sul
   max-content del contenuto (~753px) e la topbar la ereditava ("header che cambia
   in base al contenuto"). flex:1 + min-width:0 → larghezza coerente = viewport - sidebar. */
.main-wrap { margin-left: var(--sidebar-w); flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; height: 100vh; overflow: hidden; }
/* La topbar è una barra full-bleed (sfondo + bordo a tutta larghezza). Il suo
   CONTENUTO vive in .topbar-inner, centrato sullo stesso container del body. */
.topbar {
  height: var(--topbar-h); min-height: var(--topbar-h); /* altezza FISSA, mai guidata dal contenuto */
  background: var(--surface-glass-strong);
  border-bottom: 1px solid var(--border-soft);
  box-shadow: var(--shadow-soft);
  display: flex; align-items: stretch;
  padding: 0; flex-shrink: 0;
}
/* Allineamento esatto con .dash-wrap a ogni larghezza:
   max-width = content-max + 2*pad + padding pad → il bordo del contenuto interno
   coincide con il bordo di .dash-wrap (vedi .main-content/.dash-wrap sotto). */
.topbar-inner {
  width: 100%;
  max-width: calc(var(--content-max) + 2 * var(--content-pad));
  margin: 0 auto;
  padding: 0 var(--content-pad);
  display: flex; align-items: center; justify-content: space-between;
  gap: 20px;
}
.topbar-left { display: flex; align-items: center; gap: 14px; flex-shrink: 0; min-width: 0; }
.hamburger { display: none; background: none; border: none; color: var(--text); cursor: pointer; padding: 6px; border-radius: 6px; }
.hamburger:hover { background: var(--bg-3); }
.topbar-title { font-size: 15px; font-weight: 600; color: var(--text); min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.topbar-right { display: flex; align-items: center; justify-content: flex-end; gap: 8px; min-width: 0; flex-shrink: 0; }
@media (max-width: 768px) {
  .topbar-inner { gap: 8px; }
  .topbar-left { flex: 1 1 auto; }
  .topbar-title { max-width: 42vw; }
}

/* MAIN CONTENT */
.main-content { flex: 1; overflow-y: auto; padding: 28px var(--content-pad); }
/* Dashboard: contenuto centrato sulla stessa colonna della topbar (allineati a
   ogni larghezza, vedi .topbar-inner). */
.dash-wrap { max-width: var(--content-max); margin: 0 auto; }

/* OVERLAY */
.sidebar-overlay { display: none; position: fixed; inset: 0; background: rgba(0,0,0,0.5); z-index: 99; }

/* ===== STAT CARDS ===== */
.stats-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 16px; margin-bottom: 28px; }
/* .stat-card: allineato ai token del sistema KPI canonico (.kpi-card) — stesso
   radius, stesso trattamento accent, numeri tabular-nums. Sistema KPI unico. */
.stat-card {
  background: var(--surface-glass); border: 1px solid var(--border-soft);
  border-radius: var(--radius, 12px); padding: 20px;
  box-shadow: var(--shadow-card);
}
.stat-label { font-size: 11px; font-weight: 600; color: var(--text-2); text-transform: uppercase; letter-spacing: 0.5px; margin-bottom: 8px; }
.stat-value { font-size: 32px; font-weight: 700; color: var(--text); font-variant-numeric: tabular-nums; }
.stat-card.accent { border-color: rgba(124,77,255,0.35); background: rgba(124,77,255,0.06); }
.stat-card.accent .stat-value { color: var(--purple-2); }

/* ===== PAGE HEADER ===== */
.page-header { display: flex; align-items: center; justify-content: space-between; margin-bottom: 22px; flex-wrap: wrap; gap: 12px; }
.page-header-actions { display: flex; align-items: center; justify-content: flex-end; gap: 8px; flex-wrap: wrap; }
.page-title { font-size: 20px; font-weight: 700; }
.page-sub { color: var(--text-2); font-size: 13px; margin-top: 2px; }

/* ===== BUTTONS ===== */
.btn { display: inline-flex; align-items: center; gap: 6px; width: auto; padding: 8px 16px; border-radius: 8px; font-size: 13px; font-weight: 600; cursor: pointer; border: none; text-decoration: none; transition: opacity 0.2s, transform 0.1s; font-family: inherit; }
.btn:active { transform: scale(0.98); }
.btn-sm { padding: 5px 12px; font-size: 12px; }
.btn-primary { background: linear-gradient(135deg, var(--purple-1), var(--purple-dark)); color: #fff; }
.btn-primary:hover { opacity: 0.88; }
.btn-secondary { background: var(--bg-3); border: 1px solid var(--border); color: var(--text-2); }
.btn-secondary:hover { color: var(--text); background: var(--bg-4); }
.btn-danger { background: rgba(239,68,68,0.12); border: 1px solid rgba(239,68,68,0.3); color: #fca5a5; }
.btn-danger:hover { background: rgba(239,68,68,0.2); }
.btn-outline { background: transparent; border: 1px solid var(--border); color: var(--text-2); }
.btn-outline:hover { border-color: var(--purple-2); color: var(--purple-3); }

/* ===== TABLE ===== */
.table-wrap { background: var(--bg-2); border: 1px solid var(--border); border-radius: 12px; overflow: hidden; }
.table-header { padding: 14px 20px; border-bottom: 1px solid var(--border); display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.table-search { background: var(--bg-3); border: 1px solid var(--border); border-radius: 8px; padding: 7px 12px; color: var(--text); font-size: 13px; font-family: inherit; outline: none; width: 240px; }
.table-search:focus { border-color: var(--purple-1); }
table { width: 100%; border-collapse: collapse; }
thead th { padding: 11px 16px; text-align: left; font-size: 11px; font-weight: 600; color: var(--text-2); text-transform: uppercase; letter-spacing: 0.5px; border-bottom: 1px solid var(--border); }
tbody tr { border-bottom: 1px solid var(--border); transition: background 0.1s; }
tbody tr:last-child { border-bottom: none; }
tbody tr:hover { background: var(--bg-3); }
tbody td { padding: 12px 16px; font-size: 13.5px; color: var(--text); }
.td-sub { font-size: 12px; color: var(--text-2); margin-top: 2px; }

/* Badge */
.badge { display: inline-block; padding: 3px 8px; border-radius: 5px; font-size: 11px; font-weight: 600; text-transform: uppercase; letter-spacing: 0.3px; }
.badge-success { background: rgba(34,197,94,0.12); color: #86efac; border: 1px solid rgba(34,197,94,0.25); }
.badge-warning { background: rgba(245,158,11,0.12); color: #fcd34d; border: 1px solid rgba(245,158,11,0.25); }
.badge-service { background: rgba(124,77,255,0.12); color: var(--purple-3); border: 1px solid rgba(124,77,255,0.25); margin: 2px; }

/* ===== FORM ===== */
.form-card { background: var(--bg-2); border: 1px solid var(--border); border-radius: 12px; padding: 24px; margin-bottom: 20px; }
.form-section-title { font-size: 12px; font-weight: 700; color: var(--text-2); text-transform: uppercase; letter-spacing: 0.7px; margin-bottom: 16px; padding-bottom: 8px; border-bottom: 1px solid var(--border); }
.form-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 16px; }
.form-grid.cols-2 { grid-template-columns: repeat(2, 1fr); }
.form-full { grid-column: 1 / -1; }
.form-label { display: block; font-size: 12px; font-weight: 600; color: var(--text-2); text-transform: uppercase; letter-spacing: 0.4px; margin-bottom: 5px; }
.form-input, .form-select, .form-textarea {
  width: 100%; padding: 9px 13px;
  background: var(--bg-3); border: 1px solid var(--border);
  border-radius: 8px; color: var(--text); font-size: 13.5px; font-family: inherit;
  transition: border-color 0.2s; outline: none;
}
.form-input:focus, .form-select:focus, .form-textarea:focus { border-color: var(--purple-1); box-shadow: 0 0 0 3px rgba(124,77,255,0.12); }
.form-select { cursor: pointer; appearance: none; }
.form-textarea { resize: vertical; min-height: 80px; }
.checkbox-group { display: flex; flex-wrap: wrap; gap: 10px; }
.checkbox-label { display: flex; align-items: center; gap: 8px; cursor: pointer; background: var(--bg-3); border: 1px solid var(--border); border-radius: 8px; padding: 8px 14px; font-size: 13px; transition: border-color 0.15s; }
.checkbox-label input { accent-color: var(--purple-1); width: 15px; height: 15px; cursor: pointer; }
.checkbox-label:has(input:checked) { border-color: var(--purple-1); background: rgba(124,77,255,0.1); color: var(--purple-3); }
.form-actions { display: flex; gap: 10px; align-items: center; padding-top: 4px; }

/* ===== DETAIL ===== */
.detail-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 16px; }
.detail-field label { font-size: 11px; font-weight: 600; color: var(--text-2); text-transform: uppercase; letter-spacing: 0.4px; display: block; margin-bottom: 4px; }
.detail-field span { font-size: 14px; color: var(--text); display: block; }
.detail-field span.empty { color: var(--text-2); font-style: italic; }
.detail-card { background: var(--bg-2); border: 1px solid var(--border); border-radius: 12px; padding: 22px; margin-bottom: 18px; }
.detail-section-title { font-size: 12px; font-weight: 700; color: var(--text-2); text-transform: uppercase; letter-spacing: 0.7px; margin-bottom: 16px; padding-bottom: 8px; border-bottom: 1px solid var(--border); }

/* ===== CARD MOBILE (clienti) ===== */
.client-cards { display: none; }
.client-card { background: var(--bg-2); border: 1px solid var(--border); border-radius: 12px; padding: 16px; margin-bottom: 12px; }
.client-card-top { display: flex; justify-content: space-between; align-items: flex-start; margin-bottom: 8px; }
.client-card-name { font-size: 15px; font-weight: 600; }
.client-card-meta { font-size: 12px; color: var(--text-2); margin-bottom: 10px; }
.client-card-actions { display: flex; gap: 8px; }

/* ===== CARD MOBILE (task) ===== */
.task-cards { display: none; }
.task-card { background: var(--bg-2); border: 1px solid var(--border); border-radius: 12px; padding: 16px; margin-bottom: 12px; }
.task-card.task-card-done { opacity: 0.6; }
.task-card-top { display: flex; justify-content: space-between; align-items: flex-start; gap: 8px; margin-bottom: 6px; }
.task-card-title { font-size: 15px; font-weight: 600; color: var(--text); text-decoration: none; flex: 1; min-width: 0; }
.task-card-detail { font-size: 12px; color: var(--text-2); margin-bottom: 8px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.task-card-meta { font-size: 12px; color: var(--text-2); margin-bottom: 10px; display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.task-card-actions { display: flex; gap: 8px; flex-wrap: wrap; }

/* ===== RESPONSIVE ===== */
@media (max-width: 768px) {
  .sidebar { transform: translateX(calc(-100% - 12px)); visibility: hidden; pointer-events: none; box-shadow: none; }
  .sidebar.open { transform: translateX(0); visibility: visible; pointer-events: auto; box-shadow: var(--shadow-soft); }
  .sidebar-overlay.open { display: block; }
  .main-wrap { margin-left: 0; }
  .hamburger { display: flex; }
  /* su mobile la colonna usa pad ridotto: topbar-inner e main-content restano allineati */
  :root { --content-pad: 16px; }
  .main-content { padding: 18px var(--content-pad); }

  .table-wrap table { display: none; }
  .client-cards { display: block; }
  .order-cards { display: block; }
  .enroll-cards { display: block; }
  .task-cards { display: block; }

  .form-grid, .form-grid.cols-2 { grid-template-columns: 1fr; }
  .detail-grid { grid-template-columns: 1fr 1fr; }
  .stats-grid { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 480px) {
  .detail-grid { grid-template-columns: 1fr; }
  .stats-grid { grid-template-columns: 1fr 1fr; }
}

/* ===== TABELLA RESPONSIVE RIUSABILE (.table-stack) =====
   Convenzione design-system (studio UI §4.2): per le tabelle READ-ONLY,
   invece di duplicare i dati in card a mano, una sola classe trasforma la
   tabella in blocchi impilati su mobile. La label di colonna viene dall'attr
   data-label su ogni <td>. Nessuna duplicazione di markup, niente divergenza.
   Override esplicito della regola globale che nasconde .table-wrap table <=768px. */
@media (max-width: 768px) {
  .table-wrap.table-stack table,
  .table-wrap.table-stack tbody,
  .table-wrap.table-stack tr,
  .table-wrap.table-stack td { display: block; width: 100%; }
  .table-wrap.table-stack thead { display: none; }
  .table-wrap.table-stack tr {
    background: var(--bg-2); border: 1px solid var(--border);
    border-radius: var(--radius); padding: 8px 14px; margin-bottom: 12px;
  }
  .table-wrap.table-stack td {
    display: flex; justify-content: space-between; gap: 16px;
    padding: 5px 0; border: 0; font-size: 13px; text-align: right;
  }
  .table-wrap.table-stack td::before {
    content: attr(data-label); color: var(--text-2); font-weight: 600;
    text-align: left; flex-shrink: 0;
  }
  /* celle senza label (es. colonna azioni) restano allineate a sinistra */
  .table-wrap.table-stack td:not([data-label]) { justify-content: flex-start; text-align: left; }
}

/* ===== ORDER STATUS BADGES ===== */
.badge-order-pending   { background: rgba(100,100,120,0.15); color: var(--text-2); border: 1px solid var(--border); }
.badge-order-paid      { background: rgba(96,165,250,0.12); color: #93c5fd; border: 1px solid rgba(96,165,250,0.25); }
.badge-order-shipped   { background: rgba(124,77,255,0.12); color: var(--purple-3); border: 1px solid rgba(124,77,255,0.25); }
.badge-order-fulfilled { background: rgba(34,197,94,0.12); color: #86efac; border: 1px solid rgba(34,197,94,0.25); }
.badge-order-cancelled { background: rgba(239,68,68,0.12); color: #fca5a5; border: 1px solid rgba(239,68,68,0.25); }

/* ===== ORDER CARDS MOBILE ===== */
.order-cards { display: none; }
.order-card { background: var(--bg-2); border: 1px solid var(--border); border-radius: 12px; padding: 16px; margin-bottom: 12px; }
.order-card-top { display: flex; justify-content: space-between; align-items: center; margin-bottom: 6px; }
.order-card-meta { font-size: 12px; color: var(--text-2); margin-bottom: 8px; }

/* ===== ELEARNING BADGES ===== */
.badge-enroll-active { background: rgba(124,77,255,0.12); color: var(--purple-3); border: 1px solid rgba(124,77,255,0.25); }
.badge-enroll-done   { background: rgba(34,197,94,0.12); color: #86efac; border: 1px solid rgba(34,197,94,0.25); }

/* ===== ENROLL CARDS MOBILE ===== */
.enroll-cards { display: none; }
.enroll-card { background: var(--bg-2); border: 1px solid var(--border); border-radius: 12px; padding: 16px; margin-bottom: 12px; }
.enroll-card-top { display: flex; justify-content: space-between; align-items: center; margin-bottom: 6px; }
.enroll-card-meta { font-size: 12px; color: var(--text-2); margin-bottom: 8px; }

/* ===== UTILITY (estratte dagli inline ripetuti: mono, muted) ===== */
.mono { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; }
.muted { color: var(--text-2); }
.muted-3 { color: var(--text-3); }

/* ===== SUBTABS (tab di sezione dentro una pagina, es. Lead / Report SLA) ===== */
.subtabs { display: flex; flex-wrap: wrap; gap: 2px; border-bottom: 1px solid var(--border); margin-bottom: 20px; }
.subtab {
  display: inline-flex; align-items: center; gap: 6px;
  font-size: 13.5px; font-weight: 600; color: var(--text-2); text-decoration: none;
  padding: 9px 14px; border-radius: 8px 8px 0 0; white-space: nowrap;
  border-bottom: 2px solid transparent; margin-bottom: -1px;
  transition: color .15s, border-color .15s, background .15s;
}
.subtab:hover { color: var(--text); background: var(--bg-3); }
.subtab.active { color: var(--purple-2); border-bottom-color: var(--purple-1); }

/* ===== EMPTY STATE =====
   Canonico per nuovo lavoro: .empty-v2 (icona in box tinto + h4 + p).
   .empty-state (legacy, svg+p) è qui allineato allo STESSO linguaggio visivo
   (stessa spaziatura, colori token, icona soft) così i due leggono come uno. */
.empty-state { padding: var(--s6, 48px) var(--s4, 24px); text-align: center; color: var(--text-2); }
.empty-state svg { width: 46px; height: 46px; margin-bottom: 10px; opacity: 0.45; stroke: var(--primary-2); }
.empty-state p { font-size: var(--fs-md, 15px); margin-bottom: 16px; max-width: 360px; margin-left: auto; margin-right: auto; }

/* ===== CONFIRM DIALOG ===== */
.confirm-overlay { display: none; position: fixed; inset: 0; background: rgba(0,0,0,0.6); z-index: 200; align-items: center; justify-content: center; }
.confirm-overlay.open { display: flex; }
.confirm-box { background: var(--bg-2); border: 1px solid var(--border); border-radius: 14px; padding: 28px; max-width: 360px; width: 90%; box-shadow: 0 20px 60px rgba(0,0,0,0.5); }
.confirm-title { font-size: 16px; font-weight: 700; margin-bottom: 8px; }
.confirm-text { font-size: 13px; color: var(--text-2); margin-bottom: 22px; line-height: 1.5; }
.confirm-actions { display: flex; gap: 10px; justify-content: flex-end; }

/* ===== ALERTS ===== */
.alert { border-radius: 8px; padding: 10px 14px; font-size: 13px; }
.alert-warning { background: rgba(245,158,11,0.1); border: 1px solid rgba(245,158,11,0.3); color: #fcd34d; }
.alert-success { background: rgba(34,197,94,0.1); border: 1px solid rgba(34,197,94,0.3); color: #86efac; }

/* ===== CATALOGO PRODUCT CARDS (mobile) ===== */
.product-cards { display: none; }
.product-card { background: var(--bg-2); border: 1px solid var(--border); border-radius: 12px; padding: 16px; margin-bottom: 12px; }

@media (max-width: 768px) {
  .product-cards { display: block; }
}

/* ===== CALL CENTER WORKSPACES ===== */
.cc-owner-shell{ display:flex; flex-direction:column; gap:16px; }
.cc-owner-hero{
  display:grid; grid-template-columns:minmax(0,1fr) minmax(360px,.58fr); gap:20px;
  background:var(--surface-accent); border:1px solid var(--border-strong); border-radius:8px;
  padding:20px; box-shadow:var(--shadow-glass); position:relative; overflow:hidden;
}
.cc-owner-hero > *{ position:relative; z-index:1; min-width:0; }
.cc-owner-hero h1{ font-size:30px; line-height:1.08; letter-spacing:0; margin:6px 0 8px; max-width:850px; }
.cc-owner-hero p{ color:var(--text-2); line-height:1.5; max-width:760px; }
.cc-kicker{ display:inline-flex; color:var(--primary-2); font-size:11px; font-weight:800; text-transform:uppercase; letter-spacing:.08em; }
.cc-hero-actions{ display:flex; gap:8px; flex-wrap:wrap; margin-top:18px; }
.cc-owner-status{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; align-content:start; }
.cc-owner-status div,.cc-panel,.cc-list-item,.cc-risk{ background:var(--surface-glass); border:1px solid var(--border-soft); border-radius:8px; box-shadow:var(--shadow-card); }
.cc-owner-status div{ padding:12px; min-width:0; }
.cc-owner-status span,.cc-money-stack span,.cc-risk span{ display:block; color:var(--text-2); font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:.04em; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.cc-owner-status strong,.cc-money-stack strong{ display:block; color:var(--text); font-size:18px; font-weight:800; margin-top:5px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.cc-owner-grid{ display:grid; grid-template-columns:minmax(0,1.35fr) minmax(280px,.65fr); gap:16px; align-items:start; }
.cc-panel{ padding:16px; min-width:0; }
.cc-panel-wide{ grid-column:span 1; }
.cc-owner-campaigns{ grid-column:1; grid-row:1; }
.cc-owner-priorities{ grid-column:2; grid-row:1; }
.cc-owner-lifecycle{ grid-column:1; grid-row:2; }
.cc-owner-decisions{ grid-column:2; grid-row:2; }
.cc-owner-risks{ grid-column:1; grid-row:3; }
.cc-owner-revenue{ grid-column:2; grid-row:3; }
.cc-panel-head{ display:flex; align-items:flex-start; justify-content:space-between; gap:12px; margin-bottom:12px; }
.cc-panel h2{ font-size:17px; line-height:1.2; margin-top:2px; letter-spacing:0; }
.cc-pill{ flex:0 0 auto; color:var(--primary-2); background:rgba(124,77,255,.12); border:1px solid rgba(124,77,255,.24); border-radius:999px; padding:4px 9px; font-size:11px; font-weight:800; white-space:nowrap; }
.cc-text-link{ color:var(--primary-2); font-size:12px; font-weight:800; text-decoration:none; white-space:nowrap; }
.cc-text-link:hover{ color:var(--text); }
.cc-priority-list{ display:grid; gap:7px; }
.cc-priority-row{
  display:grid; grid-template-columns:minmax(0,1fr) auto; gap:3px 10px; min-width:0;
  padding:10px 0; color:inherit; text-decoration:none; border-bottom:1px solid var(--border-soft);
}
.cc-priority-row:last-child{ border-bottom:0; }
.cc-priority-row span{ color:var(--text-2); font-size:12px; font-weight:700; }
.cc-priority-row strong{ color:var(--text); font-size:14px; text-align:right; }
.cc-priority-row small{ grid-column:1/-1; color:var(--text-2); line-height:1.35; overflow-wrap:anywhere; }
.cc-priority-row:hover strong{ color:var(--primary-2); }
.cc-lifecycle-grid{ grid-template-columns:repeat(3,minmax(0,1fr)); }
.cc-table{ display:flex; flex-direction:column; gap:6px; overflow-x:auto; }
.cc-table-row{ display:grid; grid-template-columns:minmax(220px,1.8fr) minmax(92px,.7fr) minmax(74px,.45fr) minmax(74px,.45fr); gap:10px; align-items:center; min-width:560px; padding:9px 0; border-bottom:1px solid var(--border-soft); }
.cc-table-row span{ min-width:0; color:var(--text); font-size:13px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.cc-table-row strong{ display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.cc-table-row small{ display:block; color:var(--text-2); margin-top:2px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.cc-table-head span{ color:var(--text-2); font-size:10.5px; font-weight:800; text-transform:uppercase; letter-spacing:.05em; }
.cc-status{ display:inline-flex; max-width:100%; border-radius:999px; padding:3px 7px; font-style:normal; font-size:11px; font-weight:800; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.cc-status.is-good{ color:var(--ok); background:rgba(34,197,94,.1); }
.cc-status.is-info{ color:var(--primary-2); background:rgba(124,77,255,.12); }
.cc-status.is-warn{ color:var(--warn); background:rgba(245,158,11,.1); }
.cc-list{ display:flex; flex-direction:column; gap:8px; }
.cc-list-item{ display:grid; grid-template-columns:10px minmax(0,1fr); gap:10px; padding:10px; }
.cc-list-item strong{ display:block; color:var(--text); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.cc-list-item small{ display:block; color:var(--text-2); margin-top:3px; line-height:1.35; overflow-wrap:anywhere; }
.cc-severity{ width:8px; height:100%; min-height:34px; border-radius:999px; background:var(--primary-2); }
.cc-severity.is-danger{ background:var(--crit); }
.cc-severity.is-warn{ background:var(--warn); }
.cc-money-stack{ display:grid; grid-template-columns:1fr; gap:8px; }
.cc-money-stack div{ border:1px solid var(--border-soft); border-radius:8px; padding:10px; background:var(--surface-2); }
.cc-blocker{ margin-top:10px; border:1px solid rgba(245,158,11,.25); background:rgba(245,158,11,.08); border-radius:8px; padding:10px; }
.cc-blocker strong{ display:block; color:var(--warn); margin-bottom:4px; }
.cc-blocker span{ color:var(--text-2); overflow-wrap:anywhere; }
.cc-risk-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(190px,1fr)); gap:8px; }
.cc-risk{ padding:10px; min-width:0; border-left:3px solid var(--border-strong); }
.cc-risk.is-good{ border-left-color:var(--ok); }
.cc-risk.is-info{ border-left-color:var(--primary-2); }
.cc-risk.is-warn{ border-left-color:var(--warn); }
.cc-risk.is-danger{ border-left-color:var(--crit); }
.cc-risk strong{ display:block; color:var(--text); margin:6px 0; line-height:1.25; overflow-wrap:anywhere; }
.cc-risk small{ color:var(--text-2); line-height:1.35; overflow-wrap:anywhere; }
@supports ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
  .cc-owner-hero,.cc-owner-status div,.cc-panel,.cc-list-item,.cc-risk{
    -webkit-backdrop-filter:var(--glass-blur); backdrop-filter:var(--glass-blur);
  }
}
@media (max-width: 1100px){
  .cc-owner-hero,.cc-owner-grid{ grid-template-columns:1fr; }
  .cc-owner-campaigns,.cc-owner-priorities,.cc-owner-lifecycle,.cc-owner-decisions,.cc-owner-risks,.cc-owner-revenue{ grid-column:1; grid-row:auto; }
}
@media (max-width: 560px){
  .cc-owner-hero{ padding:18px; }
  .cc-owner-status{ grid-template-columns:1fr; }
  .cc-lifecycle-grid{ grid-template-columns:1fr; }
  .cc-hero-actions .btn{ width:100%; justify-content:center; }
  .cc-panel-head{ flex-direction:column; align-items:flex-start; }
  .cc-table{ overflow-x:visible; gap:10px; }
  .cc-table-head{ display:none; }
  .cc-table-row{
    min-width:0; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px;
    padding:10px; border:1px solid var(--border-soft); border-radius:8px;
    background:var(--surface-2);
  }
  .cc-table-row span{ white-space:normal; font-size:12px; }
  .cc-table-row strong,.cc-table-row small{ white-space:normal; overflow-wrap:anywhere; }
  .cc-table-row span:first-child{ grid-column:1 / -1; }
  .cc-table-row span:nth-child(n+2)::before{
    display:block; color:var(--text-2); font-size:9.5px; font-weight:800;
    text-transform:uppercase; letter-spacing:.05em; margin-bottom:3px;
  }
  .cc-table-row span:nth-child(2)::before{ content:"Stato"; }
  .cc-table-row span:nth-child(3)::before{ content:"Chiamate"; }
  .cc-table-row span:nth-child(4)::before{ content:"Contratti"; }
}
.cc-workbench-shell{ display:flex; flex-direction:column; gap:16px; }
.cc-workbench-hero{
  display:grid; grid-template-columns:minmax(0,1fr) minmax(300px,.45fr); gap:18px;
  background:var(--surface-accent); border:1px solid var(--border-strong); border-radius:8px;
  padding:18px 20px; box-shadow:var(--shadow-glass); overflow:hidden; position:relative;
}
.cc-workbench-hero > *{ position:relative; z-index:1; min-width:0; }
.cc-workbench-hero h1{ font-size:28px; line-height:1.08; letter-spacing:0; margin:6px 0 8px; }
.cc-workbench-hero p{ color:var(--text-2); line-height:1.5; max-width:760px; }
.cc-mini-stack{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; align-content:start; }
.cc-mini-stack div,.cc-queue-item,.cc-step,.cc-evidence,.cc-check{
  background:var(--surface-glass); border:1px solid var(--border-soft); border-radius:8px; box-shadow:var(--shadow-card);
}
.cc-mini-stack div{ padding:11px; min-width:0; }
.cc-mini-stack span,.cc-queue-item span,.cc-step span,.cc-evidence span,.cc-check span{ display:block; color:var(--text-2); font-size:11px; font-weight:800; text-transform:uppercase; letter-spacing:.04em; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.cc-mini-stack strong{ display:block; color:var(--text); font-size:18px; margin-top:5px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.cc-workbench-grid{ display:grid; grid-template-columns:minmax(220px,.62fr) minmax(360px,1.38fr) minmax(280px,.72fr); gap:14px; align-items:start; }
.cc-operator-main,.cc-operator-actions{ display:grid; gap:14px; min-width:0; }
.cc-operator-actions{ align-content:start; }
.cc-operator-actions .cc-runtime-form fieldset{ grid-template-columns:1fr; }
.cc-subsection-head{ display:flex; align-items:flex-start; justify-content:space-between; gap:12px; margin:18px 0 10px; }
.cc-subsection-head h3,.cc-requirements-grid h3{ margin:3px 0 0; font-size:15px; letter-spacing:0; }
.cc-coach-note{ margin-top:12px; padding:11px 12px; border:1px solid rgba(124,77,255,.24); border-radius:8px; background:rgba(124,77,255,.08); }
.cc-coach-note strong{ display:block; color:var(--text); margin-bottom:5px; }
.cc-coach-note p{ margin:4px 0 0; color:var(--text-2); font-size:12px; line-height:1.4; }
.cc-requirements-grid{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; }
.cc-queue-list,.cc-step-list,.cc-evidence-list,.cc-checklist{ display:grid; gap:8px; }
.cc-queue-item{ display:grid; grid-template-columns:minmax(0,1fr) auto; gap:10px; padding:10px; text-decoration:none; color:inherit; border-left:3px solid var(--border-strong); }
.cc-queue-item > span:first-child{ min-width:0; overflow:visible; text-overflow:clip; white-space:normal; }
.cc-queue-item:hover{ border-color:var(--primary-2); transform:translateY(-1px); }
.cc-queue-item.is-active{ border-left-color:var(--primary-2); background:rgba(124,77,255,.11); }
.cc-queue-item strong,.cc-step strong,.cc-evidence strong,.cc-check strong{ display:block; color:var(--text); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.cc-queue-item strong{ overflow:visible; text-overflow:clip; white-space:normal; }
.cc-queue-item small,.cc-step small,.cc-evidence small,.cc-check small{ display:block; color:var(--text-2); margin-top:4px; line-height:1.35; overflow-wrap:anywhere; white-space:normal; }
.cc-priority{ color:var(--primary-2); font-weight:900; font-variant-numeric:tabular-nums; }
.cc-current-meta{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; margin-bottom:12px; }
.cc-current-meta div{ border:1px solid var(--border-soft); border-radius:8px; background:var(--surface-2); padding:10px; min-width:0; }
.cc-current-meta span{ display:block; color:var(--text-2); font-size:11px; font-weight:800; text-transform:uppercase; letter-spacing:.04em; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.cc-current-meta strong{ display:block; margin-top:5px; color:var(--text); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.cc-step,.cc-evidence,.cc-check{ padding:10px; min-width:0; }
.cc-step{ display:grid; grid-template-columns:28px minmax(0,1fr); gap:10px; align-items:center; }
.cc-step-index{ display:grid; place-items:center; width:28px; height:28px; border-radius:999px; background:rgba(124,77,255,.14); color:var(--primary-2); font-weight:900; }
.cc-runtime-form{ display:grid; gap:10px; }
.cc-runtime-form fieldset{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)) auto; gap:8px; padding:0; border:0; margin:0; min-width:0; align-items:end; }
.cc-runtime-form fieldset:disabled{ opacity:.7; }
.cc-runtime-form label{ display:grid; gap:5px; min-width:0; }
.cc-runtime-form label span{ display:block; color:var(--text-2); font-size:11px; font-weight:800; text-transform:uppercase; letter-spacing:.04em; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.cc-runtime-form select,.cc-runtime-form input{ width:100%; min-width:0; border:1px solid var(--border-soft); border-radius:8px; background:var(--surface-2); color:var(--text); padding:9px 10px; }
.cc-runtime-form button{ min-height:38px; white-space:nowrap; }
.cc-claim-form fieldset{ grid-template-columns:minmax(0,1fr); }
.cc-claim-form button{ width:100%; justify-content:center; }
.cc-check{ display:grid; grid-template-columns:18px minmax(0,1fr); gap:8px; align-items:center; }
.cc-check-dot{ width:12px; height:12px; border-radius:999px; background:var(--primary-2); box-shadow:0 0 0 4px rgba(124,77,255,.12); }
@supports ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
  .cc-workbench-hero,.cc-mini-stack div,.cc-queue-item,.cc-step,.cc-evidence,.cc-check{
    -webkit-backdrop-filter:var(--glass-blur); backdrop-filter:var(--glass-blur);
  }
}
@media (max-width: 1240px){
  .cc-workbench-grid{ grid-template-columns:minmax(220px,.7fr) minmax(0,1.3fr); }
  .cc-operator-actions{ grid-column:1/-1; grid-template-columns:repeat(3,minmax(0,1fr)); }
}
@media (max-width: 820px){ .cc-workbench-hero,.cc-workbench-grid,.cc-operator-actions{ grid-template-columns:1fr; } }
@media (max-width: 700px){ .cc-runtime-form fieldset{ grid-template-columns:1fr; } }
@media (max-width: 560px){
  .cc-workbench-hero{ padding:18px; }
  .cc-mini-stack,.cc-current-meta,.cc-requirements-grid{ grid-template-columns:1fr; }
}
.cc-supervision-shell{ display:flex; flex-direction:column; gap:16px; }
.cc-supervision-hero{
  display:grid; grid-template-columns:minmax(0,1fr) minmax(340px,.5fr); gap:18px;
  background:var(--surface-accent); border:1px solid var(--border-strong); border-radius:8px;
  padding:18px 20px; box-shadow:var(--shadow-glass); overflow:hidden; position:relative;
}
.cc-supervision-hero > *{ position:relative; z-index:1; min-width:0; }
.cc-supervision-hero h1{ font-size:28px; line-height:1.08; letter-spacing:0; margin:6px 0 8px; }
.cc-supervision-hero p{ color:var(--text-2); line-height:1.5; max-width:780px; }
.cc-supervision-grid{ display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:16px; align-items:start; }
.cc-supervision-stack{ display:grid; gap:16px; }
.cc-lane-grid,.cc-ledger-grid,.cc-gate-grid{ display:grid; gap:8px; }
.cc-lane-card,.cc-ledger-card,.cc-gate-card,.cc-settlement-card{
  background:var(--surface-glass); border:1px solid var(--border-soft); border-radius:8px; box-shadow:var(--shadow-card);
  padding:10px; min-width:0; border-left:3px solid var(--border-strong);
}
.cc-lane-card.is-good,.cc-gate-card.is-good{ border-left-color:var(--ok); }
.cc-lane-card.is-warn,.cc-ledger-card.is-warn,.cc-gate-card.is-warn{ border-left-color:var(--warn); }
.cc-lane-card.is-danger,.cc-gate-card.is-danger{ border-left-color:var(--crit); }
.cc-lane-card.is-info,.cc-ledger-card.is-info,.cc-gate-card.is-info{ border-left-color:var(--primary-2); }
.cc-lane-card span,.cc-ledger-card span,.cc-gate-card span,.cc-settlement-card span{
  display:block; color:var(--text-2); font-size:11px; font-weight:800; text-transform:uppercase; letter-spacing:.04em; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
}
.cc-lane-card strong,.cc-ledger-card strong,.cc-gate-card strong,.cc-settlement-card strong{
  display:block; color:var(--text); margin-top:5px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
}
.cc-lane-card small,.cc-ledger-card small,.cc-gate-card small,.cc-settlement-card small{
  display:block; color:var(--text-2); margin-top:4px; line-height:1.35; overflow-wrap:anywhere;
}
.cc-settlement-card{ background:linear-gradient(135deg, rgba(124,77,255,.12), var(--surface-glass)); }
@supports ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
  .cc-supervision-hero,.cc-lane-card,.cc-ledger-card,.cc-gate-card,.cc-settlement-card{
    -webkit-backdrop-filter:var(--glass-blur); backdrop-filter:var(--glass-blur);
  }
}
@media (max-width: 980px){ .cc-supervision-hero,.cc-supervision-grid{ grid-template-columns:1fr; } }
@media (max-width: 560px){ .cc-supervision-hero{ padding:18px; } }

.cc-module-shell{ display:flex; flex-direction:column; gap:16px; }
.cc-module-header{
  display:block; padding:18px 20px; border:1px solid rgba(124,77,255,.28); border-radius:8px; overflow:hidden;
  background:var(--surface-glass); box-shadow:var(--shadow-card); backdrop-filter:var(--glass-blur);
}
.cc-module-header h1{ font-size:28px; line-height:1.08; letter-spacing:0; margin:6px 0 8px; }
.cc-module-header p{ color:var(--text-2); line-height:1.45; max-width:760px; }
.cc-module-metrics div,.cc-module-table-panel,.cc-detail-rail{
  background:var(--surface-glass); border:1px solid var(--border-soft); border-radius:8px; box-shadow:var(--shadow-card);
}
.cc-module-metrics span,.cc-detail-list span{
  display:block; color:var(--text-2); font-size:11px; font-weight:800; text-transform:uppercase; letter-spacing:.04em;
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
}
.cc-module-metrics strong,.cc-detail-list strong{
  display:block; color:var(--text); margin-top:5px; font-weight:850; overflow-wrap:anywhere;
}
.cc-module-metrics{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; }
.cc-module-metrics div{ padding:13px; min-width:0; }
.cc-module-metrics strong{ font-size:24px; font-variant-numeric:tabular-nums; }
.cc-module-workspace{ display:grid; grid-template-columns:minmax(0,1fr) minmax(300px,.32fr); gap:16px; align-items:start; }
.cc-module-table-panel,.cc-detail-rail{ padding:16px; min-width:0; }
.cc-module-panel-head{ display:flex; align-items:flex-start; justify-content:space-between; gap:12px; margin-bottom:12px; }
.cc-module-panel-head h2{ margin:2px 0 0; font-size:17px; line-height:1.2; letter-spacing:0; }
.cc-module-panel-head p{ margin:5px 0 0; color:var(--text-2); line-height:1.35; }
.cc-data-table{ display:flex; flex-direction:column; min-width:0; overflow-x:auto; }
.cc-data-row{
  display:grid; grid-template-columns:minmax(240px,1.5fr) minmax(96px,.58fr) repeat(4,minmax(96px,.72fr));
  gap:10px; align-items:center; min-width:760px; padding:10px 0; border-bottom:1px solid var(--border-soft);
  color:inherit; text-decoration:none;
}
.cc-data-row:hover{ background:rgba(124,77,255,.06); }
.cc-data-row > span{ min-width:0; overflow:hidden; text-overflow:ellipsis; }
.cc-data-row strong{ display:block; color:var(--text); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.cc-data-row small{ display:block; color:var(--text-2); margin-top:3px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.cc-data-head{ padding-top:0; min-height:28px; }
.cc-data-head span{ color:var(--text-2); font-size:10.5px; font-weight:900; text-transform:uppercase; letter-spacing:.05em; }
.cc-data-table-compact .cc-data-row{ grid-template-columns:minmax(220px,1.4fr) minmax(96px,.55fr) repeat(3,minmax(92px,.75fr)); min-width:660px; }
.cc-secondary-table{ margin-top:18px; }
.cc-detail-list{ display:grid; gap:8px; }
.cc-detail-list div{ border:1px solid var(--border-soft); background:var(--surface-2); border-radius:8px; padding:10px; min-width:0; }
.cc-detail-actions{ display:grid; grid-template-columns:1fr; gap:8px; margin-top:14px; }
.cc-detail-actions .btn{ width:100%; justify-content:center; }
.cc-detail-note{ margin-top:14px; border:1px solid rgba(245,158,11,.24); background:rgba(245,158,11,.08); border-radius:8px; padding:10px; }
.cc-detail-note strong{ display:block; color:var(--warn); margin-bottom:4px; }
.cc-detail-note span{ color:var(--text-2); line-height:1.35; }
.cc-empty-state{ padding:20px; color:var(--text-2); border:1px dashed var(--border-soft); border-radius:8px; }
html[data-theme="light"] .cc-module-header,
html[data-theme="light"] .cc-module-metrics div,
html[data-theme="light"] .cc-module-table-panel,
html[data-theme="light"] .cc-detail-rail{ background:rgba(255,255,255,.78); }
@media (max-width: 1100px){
  .cc-module-header,.cc-module-workspace{ grid-template-columns:1fr; }
}
@media (max-width: 760px){
  .cc-module-metrics{ grid-template-columns:repeat(2,minmax(0,1fr)); }
  .cc-module-header{ padding:18px; }
}
@media (max-width: 560px){
  .cc-module-metrics{ grid-template-columns:1fr; }
  .cc-data-table{ overflow-x:visible; gap:8px; }
  .cc-data-head{ display:none; }
  .cc-data-row,.cc-data-table-compact .cc-data-row{
    min-width:0; grid-template-columns:1fr; gap:8px; border:1px solid var(--border-soft);
    border-radius:8px; padding:11px; background:var(--surface-glass);
  }
  .cc-data-row strong,.cc-data-row small{ white-space:normal; overflow-wrap:anywhere; }
}

/* =====================================================================
   DASHBOARD V2 — cockpit vivo + regole anti-overflow (R1..R10)
   Sezione additiva: non altera le classi sopra. Riferimento spec:
   _strategia/DASHBOARD-V2-SPEC-2026-06-22.md
   ===================================================================== */

/* --- Token di base (scala 8, raggio, larghezza minima KPI) --- */
:root{
  --s1:4px; --s2:8px; --s3:16px; --s4:24px; --s5:32px; --s6:48px;
  --radius:12px;
  --kpi-min:220px;
  /* Scala tipografica unica (Inter, base 14px). Sistema dichiarato: una sola
     famiglia, pesi 400/500/600/700/800, scala modulare. I numeri usano sempre
     tabular-nums (vedi .kpi-value). Titoli pagina fluidi via clamp. */
  --fs-xs:11px; --fs-sm:12.5px; --fs-base:14px; --fs-md:15px;
  --fs-lg:18px; --fs-xl:22px; --fs-2xl:clamp(22px,3vw,30px);
  --fw-regular:400; --fw-medium:500; --fw-semibold:600; --fw-bold:700; --fw-black:800;
  /* alias semantici dei colori esistenti, così le viste non hardcodano hex */
  --primary: var(--purple-1);
  --primary-2: var(--purple-2);
  --ok: var(--success);
  --warn: var(--warning);
  --crit: var(--danger);
  --panel-bg: var(--surface-glass);
}

/* --- Tema chiaro (data-theme="light" su <html>): override delle sole var
   colore. Default resta dark. Contrasto AA mantenuto. --- */
html[data-theme="light"]{
  --bg:#f7f6fc; --bg-2:#ffffff; --bg-3:#f0edf8; --bg-4:#e6e0f4;
  --bg-elevated:#ffffff;
  --border:#ddd7ea; --border-soft:rgba(124,77,255,0.16); --border-strong:rgba(124,77,255,0.32);
  --text:#1c1c28; --text-2:#5b5b73; --text-3:#8a8aa0;
  --surface:rgba(255,255,255,0.86);
  --surface-2:rgba(247,246,252,0.74);
  --surface-glass:linear-gradient(135deg, rgba(255,255,255,0.82), rgba(243,239,255,0.54)), rgba(255,255,255,0.72);
  --surface-glass-strong:linear-gradient(135deg, rgba(255,255,255,0.92), rgba(243,239,255,0.68)), rgba(255,255,255,0.84);
  --surface-accent:linear-gradient(135deg, rgba(124,77,255,0.13), rgba(53,198,255,0.08)), rgba(255,255,255,0.74);
  --shadow-soft:0 18px 54px rgba(42,30,76,0.12);
  --shadow-card:0 12px 30px rgba(42,30,76,0.10);
  --shadow-glass:0 22px 70px rgba(42,30,76,0.14), 0 1px 0 rgba(255,255,255,0.72) inset;
  --panel-bg:var(--surface-glass);
  --purple-bg:#f3efff;
}
html{ color-scheme:dark; }
html[data-theme="light"]{ color-scheme:light; }
html[data-theme="light"] body{
  background:
    linear-gradient(135deg, rgba(124,77,255,0.10), rgba(53,198,255,0.04) 42%, transparent 68%),
    linear-gradient(180deg, var(--bg) 0%, var(--bg-elevated) 100%);
  color:var(--text);
}
html[data-theme="light"] .stat-card.accent{ background:rgba(124,77,255,0.06); }

@supports ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
  .sidebar,
  .topbar,
  .period-picker,
  .icon-btn,
  .dash-wrap .kpi-card,
  .dash-wrap .panel,
  .dash-wrap .alert-item,
  .dash-wrap .onb-card,
  .dash-wrap .action-tile,
  .denied-hero,
  .denied-panel,
  .table-wrap,
  .form-card,
  .detail-card,
  .client-card,
  .task-card,
  .order-card,
  .enroll-card,
  .product-card,
  .toast,
  .drawer,
  /* lp-/cru-/dv- (redesign 2026-07): glass sui CONTENITORI. Le righe di lista
     (.lp-row, .sg-row, .pd-*-row) restano tinte senza blur: N righe × blur
     = jank su hardware debole — tradeoff deliberato. */
  .panel,
  .lp-kpi,
  .lp-empty,
  .cru-next,
  .cru-fold,
  .caf-stage,
  .caf-readiness-item,
  .caf-story-step,
  .caf-procedure-lane,
  .dv-doc,
  .at-closed {
    -webkit-backdrop-filter: var(--glass-blur);
    backdrop-filter: var(--glass-blur);
  }
}

/* immagini/video non sfondano mai il contenitore (R0). Gli svg con width/height
   espliciti restano intatti: limitiamo solo img/video per non deformare le icone. */
.main-content img, .main-content video{ max-width:100%; height:auto; }

/* --- R1: min-width:0 su OGNI figlio flex/grid con testo (regola madre) --- */
.kpi-card, .kpi-card *, .panel, .panel-body, .panel-body *,
.kpi-strip > *, .kpi-grid > *, .dlist td, .drawer-body *{ min-width:0; }

/* --- R2/R3/R4: utility di troncamento e wrapping --- */
.truncate{ white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.clamp-2{ display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2; line-clamp:2; overflow:hidden; }
.break-anywhere{ overflow-wrap:anywhere; word-break:break-word; }

/* =================== TOPBAR: contesto e controlli globali =============== */
.topbar-clock{
  min-width:5ch; color:var(--text-3); font-size:12px; font-weight:600;
  font-variant-numeric:tabular-nums; text-align:center; white-space:nowrap;
}
.topbar-controls{ display:flex; align-items:center; gap:var(--s2); }
.period-picker{
  display:inline-flex; background:var(--surface-2); border:1px solid var(--border-soft);
  border-radius:8px; padding:2px; gap:2px;
}
.period-picker a{
  font-size:12px; color:var(--text-2); text-decoration:none;
  padding:4px 9px; border-radius:6px; white-space:nowrap; transition:background .15s,color .15s;
}
.period-picker a:hover{ color:var(--text); }
.period-picker a.active{ background:var(--primary); color:#fff; font-weight:600; }
.icon-btn{
  display:inline-flex; align-items:center; justify-content:center;
  width:34px; height:34px; border-radius:8px; cursor:pointer;
  background:var(--surface-2); border:1px solid var(--border-soft); color:var(--text-2);
  transition:color .15s, background .15s;
}
.icon-btn:hover{ color:var(--text); background:var(--surface-glass); border-color:var(--border-strong); }
.icon-btn svg{ width:16px; height:16px; }

/* =================== HERO KPI STRIP =================== */
.dash-section-title{
  font-size:12px; font-weight:700; color:var(--text-2);
  text-transform:uppercase; letter-spacing:0.7px; margin:var(--s5) 0 var(--s3);
}
.dash-section-title:first-of-type{ margin-top:0; }
.kpi-card::before,
.panel::before{
  content:""; position:absolute; inset:0; pointer-events:none;
  background:linear-gradient(135deg, rgba(255,255,255,0.09), transparent 34%, rgba(124,77,255,0.045));
  opacity:.78;
}
.intel-shell{
  position:relative; overflow:hidden; display:grid; grid-template-columns:minmax(0,1.15fr) minmax(280px,.85fr);
  gap:var(--s4); align-items:stretch; margin:0 0 var(--s5);
  padding:18px; border:1px solid var(--border-strong); border-radius:var(--radius);
  background:
    radial-gradient(circle at 12% 0%, color-mix(in srgb, var(--primary) 20%, transparent), transparent 34%),
    linear-gradient(135deg, color-mix(in srgb, var(--primary) 12%, transparent), color-mix(in srgb, var(--bg-2) 82%, transparent)),
    var(--panel-bg);
  box-shadow:var(--shadow-glass);
}
.intel-shell::before{
  content:""; position:absolute; inset:0; pointer-events:none;
  background:linear-gradient(120deg, rgba(255,255,255,.12), transparent 34%, rgba(255,255,255,.05));
  opacity:.68;
}
.intel-shell > *{ position:relative; z-index:1; }
.intel-kicker{ font-size:11px; font-weight:800; letter-spacing:.08em; text-transform:uppercase; color:var(--primary-2); margin-bottom:8px; }
.intel-title{ margin:0; color:var(--text); font-size:clamp(22px, 3vw, 34px); line-height:1.04; font-weight:780; max-width:780px; }
.intel-summary{ margin:10px 0 0; max-width:760px; color:var(--text-2); font-size:14.5px; line-height:1.55; }
.intel-metrics{ display:flex; flex-wrap:wrap; gap:8px; margin-top:16px; }
.intel-metric{
  min-width:104px; display:flex; align-items:baseline; gap:7px; padding:9px 11px; border-radius:12px;
  color:var(--text); text-decoration:none; background:color-mix(in srgb, var(--bg-2) 68%, transparent);
  border:1px solid var(--border-soft);
}
.intel-metric:hover{ border-color:var(--border-strong); }
.intel-metric strong{ font-size:22px; line-height:1; font-variant-numeric:tabular-nums; }
.intel-metric span{ color:var(--text-2); font-size:11.5px; font-weight:700; text-transform:uppercase; letter-spacing:.04em; }
.intel-opportunity-head{ display:flex; align-items:center; justify-content:space-between; gap:10px; margin-top:18px; }
.intel-opportunity-head span{ color:var(--primary-2); font-size:10.5px; font-weight:800; letter-spacing:.08em; text-transform:uppercase; }
.intel-opportunity-head strong{ color:var(--text-2); font-size:12px; font-weight:700; }
.intel-opportunities{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; margin-top:8px; }
.intel-opportunity{
  min-width:0; display:flex; flex-direction:column; gap:4px; padding:11px 12px; border-radius:12px;
  color:var(--text); text-decoration:none; border:1px solid var(--border-soft);
  background:color-mix(in srgb, var(--bg-2) 68%, transparent);
}
.intel-opportunity:hover{ border-color:var(--border-strong); transform:translateY(-1px); }
.intel-opportunity-k{ color:var(--primary-2); font-size:10px; font-weight:800; letter-spacing:.06em; text-transform:uppercase; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.intel-opportunity strong{ color:var(--text); font-size:13px; line-height:1.24; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.intel-opportunity span:last-child{ color:var(--text-2); font-size:11.5px; line-height:1.35; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.intel-side{ display:flex; flex-direction:column; gap:12px; min-width:0; }
.intel-list{ display:flex; flex-direction:column; gap:8px; min-width:0; }
.intel-item{
  display:flex; gap:10px; min-width:0; padding:11px 12px; border-radius:12px;
  border:1px solid var(--border-soft); background:color-mix(in srgb, var(--bg-2) 72%, transparent);
  color:var(--text); text-decoration:none;
}
.intel-item:hover{ border-color:var(--border-strong); }
.intel-dot{ width:9px; height:9px; border-radius:999px; flex:0 0 auto; margin-top:6px; background:var(--primary); }
.intel-dot-alta,.intel-state-attention .intel-dot{ background:var(--danger); }
.intel-dot-risk{ background:var(--danger); }
.intel-dot-media,.intel-state-approval .intel-dot{ background:var(--warning); }
.intel-dot-opportunity{ background:var(--primary); }
.intel-copy{ display:flex; flex-direction:column; min-width:0; gap:2px; }
.intel-item-k{ color:var(--primary-2); font-size:10px; font-weight:800; letter-spacing:.08em; text-transform:uppercase; }
.intel-copy strong{ color:var(--text); font-size:13.5px; line-height:1.25; overflow-wrap:anywhere; }
.intel-copy span:last-child{ color:var(--text-2); font-size:12px; line-height:1.35; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.intel-empty{
  display:flex; flex-direction:column; gap:4px; min-height:116px; justify-content:center; padding:14px;
  border:1px solid var(--border-soft); border-radius:12px; background:color-mix(in srgb, var(--bg-2) 72%, transparent);
}
.intel-empty strong{ color:var(--text); font-size:14px; }
.intel-empty span{ color:var(--text-2); font-size:12.5px; line-height:1.45; }
.intel-sources{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
.intel-source{
  display:flex; align-items:flex-start; gap:8px; min-width:0; padding:9px 10px;
  border:1px solid var(--border-soft); border-radius:12px;
  background:color-mix(in srgb, var(--bg-2) 64%, transparent);
  color:var(--text); text-decoration:none;
}
.intel-source:hover{ border-color:var(--border-strong); }
.intel-source-dot{ width:8px; height:8px; flex:0 0 auto; margin-top:5px; border-radius:999px; background:var(--text-3); }
.intel-source-live .intel-source-dot{ background:var(--success); }
.intel-source-ready .intel-source-dot{ background:var(--primary-2); }
.intel-source-missing .intel-source-dot{ background:var(--warning); }
.intel-source-copy{ display:flex; flex-direction:column; gap:1px; min-width:0; }
.intel-source-copy strong{ color:var(--text); font-size:12.5px; line-height:1.2; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.intel-source-copy span{ color:var(--text-2); font-size:11px; line-height:1.25; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.intel-actions{ display:flex; align-items:center; justify-content:space-between; gap:10px; flex-wrap:wrap; margin-top:auto; }
.intel-warning{ color:var(--warning); font-size:12px; font-weight:700; }
.caf-dashboard-shell{
  border-color:color-mix(in srgb, var(--primary) 34%, var(--border-strong));
}
.caf-dashboard-shell .intel-title{ max-width:820px; }
.caf-dashboard-metrics .intel-metric{ min-width:96px; }
.caf-role-grid{
  display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:9px; margin-top:16px;
}
.caf-role-card{
  min-width:0; min-height:132px; display:flex; flex-direction:column; gap:5px;
  padding:12px; border-radius:12px; text-decoration:none; color:var(--text);
  border:1px solid var(--border-soft);
  background:color-mix(in srgb, var(--bg-2) 70%, transparent);
}
.caf-role-card:hover{ border-color:var(--border-strong); transform:translateY(-1px); }
.caf-role-card.is-active{
  border-color:color-mix(in srgb, var(--primary) 58%, var(--border));
  background:linear-gradient(135deg, color-mix(in srgb, var(--primary) 16%, transparent), color-mix(in srgb, var(--bg-2) 78%, transparent));
}
.caf-role-card span{
  color:var(--primary-2); font-size:10px; font-weight:800; letter-spacing:.07em;
  text-transform:uppercase; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
}
.caf-role-card strong{ color:var(--text); font-size:14px; line-height:1.2; }
.caf-role-card em{ color:var(--text-2); font-size:12px; font-style:normal; font-weight:700; }
.caf-role-card small{ color:var(--text-3); font-size:11.5px; line-height:1.35; display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; }
.caf-current-role{
  display:flex; flex-direction:column; gap:4px; padding:14px;
  border:1px solid color-mix(in srgb, var(--primary) 34%, var(--border));
  border-radius:12px; background:color-mix(in srgb, var(--primary) 9%, var(--bg-2));
}
.caf-current-role span{
  color:var(--primary-2); font-size:10px; font-weight:800; letter-spacing:.08em; text-transform:uppercase;
}
.caf-current-role strong{ color:var(--text); font-size:16px; line-height:1.22; }
.caf-current-role small{ color:var(--text-2); font-size:12px; line-height:1.35; }
.caf-focus-list .intel-item{ min-height:70px; }
.caf-location-list{ display:flex; flex-direction:column; gap:7px; }
.caf-location-list a{
  display:flex; align-items:center; justify-content:space-between; gap:10px; min-width:0;
  padding:9px 10px; border-radius:12px; text-decoration:none; color:var(--text);
  border:1px solid var(--border-soft); background:color-mix(in srgb, var(--bg-2) 64%, transparent);
}
.caf-location-list a:hover{ border-color:var(--border-strong); }
.caf-location-list span{ min-width:0; display:flex; flex-direction:column; gap:1px; }
.caf-location-list strong{ color:var(--text); font-size:12.5px; line-height:1.2; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.caf-location-list small{ color:var(--text-2); font-size:11px; line-height:1.3; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.caf-location-list em{
  flex:0 0 auto; color:var(--primary-2); font-size:12px; font-style:normal; font-weight:800;
  border:1px solid color-mix(in srgb, var(--primary) 30%, var(--border));
  border-radius:999px; padding:4px 7px;
}
.kpi-grid{
  display:grid;
  grid-template-columns:repeat(auto-fill, minmax(min(var(--kpi-min),100%), 1fr));
  gap:var(--s3);
}
.kpi-card{
  background:var(--panel-bg); border:1px solid var(--border-soft);
  border-radius:var(--radius); padding:var(--s4);
  display:flex; flex-direction:column; gap:var(--s2);
  position:relative; overflow:hidden;
  box-shadow:var(--shadow-card);
  transition:border-color .15s, transform .15s, box-shadow .15s;
}
.kpi-card:hover{ border-color:var(--border-strong); transform:translateY(-1px); }
.kpi-card.accent{ border-color:var(--border-strong); background:var(--surface-accent); }
.kpi-card > *{ position:relative; z-index:1; }
.kpi-card-head{ display:flex; align-items:center; gap:var(--s2); }
.kpi-icon{
  width:34px; height:34px; flex-shrink:0; border-radius:9px;
  display:flex; align-items:center; justify-content:center;
  background:linear-gradient(135deg, rgba(124,77,255,0.22), rgba(180,138,255,0.10));
  border:1px solid var(--border-soft);
}
.kpi-icon svg{ width:18px; height:18px; stroke:var(--primary-2); }
.kpi-title{
  font-size:12px; font-weight:600; color:var(--text-2);
  text-transform:uppercase; letter-spacing:0.4px; flex:1;
}
.kpi-value{
  font-size:clamp(22px, 4.5vw, 30px); font-weight:700; color:var(--text);
  font-variant-numeric:tabular-nums; white-space:nowrap;
  overflow:hidden; text-overflow:ellipsis; line-height:1.1;
}
.kpi-value .unit{ font-size:14px; font-weight:500; color:var(--text-2); margin-left:4px; }
.kpi-foot{ display:flex; align-items:center; gap:var(--s2); flex-wrap:wrap; }
.kpi-sub{ font-size:12px; color:var(--text-2); min-width:0; }

/* delta ↑↓ con freccia + label (mai colore da solo) */
.delta{ display:inline-flex; align-items:center; gap:3px; font-size:12px; font-weight:600; white-space:nowrap; }
.delta.up{ color:#4ade80; }
.delta.down{ color:#f87171; }
.delta.flat{ color:var(--text-2); }
html[data-theme="light"] .delta.up{ color:#16a34a; }
html[data-theme="light"] .delta.down{ color:#dc2626; }

/* semaforo di stato: icona + label, mai solo colore (R10/WCAG) */
.dot{ display:inline-flex; align-items:center; gap:6px; font-size:12px; font-weight:600; white-space:nowrap; }
.dot::before{ content:""; width:9px; height:9px; border-radius:50%; flex-shrink:0; background:var(--text-2); }
.dot.ok{ color:#4ade80; } .dot.ok::before{ background:var(--ok); }
.dot.warn{ color:#fcd34d; } .dot.warn::before{ background:var(--warn); }
.dot.crit{ color:#f87171; } .dot.crit::before{ background:var(--crit); }
html[data-theme="light"] .dot.ok{ color:#16a34a; }
html[data-theme="light"] .dot.warn{ color:#b45309; }
html[data-theme="light"] .dot.crit{ color:#dc2626; }

/* =================== BANDA ALERT =================== */
.alert-band{ display:flex; flex-direction:column; gap:var(--s2); margin-top:var(--s3); }
.alert-item{
  display:flex; align-items:center; gap:var(--s3); min-width:0;
  background:var(--panel-bg); border:1px solid var(--border-soft);
  border-left:3px solid var(--text-2);
  border-radius:10px; padding:12px var(--s3);
  box-shadow:var(--shadow-card);
}
.alert-item.warn{ border-left-color:var(--warn); }
.alert-item.crit{ border-left-color:var(--crit); }
.alert-item.info{ border-left-color:var(--primary); }
.alert-ico{ flex-shrink:0; width:18px; height:18px; }
.alert-ico svg{ width:18px; height:18px; }
.alert-item.warn .alert-ico{ color:var(--warn); }
.alert-item.crit .alert-ico{ color:var(--crit); }
.alert-item.info .alert-ico{ color:var(--primary-2); }
.alert-text{ flex:1; min-width:0; font-size:13px; color:var(--text); }
.alert-text .clamp-2{ color:var(--text-2); font-size:12px; margin-top:2px; }
.alert-actions{ display:flex; align-items:center; gap:var(--s2); flex-shrink:0; }
.alert-dismiss{ background:none; border:none; color:var(--text-2); cursor:pointer; padding:4px; border-radius:6px; line-height:0; }
.alert-dismiss:hover{ color:var(--text); background:var(--surface-2); }

/* =================== PANELS / GRAFICI / LISTE =================== */
.content-grid{ display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:var(--s4); margin-top:var(--s3); }
.content-grid.one{ grid-template-columns:minmax(0,1fr); }
.panel{
  background:var(--panel-bg); border:1px solid var(--border-soft);
  border-radius:var(--radius); display:flex; flex-direction:column; min-width:0;
  position:relative; overflow:hidden; box-shadow:var(--shadow-card);
}
.panel-head{
  display:flex; align-items:center; justify-content:space-between; gap:var(--s3);
  padding:var(--s3) var(--s4); border-bottom:1px solid var(--border-soft); min-width:0;
  position:relative; z-index:1;
}
.panel-title{ font-size:14px; font-weight:600; color:var(--text); min-width:0; }
.panel-sub{ font-size:12px; color:var(--text-2); margin-top:2px; }
.panel-head .link{ font-size:12px; color:var(--primary-2); text-decoration:none; white-space:nowrap; flex-shrink:0; }
.panel-head .link:hover{ text-decoration:underline; }
.panel-body{ padding:var(--s4); position:relative; z-index:1; }

/* mini bar-chart in pura CSS (no libs): accessibile via aria-label sulle barre */
.spark{ display:flex; align-items:flex-end; gap:6px; height:120px; }
.spark .bar{ flex:1; min-width:0; background:linear-gradient(180deg,var(--primary-2),var(--primary)); border-radius:6px 6px 0 0; min-height:4px; position:relative; }
.spark .bar.muted{ background:var(--surface-2); }
.spark-x{ display:flex; gap:6px; margin-top:8px; }
.spark-x span{ flex:1; min-width:0; text-align:center; font-size:10px; color:var(--text-2); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }

/* funnel CRM lead (stati) — barre orizzontali con label troncata */
.funnel{ display:flex; flex-direction:column; gap:10px; }
.funnel-row{ display:flex; align-items:center; gap:var(--s3); min-width:0; }
.funnel-label{ width:110px; flex-shrink:0; font-size:12px; color:var(--text-2); }
.funnel-track{ flex:1; min-width:0; height:22px; background:var(--surface-2); border:1px solid var(--border-soft); border-radius:6px; overflow:hidden; }
.funnel-fill{ height:100%; background:linear-gradient(90deg,var(--primary),var(--primary-2)); border-radius:6px; display:flex; align-items:center; padding-left:8px; }
.funnel-fill span{ font-size:11px; font-weight:700; color:#fff; }
.funnel-n{ width:34px; flex-shrink:0; text-align:right; font-size:13px; font-weight:600; font-variant-numeric:tabular-nums; }
.panel-note{ margin-top:var(--s3); font-size:12px; line-height:1.5; color:var(--text-2); }

/* lista actionable (table → card mobile) */
.dlist{ width:100%; border-collapse:collapse; }
.dlist th{ padding:10px var(--s3); text-align:left; font-size:11px; font-weight:600; color:var(--text-2); text-transform:uppercase; letter-spacing:0.4px; border-bottom:1px solid var(--border-soft); }
.dlist td{ padding:11px var(--s3); font-size:13px; color:var(--text); border-bottom:1px solid var(--border-soft); vertical-align:middle; }
.dlist tr:last-child td{ border-bottom:none; }
.dlist tbody tr{ cursor:pointer; transition:background .12s; }
.dlist tbody tr:hover{ background:rgba(124,77,255,0.08); }
.cell-strong{ font-weight:600; color:var(--text); }
.cell-sub{ font-size:12px; color:var(--text-2); }
.dlist .col-grow{ width:99%; }

/* =================== DRAWER drill-down =================== */
.drawer-overlay{ display:none; position:fixed; inset:0; background:rgba(0,0,0,0.55); z-index:210; }
.drawer-overlay.open{ display:block; }
.drawer{
  position:fixed; top:0; right:0; height:100vh; width:min(420px,92vw);
  background:var(--panel-bg); border-left:1px solid var(--border-soft);
  z-index:220; transform:translateX(100%); transition:transform .25s ease;
  display:flex; flex-direction:column; box-shadow:-20px 0 60px rgba(0,0,0,0.4);
}
.drawer.open{ transform:translateX(0); }
.drawer-head{ display:flex; align-items:flex-start; justify-content:space-between; gap:var(--s3); padding:var(--s4); border-bottom:1px solid var(--border-soft); }
.drawer-title{ font-size:16px; font-weight:700; min-width:0; }
.drawer-body{ flex:1; overflow-y:auto; padding:var(--s4); display:flex; flex-direction:column; gap:var(--s3); }
.drawer-field label{ font-size:11px; font-weight:600; color:var(--text-2); text-transform:uppercase; letter-spacing:0.4px; display:block; margin-bottom:3px; }
.drawer-field .val{ font-size:14px; color:var(--text); }

/* =================== EMPTY STATE v2 =================== */
.empty-v2{ text-align:center; padding:var(--s6) var(--s4); display:flex; flex-direction:column; align-items:center; gap:var(--s2); }
.empty-v2 .ico{ width:54px; height:54px; border-radius:14px; display:flex; align-items:center; justify-content:center; background:linear-gradient(135deg, rgba(124,77,255,0.20), rgba(180,138,255,0.08)); border:1px solid var(--border-soft); margin-bottom:4px; }
.empty-v2 .ico svg{ width:26px; height:26px; stroke:var(--primary-2); }
.empty-v2 h4{ font-size:15px; font-weight:700; color:var(--text); }
.empty-v2 p{ font-size:13px; color:var(--text-2); max-width:340px; }

/* =================== ACCESS DENIED =================== */
.denied-wrap{ display:flex; flex-direction:column; gap:var(--s4); }
.denied-hero{
  display:grid; grid-template-columns:auto minmax(0,1fr) auto; align-items:center; gap:var(--s4);
  min-height:220px; padding:var(--s5);
  background:var(--surface-accent); border:1px solid var(--border-strong); border-radius:var(--radius);
  box-shadow:var(--shadow-card); position:relative; overflow:hidden;
}
.denied-hero::before,
.denied-panel::before{
  content:""; position:absolute; inset:0; pointer-events:none;
  background:linear-gradient(135deg, rgba(255,255,255,0.10), transparent 36%, rgba(124,77,255,0.06));
  opacity:.82;
}
.denied-hero > *, .denied-panel > *{ position:relative; z-index:1; }
.denied-icon{
  width:62px; height:62px; border-radius:16px; display:flex; align-items:center; justify-content:center;
  background:linear-gradient(135deg, rgba(124,77,255,0.24), rgba(180,138,255,0.10));
  border:1px solid var(--border-strong); color:var(--primary-2); flex-shrink:0;
}
.denied-icon svg{ width:32px; height:32px; }
.denied-copy{ min-width:0; display:flex; flex-direction:column; gap:6px; }
.denied-kicker{
  font-size:11px; font-weight:800; color:var(--primary-2);
  text-transform:uppercase; letter-spacing:.7px;
}
.denied-copy h1{
  margin:0; color:var(--text); font-size:clamp(24px,3vw,34px);
  line-height:1.08; font-weight:800; letter-spacing:0;
}
.denied-copy p{ margin:0; color:var(--text-2); font-size:14px; line-height:1.55; max-width:62ch; }
.denied-actions{ display:flex; align-items:center; justify-content:flex-end; gap:var(--s2); flex-wrap:wrap; }
.denied-panel{ position:relative; overflow:hidden; }
.denied-grid{ display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:var(--s3); }
.denied-grid div{
  min-width:0; padding:14px; border:1px solid var(--border-soft); border-radius:10px;
  background:var(--surface-2);
}
.denied-grid span{
  display:block; margin-bottom:5px; color:var(--text-2); font-size:11px; font-weight:700;
  text-transform:uppercase; letter-spacing:.55px;
}
.denied-grid strong{
  display:block; color:var(--text); font-size:13px; font-weight:700;
  overflow-wrap:anywhere; word-break:break-word;
}

/* =================== SKELETON =================== */
.skeleton{ position:relative; overflow:hidden; background:var(--surface-2); border-radius:6px; color:transparent !important; }
.skeleton::after{ content:""; position:absolute; inset:0; transform:translateX(-100%); background:linear-gradient(90deg,transparent,rgba(255,255,255,0.08),transparent); animation:shimmer 1.3s infinite; }
@keyframes shimmer{ 100%{ transform:translateX(100%); } }
.fade-in{ animation:fadeIn .4s ease both; }
@keyframes fadeIn{ from{ opacity:0; transform:translateY(6px); } to{ opacity:1; transform:none; } }

/* =================== TOAST =================== */
.toast-wrap{ position:fixed; bottom:20px; right:20px; z-index:300; display:flex; flex-direction:column; gap:10px; max-width:min(360px,92vw); }
.toast{
  display:flex; align-items:center; gap:10px; min-width:0;
  background:var(--panel-bg); border:1px solid var(--border-soft); border-left:3px solid var(--primary);
  border-radius:10px; padding:12px var(--s3); box-shadow:0 12px 40px rgba(0,0,0,0.35);
  animation:toastIn .25s ease both; font-size:13px; color:var(--text);
}
.toast.ok{ border-left-color:var(--ok); }
.toast.warn{ border-left-color:var(--warn); }
.toast.err{ border-left-color:var(--crit); }
.toast .toast-msg{ flex:1; min-width:0; }
@keyframes toastIn{ from{ opacity:0; transform:translateX(20px); } to{ opacity:1; transform:none; } }

/* =================== RESPONSIVE v2 =================== */
@media (max-width:900px){
  .content-grid{ grid-template-columns:minmax(0,1fr); }
  .topbar-clock{ display:none; }
  .intel-shell{ grid-template-columns:1fr; padding:15px; }
  .intel-title{ font-size:24px; }
  .intel-metric{ flex:1; min-width:0; justify-content:center; }
  .caf-role-grid{ grid-template-columns:1fr; }
  .caf-role-card{ min-height:0; }
  .denied-hero{ grid-template-columns:1fr; align-items:flex-start; }
  .denied-actions{ justify-content:flex-start; }
  .denied-grid{ grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width:480px){
  .kpi-grid{ grid-template-columns:1fr; }
  .topbar{ position:sticky; top:0; z-index:30; }
  .denied-hero{ padding:var(--s4); }
  .intel-metrics{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
  .intel-metric{ flex-direction:column; align-items:center; justify-content:center; min-width:0; gap:4px; padding:10px 6px; text-align:center; }
  .intel-metric strong{ font-size:20px; }
  .intel-metric span{ max-width:100%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:10px; }
  .intel-opportunity-head{ align-items:flex-start; flex-direction:column; gap:3px; }
  .intel-opportunities{ grid-template-columns:1fr; }
  .intel-sources{ grid-template-columns:1fr; }
  .intel-actions .btn{ width:100%; justify-content:center; }
  .denied-actions .btn{ width:100%; justify-content:center; }
  .denied-grid{ grid-template-columns:1fr; }
  .dlist.table-as-card thead{ display:none; }
  .dlist.table-as-card, .dlist.table-as-card tbody, .dlist.table-as-card tr, .dlist.table-as-card td{ display:block; width:100%; }
  .dlist.table-as-card tr{ border:1px solid var(--border); border-radius:10px; margin-bottom:10px; padding:6px; }
  .dlist.table-as-card td{ border:none; padding:6px 10px; }
  .funnel-label{ width:84px; }
  .page-header-actions{ width:100%; justify-content:space-between; }
  .period-picker{ flex-wrap:wrap; }
}

/* =====================================================================
   PASS A — PORTALE CLIENTE: onboarding che gasa, movimento, chat plug,
   barra consumo AI. Sezione additiva (non altera le classi sopra).
   Tutto rispetta le 10 regole anti-overflow (min-width:0, truncate, clamp).
   ===================================================================== */

/* ---- Movimento d'ingresso (fade + slide-in), una volta, accessibile ---- */
@keyframes revealUp{ from{ opacity:0; transform:translateY(10px); } to{ opacity:1; transform:none; } }
@keyframes growW{ from{ width:0; } to{ width:var(--w,100%); } }
@keyframes popIn{ from{ opacity:0; transform:translateY(6px) scale(.98); } to{ opacity:1; transform:none; } }
.reveal{ animation:revealUp .5s cubic-bezier(.2,.7,.3,1) both; }

/* ---- ONBOARDING / spinta al futuro ---- */
.onb-card{
  position:relative; overflow:hidden; min-width:0;
  background:
    radial-gradient(120% 140% at 100% 0%, rgba(124,77,255,0.16), transparent 55%),
    var(--panel-bg);
  border:1px solid rgba(124,77,255,0.30); border-radius:16px;
  padding:var(--s4); margin-bottom:var(--s4);
  box-shadow:0 10px 40px rgba(124,77,255,0.08);
}
.onb-glow{
  position:absolute; top:-40%; right:-10%; width:340px; height:340px; pointer-events:none;
  background:radial-gradient(circle, rgba(124,77,255,0.22), transparent 65%);
  filter:blur(8px); animation:onbDrift 9s ease-in-out infinite alternate;
}
@keyframes onbDrift{ from{ transform:translate(0,0); } to{ transform:translate(-24px,18px); } }
.onb-head{ display:flex; align-items:flex-start; justify-content:space-between; gap:var(--s4); min-width:0; position:relative; }
.onb-eyebrow{ display:inline-flex; align-items:center; gap:7px; font-size:12px; font-weight:700; letter-spacing:.5px; text-transform:uppercase; color:var(--primary-2); }
.onb-spark{ width:8px; height:8px; border-radius:50%; background:var(--primary-2); box-shadow:0 0 0 0 rgba(124,77,255,.6); animation:pulse 2s infinite; flex-shrink:0; }
.onb-title{ font-size:clamp(18px,2.6vw,24px); font-weight:800; color:var(--text); line-height:1.2; margin:8px 0 6px; }
.onb-sub{ font-size:13px; color:var(--text-2); max-width:46ch; line-height:1.5; }
.onb-ring{
  flex-shrink:0; width:74px; height:74px; border-radius:50%;
  background:conic-gradient(var(--primary) calc(var(--pct,0)*1%), var(--bg-4) 0);
  -webkit-mask:radial-gradient(circle 34px at 50% 50%, transparent 22px, #000 23px);
          mask:radial-gradient(circle 34px at 50% 50%, transparent 22px, #000 23px);
  display:grid; place-items:center; position:relative;
}
.onb-ring-num{ font-size:15px; font-weight:800; color:var(--text); font-variant-numeric:tabular-nums; }
.onb-progress{ margin:var(--s4) 0 var(--s3); }
.onb-bar{ height:8px; border-radius:999px; background:var(--bg-3); overflow:hidden; }
.onb-fill{
  height:100%; width:var(--w,0%); border-radius:999px;
  background:linear-gradient(90deg,var(--primary),var(--primary-2));
  animation:growW 1.1s cubic-bezier(.2,.8,.2,1) both; animation-delay:.15s;
}
.onb-progress-meta{ margin-top:8px; font-size:12px; color:var(--text-2); font-weight:600; }
.onb-steps{ display:grid; grid-template-columns:repeat(auto-fill,minmax(min(280px,100%),1fr)); gap:var(--s2); }
.onb-step{
  display:flex; align-items:center; gap:var(--s3); min-width:0;
  background:var(--bg-3); border:1px solid var(--border); border-radius:12px; padding:12px var(--s3);
  transition:border-color .15s, transform .15s, background .15s;
}
.onb-step:hover{ border-color:rgba(124,77,255,0.4); transform:translateY(-2px); }
.onb-step.done{ background:rgba(34,197,94,0.06); border-color:rgba(34,197,94,0.28); }
.onb-step-ck{
  width:34px; height:34px; flex-shrink:0; border-radius:10px; display:grid; place-items:center;
  background:rgba(124,77,255,0.12); color:var(--primary-2);
}
.onb-step-ck svg{ width:18px; height:18px; }
.onb-step.done .onb-step-ck{ background:rgba(34,197,94,0.16); color:var(--ok); }
.onb-step-txt{ flex:1; min-width:0; }
.onb-step-title{ font-size:13.5px; font-weight:600; color:var(--text); }
.onb-step.done .onb-step-title{ color:var(--text-2); }
.onb-step-desc{ font-size:12px; color:var(--text-2); margin-top:2px; line-height:1.4; }
.onb-step-act{ flex-shrink:0; }
.onb-cta{ display:flex; align-items:center; gap:var(--s3); flex-wrap:wrap; margin-top:var(--s4); }
.onb-cta-note{ font-size:12px; color:var(--text-2); }

/* ---- CONSUMO AI (plug visivo) ---- */
.consumo-meter{
  display:block; width:100%; text-align:left; cursor:pointer;
  background:var(--bg-3); border:1px solid var(--border); border-radius:12px; padding:var(--s3);
  transition:border-color .15s, transform .15s;
}
.consumo-meter:hover{ border-color:rgba(124,77,255,0.4); transform:translateY(-2px); }
.consumo-top{ display:flex; align-items:baseline; gap:8px; margin-bottom:10px; }
.consumo-pct{ font-size:26px; font-weight:800; color:var(--text); font-variant-numeric:tabular-nums; line-height:1; }
.consumo-cap{ font-size:12px; color:var(--text-2); }
.consumo-bar{ height:10px; border-radius:999px; background:var(--bg-4); overflow:hidden; }
.consumo-fill{
  height:100%; width:var(--w,0%); border-radius:999px;
  background:linear-gradient(90deg,var(--primary),var(--primary-2));
  animation:growW 1.1s cubic-bezier(.2,.8,.2,1) both; animation-delay:.2s;
}
.consumo-foot{ display:flex; align-items:center; justify-content:space-between; gap:var(--s2); margin-top:10px; flex-wrap:wrap; }
.consumo-hint{ font-size:11px; color:var(--text-3); }

/* ---- ACTION TILES (cosa puoi fare ora) ---- */
.action-tiles{ display:grid; grid-template-columns:repeat(auto-fill,minmax(min(220px,100%),1fr)); gap:var(--s2); }
.action-tile{
  display:flex; align-items:center; gap:var(--s3); min-width:0; text-align:left; cursor:pointer;
  background:var(--bg-3); border:1px solid var(--border); border-radius:12px; padding:12px var(--s3);
  color:var(--text); text-decoration:none; transition:border-color .15s, transform .15s, background .15s;
}
.action-tile:hover{ border-color:rgba(124,77,255,0.4); transform:translateY(-2px); background:var(--bg-4); }
.action-ico{ width:36px; height:36px; flex-shrink:0; border-radius:10px; display:grid; place-items:center; background:rgba(124,77,255,0.12); color:var(--primary-2); }
.action-ico svg{ width:18px; height:18px; }
.action-txt{ display:flex; flex-direction:column; min-width:0; }
.action-t{ font-size:13.5px; font-weight:600; color:var(--text); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.action-d{ font-size:12px; color:var(--text-2); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }

/* ---- CHAT PLUG (anteprima, nessun backend) ---- */
.chat-fab{
  position:fixed; right:22px; bottom:22px; z-index:320;
  display:inline-flex; align-items:center; gap:9px;
  background:linear-gradient(135deg,var(--purple-1),var(--purple-dark)); color:#fff;
  border:none; border-radius:999px; padding:13px 18px; cursor:pointer;
  font-size:13.5px; font-weight:700; font-family:inherit;
  box-shadow:0 12px 32px rgba(124,77,255,0.45);
  transition:transform .15s, box-shadow .15s, opacity .2s;
  animation:revealUp .5s .4s both;
}
.chat-fab:hover{ transform:translateY(-2px); box-shadow:0 16px 40px rgba(124,77,255,0.55); }
.chat-fab svg{ width:20px; height:20px; flex-shrink:0; }
.chat-fab.hidden{ opacity:0; pointer-events:none; transform:translateY(10px) scale(.96); }
.chat-panel{
  position:fixed; right:22px; bottom:22px; z-index:330; width:min(380px,calc(100vw - 24px));
  max-height:min(620px,calc(100vh - 44px)); display:none; flex-direction:column;
  background:var(--bg-2); border:1px solid var(--border); border-radius:16px; overflow:hidden;
  box-shadow:0 24px 64px rgba(0,0,0,0.5);
}
.chat-panel.open{ display:flex; animation:popIn .25s ease both; }
.chat-head{ display:flex; align-items:center; justify-content:space-between; gap:var(--s3); padding:14px var(--s3); border-bottom:1px solid var(--border); background:var(--bg-2); }
.chat-head-id{ display:flex; align-items:center; gap:10px; min-width:0; }
.chat-avatar{ width:36px; height:36px; flex-shrink:0; border-radius:10px; display:grid; place-items:center; background:linear-gradient(135deg,var(--purple-1),var(--purple-dark)); color:#fff; }
.chat-avatar svg{ width:20px; height:20px; }
.chat-head-title{ font-size:14px; font-weight:700; color:var(--text); }
.chat-head-sub{ font-size:11.5px; color:var(--text-2); display:flex; align-items:center; gap:6px; }
.chat-modes{ display:flex; gap:6px; padding:10px var(--s3); border-bottom:1px solid var(--border); }
.chat-mode{
  flex:1; min-width:0; display:inline-flex; align-items:center; justify-content:center; gap:6px;
  font-size:12px; font-weight:600; font-family:inherit; cursor:pointer;
  background:var(--bg-3); border:1px solid var(--border); color:var(--text-2);
  border-radius:8px; padding:8px 6px; transition:background .15s,color .15s,border-color .15s;
}
.chat-mode svg{ width:14px; height:14px; flex-shrink:0; }
.chat-mode.active{ background:rgba(124,77,255,0.14); border-color:rgba(124,77,255,0.4); color:var(--primary-2); }
.chat-body{ flex:1; overflow-y:auto; padding:var(--s3); display:flex; flex-direction:column; gap:10px; min-height:140px; }
.chat-bubble{ max-width:85%; min-width:0; }
.chat-bubble.bot{ align-self:flex-start; }
.chat-bubble.user{ align-self:flex-end; }
.chat-bubble.pop{ animation:popIn .25s ease both; }
.chat-bubble-txt{ font-size:13px; line-height:1.5; padding:10px 13px; border-radius:14px; overflow-wrap:anywhere; }
.chat-bubble.bot .chat-bubble-txt{ background:var(--bg-3); color:var(--text); border-bottom-left-radius:5px; }
.chat-bubble.user .chat-bubble-txt{ background:linear-gradient(135deg,var(--purple-1),var(--purple-dark)); color:#fff; border-bottom-right-radius:5px; }
.chat-suggest{ display:flex; flex-wrap:wrap; gap:7px; }
.chat-suggest[hidden]{ display:none; }
.chat-chip{
  font-size:12px; font-family:inherit; cursor:pointer; color:var(--primary-2);
  background:rgba(124,77,255,0.10); border:1px solid rgba(124,77,255,0.3); border-radius:999px;
  padding:6px 12px; transition:background .15s; max-width:100%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
}
.chat-chip:hover{ background:rgba(124,77,255,0.2); }
.chat-input{ display:flex; align-items:center; gap:8px; padding:10px var(--s3); border-top:1px solid var(--border); }
.chat-input input{
  flex:1; min-width:0; background:var(--bg-3); border:1px solid var(--border); border-radius:999px;
  padding:9px 14px; color:var(--text); font-size:13px; font-family:inherit;
}
.chat-input input:disabled{ cursor:not-allowed; color:var(--text-3); }
.chat-send{ width:38px; height:38px; flex-shrink:0; border-radius:50%; border:none; cursor:pointer; display:grid; place-items:center; background:var(--bg-4); color:var(--text-3); }
.chat-send svg{ width:16px; height:16px; }
.chat-send:disabled{ cursor:not-allowed; }
.chat-foot{ padding:8px var(--s3) 12px; font-size:11px; color:var(--text-3); text-align:center; }

/* ---- AI GUIDED SUPPORT (contextual, read-only) ---- */
.ai-guide-toggle{ position:relative; }
.ai-guide-toggle::after{
  content:""; position:absolute; right:7px; top:7px; width:6px; height:6px; border-radius:50%;
  background:var(--purple-2); box-shadow:0 0 12px rgba(180,138,255,.72);
}
.ai-guide-avatar{
  width:24px; height:24px; border-radius:10px; display:grid; grid-template-columns:1fr 1fr;
  align-items:center; justify-items:center; gap:2px; padding:6px;
  background:
    radial-gradient(circle at 35% 28%, rgba(255,255,255,.72), transparent 22%),
    linear-gradient(145deg, rgba(180,138,255,.96), rgba(124,77,255,.68) 56%, rgba(50,32,120,.92));
  border:1px solid rgba(255,255,255,.28);
  box-shadow:0 8px 22px rgba(124,77,255,.28), inset 0 1px 0 rgba(255,255,255,.38);
}
.ai-guide-avatar-eye{
  width:4px; height:5px; border-radius:999px; background:#fff;
  box-shadow:0 0 8px rgba(255,255,255,.9);
}
.ai-guide-backdrop{
  position:fixed; inset:0; z-index:328; background:rgba(0,0,0,.38);
  -webkit-backdrop-filter:blur(2px); backdrop-filter:blur(2px);
}
.ai-guide-backdrop[hidden]{ display:none; }
.ai-guide-panel{
  position:fixed; right:18px; top:calc(var(--topbar-h) + 14px); z-index:329;
  width:min(420px,calc(100vw - 24px)); max-height:calc(100vh - var(--topbar-h) - 28px);
  display:none; flex-direction:column; overflow:hidden;
  border:1px solid rgba(180,138,255,.28); border-radius:18px;
  background:linear-gradient(135deg,rgba(124,77,255,.16),rgba(255,255,255,.035)),var(--panel-bg);
  -webkit-backdrop-filter:var(--glass-blur); backdrop-filter:var(--glass-blur);
  box-shadow:0 28px 90px rgba(0,0,0,.42), 0 1px 0 rgba(255,255,255,.08) inset;
}
.ai-guide-panel.open{ display:flex; animation:popIn .2s ease both; }
.ai-guide-head{
  display:flex; align-items:flex-start; justify-content:space-between; gap:12px;
  padding:16px 16px 14px; border-bottom:1px solid var(--border-soft);
}
.ai-guide-head-main{ display:flex; flex-direction:column; gap:3px; min-width:0; }
.ai-guide-kicker{
  color:var(--purple-3); font-size:10.5px; font-weight:800; text-transform:uppercase;
  letter-spacing:.06em;
}
.ai-guide-head strong{ font-size:17px; line-height:1.15; color:var(--text); overflow-wrap:anywhere; }
.ai-guide-head small{ color:var(--text-2); font-size:12px; overflow-wrap:anywhere; }
.ai-guide-close{ flex:0 0 auto; }
.ai-guide-body{ overflow:auto; padding:14px 16px; display:flex; flex-direction:column; gap:12px; }
.ai-guide-status{
  border:1px solid rgba(124,77,255,.22); border-radius:12px; padding:12px;
  background:rgba(124,77,255,.09); color:var(--text-2); font-size:13px;
}
.ai-guide-section{
  border:1px solid rgba(124,77,255,.2); border-radius:13px; padding:12px;
  background:color-mix(in srgb, var(--bg-2) 78%, transparent);
}
.ai-guide-section > span{
  display:block; color:var(--text-2); font-size:10.5px; font-weight:800;
  text-transform:uppercase; letter-spacing:.055em; margin-bottom:8px;
}
.ai-guide-section p,
.ai-guide-section li{ color:var(--text); font-size:13px; line-height:1.45; overflow-wrap:anywhere; }
.ai-guide-section p{ margin:0; }
.ai-guide-section ul{ margin:0; padding-left:18px; display:flex; flex-direction:column; gap:6px; }
.ai-guide-action-list{ display:flex; flex-direction:column; gap:8px; }
.ai-guide-script-list{ display:flex; flex-direction:column; gap:8px; }
.ai-guide-script{
  width:100%; min-height:46px; display:flex; flex-direction:column; align-items:flex-start;
  justify-content:center; gap:3px; border:1px solid rgba(180,138,255,.25); border-radius:12px;
  background:linear-gradient(135deg,rgba(124,77,255,.18),rgba(255,255,255,.035));
  color:var(--text); padding:9px 11px; font:inherit; cursor:pointer;
}
.ai-guide-script strong{ font-size:12.8px; line-height:1.2; overflow-wrap:anywhere; }
.ai-guide-script span{ color:var(--text-2); font-size:11.5px; line-height:1.25; }
.ai-guide-script:hover{ border-color:rgba(180,138,255,.48); background:rgba(124,77,255,.16); }
.ai-guide-journey-list{ display:flex; flex-direction:column; gap:9px; }
.ai-guide-journey{
  border:1px solid rgba(180,138,255,.18); border-radius:11px; padding:10px;
  background:rgba(124,77,255,.08); display:flex; flex-direction:column; gap:7px;
}
.ai-guide-journey strong{ color:var(--text); font-size:12.8px; line-height:1.25; overflow-wrap:anywhere; }
.ai-guide-journey p{ color:var(--text-2); font-size:12.2px; line-height:1.42; margin:0; }
.ai-guide-journey ol{ margin:0; padding-left:18px; display:flex; flex-direction:column; gap:5px; }
.ai-guide-journey li{ padding-left:1px; }
.ai-guide-journey li span{ display:block; color:var(--text); font-size:12.2px; line-height:1.32; }
.ai-guide-journey li small{ display:block; color:var(--text-2); font-size:10.8px; line-height:1.32; overflow-wrap:anywhere; }
.ai-guide-action{
  width:100%; display:flex; align-items:center; justify-content:space-between; gap:10px;
  min-height:38px; border:1px solid rgba(124,77,255,.2); border-radius:10px;
  background:var(--bg-3); color:var(--text); padding:8px 10px; font:inherit;
}
.ai-guide-action strong{ min-width:0; font-size:12.5px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.ai-guide-action span{
  flex:0 0 auto; color:var(--purple-3); font-size:10.5px; font-weight:800;
  text-transform:uppercase; letter-spacing:.04em;
}
.ai-guide-action:disabled{ opacity:.95; cursor:not-allowed; }
.ai-guide-foot{
  border-top:1px solid var(--border-soft); padding:11px 16px; color:var(--text-2);
  font-size:11.5px; line-height:1.4; background:rgba(0,0,0,.08); display:flex;
  flex-direction:column; gap:10px;
}
.ai-guide-feedback{ display:flex; flex-wrap:wrap; gap:8px; }
.ai-guide-feedback .btn{
  min-height:30px; padding:6px 10px; border-radius:8px; font-size:12px; line-height:1.1;
  flex:1 1 96px; justify-content:center; white-space:normal;
}
.ai-guide-feedback .btn:disabled{ opacity:.66; cursor:not-allowed; }
.ai-guide-anchor-active{
  outline:2px solid rgba(180,138,255,.82) !important; outline-offset:3px;
  box-shadow:0 0 0 5px rgba(124,77,255,.16) !important;
}
.ai-guide-anchor-current{
  position:relative; z-index:326;
  border-radius:8px;
}
.ai-guide-stepbar{
  position:fixed; left:50%; top:calc(var(--topbar-h) + 12px); z-index:333;
  width:min(780px,calc(100vw - 24px)); transform:translateX(-50%);
  display:flex; align-items:center; gap:12px; padding:11px 12px;
  border:1px solid rgba(180,138,255,.34); border-radius:16px;
  background:linear-gradient(135deg,rgba(124,77,255,.2),rgba(255,255,255,.06)),var(--panel-bg);
  -webkit-backdrop-filter:var(--glass-blur); backdrop-filter:var(--glass-blur);
  box-shadow:0 18px 64px rgba(0,0,0,.34), inset 0 1px 0 rgba(255,255,255,.12);
}
.ai-guide-stepbar[hidden]{ display:none; }
.ai-guide-stepbar-avatar{
  flex:0 0 38px; width:38px; height:38px; border-radius:14px; display:grid;
  grid-template-columns:1fr 1fr; align-items:center; justify-items:center; gap:2px; padding:11px;
  background:linear-gradient(145deg,rgba(180,138,255,.95),rgba(124,77,255,.7) 58%,rgba(50,32,120,.96));
  box-shadow:0 10px 28px rgba(124,77,255,.3), inset 0 1px 0 rgba(255,255,255,.38);
}
.ai-guide-stepbar-avatar span{ width:5px; height:6px; border-radius:999px; background:#fff; }
.ai-guide-stepbar-copy{ min-width:0; flex:1; display:flex; flex-direction:column; gap:2px; }
.ai-guide-stepbar-copy strong{ color:var(--text); font-size:14px; line-height:1.2; overflow-wrap:anywhere; }
.ai-guide-stepbar-copy p{ color:var(--text-2); font-size:12.5px; line-height:1.35; margin:0; overflow-wrap:anywhere; }
.ai-guide-stepbar-controls{ flex:0 0 auto; display:flex; align-items:center; gap:8px; }
.ai-guide-stepbar-controls .btn{ min-height:32px; padding:7px 11px; border-radius:9px; font-size:12px; }
.ai-guide-stepbar-controls .icon-btn{ width:32px; height:32px; }
.ai-guide-tooltip{
  position:fixed; z-index:332; padding:10px 11px; border:1px solid rgba(180,138,255,.38);
  border-radius:13px; background:linear-gradient(135deg,rgba(34,22,68,.92),rgba(20,19,32,.9));
  -webkit-backdrop-filter:var(--glass-blur); backdrop-filter:var(--glass-blur);
  box-shadow:0 18px 48px rgba(0,0,0,.36); color:var(--text);
}
.ai-guide-tooltip[hidden]{ display:none; }
.ai-guide-tooltip span{ display:block; font-size:12px; font-weight:800; line-height:1.2; margin-bottom:4px; }
.ai-guide-tooltip p{ margin:0; color:var(--text-2); font-size:11.8px; line-height:1.35; overflow-wrap:anywhere; }
html[data-theme="light"] .ai-guide-panel{ box-shadow:0 24px 72px rgba(60,45,95,.18), 0 1px 0 rgba(255,255,255,.78) inset; }
html[data-theme="light"] .ai-guide-stepbar,
html[data-theme="light"] .ai-guide-tooltip{
  box-shadow:0 18px 52px rgba(60,45,95,.18), inset 0 1px 0 rgba(255,255,255,.72);
}
html[data-theme="light"] .ai-guide-tooltip{
  background:linear-gradient(135deg,rgba(255,255,255,.88),rgba(246,243,255,.82));
}

/* ---- MODALE CONSUMO AI ---- */
.cons-backdrop{ display:none; position:fixed; inset:0; z-index:340; background:rgba(0,0,0,0.6); backdrop-filter:blur(2px); }
.cons-backdrop.open{ display:block; }
.cons-modal{
  display:none; position:fixed; inset:0; margin:auto; z-index:341;
  width:min(520px,calc(100vw - 24px)); height:max-content; max-height:90vh; overflow-y:auto;
  background:var(--bg-2); border:1px solid var(--border); border-radius:16px; padding:var(--s4);
  box-shadow:0 24px 64px rgba(0,0,0,0.6);
}
.cons-modal.open{ display:block; animation:popIn .25s ease both; }
.cons-head{ display:flex; align-items:flex-start; justify-content:space-between; gap:var(--s3); margin-bottom:var(--s4); min-width:0; }
.cons-title{ font-size:18px; font-weight:800; color:var(--text); }
.cons-sub{ font-size:13px; color:var(--text-2); margin-top:3px; }
.cons-summary{ background:var(--bg-3); border:1px solid var(--border); border-radius:12px; padding:var(--s3); margin-bottom:var(--s4); }
.cons-summary-num{ font-size:28px; font-weight:800; color:var(--text); font-variant-numeric:tabular-nums; margin-bottom:10px; }
.cons-summary-unit{ font-size:13px; font-weight:500; color:var(--text-2); margin-left:4px; }
.cons-summary-meta{ font-size:12px; color:var(--text-2); margin-top:10px; }
.cons-list-title{ font-size:12px; font-weight:700; text-transform:uppercase; letter-spacing:.5px; color:var(--text-2); margin-bottom:10px; }
.cons-list{ display:flex; flex-direction:column; gap:8px; }
.cons-row{ display:flex; align-items:center; gap:var(--s3); min-width:0; }
.cons-row-ico{ width:32px; height:32px; flex-shrink:0; border-radius:9px; display:grid; place-items:center; background:rgba(124,77,255,0.12); color:var(--primary-2); }
.cons-row-ico svg{ width:16px; height:16px; }
.cons-row-txt{ flex:1; min-width:0; }
.cons-row-t{ font-size:13px; font-weight:600; color:var(--text); }
.cons-row-d{ font-size:11.5px; color:var(--text-2); }
.cons-row-bar{ width:84px; flex-shrink:0; height:6px; border-radius:999px; background:var(--bg-4); overflow:hidden; }
.cons-row-fill{ height:100%; width:var(--w,0%); border-radius:999px; background:linear-gradient(90deg,var(--primary),var(--primary-2)); animation:growW 1s cubic-bezier(.2,.8,.2,1) both; animation-delay:.1s; }
.cons-row-pct{ width:34px; flex-shrink:0; text-align:right; font-size:12.5px; font-weight:700; color:var(--text); font-variant-numeric:tabular-nums; }
.cons-note{ margin-top:var(--s4); font-size:12px; color:var(--text-3); line-height:1.5; }

/* ---- Responsive cliente ---- */
@media (max-width:560px){
  .onb-head{ flex-direction:column; align-items:flex-start; gap:var(--s3); }
  .onb-ring{ align-self:flex-start; }
  .chat-fab-label{ display:none; }
  .chat-fab{ padding:14px; }
  .chat-panel{ right:12px; left:12px; bottom:12px; width:auto; }
  .ai-guide-panel{ right:12px; left:12px; top:calc(var(--topbar-h) + 10px); width:auto; max-height:calc(100vh - var(--topbar-h) - 20px); }
  .ai-guide-head{ padding:14px; }
  .ai-guide-body{ padding:12px; }
  .ai-guide-stepbar{
    left:12px; right:12px; top:calc(var(--topbar-h) + 8px); width:auto; transform:none;
    align-items:flex-start; flex-wrap:wrap;
  }
  .ai-guide-stepbar-copy{ flex:1 1 calc(100% - 56px); }
  .ai-guide-stepbar-controls{ width:100%; justify-content:flex-end; }
  .ai-guide-tooltip{ max-width:calc(100vw - 24px); }
}

/* =====================================================================
   A11Y FONDAMENTA (design-system): focus-visible coerente su TUTTO il
   cockpit + reduced-motion COMPLETO. Prima: focus-visible assente,
   reduced-motion coperto solo per il blocco cliente (live-dot/skeleton/
   toast continuavano ad animare). Sono gate del processo UI.
   ===================================================================== */

/* Focus visibile coerente: anello viola a 3px, solo da tastiera (:focus-visible),
   mai sul focus da mouse. Vale per link, bottoni, campi e voci nav/tab. */
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
[tabindex]:focus-visible,
.nav-item:focus-visible,
.subtab:focus-visible,
.gx-tab:focus-visible,
.action-tile:focus-visible,
.icon-btn:focus-visible {
  outline: 2px solid var(--purple-2);
  outline-offset: 2px;
  border-radius: 6px;
}
/* Per gli input togliamo il doppio segnale: l'anello sostituisce il box-shadow. */
.form-control:focus-visible { box-shadow: none; }

/* reduced-motion COMPLETO: azzera ogni animazione/transizione (live-dot,
   skeleton, toast, reveal, barre) lasciando lo stato finale; niente smooth-scroll. */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.001ms !important;
    scroll-behavior: auto !important;
  }
  .onb-fill, .consumo-fill, .cons-row-fill { width: var(--w, 0%); }
}

/* =====================================================================
   GESTIONALE (Consulta) v2 — filtri STABILI ed etichettati, KPI card
   anti-overflow, breakdown leggibili (metodo/giorno/turno/categoria),
   intervallo date custom. Riusa i token (--s*, --radius, --primary, --ok…)
   e le 10 regole anti-overflow del DASHBOARD-V2-SPEC. Vale per /gestionale
   (agenzia) e /mio-gestionale (cliente): stesso markup riusabile.
   ===================================================================== */

/* --- Toolbar filtri: posizione STABILE, gruppi etichettati (niente pill
   che salta a tutta larghezza come nella v1). --- */
.gx-toolbar{
  display:flex; flex-wrap:wrap; align-items:flex-end; gap:var(--s3) var(--s5);
  background:var(--panel-bg); border:1px solid var(--border);
  border-radius:var(--radius); padding:var(--s3) var(--s4);
  margin-bottom:var(--s4); min-width:0;
}
.gx-fgroup{ display:flex; flex-direction:column; align-items:flex-start; gap:7px; min-width:0; }
.gx-fgroup-label{
  font-size:11px; font-weight:700; color:var(--text-2);
  text-transform:uppercase; letter-spacing:0.6px;
  display:flex; align-items:center; gap:6px;
}
.gx-fgroup-label svg{ width:13px; height:13px; opacity:.85; flex-shrink:0; }

/* segmented control: contenitore inline (NON stretch), opzioni a contenuto */
.gx-seg{
  display:inline-flex; align-self:flex-start; flex-wrap:wrap; gap:3px;
  background:var(--bg-3); border:1px solid var(--border);
  border-radius:10px; padding:3px;
}
.gx-seg a{
  flex:0 0 auto; display:inline-flex; align-items:center; gap:6px;
  font-size:13px; font-weight:600; color:var(--text-2); text-decoration:none;
  padding:7px 14px; border-radius:7px; white-space:nowrap;
  transition:background .15s, color .15s;
}
.gx-seg a:hover{ color:var(--text); background:var(--bg-4); }
.gx-seg a.active{ background:var(--primary); color:#fff; box-shadow:0 1px 3px rgba(124,77,255,0.4); }
.gx-seg a.active:hover{ background:var(--primary); color:#fff; }

/* range date custom (da/a): form GET → stato bookmarkabile, nessuno stato JS */
.gx-daterange{ display:flex; flex-wrap:wrap; align-items:flex-end; gap:var(--s2); min-width:0; }
.gx-date{ display:flex; flex-direction:column; gap:4px; min-width:0; }
.gx-date > span{ font-size:10px; font-weight:700; color:var(--text-3); text-transform:uppercase; letter-spacing:0.4px; }
.gx-date input[type=date]{
  background:var(--bg-3); border:1px solid var(--border); border-radius:8px;
  color:var(--text); font-size:13px; font-family:inherit; padding:7px 10px;
  outline:none; transition:border-color .15s, box-shadow .15s; color-scheme:dark; max-width:155px;
}
html[data-theme="light"] .gx-date input[type=date]{ color-scheme:light; }
.gx-date input[type=date]:focus{ border-color:var(--primary); box-shadow:0 0 0 3px rgba(124,77,255,0.12); }
.gx-daterange .btn{ height:36px; }
.gx-range-tag{
  display:inline-flex; align-items:center; gap:6px;
  font-size:12px; font-weight:600; color:var(--primary-2);
  background:rgba(124,77,255,0.1); border:1px solid rgba(124,77,255,0.25);
  border-radius:999px; padding:5px 12px; white-space:nowrap; max-width:100%;
}
.gx-range-tag .x{ color:var(--text-2); text-decoration:none; line-height:0; display:inline-flex; }
.gx-range-tag .x:hover{ color:var(--text); }

/* --- KPI gestionale: griglia fluida + card overflow-safe (R5/R6) --- */
.gx-kpis{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(min(210px,100%), 1fr));
  gap:var(--s3); margin-bottom:var(--s4);
}
.gx-kpi{
  background:var(--panel-bg); border:1px solid var(--border);
  border-radius:var(--radius); padding:var(--s3) var(--s4);
  display:flex; flex-direction:column; gap:6px; min-width:0; overflow:hidden;
  transition:border-color .15s, transform .15s;
}
.gx-kpi:hover{ border-color:rgba(124,77,255,0.35); }
.gx-kpi.accent{ border-color:rgba(124,77,255,0.35); background:rgba(124,77,255,0.06); }
.gx-kpi-label{
  font-size:11px; font-weight:600; color:var(--text-2);
  text-transform:uppercase; letter-spacing:0.5px;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
.gx-kpi-value{
  font-size:clamp(19px, 2.3vw, 25px); font-weight:700; color:var(--text);
  font-variant-numeric:tabular-nums; line-height:1.2;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
.gx-kpi.accent .gx-kpi-value{ color:var(--primary-2); }
.gx-kpi-sub{ font-size:12px; color:var(--text-2); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }

/* --- breakdown a barre: nome (troncato) + importo + sub-conteggio + track --- */
.gx-bars{ display:flex; flex-direction:column; gap:var(--s3); }
.gx-bar-row{ min-width:0; }
.gx-bar-top{ display:flex; align-items:baseline; gap:var(--s3); margin-bottom:6px; min-width:0; }
.gx-bar-name{ flex:1; min-width:0; font-size:13px; color:var(--text); font-weight:500; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.gx-bar-amt{ flex-shrink:0; font-size:13.5px; font-weight:700; color:var(--text); font-variant-numeric:tabular-nums; white-space:nowrap; }
.gx-bar-sub{ flex-shrink:0; font-size:12px; color:var(--text-2); font-variant-numeric:tabular-nums; white-space:nowrap; min-width:54px; text-align:right; }
.gx-bar-track{ height:8px; background:var(--bg-3); border-radius:6px; overflow:hidden; }
.gx-bar-fill{ height:100%; min-width:3px; background:linear-gradient(90deg, var(--primary), var(--primary-2)); border-radius:6px; }
.gx-bar-fill.alt{ background:linear-gradient(90deg, #2bb673, #4ade80); }

/* --- meta freschezza + nota limiti range (mai dati inventati) --- */
.gx-fresh{ display:inline-flex; align-items:center; gap:8px; font-size:12px; color:var(--text-2); margin-top:var(--s3); }
.gx-fresh svg{ width:14px; height:14px; opacity:.8; flex-shrink:0; }
.gx-note{ font-size:12.5px; color:var(--text-2); line-height:1.55; background:var(--bg-3); border:1px solid var(--border); border-left:3px solid var(--primary); border-radius:8px; padding:10px var(--s3); margin-bottom:var(--s4); }

/* --- hardening globale stat-card (R1/R6): nessun valore esce più dai bordi --- */
.stat-card{ min-width:0; overflow:hidden; }
.stats-grid > *{ min-width:0; }
.stat-value{ font-variant-numeric:tabular-nums; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }

/* --- responsive gestionale --- */
@media (max-width:560px){
  .gx-toolbar{ gap:var(--s3); padding:var(--s3); }
  .gx-fgroup{ width:100%; }
  .gx-seg{ width:100%; }
  .gx-seg a{ flex:1 1 auto; justify-content:center; padding:8px 6px; }
  .gx-daterange{ width:100%; }
  .gx-date{ flex:1 1 120px; }
  .gx-date input[type=date]{ max-width:none; width:100%; }
  .gx-daterange .btn{ flex:1 1 100%; justify-content:center; }
}

/* --- liste a card responsive (turni recenti, dettagli numerici) — NON usano
   <table> così non spariscono su mobile (dove .table-wrap table è display:none) --- */
.gx-list{ display:grid; grid-template-columns:repeat(auto-fill, minmax(min(290px,100%), 1fr)); gap:var(--s3); }
.gx-list-card{ background:var(--panel-bg); border:1px solid var(--border); border-radius:var(--radius); padding:var(--s3) var(--s4); min-width:0; }
.gx-list-head{ display:flex; align-items:center; justify-content:space-between; gap:var(--s2); margin-bottom:var(--s3); min-width:0; }
.gx-list-title{ font-size:13.5px; font-weight:700; color:var(--text); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; min-width:0; }
.gx-figs{ display:grid; grid-template-columns:1fr 1fr; gap:var(--s2) var(--s3); }
.gx-fig{ min-width:0; }
.gx-fig .k{ font-size:10.5px; color:var(--text-2); text-transform:uppercase; letter-spacing:0.3px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.gx-fig .val{ font-size:14px; font-weight:600; color:var(--text); font-variant-numeric:tabular-nums; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.gx-fig .val.big{ font-size:17px; color:var(--primary-2); }
.gx-fig.span2{ grid-column:1 / -1; }

/* --- mini column-chart (andamento per giorno) — puro CSS, accessibile --- */
.gx-cols{ display:flex; align-items:flex-end; gap:6px; height:120px; min-width:0; }
.gx-col{ flex:1 1 0; min-width:0; display:flex; flex-direction:column; justify-content:flex-end; align-items:stretch; height:100%; }
.gx-col-bar{ background:linear-gradient(180deg, var(--primary-2), var(--primary)); border-radius:5px 5px 0 0; min-height:4px; }
.gx-col.today .gx-col-bar{ background:linear-gradient(180deg,#4ade80,#2bb673); }
.gx-cols-x{ display:flex; gap:6px; margin-top:8px; }
.gx-cols-x span{ flex:1 1 0; min-width:0; text-align:center; font-size:10px; color:var(--text-2); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }

/* sotto-titolo sezione senza border (per gruppi dentro detail-card) */
.gx-sub-title{ font-size:12px; font-weight:700; color:var(--text-2); text-transform:uppercase; letter-spacing:0.6px; margin:var(--s4) 0 var(--s3); }
.gx-sub-title:first-child{ margin-top:0; }

/* --- module-nav gestionale: tab bar con underline (linguaggio "navigazione",
   distinto dai filtri segmented così non si confondono). Stabile, wrappa con
   grazia, active chiaro senza barre piene a tutta larghezza. --- */
.gx-tabs{ display:flex; flex-wrap:wrap; gap:2px; border-bottom:1px solid var(--border); margin-bottom:var(--s4); }
.gx-tab{
  display:inline-flex; align-items:center; gap:6px;
  font-size:13.5px; font-weight:600; color:var(--text-2); text-decoration:none;
  padding:10px 14px; border-radius:8px 8px 0 0; white-space:nowrap;
  border-bottom:2px solid transparent; margin-bottom:-1px;
  transition:color .15s, border-color .15s, background .15s;
}
.gx-tab:hover{ color:var(--text); background:var(--bg-3); }
.gx-tab.active{ color:var(--primary-2); border-bottom-color:var(--primary); }

/* =====================================================================
   GESTIONALE ANALYTICS PRO — categoria+drill-down, affluenza per orario,
   export PDF, documenti fiscali. Additivo, riusa i token; tutte le 10 regole
   anti-overflow (min-width:0, truncate, grid fluida, overflow-x:auto esplicito).
   ===================================================================== */

/* --- barra azioni (contesto selezione + Scarica PDF) --- */
.gx-actionbar{ display:flex; align-items:center; justify-content:space-between; gap:var(--s3); flex-wrap:wrap; margin-bottom:var(--s4); min-width:0; }
.gx-actionbar-info{ font-size:13px; color:var(--text-2); min-width:0; overflow:hidden; text-overflow:ellipsis; }
.gx-actionbar-info strong{ color:var(--text); font-weight:600; }

/* --- intestazione sezione con hint a destra (es. "tocca per i dettagli") --- */
.detail-head{ display:flex; align-items:baseline; justify-content:space-between; gap:var(--s3); flex-wrap:wrap; margin-bottom:var(--s3); padding-bottom:8px; border-bottom:1px solid var(--border); min-width:0; }
.detail-hint{ font-size:12px; color:var(--text-2); min-width:0; overflow:hidden; text-overflow:ellipsis; }
.detail-hint strong{ color:var(--primary-2); }

/* --- VENDUTO PER CATEGORIA + DRILL-DOWN ITEM (native <details>, zero JS) --- */
.gx-cats{ display:flex; flex-direction:column; gap:var(--s2); }
.gx-cat{ border:1px solid var(--border); border-radius:10px; background:var(--bg-2); overflow:hidden; }
.gx-cat[open]{ border-color:rgba(124,77,255,0.3); }
.gx-cat-sum{ display:flex; align-items:center; gap:var(--s3); padding:12px var(--s3); cursor:pointer; list-style:none; min-width:0; transition:background .15s; }
.gx-cat-sum::-webkit-details-marker{ display:none; }
.gx-cat-sum:hover{ background:var(--bg-3); }
.gx-cat-chev{ width:15px; height:15px; flex-shrink:0; color:var(--text-2); transition:transform .2s; }
.gx-cat[open] .gx-cat-chev{ transform:rotate(90deg); color:var(--primary-2); }
.gx-cat-main{ flex:1; min-width:0; }
.gx-cat-items{ padding:6px var(--s3) var(--s3) calc(var(--s3) + 27px); display:flex; flex-direction:column; gap:12px; border-top:1px dashed var(--border); margin-top:2px; }
.gx-item-row .gx-bar-name{ font-weight:400; color:var(--text-2); }
.gx-bar-track.sm{ height:6px; }
.gx-bar-fill.alt2{ background:linear-gradient(90deg,#9b6bff,#b48aff); }

/* --- affluenza per orario: column-chart più alto, ora di punta evidenziata --- */
.gx-cols-tall{ height:150px; }
.gx-col.peak .gx-col-bar{ background:linear-gradient(180deg,#34d399,#10b981); }
.gx-chart-legend{ font-size:11.5px; color:var(--text-3); margin-top:10px; }

/* --- documenti fiscali: box per aliquota (griglia fluida) --- */
.gx-figgrid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(min(180px,100%),1fr)); gap:var(--s3); }
.gx-figbox{ background:var(--bg-3); border:1px solid var(--border); border-radius:10px; padding:12px var(--s3); min-width:0; }
.gx-figbox-k{ font-size:11px; font-weight:600; color:var(--text-2); text-transform:uppercase; letter-spacing:.4px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.gx-figbox-v{ font-size:19px; font-weight:700; color:var(--primary-2); font-variant-numeric:tabular-nums; margin-top:4px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.gx-figbox-s{ font-size:11.5px; color:var(--text-2); margin-top:2px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }

/* --- tabella documenti: grid allineata; scroll-x esplicito su mobile (denso) --- */
.gx-doctable{ display:flex; flex-direction:column; overflow-x:auto; }
.gx-doc-head, .gx-doc-row{
  display:grid;
  grid-template-columns:minmax(64px,1.1fr) 92px 100px minmax(80px,1.1fr) 92px 84px 96px;
  gap:var(--s2); align-items:center; padding:9px 6px; min-width:700px;
}
.gx-doc-head{ font-size:10.5px; font-weight:700; text-transform:uppercase; letter-spacing:.4px; color:var(--text-2); border-bottom:1px solid var(--border); position:sticky; top:0; }
.gx-doc-row{ border-bottom:1px solid var(--border); font-size:13px; }
.gx-doc-row:hover{ background:var(--bg-3); }
.gx-doc-head span, .gx-doc-row span{ min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.gx-doc-row .c-amt{ text-align:right; font-variant-numeric:tabular-nums; }
.gx-doc-head .c-amt{ text-align:right; }
.gx-doc-row .c-amt.strong{ font-weight:700; color:var(--text); }
.gx-doc-row .c-num{ font-weight:600; color:var(--text); }
.gx-doc-row .c-nif{ color:var(--text-2); }

/* =========================================================
   MAIL-MARKETING — sezione cockpit campagne / liste / template
   ========================================================= */

/* Badge stato campagna */
.badge-campaign-draft     { background:rgba(100,100,120,.15); color:var(--text-2); border:1px solid var(--border); }
.badge-campaign-pending   { background:rgba(245,158,11,.12); color:#fcd34d; border:1px solid rgba(245,158,11,.25); }
.badge-campaign-approved  { background:rgba(96,165,250,.12); color:#93c5fd; border:1px solid rgba(96,165,250,.25); }
.badge-campaign-sending   { background:rgba(124,77,255,.12); color:var(--purple-3); border:1px solid rgba(124,77,255,.25); }
.badge-campaign-sent      { background:rgba(34,197,94,.12); color:#86efac; border:1px solid rgba(34,197,94,.25); }
.badge-campaign-canceled  { background:rgba(239,68,68,.1); color:#fca5a5; border:1px solid rgba(239,68,68,.2); }

/* Stats bar */
.mm-stats-row { display:flex; gap:12px; margin-bottom:20px; flex-wrap:wrap; }
.mm-stat { background:var(--bg-2); border:1px solid var(--border); border-radius:10px; padding:12px 18px; min-width:80px; display:flex; flex-direction:column; align-items:center; }
.mm-stat-n { font-size:22px; font-weight:700; color:var(--primary-2); font-variant-numeric:tabular-nums; }
.mm-stat-l { font-size:11px; color:var(--text-2); margin-top:2px; text-align:center; }

/* Avviso non-pg */
.mm-notice { background:rgba(245,158,11,.08); border:1px solid rgba(245,158,11,.25); border-radius:10px; padding:10px 14px; display:flex; align-items:center; gap:8px; font-size:13px; color:#fcd34d; margin-bottom:16px; }

/* Layout two-col: main + sidebar */
.mm-two-col { display:grid; grid-template-columns:1fr 300px; gap:20px; align-items:start; }
@media (max-width:768px) { .mm-two-col { grid-template-columns:1fr; } }

/* Card riutilizzabile per sidebar */
.mm-sidebar-card { background:var(--bg-2); border:1px solid var(--border); border-radius:12px; padding:16px; }
.mm-card-title { font-size:13px; font-weight:700; color:var(--text); margin-bottom:12px; text-transform:uppercase; letter-spacing:.4px; }

/* Form helpers */
.form-group { margin-bottom:14px; }
.form-label { display:block; font-size:12px; font-weight:600; color:var(--text-2); margin-bottom:5px; }
.form-hint { font-size:11.5px; color:var(--text-3); }
.form-control { width:100%; background:var(--bg-3); border:1px solid var(--border); border-radius:8px; padding:8px 10px; color:var(--text); font-size:13px; font-family:inherit; box-sizing:border-box; }
.form-control:focus { outline:none; border-color:var(--purple-2); }
textarea.form-control { resize:vertical; }

/* Dettagli campagna */
.mm-detail-card { background:var(--bg-2); border:1px solid var(--border); border-radius:12px; overflow:hidden; }
.mm-detail-row { display:flex; gap:12px; padding:10px 14px; border-bottom:1px solid var(--border); font-size:13px; }
.mm-detail-row:last-child { border-bottom:none; }
.mm-detail-lbl { font-size:11px; font-weight:600; color:var(--text-2); min-width:90px; padding-top:1px; text-transform:uppercase; letter-spacing:.3px; }

/* Metriche per-campagna */
.mm-metrics-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(min(100px,100%),1fr)); gap:10px; }
.mm-metric { background:var(--bg-2); border:1px solid var(--border); border-radius:10px; padding:12px; text-align:center; }
.mm-metric-n { display:block; font-size:20px; font-weight:700; color:var(--primary-2); font-variant-numeric:tabular-nums; }
.mm-metric-l { display:block; font-size:11px; color:var(--text-2); margin-top:3px; }
.mm-metric-l sup { cursor:help; }

/* Anteprima in iframe */
.mm-email-iframe-wrap { border-radius:10px; overflow:hidden; }

/* Form layout (nuova campagna: main + preview) */
.mm-form-layout { display:grid; grid-template-columns:1fr 320px; gap:20px; align-items:start; }
@media (max-width:900px) { .mm-form-layout { grid-template-columns:1fr; } }
.mm-form-main { display:flex; flex-direction:column; }
.mm-section-title { font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:.5px; color:var(--text-3); margin-bottom:10px; }
.mm-preview-panel { background:var(--bg-2); border:1px solid var(--border); border-radius:12px; padding:16px; position:sticky; top:20px; }

/* Email preview (live nel form) */
.mm-email-preview { background:var(--bg-3); border:1px solid var(--border); border-radius:8px; padding:16px; }
.mm-ep-subject { font-weight:700; font-size:15px; margin-bottom:12px; color:var(--text); border-bottom:1px solid var(--border); padding-bottom:10px; }
.mm-ep-body { font-size:13px; color:var(--text-2); line-height:1.6; }
.mm-ep-cta { margin-top:12px; }
.mm-ep-cta span { background:linear-gradient(135deg,var(--purple-1),var(--purple-dark)); color:#fff; padding:8px 18px; border-radius:8px; display:inline-block; font-size:13px; font-weight:600; }

/* Info box (gabbia approvazione) */
.mm-info-box { background:rgba(124,77,255,.08); border:1px solid rgba(124,77,255,.2); border-radius:8px; padding:10px 14px; display:flex; align-items:flex-start; gap:8px; font-size:12px; color:var(--purple-3); line-height:1.5; }

/* Action card (approva/invia) */
.mm-action-card { border-color:rgba(124,77,255,.3); }

/* =========================================================
   ACCOUNT / ORGANIZATION SHELL - enterprise identity layer
   ========================================================= */
.org-switcher{ position:relative; }
.org-switcher summary{
  list-style:none; display:flex; align-items:center; gap:9px; cursor:pointer;
  min-width:0; max-width:260px; padding:6px 10px; border-radius:10px;
  border:1px solid rgba(124,77,255,.26);
  background:linear-gradient(135deg,rgba(124,77,255,.14),rgba(255,255,255,.035));
  color:var(--text); backdrop-filter:blur(14px);
}
.org-switcher summary::-webkit-details-marker{ display:none; }
.org-dot{ width:8px; height:8px; border-radius:999px; background:var(--purple-2); box-shadow:0 0 0 4px rgba(124,77,255,.14); flex-shrink:0; }
.org-switcher-text{ display:flex; flex-direction:column; min-width:0; line-height:1.2; }
.org-switcher-text strong{ font-size:12.5px; max-width:18ch; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.org-switcher-text small{ font-size:10.5px; color:var(--text-2); }
.org-switcher-menu{
  position:absolute; right:0; top:calc(100% + 8px); z-index:120; width:min(320px,88vw);
  display:flex; flex-direction:column; gap:6px; padding:8px;
  border:1px solid rgba(124,77,255,.22); border-radius:12px;
  background:rgba(22,22,31,.92); box-shadow:0 18px 60px rgba(0,0,0,.34);
  backdrop-filter:blur(18px);
}
html[data-theme="light"] .org-switcher-menu{ background:rgba(255,255,255,.94); box-shadow:0 18px 50px rgba(30,20,60,.12); }
.org-switcher-menu button,
.org-switcher-menu a{
  width:100%; display:flex; align-items:center; justify-content:space-between; gap:10px;
  border:0; border-radius:9px; padding:9px 10px; text-align:left; text-decoration:none;
  background:transparent; color:var(--text); font:inherit; cursor:pointer;
}
.org-switcher-menu button:hover,
.org-switcher-menu a:hover{ background:rgba(124,77,255,.12); }
.org-switcher-menu button:disabled{ cursor:default; opacity:.78; }
.org-switcher-menu button span{ display:flex; flex-direction:column; min-width:0; }
.org-switcher-menu button strong{ font-size:13px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.org-switcher-menu button small{ font-size:11px; color:var(--text-2); }
.org-switcher-menu em{ font-style:normal; font-size:11px; color:var(--purple-3); }

.identity-wrap{ display:flex; flex-direction:column; gap:18px; }
.identity-grid{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px; }
.identity-actions{ display:flex; align-items:center; gap:10px; flex-wrap:wrap; }
.workspace-switchboard-shell,
.workspace-governance-shell{ margin-bottom:0; }
.workspace-command-title{
  margin:0; color:var(--text); font-size:clamp(20px, 2.4vw, 28px);
  line-height:1.08; font-weight:780; letter-spacing:0;
}
.workspace-command-copy{
  margin:9px 0 0; max-width:800px; color:var(--text-2);
  font-size:14px; line-height:1.55;
}
.workspace-command-actions{ display:flex; gap:8px; flex-wrap:wrap; }
.identity-panel{
  background:linear-gradient(135deg,rgba(124,77,255,.055),rgba(255,255,255,.018)),var(--panel-bg);
  box-shadow:0 12px 36px rgba(0,0,0,.12);
}
html[data-theme="light"] .identity-panel{ box-shadow:0 12px 34px rgba(60,45,95,.08); }
.identity-fields{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; }
.identity-fields .detail-field span{ overflow-wrap:anywhere; }
.identity-fields .identity-alert{ grid-column:1 / -1; }
.identity-alert{
  display:flex; align-items:center; gap:10px; flex-wrap:wrap;
  border:1px solid rgba(245,158,11,.26); border-left:3px solid var(--warning);
  border-radius:10px; padding:11px 14px; background:rgba(245,158,11,.08);
  color:var(--text);
}
.identity-alert strong{ font-size:13px; }
.identity-alert span{ font-size:13px; color:var(--text-2); }
.identity-alert.subtle{ border-color:rgba(124,77,255,.22); border-left-color:var(--purple-2); background:rgba(124,77,255,.08); }
.identity-alert-success{ border-color:rgba(34,197,94,.28); border-left-color:var(--success); background:rgba(34,197,94,.08); }
.identity-form{
  display:grid; grid-template-columns:repeat(3,minmax(0,1fr)) auto;
  gap:12px; align-items:end; border-top:1px solid var(--border);
}
.identity-form label{ display:flex; flex-direction:column; gap:7px; min-width:0; }
.identity-form label span{ color:var(--text-2); font-size:12px; font-weight:700; }
.identity-form .table-search{ width:100%; min-height:38px; }
.identity-form-actions{ display:flex; align-items:center; min-height:38px; }
.identity-hero{
  display:flex; align-items:flex-end; justify-content:space-between; gap:16px; flex-wrap:wrap;
  border:1px solid rgba(124,77,255,.25); border-radius:14px; padding:22px;
  background:
    linear-gradient(135deg,rgba(124,77,255,.2),rgba(180,138,255,.05)),
    var(--panel-bg);
  box-shadow:0 16px 52px rgba(0,0,0,.16);
}
.identity-kicker{ display:block; font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:.6px; color:var(--purple-3); margin-bottom:6px; }
.identity-hero h1{ font-size:28px; line-height:1.05; margin:0 0 6px; letter-spacing:0; }
.identity-hero p{ color:var(--text-2); margin:0; }
.identity-hero-meta{ display:flex; gap:8px; align-items:center; flex-wrap:wrap; }
.identity-org-list{ display:flex; flex-direction:column; gap:9px; }
.identity-org-row{
  display:flex; align-items:center; justify-content:space-between; gap:12px;
  padding:11px 12px; border:1px solid var(--border); border-radius:10px; background:var(--bg-3);
}
.identity-org-row.is-current{ border-color:rgba(124,77,255,.42); background:rgba(124,77,255,.1); }
.identity-org-row div{ min-width:0; display:flex; flex-direction:column; gap:2px; }
.identity-org-row strong{ overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.identity-org-row span{ color:var(--text-2); font-size:12px; }
.identity-invite-form{ display:grid; grid-template-columns:1.2fr 1fr .9fr auto; gap:14px; align-items:end; }
.identity-invite-form .form-group{ margin-bottom:0; }
.identity-invite-actions{ display:flex; align-items:flex-end; justify-content:flex-end; }
.identity-role-form{ display:grid; grid-template-columns:minmax(128px,1fr) auto; gap:8px; align-items:center; max-width:260px; }
.identity-role-form .form-control{ min-height:32px; padding:6px 8px; font-size:12.5px; }
.permission-table td{ vertical-align:middle; }
.permission-table .cell-strong,
.permission-table .cell-sub{ overflow-wrap:anywhere; }
.permission-console .panel-body{ display:flex; flex-direction:column; gap:14px; }
.permission-summary-grid{ display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:10px; }
.permission-metric{
  min-height:76px; display:flex; flex-direction:column; justify-content:space-between; gap:8px;
  border:1px solid rgba(124,77,255,.18); border-radius:10px; padding:11px 12px; background:var(--bg-3);
}
.permission-metric span{ color:var(--text-2); font-size:11.5px; text-transform:uppercase; letter-spacing:.4px; }
.permission-metric strong{ font-size:22px; line-height:1; letter-spacing:0; }
.permission-metric.good{ border-color:rgba(16,185,129,.25); background:rgba(16,185,129,.07); }
.permission-metric.warn{ border-color:rgba(245,158,11,.26); background:rgba(245,158,11,.07); }
.permission-toolbar{ display:flex; align-items:flex-end; gap:12px; flex-wrap:wrap; }
.permission-search-wrap{ display:flex; flex-direction:column; gap:6px; min-width:180px; }
.permission-search-wrap label{ color:var(--text-2); font-size:11.5px; font-weight:700; text-transform:uppercase; letter-spacing:.4px; }
.permission-search-wrap .form-control{ min-height:34px; padding:7px 10px; font-size:13px; }
.permission-filter-actions{ display:flex; align-items:center; flex-wrap:wrap; gap:6px; padding:3px; border:1px solid var(--border); border-radius:10px; background:var(--bg-3); }
.permission-filter-chip{
  min-height:30px; border:0; border-radius:8px; padding:6px 10px;
  background:transparent; color:var(--text-2); font:inherit; font-size:12.5px; cursor:pointer;
}
.permission-filter-chip:hover,
.permission-filter-chip.is-active{ background:rgba(124,77,255,.16); color:var(--text); }
.permission-module-list{ display:flex; flex-direction:column; gap:14px; }
.permission-module-group{ display:flex; flex-direction:column; gap:8px; }
.permission-module-head{ display:flex; align-items:center; justify-content:space-between; gap:12px; }
.permission-module-head div{ display:flex; flex-direction:column; gap:2px; min-width:0; }
.permission-module-head strong{ font-size:13px; overflow-wrap:anywhere; }
.permission-module-head span{ color:var(--text-2); font-size:12px; }
.permission-module-table{ border-radius:10px; }
.permission-diff{ color:var(--text); font-size:12.5px; line-height:1.35; overflow-wrap:anywhere; }
.permission-filter-empty[hidden],
.permission-module-group[hidden],
.permission-table tr[hidden],
.audit-row[hidden]{ display:none !important; }
.permission-override-form{
  display:grid; grid-template-columns:minmax(116px,.8fr) minmax(140px,1fr) auto;
  gap:8px; align-items:center; max-width:430px; margin-left:auto;
}
.permission-override-form .form-control{ min-height:32px; padding:6px 8px; font-size:12.5px; }
.permission-reason{ min-width:0; }
.identity-member-actions{ display:flex; align-items:center; gap:8px; flex-wrap:wrap; margin-top:8px; }
.identity-member-actions form{ margin:0; }
.capability-cloud{ display:flex; flex-wrap:wrap; gap:8px; }
.capability-cloud.compact{ max-height:132px; overflow:hidden; }
.cap-chip{ display:inline-flex; align-items:center; min-height:26px; border-radius:999px; padding:4px 9px; font-size:11.5px; color:var(--purple-3); background:rgba(124,77,255,.12); border:1px solid rgba(124,77,255,.22); }
.cap-chip.muted{ color:var(--text-2); background:var(--bg-3); border-color:var(--border); }
.mono-id{ font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace; font-size:12px; color:var(--text-2); overflow-wrap:anywhere; }
.identity-table{ background:var(--panel-bg); }
.audit-panel .panel-body{ display:flex; flex-direction:column; gap:12px; }
.audit-alert{ margin-bottom:0; }
.audit-timeline{ display:flex; flex-direction:column; gap:10px; }
.audit-row{
  display:flex; align-items:flex-start; justify-content:space-between; gap:12px;
  padding:11px 12px; border:1px solid rgba(124,77,255,.2); border-radius:10px;
  background:linear-gradient(135deg,rgba(124,77,255,.08),rgba(255,255,255,.018)),var(--bg-3);
}
html[data-theme="light"] .audit-row{ background:linear-gradient(135deg,rgba(124,77,255,.055),rgba(255,255,255,.72)),var(--bg-3); }
.audit-row-main{ min-width:0; display:flex; flex-direction:column; gap:4px; }
.audit-row-title{ display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
.audit-row-title strong{ font-size:13px; }
.audit-row-meta,
.audit-row-detail,
.audit-row-diff{ color:var(--text-2); font-size:12px; line-height:1.35; overflow-wrap:anywhere; }
.audit-row-diff{ color:var(--text); }
.audit-row-time{ flex-shrink:0; color:var(--text-2); font-size:11.5px; white-space:nowrap; }
.identity-auth-page{
  min-height:100vh; display:grid; place-items:center; padding:24px;
  background:linear-gradient(135deg,var(--bg),var(--bg-2));
}
.identity-auth-card{
  width:min(560px,100%); border:1px solid rgba(124,77,255,.25); border-radius:18px;
  background:rgba(22,22,31,.82); backdrop-filter:blur(22px);
  box-shadow:0 24px 90px rgba(0,0,0,.32); padding:30px;
}
html[data-theme="light"] .identity-auth-card{ background:rgba(255,255,255,.88); box-shadow:0 24px 70px rgba(60,45,95,.14); }
.identity-auth-card h1{ font-size:26px; margin:0 0 8px; letter-spacing:0; }
.identity-auth-card p{ color:var(--text-2); margin:0 0 20px; line-height:1.5; }
.identity-choice-page{ align-items:center; }
.identity-choice-shell{ width:min(760px,100%); }
.identity-choice-hero{
  display:grid; grid-template-columns:minmax(0,1fr) auto; gap:20px;
  align-items:end; margin:18px 0 20px;
}
.identity-choice-hero h1{ font-size:clamp(25px,3.5vw,36px); line-height:1.04; margin:0 0 10px; }
.identity-choice-hero p{ max-width:620px; margin:0; }
.identity-choice-metrics{
  display:grid; grid-template-columns:repeat(3,minmax(72px,1fr)); gap:8px;
  min-width:min(290px,100%);
}
.identity-choice-metrics div{
  display:flex; flex-direction:column; gap:3px; align-items:center; justify-content:center;
  min-height:66px; padding:10px 8px; border:1px solid var(--border-soft);
  border-radius:12px; background:color-mix(in srgb, var(--bg-2) 72%, transparent);
}
.identity-choice-metrics strong{ color:var(--text); font-size:22px; line-height:1; font-variant-numeric:tabular-nums; }
.identity-choice-metrics span{ color:var(--text-2); font-size:10.5px; font-weight:800; text-transform:uppercase; letter-spacing:.05em; white-space:nowrap; }
.identity-choice-list{ display:flex; flex-direction:column; gap:10px; }
.identity-choice-card button{
  width:100%; display:flex; align-items:center; justify-content:space-between; gap:16px;
  padding:14px; border:1px solid var(--border); border-radius:12px;
  background:var(--bg-2); color:var(--text); font:inherit; cursor:pointer;
}
.identity-choice-card button:hover{ border-color:rgba(124,77,255,.45); background:rgba(124,77,255,.1); }
.identity-choice-card.is-current button{ border-color:rgba(124,77,255,.5); }
.identity-choice-card button span:first-child{ display:flex; flex-direction:column; min-width:0; text-align:left; }
.choice-title-row{ display:flex; align-items:center; gap:8px; min-width:0; }
.identity-choice-card strong{ font-size:14px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.identity-choice-card small{ color:var(--text-2); font-size:12px; margin-top:2px; }
.choice-title-row em{
  flex-shrink:0; font-style:normal; color:var(--purple-3); font-size:10px; font-weight:800;
  text-transform:uppercase; letter-spacing:.05em; border:1px solid rgba(124,77,255,.28);
  border-radius:999px; padding:2px 6px; background:rgba(124,77,255,.1);
}
.choice-arrow{ color:var(--purple-3); font-size:12px; font-weight:700; flex-shrink:0; }
.identity-choice-guardrail{
  display:flex; align-items:flex-start; gap:10px; margin-top:14px; padding:12px 13px;
  border:1px solid rgba(124,77,255,.22); border-radius:12px;
  background:color-mix(in srgb, var(--bg-2) 72%, transparent);
  color:var(--text-2); font-size:12.5px; line-height:1.4;
}
.empty-v2.tight{ padding:20px 12px; }

@media (max-width:900px){
  .identity-grid{ grid-template-columns:1fr; }
  .permission-summary-grid{ grid-template-columns:repeat(2,minmax(0,1fr)); }
  .identity-invite-form{ grid-template-columns:1fr 1fr; }
  .identity-invite-actions{ justify-content:flex-start; }
  .identity-role-form{ max-width:100%; }
  .permission-override-form{ max-width:100%; }
  .org-switcher summary{ max-width:42vw; }
}
@media (max-width:640px){
  .identity-fields{ grid-template-columns:1fr; }
  .permission-summary-grid{ grid-template-columns:1fr; }
  .permission-search-wrap,
  .permission-search-wrap .table-search,
  .permission-search-wrap .form-control,
  .permission-filter-actions{ width:100%; }
  .permission-filter-chip{ flex:1 1 auto; }
  .identity-invite-form{ grid-template-columns:1fr; }
  .identity-invite-actions .btn{ width:100%; justify-content:center; }
  .identity-form{ grid-template-columns:1fr; }
  .identity-form-actions .btn{ width:100%; justify-content:center; }
  .workspace-command-actions .btn{ flex:1 1 120px; justify-content:center; }
  .identity-role-form{ grid-template-columns:1fr; }
  .identity-role-form .btn{ justify-content:center; }
  .permission-override-form{ grid-template-columns:1fr; margin-left:0; }
  .permission-override-form .btn{ justify-content:center; }
  .identity-member-actions .btn{ min-width:96px; justify-content:center; }
  .audit-row{ flex-direction:column; }
  .audit-row-time{ white-space:normal; }
  .identity-hero h1{ font-size:22px; }
  .identity-auth-card{ padding:22px; }
  .identity-choice-hero{ grid-template-columns:1fr; gap:16px; }
  .identity-choice-metrics{ min-width:0; width:100%; }
  .identity-choice-card button{ align-items:flex-start; }
  .choice-arrow{ padding-top:2px; }
  .org-switcher{ display:block; }
  .org-switcher summary{ max-width:120px; padding:6px 8px; }
  .org-switcher-text strong{ max-width:10ch; }
  .org-switcher-text small{ display:none; }
}

@media (max-width:480px){
  .topbar-title{ display:none; }
}

/* ===================================================================
   LIST PAGE (lp-) — pattern condiviso delle liste operative (Pratiche,
   Soggetti, Sedi, Operatori, ...). Sostituisce le view V0 inline-style.
   Solo token del tema: dark/light gratis. Mobile-first.
   =================================================================== */
.lp-wrap{ max-width:1060px; margin:0 auto; }
.lp-head{ display:flex; align-items:flex-end; justify-content:space-between; gap:14px; flex-wrap:wrap; margin-bottom:18px; }
.lp-head-main{ min-width:0; }
.lp-head-actions{ display:flex; gap:10px; flex-wrap:wrap; }

/* KPI chips: numeri cliccabili che FILTRANO (non solo decorazione). */
.lp-kpis{ display:flex; gap:10px; flex-wrap:wrap; margin-bottom:16px; }
.lp-kpi{ display:flex; align-items:baseline; gap:8px; padding:9px 14px; border-radius:10px; text-decoration:none;
         background:var(--surface-glass); border:1px solid var(--border); border-left:3px solid var(--kpi-accent, var(--purple-1));
         transition:border-color .15s ease, transform .12s ease; }
.lp-kpi:hover{ transform:translateY(-1px); border-color:color-mix(in srgb, var(--kpi-accent, var(--purple-1)) 45%, var(--border)); }
.lp-kpi:focus-visible{ outline:2px solid var(--purple-1); outline-offset:2px; }
.lp-kpi.is-active{ border-color:var(--kpi-accent, var(--purple-1)); background:color-mix(in srgb, var(--kpi-accent, var(--purple-1)) 10%, transparent); }
.lp-kpi-n{ font-size:20px; font-weight:700; line-height:1; color:var(--text); font-variant-numeric:tabular-nums; }
.lp-kpi.is-active .lp-kpi-n{ color:var(--kpi-accent, var(--purple-2)); }
.lp-kpi-l{ font-size:11.5px; font-weight:600; color:var(--text-2); }

/* Toolbar: ricerca che cresce + filtri + azioni, una riga sola. */
.lp-toolbar{ display:flex; gap:10px; align-items:center; flex-wrap:wrap; margin-bottom:14px; }
.lp-search{ position:relative; flex:1; min-width:220px; }
.lp-search svg{ position:absolute; left:11px; top:50%; transform:translateY(-50%); width:15px; height:15px; color:var(--text-3); pointer-events:none; }
.lp-search input{ width:100%; padding:9px 12px 9px 34px; background:var(--bg-3); border:1px solid var(--border); border-radius:9px;
                  color:var(--text); font-size:13px; font-family:inherit; outline:none; transition:border-color .15s; }
.lp-search input:focus{ border-color:var(--purple-1); box-shadow:0 0 0 3px color-mix(in srgb, var(--purple-1) 15%, transparent); }
.lp-select{ padding:9px 12px; background:var(--bg-3); border:1px solid var(--border); border-radius:9px; color:var(--text);
            font-size:13px; font-family:inherit; outline:none; max-width:220px; }
.lp-select:focus{ border-color:var(--purple-1); }

/* Righe-link: hover/focus in CSS (via gli onmouseover V0), meta a destra. */
.lp-list{ display:flex; flex-direction:column; gap:8px; }
.lp-row{ display:flex; align-items:center; justify-content:space-between; gap:14px; padding:13px 16px; border-radius:11px;
         text-decoration:none; background:var(--surface-glass); border:1px solid var(--border);
         transition:border-color .15s ease, background .15s ease; }
.lp-row:hover{ border-color:var(--purple-1); background:var(--surface-glass-strong); }
.lp-row:focus-visible{ outline:2px solid var(--purple-1); outline-offset:2px; }
.lp-row-main{ flex:1; min-width:0; }
.lp-row-top{ display:flex; align-items:center; gap:9px; flex-wrap:wrap; margin-bottom:3px; }
.lp-row-id{ font-family:ui-monospace, SFMono-Regular, Menlo, monospace; font-size:13px; font-weight:600; color:var(--text); }
.lp-row-title{ font-size:14px; font-weight:600; color:var(--text); }
.lp-row-sub{ font-size:12.5px; color:var(--text-2); }
.lp-row-sub .dim{ color:var(--text-3); }
.lp-row-meta{ text-align:right; flex:0 0 auto; }
.lp-row-meta-1{ font-size:12.5px; color:var(--text-2); }
.lp-row-meta-2{ font-size:11.5px; color:var(--text-3); margin-top:2px; }
.lp-row-chev{ flex:0 0 auto; color:var(--text-3); width:16px; height:16px; }
.lp-row:hover .lp-row-chev{ color:var(--purple-2); }

/* Badge di stato data-driven: colori dal route (STATI_COLORS) via CSS var. */
.status-pill{ display:inline-block; padding:3px 9px; border-radius:999px; font-size:11px; font-weight:600; white-space:nowrap;
              background:var(--pill-bg, var(--bg-3)); color:var(--pill-fg, var(--text-2));
              border:1px solid color-mix(in srgb, var(--pill-fg, var(--text-2)) 25%, transparent); }

/* Empty-state di lista: onesto + CTA. */
.lp-empty{ padding:44px 20px; text-align:center; background:var(--surface-glass); border:1px dashed var(--border); border-radius:12px; }
.lp-empty svg{ width:42px; height:42px; opacity:.4; margin-bottom:10px; color:var(--purple-2); }
.lp-empty-t{ font-size:15px; font-weight:600; color:var(--text); margin-bottom:4px; }
.lp-empty-s{ font-size:13px; color:var(--text-2); margin-bottom:14px; }

/* Contatore risultati / footer lista */
.lp-count{ font-size:12px; color:var(--text-3); margin:10px 2px 0; }

@media (max-width:640px){
  .lp-kpis{ overflow-x:auto; flex-wrap:nowrap; padding-bottom:4px; scrollbar-width:thin; }
  .lp-kpi{ flex:0 0 auto; }
  .lp-row{ flex-wrap:wrap; }
  .lp-row-meta{ text-align:left; width:100%; display:flex; gap:10px; align-items:baseline; }
  .lp-row-meta-2{ margin-top:0; }
  .lp-row-chev{ display:none; }
}
@media (prefers-reduced-motion: reduce){
  .lp-kpi, .lp-row{ transition:none; }
  .lp-kpi:hover{ transform:none; }
}

/* lp- extra: breadcrumb, avatar, righe statiche con form inline (Operatori). */
.lp-crumbs{ display:flex; align-items:center; gap:6px; font-size:13px; color:var(--text-2); margin-bottom:14px; }
.lp-crumbs a{ color:var(--purple-2); text-decoration:none; }
.lp-crumbs a:hover{ text-decoration:underline; }
.lp-crumbs .sep{ color:var(--text-3); }
.lp-crumbs .here{ color:var(--text); font-weight:500; }
.lp-avatar{ width:36px; height:36px; border-radius:50%; flex:0 0 auto; display:flex; align-items:center; justify-content:center;
            font-weight:600; font-size:14px; color:#fff; background:linear-gradient(135deg, var(--purple-1), var(--purple-dark)); }
.lp-row.is-static{ cursor:default; }
.lp-row.is-static:hover{ border-color:var(--border); background:var(--surface-glass); }
.lp-row-form{ display:flex; align-items:center; gap:8px; flex-wrap:wrap; margin:0; }
.lp-select-sm{ padding:5px 9px; background:var(--bg-3); border:1px solid var(--border); border-radius:7px;
               color:var(--text); font-size:12px; font-family:inherit; outline:none; }
.lp-select-sm:focus{ border-color:var(--purple-1); }
.lp-row-person{ display:flex; align-items:center; gap:10px; min-width:0; }
@media (max-width:640px){
  .lp-row-form{ width:100%; }
  .lp-row-form select{ flex:1; }
}

/* Inbox: coda operativa compatta, senza dashboard o verticali annidati. */
.sr-only{ position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.inbox-page-header{ margin-bottom:16px; }
.inbox-notice{ margin-bottom:14px; padding:11px 14px; border:1px solid var(--border); border-radius:8px; background:var(--surface-glass); color:var(--text); font-size:13px; }
.inbox-notice.is-warning{ border-color:color-mix(in srgb, var(--warning) 45%, var(--border)); }
.inbox-workspace-picker{ display:grid; grid-template-columns:auto minmax(220px,360px) auto; align-items:end; gap:8px; margin-bottom:14px; }
.inbox-workspace-picker label{ align-self:center; color:var(--text-2); font-size:12.5px; font-weight:600; }
.inbox-channel-strip{ display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:8px; margin-bottom:14px; }
.inbox-channel{ min-height:64px; display:flex; align-items:center; gap:10px; padding:11px 12px; border:1px solid var(--border); border-radius:8px; background:var(--surface); }
.inbox-channel-dot{ width:8px; height:8px; flex:0 0 8px; border-radius:50%; background:var(--warning); }
.inbox-channel.is-connected .inbox-channel-dot{ background:var(--success); }
.inbox-channel strong,.inbox-channel small{ display:block; }
.inbox-channel strong{ font-size:13px; }
.inbox-channel small{ margin-top:3px; color:var(--text-2); font-size:11px; }
.inbox-filters{ display:flex; align-items:center; gap:6px; flex-wrap:wrap; margin-bottom:14px; }
.inbox-filter{ display:inline-flex; align-items:center; gap:8px; min-height:34px; padding:7px 10px; border:1px solid var(--border); border-radius:8px; color:var(--text-2); text-decoration:none; background:var(--surface-glass); font-size:12.5px; }
.inbox-filter strong{ min-width:20px; text-align:center; color:var(--text); font-variant-numeric:tabular-nums; }
.inbox-filter:hover, .inbox-filter:focus-visible{ border-color:var(--purple-2); color:var(--text); }
.inbox-filter.is-active{ color:var(--text); border-color:color-mix(in srgb, var(--purple-2) 62%, var(--border)); background:color-mix(in srgb, var(--purple-2) 11%, var(--surface-glass)); }
.inbox-new-request{ margin-bottom:16px; border-radius:8px; }
.inbox-new-request[hidden]{ display:none !important; }
.inbox-request-form{ display:grid; grid-template-columns:minmax(0,1fr); gap:12px; }
.inbox-request-form .form-group{ margin-bottom:0; }
.inbox-field-wide{ min-width:0; }
.inbox-request-footer{ display:flex; align-items:flex-end; justify-content:space-between; gap:12px; flex-wrap:wrap; }
.inbox-request-footer .form-group{ width:min(220px,100%); }
.inbox-queue{ overflow:hidden; border-radius:8px; }
.inbox-queue-head{ display:flex; align-items:center; justify-content:space-between; gap:12px; }
.inbox-search{ display:block; }
.inbox-search .table-search{ width:min(260px,40vw); }
.inbox-search-wrap{ display:flex; align-items:center; justify-content:flex-end; gap:9px; }
.inbox-search-wrap > span{ color:var(--text-3); font-size:11.5px; white-space:nowrap; }
.inbox-table-wrap{ border:0; border-radius:0; }
.inbox-conversation-title{ color:var(--text); font-weight:650; text-decoration:none; }
.inbox-conversation-title:hover{ color:var(--purple-2); }
.inbox-mobile-item{ display:block; color:inherit; text-decoration:none; }
@media (max-width:768px){
  .inbox-workspace-picker{ grid-template-columns:1fr; align-items:stretch; }
  .inbox-channel-strip{ grid-template-columns:repeat(2,minmax(0,1fr)); }
  .inbox-queue-head{ align-items:flex-start; flex-direction:column; }
  .inbox-search-wrap, .inbox-search, .inbox-search .table-search{ width:100%; max-width:none; }
  .inbox-search-wrap{ align-items:flex-start; flex-direction:column-reverse; }
  .inbox-mobile-list{ padding:12px; }
}

/* Prenotazioni: richieste, confermate e servizi senza control-room annidate. */
.booking-summary{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; margin-bottom:18px; }
.booking-summary a{ display:flex; align-items:flex-end; justify-content:space-between; gap:10px; min-width:0; padding:14px 16px;
                    color:var(--text); text-decoration:none; background:var(--bg-2); border:1px solid var(--border); border-radius:8px; }
.booking-summary a:hover{ border-color:var(--border-strong); }
.booking-summary a.is-attention{ border-left:3px solid var(--warning); }
.booking-summary a.is-critical{ border-left:3px solid var(--danger); }
.booking-summary span{ color:var(--text-2); font-size:12px; font-weight:600; }
.booking-summary strong{ font-size:26px; line-height:1; font-variant-numeric:tabular-nums; }
.booking-empty-state{ border:1px solid var(--border); border-radius:8px; background:var(--bg-2); }
.booking-action-notice{ margin-bottom:14px; padding:11px 14px; color:var(--danger); background:color-mix(in srgb,var(--danger) 8%,var(--bg-2));
                        border:1px solid color-mix(in srgb,var(--danger) 40%,var(--border)); border-radius:8px; font-size:13px; }
.booking-action-notice[hidden]{ display:none !important; }
.booking-section{ margin-bottom:18px; overflow:visible; border-radius:8px; }
.booking-section:last-of-type{ margin-bottom:0; }
.booking-section-head > div{ display:flex; align-items:baseline; gap:8px; flex-wrap:wrap; }
.booking-section-head span{ color:var(--text-3); font-size:11.5px; }
.booking-section td{ vertical-align:top; }
.booking-date, .booking-customer{ color:var(--text); font-weight:650; }
.booking-break{ overflow-wrap:anywhere; word-break:break-word; }
.booking-overdue{ box-shadow:inset 3px 0 0 var(--danger); }
.booking-overdue-label{ margin-top:5px; color:var(--danger); font-size:11px; font-weight:650; }
.booking-action-cell{ min-width:152px; text-align:right; }
.booking-row-actions{ display:flex; align-items:center; justify-content:flex-end; gap:6px; }
.booking-more{ position:relative; }
.booking-more summary{ list-style:none; user-select:none; }
.booking-more summary::-webkit-details-marker{ display:none; }
.booking-more-menu{ position:absolute; z-index:20; top:calc(100% + 5px); right:0; min-width:164px; padding:5px;
                    background:var(--bg-2); border:1px solid var(--border-strong); border-radius:8px; box-shadow:0 12px 30px rgba(0,0,0,.18); }
.booking-menu-action{ width:100%; padding:8px 10px; color:var(--text); background:transparent; border:0; border-radius:6px;
                      font:inherit; font-size:12px; text-align:left; cursor:pointer; }
.booking-menu-action:hover{ background:var(--bg-3); }
.booking-danger{ color:var(--danger); }
.booking-mobile-list{ padding:12px; }
.booking-mobile-date{ margin-top:9px; color:var(--text); font-size:12px; font-weight:650; }
.booking-mobile-customer{ margin-top:8px; color:var(--text); font-weight:650; }
.booking-mobile-service-facts{ display:flex; flex-wrap:wrap; gap:6px 14px; margin-top:9px; color:var(--text-2); font-size:12px; }
.booking-service-state{ display:inline-flex; align-items:center; padding:3px 8px; border:1px solid var(--border); border-radius:999px;
                        color:var(--text-2); font-size:11.5px; font-weight:650; white-space:nowrap; }
.booking-service-state.is-active{ color:var(--success); border-color:color-mix(in srgb,var(--success) 38%,var(--border)); }
.booking-service-state.is-paused{ color:var(--text-3); }
.booking-service-create{ margin-bottom:18px; overflow:hidden; border-radius:8px; }
.booking-service-create > summary{ padding:14px 16px; color:var(--text); font-size:13px; font-weight:700; cursor:pointer; }
.booking-service-create[open] > summary{ border-bottom:1px solid var(--border); }
.booking-service-form{ display:grid; gap:14px; padding:16px; }
.booking-service-form label, .booking-availability-card label{ display:grid; gap:6px; color:var(--text-2); font-size:11.5px; font-weight:650; }
.booking-service-form [hidden]{ display:none !important; }
.booking-service-form .booking-checkbox{ display:flex; align-items:center; align-self:end; grid-auto-flow:column; justify-content:start; }
.booking-form-note{ margin:0; color:var(--text-3); font-size:11.5px; line-height:1.5; }
.booking-form-note a{ color:var(--primary); }
.booking-form-feedback{ padding:9px 11px; color:var(--success); background:color-mix(in srgb,var(--success) 7%,var(--bg-2));
                        border:1px solid color-mix(in srgb,var(--success) 35%,var(--border)); border-radius:7px; font-size:12px; }
.booking-form-feedback.is-error{ color:var(--danger); background:color-mix(in srgb,var(--danger) 7%,var(--bg-2));
                                 border-color:color-mix(in srgb,var(--danger) 35%,var(--border)); }
.booking-form-feedback[hidden]{ display:none !important; }
.booking-availability-list{ display:grid; gap:10px; padding:12px; }
.booking-availability-card{ overflow:hidden; border:1px solid var(--border); border-radius:8px; background:var(--bg-2); }
.booking-availability-card > summary{ display:flex; align-items:center; justify-content:space-between; gap:14px; padding:13px 14px; cursor:pointer; }
.booking-availability-card > summary span:first-child{ display:grid; gap:3px; }
.booking-availability-card > summary small, .booking-availability-card > summary span:last-child{ color:var(--text-3); font-size:11px; }
.booking-availability-card > form{ display:grid; gap:14px; padding:14px; border-top:1px solid var(--border); }
.booking-week-grid{ display:grid; gap:7px; }
.booking-week-row{ display:grid; grid-template-columns:minmax(120px,.8fr) minmax(240px,2fr) minmax(120px,.8fr); gap:8px; align-items:end; }
.booking-week-row .booking-day-check{ display:flex; align-items:center; align-self:center; gap:7px; color:var(--text); }
.booking-generation-range{ display:grid; grid-template-columns:repeat(2,minmax(150px,240px)); gap:10px; }
.booking-slot-manager{ padding:14px; border-top:1px solid var(--border); }
.booking-slot-date-filter{ display:flex; align-items:end; gap:7px; }
.booking-slot-date-filter label{ display:grid; gap:4px; color:var(--text-3); font-size:11px; }
.booking-slot-date-filter .form-input{ min-width:150px; }
.booking-slot-manager-head{ display:flex; align-items:flex-start; justify-content:space-between; gap:14px; margin-bottom:10px; }
.booking-slot-manager-head > div{ display:grid; gap:3px; }
.booking-slot-manager-head strong{ color:var(--text); font-size:13px; }
.booking-slot-manager-head span, .booking-slot-empty{ color:var(--text-3); font-size:11.5px; }
.booking-slot-empty{ margin:0; }
.booking-slot-list{ display:grid; gap:7px; }
.booking-slot-form{ display:grid; grid-template-columns:minmax(210px,1.6fr) minmax(90px,.5fr) minmax(130px,.7fr) auto; gap:8px; align-items:end;
                    padding:9px 10px; border:1px solid var(--border); border-radius:7px; background:var(--bg-1); }
.booking-slot-when{ display:grid; align-self:center; gap:3px; }
.booking-slot-when strong{ color:var(--text); font-size:12.5px; }
.booking-slot-when span{ color:var(--text-3); font-size:11px; }
.booking-slot-form .booking-form-feedback{ grid-column:1 / -1; }

@media (max-width:768px){
  .booking-section{ overflow:hidden; }
  .booking-row-actions{ justify-content:flex-start; }
  .booking-more-menu{ right:auto; left:0; }
  .booking-week-row{ grid-template-columns:1fr 1fr; padding:10px; border:1px solid var(--border); border-radius:7px; }
  .booking-week-row .booking-day-check{ grid-column:1 / -1; }
  .booking-slot-form{ grid-template-columns:1fr 1fr; }
  .booking-slot-when{ grid-column:1 / -1; }
  .booking-slot-date-filter{ width:100%; flex-wrap:wrap; }
}
@media (max-width:560px){
  .booking-summary a{ flex-direction:column; align-items:flex-start; padding:12px; }
  .booking-summary strong{ font-size:22px; }
  .booking-summary span{ font-size:10.5px; }
  .booking-generation-range{ grid-template-columns:1fr; }
  .booking-slot-manager-head{ display:grid; }
  .booking-slot-form{ grid-template-columns:1fr; }
  .booking-slot-when, .booking-slot-form .booking-form-feedback{ grid-column:auto; }
}

/* Clienti: portfolio ricercabile e dettaglio operativo, senza control room. */
.client-page-header, .client-detail-header, .client-form-header{ margin-bottom:16px; }
.client-notice{ margin-bottom:14px; padding:11px 14px; border:1px solid var(--border); border-radius:8px; background:var(--bg-2); font-size:13px; }
.client-notice.is-error{ color:var(--danger); border-color:color-mix(in srgb,var(--danger) 40%,var(--border)); background:color-mix(in srgb,var(--danger) 8%,var(--bg-2)); }
.client-summary{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; margin-bottom:18px; }
.client-summary a{ display:flex; align-items:flex-end; justify-content:space-between; gap:10px; min-width:0; padding:14px 16px; color:var(--text); text-decoration:none;
                   border:1px solid var(--border); border-radius:8px; background:var(--bg-2); }
.client-summary a:hover, .client-summary a:focus-visible{ border-color:var(--border-strong); }
.client-summary a.is-active{ border-color:color-mix(in srgb,var(--purple-2) 60%,var(--border)); background:color-mix(in srgb,var(--purple-2) 9%,var(--bg-2)); }
.client-summary a.is-attention{ border-left:3px solid var(--warning); }
.client-summary span{ color:var(--text-2); font-size:12px; font-weight:600; }
.client-summary strong{ font-size:26px; line-height:1; font-variant-numeric:tabular-nums; }
.client-portfolio{ overflow:hidden; border-radius:8px; }
.client-portfolio-head{ display:flex; align-items:center; justify-content:space-between; gap:12px; }
.client-portfolio-head > div{ display:flex; align-items:baseline; gap:8px; flex-wrap:wrap; }
.client-portfolio-head > div span{ color:var(--text-3); font-size:11.5px; }
.client-search-form{ display:flex; align-items:center; justify-content:flex-end; gap:7px; min-width:min(480px,55%); }
.client-search-form .table-search{ width:min(300px,100%); }
.client-table td{ vertical-align:top; }
.client-name{ color:var(--text); font-weight:650; text-decoration:none; }
.client-name:hover, .client-contact-link:hover{ color:var(--purple-2); }
.client-open-cell{ width:72px; text-align:right; }
.client-break{ overflow-wrap:anywhere; word-break:break-word; }
.client-empty-state{ border-radius:0; }
.client-mobile-list{ padding:12px; }
.client-mobile-list .client-card{ border-radius:8px; }
.client-mobile-services{ display:flex; flex-wrap:wrap; gap:5px; margin-bottom:11px; }
.client-pagination{ display:flex; align-items:center; justify-content:space-between; gap:12px; padding:12px 16px; border-top:1px solid var(--border); }
.client-pagination > span{ color:var(--text-3); font-size:12px; }
.client-pagination > div{ display:flex; gap:7px; }
.client-header-actions{ display:flex; gap:8px; flex-wrap:wrap; }
.client-detail-sub{ display:flex; align-items:center; gap:8px; flex-wrap:wrap; margin-top:4px; }
.client-next-action{ display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:14px; padding:12px 14px; border:1px solid var(--border); border-left:3px solid var(--purple-2); border-radius:8px; background:var(--bg-2); }
.client-next-action.is-attention{ border-left-color:var(--warning); }
.client-next-action span{ color:var(--text-2); font-size:12px; font-weight:600; }
.client-next-action strong{ color:var(--text); font-size:13px; text-align:right; }
.client-detail-summary{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; margin-bottom:18px; }
.client-detail-summary > div{ display:flex; flex-direction:column; gap:5px; min-width:0; padding:13px 14px; border:1px solid var(--border); border-radius:8px; background:var(--bg-2); }
.client-detail-summary span{ color:var(--text-2); font-size:11.5px; }
.client-detail-summary strong{ color:var(--text); font-size:14px; overflow-wrap:anywhere; }
.client-detail-section{ margin-bottom:0; padding:18px 2px; border:0; border-bottom:1px solid var(--border); border-radius:0; background:transparent; }
.client-contact-link{ color:var(--purple-2); overflow-wrap:anywhere; }
.client-service-list{ display:flex; flex-wrap:wrap; gap:7px; }
.client-empty-copy{ color:var(--text-2); font-size:13px; }
.client-field-wide{ grid-column:1/-1; }
.client-notes{ color:var(--text); line-height:1.6; white-space:pre-wrap; overflow-wrap:anywhere; }
.client-secondary-section, .client-danger-zone, .client-form-advanced{ margin-bottom:18px; border:1px solid var(--border); border-radius:8px; background:var(--bg-2); }
.client-secondary-section > summary, .client-danger-zone > summary, .client-form-advanced > summary{ padding:13px 15px; color:var(--text); font-size:13px; font-weight:650; cursor:pointer; }
.client-secondary-content, .client-form-advanced-content{ padding:4px 15px 16px; }
.client-danger-zone > div{ padding:0 15px 15px; }
.client-danger-zone p{ margin:0 0 11px; color:var(--text-2); font-size:12.5px; }
.client-form{ max-width:980px; }
.client-form-card{ border-radius:8px; }
.client-module-list{ display:flex; flex-wrap:wrap; gap:8px 14px; }
.client-form-actions{ width:max-content; max-width:100%; margin-top:18px; }

@media (max-width:768px){
  .client-portfolio-head{ align-items:flex-start; flex-direction:column; }
  .client-search-form{ width:100%; min-width:0; justify-content:flex-start; flex-wrap:wrap; }
  .client-search-form .table-search{ flex:1 1 220px; width:auto; }
  .client-header-actions{ width:100%; }
  .client-header-actions .btn{ flex:1 1 140px; justify-content:center; }
}
@media (max-width:560px){
  .client-summary a{ flex-direction:column; align-items:flex-start; padding:12px; }
  .client-summary strong{ font-size:22px; }
  .client-summary span{ font-size:10.5px; }
  .client-detail-summary{ grid-template-columns:1fr; }
  .client-next-action{ align-items:flex-start; flex-direction:column; }
  .client-next-action strong{ text-align:left; }
  .client-pagination{ align-items:flex-start; flex-direction:column; }
  .client-form-actions{ width:100%; }
  .client-form-actions .btn{ flex:1 1 120px; justify-content:center; }
}

/* Siti: portfolio operativo e modifiche separate dall'approvazione. */
.badge-neutral{ background:var(--bg-3); color:var(--text-2); border:1px solid var(--border); }
.badge-danger{ background:color-mix(in srgb,var(--danger) 10%,transparent); color:var(--danger); border:1px solid color-mix(in srgb,var(--danger) 30%,var(--border)); }
.sites-page-header, .site-editor-header{ margin-bottom:16px; }
.sites-notice{ margin-bottom:14px; padding:11px 14px; border:1px solid var(--border); border-radius:8px; background:var(--bg-2); color:var(--text-2); font-size:13px; }
.sites-notice.is-error, .sites-form-error{ color:var(--danger); border-color:color-mix(in srgb,var(--danger) 40%,var(--border)); background:color-mix(in srgb,var(--danger) 8%,var(--bg-2)); }
.sites-summary{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; margin-bottom:18px; }
.sites-summary > div{ display:flex; align-items:flex-end; justify-content:space-between; gap:10px; min-width:0; padding:14px 16px; color:var(--text); border:1px solid var(--border); border-radius:8px; background:var(--bg-2); }
.sites-summary > div.is-attention{ border-left:3px solid var(--warning); }
.sites-summary span{ color:var(--text-2); font-size:12px; font-weight:600; }
.sites-summary strong{ font-size:26px; line-height:1; font-variant-numeric:tabular-nums; }
.sites-portfolio{ border:1px solid var(--border); border-radius:8px; background:var(--bg-2); overflow:hidden; }
.sites-portfolio-head{ display:flex; align-items:center; justify-content:space-between; gap:12px; padding:14px 16px; border-bottom:1px solid var(--border); }
.sites-portfolio-head > div{ display:flex; align-items:baseline; gap:8px; flex-wrap:wrap; }
.sites-portfolio-head span{ color:var(--text-3); font-size:11.5px; }
.sites-table-wrap{ overflow-x:auto; }
.sites-table{ width:100%; border-collapse:collapse; }
.sites-table th, .sites-table td{ padding:13px 16px; border-bottom:1px solid var(--border); text-align:left; vertical-align:top; }
.sites-table tbody tr:last-child td{ border-bottom:0; }
.sites-table th{ color:var(--text-3); font-size:10.5px; font-weight:650; text-transform:uppercase; }
.sites-name{ color:var(--text); font-size:13.5px; font-weight:650; text-decoration:none; overflow-wrap:anywhere; }
a.sites-name:hover, .sites-domain:hover{ color:var(--purple-2); }
.sites-domain, .sites-mobile-domain a{ color:var(--purple-2); font-size:12.5px; text-decoration:none; overflow-wrap:anywhere; }
.sites-next{ color:var(--text-2); font-size:12.5px; }
.sites-open{ width:76px; text-align:right !important; }
.sites-mobile-list{ display:none; }
.sites-empty-state{ border-radius:0; }
.sites-create-overlay[hidden], .sites-form-error[hidden], .sites-form-success[hidden], .site-editor-panel[hidden], .site-proposal[hidden]{ display:none !important; }
.sites-create-dialog{ max-width:480px; border-radius:8px; }
.sites-dialog-head{ display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:18px; }
.sites-dialog-close{ width:34px; height:34px; border:0; border-radius:6px; background:transparent; color:var(--text-2); font-size:22px; cursor:pointer; }
.sites-dialog-close:hover, .sites-dialog-close:focus-visible{ background:var(--bg-3); color:var(--text); }
.sites-create-form{ display:grid; gap:14px; }
.sites-form-error, .sites-form-success{ padding:10px 12px; border:1px solid var(--border); border-radius:8px; font-size:12.5px; }
.sites-form-success{ color:var(--success); border-color:color-mix(in srgb,var(--success) 35%,var(--border)); background:color-mix(in srgb,var(--success) 8%,var(--bg-2)); }

.site-editor-back{ display:inline-block; margin-bottom:4px; color:var(--text-2); font-size:12.5px; text-decoration:none; }
.site-editor-back:hover{ color:var(--purple-2); }
.site-editor-title{ overflow-wrap:anywhere; }
.site-editor-meta{ display:flex; gap:8px; flex-wrap:wrap; }
.site-editor-meta a{ color:var(--purple-2); text-decoration:none; overflow-wrap:anywhere; }
.site-domain-settings{ display:flex; align-items:center; justify-content:space-between; gap:18px; margin-bottom:14px; padding:12px 0; border-top:1px solid var(--border); border-bottom:1px solid var(--border); }
.site-domain-settings h2{ margin:0 0 3px; color:var(--text); font-size:14px; }
.site-domain-settings span{ color:var(--text-2); font-size:12.5px; overflow-wrap:anywhere; }
.site-domain-form{ display:grid; grid-template-columns:minmax(180px,320px) auto; gap:8px; align-items:center; }
.site-domain-form .sites-form-error,.site-domain-form .sites-form-success{ grid-column:1 / -1; }
.site-editor-next{ display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:14px; padding:12px 14px; border:1px solid var(--border); border-left:3px solid var(--purple-2); border-radius:8px; background:var(--bg-2); }
.site-editor-next.is-attention{ border-left-color:var(--warning); }
.site-editor-next span{ color:var(--text-2); font-size:12px; font-weight:600; }
.site-editor-next strong{ color:var(--text); font-size:13px; text-align:right; }
.site-editor-summary{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; margin-bottom:18px; }
.site-editor-summary > div{ display:flex; flex-direction:column; gap:5px; min-width:0; padding:13px 14px; border:1px solid var(--border); border-radius:8px; background:var(--bg-2); }
.site-editor-summary span{ color:var(--text-2); font-size:11.5px; }
.site-editor-summary strong{ color:var(--text); font-size:18px; font-variant-numeric:tabular-nums; }
.site-editor-tabs{ display:flex; align-items:flex-end; gap:4px; margin-bottom:18px; border-bottom:1px solid var(--border); overflow-x:auto; }
.site-editor-tab{ min-height:42px; padding:9px 14px; border:0; border-bottom:2px solid transparent; background:transparent; color:var(--text-2); font:inherit; font-size:13px; font-weight:600; white-space:nowrap; cursor:pointer; }
.site-editor-tab:hover, .site-editor-tab:focus-visible{ color:var(--text); }
.site-editor-tab.is-active{ color:var(--text); border-bottom-color:var(--purple-2); }
.site-tab-count{ display:inline-flex; align-items:center; justify-content:center; min-width:20px; height:20px; margin-left:5px; padding:0 5px; border-radius:8px; background:var(--warning); color:#18130a; font-size:10.5px; }
.site-editor-panel{ min-width:0; }
.site-editor-panel-head{ display:flex; align-items:flex-start; justify-content:space-between; gap:12px; margin-bottom:12px; }
.site-editor-panel-head h2{ margin:0 0 3px; color:var(--text); font-size:16px; }
.site-editor-panel-head p{ margin:0; color:var(--text-2); font-size:12.5px; }
.site-assistant{ border:1px solid var(--border); border-radius:8px; background:var(--bg-2); overflow:hidden; }
.site-assistant-thread{ display:flex; flex-direction:column; gap:10px; min-height:180px; max-height:360px; padding:16px; overflow-y:auto; }
.site-assistant-message{ max-width:min(680px,88%); padding:10px 12px; border-radius:8px; color:var(--text); font-size:13px; line-height:1.55; white-space:pre-wrap; overflow-wrap:anywhere; }
.site-assistant-message.is-assistant{ align-self:flex-start; background:var(--bg-3); }
.site-assistant-message.is-user{ align-self:flex-end; background:color-mix(in srgb,var(--purple-2) 18%,var(--bg-2)); border:1px solid color-mix(in srgb,var(--purple-2) 35%,var(--border)); }
.site-assistant-compose{ display:flex; align-items:flex-end; gap:9px; padding:12px; border-top:1px solid var(--border); }
.site-assistant-compose .form-textarea{ min-height:44px; resize:vertical; }
.site-proposal{ padding:14px 16px; border-top:1px solid var(--border); background:color-mix(in srgb,var(--purple-2) 5%,var(--bg-2)); }
.site-proposal-title{ margin-bottom:9px; color:var(--text); font-size:13px; font-weight:650; }
.site-proposal-list{ display:grid; gap:8px; }
.site-proposal-row{ display:grid; grid-template-columns:minmax(120px,.7fr) minmax(0,1fr) minmax(0,1fr); gap:10px; align-items:start; padding:10px 12px; border:1px solid var(--border); border-radius:8px; background:var(--bg-2); font-size:12.5px; }
.site-proposal-row span{ color:var(--text-2); overflow-wrap:anywhere; }
.site-proposal-row del{ color:var(--danger); overflow-wrap:anywhere; }
.site-proposal-row strong{ color:var(--success); font-weight:600; overflow-wrap:anywhere; }
.site-proposal-actions{ display:flex; gap:8px; margin-top:12px; flex-wrap:wrap; }
.site-manual-form{ max-width:900px; padding:18px; border:1px solid var(--border); border-radius:8px; background:var(--bg-2); }
.site-change-list{ display:grid; gap:9px; }
.site-change-item{ display:flex; align-items:flex-start; justify-content:space-between; gap:16px; padding:14px 16px; border:1px solid var(--border); border-radius:8px; background:var(--bg-2); }
.site-change-main{ flex:1; min-width:0; }
.site-change-heading{ display:flex; align-items:center; gap:8px; flex-wrap:wrap; margin-bottom:8px; }
.site-change-heading strong{ color:var(--text); font-size:13.5px; }
.site-change-value{ color:var(--text); font-size:13px; line-height:1.5; white-space:pre-wrap; overflow-wrap:anywhere; }
.site-change-meta{ margin-top:7px; color:var(--text-3); font-size:11.5px; }
.site-change-actions{ display:flex; gap:7px; flex-shrink:0; }
.site-change-technical{ margin-top:8px; color:var(--text-3); font-size:11.5px; }
.site-change-technical summary{ width:max-content; max-width:100%; cursor:pointer; }
.site-change-technical code{ display:block; margin-top:6px; overflow-wrap:anywhere; white-space:normal; }
.site-changes-empty{ border-radius:8px; }

@media (max-width:768px){
  .sites-table-wrap{ display:none; }
  .sites-mobile-list{ display:grid; gap:10px; padding:12px; }
  .sites-mobile-item{ display:grid; gap:10px; padding:13px; border:1px solid var(--border); border-radius:8px; background:var(--bg-2); }
  .sites-mobile-top{ display:flex; align-items:flex-start; justify-content:space-between; gap:10px; }
  .sites-mobile-domain{ color:var(--text-3); font-size:12px; overflow-wrap:anywhere; }
  .sites-mobile-next{ display:flex; align-items:flex-start; justify-content:space-between; gap:10px; padding-top:9px; border-top:1px solid var(--border); }
  .sites-mobile-next span{ color:var(--text-3); font-size:11.5px; }
  .sites-mobile-next strong{ color:var(--text); font-size:12.5px; text-align:right; }
  .site-proposal-row{ grid-template-columns:1fr; gap:5px; }
}
@media (max-width:560px){
  .sites-summary > div{ flex-direction:column; align-items:flex-start; padding:12px; }
  .sites-summary strong{ font-size:22px; }
  .sites-portfolio-head{ align-items:flex-start; flex-direction:column; }
  .site-editor-summary{ grid-template-columns:1fr; }
  .site-domain-settings{ align-items:stretch; flex-direction:column; }
  .site-domain-form{ grid-template-columns:minmax(0,1fr) auto; }
  .site-editor-next{ align-items:flex-start; flex-direction:column; }
  .site-editor-next strong{ text-align:left; }
  .site-assistant-compose{ align-items:stretch; flex-direction:column; }
  .site-assistant-compose .btn{ justify-content:center; }
  .site-change-item{ flex-direction:column; }
  .site-change-actions{ width:100%; }
  .site-change-actions .btn{ flex:1; justify-content:center; }
}