/* =============================================================
   VETROOM 2 — Grafica originale Vetroom, ottimizzata per mobile
   Gestionale: verde petrolio, barra scura, voce attiva arancione
   Proprietario: blu notte, intestazione chiara, barra in basso
   ============================================================= */
:root {
  --teal: #0f766e;        /* colore principale del gestionale */
  --teal-dark: #115e59;
  --teal-soft: #f0fdfa;
  --teal-line: #99f6e4;
  --ink: #0f172a;         /* barra laterale e titoli */
  --ink-2: #111827;
  --orange: #f97316;      /* voce di menu attiva */
  --orange-soft: #ffedd5;
  --bg: #f3f4f6;
  --white: #ffffff;
  --text: #111827;
  --muted: #6b7280;
  --line: #e5e7eb;
  --danger: #dc2626;
  --amber: #f59e0b;
  --owner: #033860;       /* colore principale del portale proprietario */
  --owner-2: #075985;
  --radius-sm: 8px;
  --radius-md: 12px;
  --radius-lg: 14px;
  --shadow: 0 1px 3px rgba(15, 23, 42, .08);
  --font: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
  /* alias usati dalle pagine */
  --navy: var(--ink); --navy-2: var(--teal); --paper: var(--bg); --lav: var(--orange-soft); --coral: var(--danger);
}

*, *::before, *::after { box-sizing: border-box; }
html, body { margin: 0; }
body { font-family: var(--font); font-size: 15px; line-height: 1.5; color: var(--text); background: var(--bg); overflow-x: hidden; -webkit-font-smoothing: antialiased; -webkit-text-size-adjust: 100%; }
[hidden] { display: none !important; }
a { color: var(--teal); text-decoration: none; }
a:hover { text-decoration: underline; }
h1, h2, h3 { color: var(--ink); line-height: 1.2; margin: 0 0 .5em; }
h1 { font-size: 21px; font-weight: 700; }
h2 { font-size: 15px; font-weight: 700; }
h3 { font-size: 14px; font-weight: 700; }
p { margin: 0 0 .8em; }
.muted { color: var(--muted); }
:focus-visible { outline: 3px solid rgba(15,118,110,.45); outline-offset: 2px; }
img { max-width: 100%; }

/* ---------- Struttura del gestionale ---------- */
.vr-header {
  background: var(--teal); color: #ecfeff;
  display: flex; align-items: center; justify-content: space-between; gap: 10px;
  padding: 10px 18px; position: sticky; top: 0; z-index: 30;
}
.vr-header-left { display: flex; align-items: center; gap: 12px; min-width: 0; }
.vr-logo-img { height: 30px; width: auto; display: block; }
.vr-logo-text { min-width: 0; border-left: 1px solid rgba(236,254,255,.35); padding-left: 12px; }
.vr-logo-title { font-weight: 700; font-size: 15px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.vr-logo-sub { font-size: 12px; opacity: .9; }
.vr-header-right { display: flex; align-items: center; gap: 10px; font-size: 13px; min-width: 0; }
.vr-header-user { font-weight: 500; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 30vw; }
.vr-header-btn { font: inherit; font-weight: 700; font-size: 13px; color: var(--teal); background: #ecfeff; border: 0; border-radius: 12px; padding: 8px 14px; min-height: 36px; cursor: pointer; }
.vr-header-btn:hover { background: #fff; }

.vr-layout { display: flex; min-height: calc(100vh - 56px); }
.vr-sidebar { width: 210px; flex-shrink: 0; background: var(--ink); padding: 12px 10px; }
.vr-nav-group { margin-bottom: 10px; }
.vr-nav-group-title {
  width: 100%; display: flex; align-items: center; justify-content: space-between; gap: 8px;
  background: transparent; border: 0; color: #9ca3af; font: inherit; font-size: 11px; font-weight: 600;
  text-transform: uppercase; letter-spacing: .08em; padding: 8px 10px; cursor: pointer; border-radius: 6px;
}
.vr-nav-group-title:hover { background: var(--ink-2); color: #e5e7eb; }
.vr-nav-group-chevron { transition: transform .12s ease; }
.vr-nav-group.collapsed .vr-nav-group-chevron { transform: rotate(-90deg); }
.vr-nav-group.collapsed .vr-nav-group-items { display: none; }
.vr-nav-group-items { margin-top: 4px; }
.vr-nav-item { display: flex; align-items: center; gap: 10px; padding: 8px 10px; color: #e5e7eb; border-radius: 6px; font-size: 14px; margin-bottom: 4px; text-decoration: none; }
.vr-nav-item:hover { background: var(--ink-2); text-decoration: none; }
.vr-nav-item.active { background: var(--orange); color: var(--ink-2); font-weight: 600; }
.vr-nav-icon { display: none; }
.vr-main { flex: 1; min-width: 0; padding: 18px 22px 40px; }
.vr-main.wrap, .vr-main.wrap-wide { max-width: none; margin: 0; }
.vr-main > * { max-width: 1100px; }
.vr-main.wrap-wide > * { max-width: 1400px; }

/* Telefono e tablet: la barra laterale diventa una griglia di icone (come l'originale) */
@media (max-width: 1024px) {
  .vr-header { padding: 8px 12px; }
  .vr-logo-img { height: 26px; }
  .vr-layout { flex-direction: column; }
  .vr-sidebar {
    width: 100%; padding: 8px; display: grid; gap: 8px;
    grid-template-columns: repeat(5, minmax(0, 1fr)); grid-auto-rows: 60px;
  }
  .vr-nav-group, .vr-nav-group-items { display: contents; margin: 0; }
  .vr-nav-group.collapsed .vr-nav-group-items { display: contents; }
  .vr-nav-group-title { display: none; }
  .vr-nav-item {
    margin: 0; padding: 3px; height: 100%; display: grid; place-items: center;
    border-radius: 14px; background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.10);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.12), 0 2px 6px rgba(0,0,0,.25);
    transition: transform .12s ease;
  }
  .vr-nav-item:active { transform: scale(.97); }
  .vr-nav-item.active { background: var(--orange); border-color: rgba(0,0,0,.22); box-shadow: inset 0 1px 0 rgba(255,255,255,.22), 0 10px 24px rgba(249,115,22,.36); }
  .vr-nav-icon { display: block; width: 100%; height: 100%; border-radius: 12px; border: 1px solid rgba(0,0,0,.6); background: #fff; padding: 4px; object-fit: contain; }
  .vr-nav-item.active .vr-nav-icon { border-color: rgba(0,0,0,.35); }
  .vr-nav-label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
  .vr-main { padding: 14px 12px 40px; }
}
@media (max-width: 480px) {
  .vr-header-user { display: none; }
  .vr-logo-text { display: none; }
  .vr-sidebar { grid-auto-rows: 56px; gap: 6px; padding: 6px; }
}

/* ---------- Pulsanti (grandi e facili da toccare) ---------- */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  min-height: 44px; padding: 10px 16px; border-radius: 14px; border: 1px solid transparent;
  font: inherit; font-size: 14px; font-weight: 700; line-height: 1.1; cursor: pointer;
  text-decoration: none; user-select: none; -webkit-tap-highlight-color: transparent;
}
.btn:hover { text-decoration: none; }
.btn-primary { background: var(--teal); color: #ecfeff; }
.btn-primary:hover { background: var(--teal-dark); }
.btn-ghost { background: var(--white); color: var(--ink); border-color: var(--line); }
.btn-ghost:hover { background: #f8fafc; }
.btn-danger { background: var(--white); color: #b91c1c; border-color: #fecaca; }
.btn-danger:hover { background: #fef2f2; }
.btn-small { min-height: 38px; padding: 8px 12px; font-size: 13px; border-radius: 12px; }
.btn[disabled] { opacity: .55; cursor: not-allowed; }
.btn-google { background: var(--white); color: var(--text); border-color: #d1d5db; width: 100%; min-height: 50px; font-size: 15px; }
.btn-google:hover { background: #f9fafb; }
.vr-action-icon { width: 26px; height: 26px; object-fit: contain; margin: -4px 0; }
.btn .vr-action-icon { background: #fff; border-radius: 8px; padding: 2px; }

/* ---------- Campi ---------- */
label { display: block; font-size: 13px; font-weight: 600; margin-bottom: 4px; color: #374151; }
input[type="text"], input[type="password"], input[type="email"], input[type="tel"], input[type="date"], input[type="time"],
input[type="number"], input[type="search"], select, textarea {
  width: 100%; font: inherit; font-size: 16px; /* 16px: niente zoom automatico su iPhone */
  padding: 9px 11px; color: var(--text); background: var(--white);
  border: 1px solid #d1d5db; border-radius: 10px; min-height: 44px;
}
input:focus, select:focus, textarea:focus { outline: none; border-color: var(--teal); box-shadow: 0 0 0 3px rgba(15,118,110,.15); }
input.is-invalid, select.is-invalid, textarea.is-invalid { border-color: var(--danger); box-shadow: 0 0 0 3px rgba(220,38,38,.15); }
textarea { min-height: 90px; resize: vertical; }
input[disabled], select[disabled], textarea[disabled] { background: #f9fafb; color: #4b5563; }
@media (min-width: 1025px) { input, select, textarea { font-size: 14px !important; } }

/* ---------- Messaggi ---------- */
.notice { border-radius: 10px; padding: 10px 12px; font-size: 14px; margin: 10px 0; }
.notice-error { background: #fee2e2; color: #991b1b; }
.notice-ok { background: #dcfce7; color: #166534; }
.notice-info { background: #e0f2fe; color: #075985; }
.loader { color: var(--muted); padding: 2.5rem 1rem; text-align: center; }
.readonly-note { background: #fef3c7; color: #92400e; border-radius: 10px; padding: 10px 12px; font-size: 14px; }

/* ---------- Schede (card) e titoli di pagina ---------- */
.panel { background: var(--white); border-radius: var(--radius-lg); padding: 14px 16px; margin-bottom: 12px; box-shadow: var(--shadow); }
.panel h2 { margin-bottom: 10px; }
.page-head { display: flex; justify-content: space-between; align-items: flex-end; gap: 10px; flex-wrap: wrap; margin-bottom: 12px; }
.page-head h1 { margin: 0; }
.back { display: inline-flex; align-items: center; min-height: 36px; margin-bottom: 6px; color: var(--muted); font-weight: 600; font-size: 14px; }
.back:hover { color: var(--teal); text-decoration: none; }
.hint-small { color: var(--muted); font-size: 13px; margin-top: 4px; }
.count { color: var(--muted); font-size: 13px; margin: 8px 0 10px; }
.search { max-width: 520px; }

.grid { display: grid; grid-template-columns: repeat(12, 1fr); gap: 10px 12px; }
.grid > div { grid-column: span 6; }
.grid .s3 { grid-column: span 3; }
.grid .s4 { grid-column: span 4; }
.grid .s8 { grid-column: span 8; }
.grid .s12 { grid-column: span 12; }
@media (max-width: 720px) { .grid > div, .grid .s3, .grid .s4, .grid .s8 { grid-column: span 12; } }

.check { display: flex; align-items: center; gap: 10px; font-weight: 600; color: var(--ink); cursor: pointer; min-height: 40px; }
.check input { width: 22px; height: 22px; accent-color: var(--teal); flex-shrink: 0; }

.actions-bar { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }
.actions-bar .spacer { flex: 1; }
@media (max-width: 600px) {
  form > .actions-bar .btn-primary { flex: 1 1 100%; }
}

/* ---------- Elenchi ---------- */
.rows { list-style: none; margin: 0; padding: 0; background: var(--white); border-radius: var(--radius-lg); overflow: hidden; box-shadow: var(--shadow); }
.rows li + li { border-top: 1px solid var(--line); }
.rows a { display: flex; justify-content: space-between; align-items: center; gap: 10px; padding: 12px 14px; color: inherit; text-decoration: none; min-height: 58px; }
.rows a:hover { background: #f9fafb; }
.rows a:active { background: var(--teal-soft); }
.rows .main { min-width: 0; }
.rows .main strong { color: var(--ink); display: block; font-size: 15px; }
.rows .main span { color: var(--muted); font-size: 13px; }
.chips { display: flex; gap: 4px; flex-wrap: wrap; justify-content: flex-end; }
.chip { font-size: 12px; font-weight: 600; padding: 3px 9px; border-radius: 999px; background: var(--teal-soft); color: var(--teal-dark); border: 1px solid #ccfbf1; white-space: nowrap; }
@media (max-width: 520px) { .rows a { flex-wrap: wrap; } .chips { justify-content: flex-start; } }
.empty { text-align: center; padding: 2rem 1rem; background: var(--white); border: 2px dashed #d1d5db; border-radius: var(--radius-lg); }
.empty p { margin: 0 auto .8rem; }
.tag, .pill { font-size: 12px; font-weight: 700; padding: 3px 9px; border-radius: 999px; background: #f3f4f6; color: #374151; white-space: nowrap; }
.tag { background: var(--orange-soft); color: #9a3412; }
.badge-owner { display: inline-block; font-size: 12px; font-weight: 700; padding: 3px 10px; border-radius: 999px; background: #e0f2fe; color: #075985; margin-top: 4px; }
.btn-small.btn-danger, .btn-small.btn-ghost { white-space: nowrap; }

/* ---------- KPI della dashboard ---------- */
.kpi-row { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; margin-bottom: 12px; }
.kpi { background: var(--white); border-radius: var(--radius-lg); padding: 12px 14px; box-shadow: var(--shadow); display: flex; align-items: center; gap: 12px; text-decoration: none; color: inherit; }
.kpi:hover { text-decoration: none; background: #f9fafb; }
.kpi img { width: 44px; height: 44px; object-fit: contain; flex-shrink: 0; }
.kpi-value { font-size: 24px; font-weight: 800; color: var(--ink); line-height: 1; }
.kpi-label { font-size: 12px; color: var(--muted); margin-top: 3px; }
@media (max-width: 520px) { .kpi { flex-direction: column; text-align: center; gap: 4px; padding: 10px 6px; } .kpi img { width: 38px; height: 38px; } }

.appt-list { display: flex; flex-direction: column; gap: 8px; }
.appt-card { display: flex; gap: 12px; align-items: center; padding: 10px 12px; border-radius: 12px; border: 1px solid var(--line); background: #f9fafb; text-decoration: none; color: inherit; }
.appt-card:hover { text-decoration: none; background: #f3f4f6; }
.appt-time { font-weight: 800; color: var(--teal); font-size: 16px; min-width: 52px; }
.appt-main { flex: 1; min-width: 0; }
.appt-main strong { display: block; color: var(--ink); }
.appt-main span { color: var(--muted); font-size: 13px; }
.appt-card.st-requested { background: #fffbeb; border-color: #fde68a; }
.appt-card.st-done { opacity: .7; }
.appt-card.st-cancelled, .appt-card.st-no_show { opacity: .5; text-decoration: line-through; }
.req-card { border: 1px solid #fde68a; background: #fffbeb; border-radius: 12px; padding: 10px 12px; display: flex; gap: 10px; align-items: center; flex-wrap: wrap; }
.req-card + .req-card { margin-top: 8px; }
.req-card .appt-main { min-width: 180px; }

/* ---------- Accesso ---------- */
.vr-login-wrap { min-height: 100vh; display: flex; align-items: center; justify-content: center; padding: 16px; background: var(--bg); }
.vr-login-card { background: var(--white); border-radius: 16px; padding: 26px 22px; box-shadow: 0 8px 24px rgba(15,23,42,.12); max-width: 400px; width: 100%; }
.vr-login-card .vr-login-logo { display: block; width: 180px; margin: 0 auto 14px; }
.vr-login-title { font-size: 20px; font-weight: 700; color: var(--ink); text-align: center; margin: 0; }
.vr-login-sub { font-size: 14px; color: var(--muted); text-align: center; margin: 6px 0 18px; }
.vr-login-card .small { font-size: 13px; color: var(--muted); text-align: center; margin-top: 16px; }

/* ---------- Benvenuto: scelta del percorso ---------- */
.paths { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-top: 16px; }
.path { text-align: left; font: inherit; color: inherit; cursor: pointer; background: var(--white); border: 2px solid var(--line); border-radius: 16px; padding: 18px; display: flex; flex-direction: column; gap: 6px; }
.path:hover { border-color: var(--teal); }
.path[aria-pressed="true"] { border-color: var(--teal); box-shadow: 0 0 0 4px rgba(15,118,110,.15); }
.path img { width: 64px; height: 64px; object-fit: contain; }
.path strong { font-size: 17px; color: var(--ink); }
.path span { color: var(--muted); font-size: 14px; }
.path-form { margin-top: 14px; background: var(--white); border-radius: 16px; padding: 18px; border: 2px solid var(--teal); }
.path-form .row { display: flex; gap: 10px; flex-wrap: wrap; align-items: flex-end; }
.path-form .row > div { flex: 1 1 240px; }
@media (max-width: 600px) { .paths { grid-template-columns: 1fr; } }
.welcome-wrap { max-width: 760px; margin: 0 auto; padding: 18px 14px 40px; }
.welcome-top { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 10px 14px; background: var(--teal); }
.welcome-top img { height: 28px; }

/* ---------- Clinica attiva e codice ---------- */
.code-box { background: var(--white); border: 2px dashed var(--teal); border-radius: var(--radius-lg); padding: 12px 14px; }
.code-box .code { font-size: 24px; font-weight: 800; letter-spacing: .12em; color: var(--ink); }
.code-box .hint { font-size: 13px; color: var(--muted); margin: 0; }

/* ---------- Animali ---------- */
.pets { display: grid; grid-template-columns: repeat(auto-fill, minmax(210px, 1fr)); gap: 10px; }
.pet-card { display: flex; gap: 12px; align-items: center; padding: 10px 12px; border-radius: var(--radius-lg); background: var(--white); box-shadow: var(--shadow); text-decoration: none; color: inherit; border: 1px solid transparent; }
.pet-card:hover { border-color: var(--teal-line); text-decoration: none; }
.pet-card strong { color: var(--ink); display: block; }
.pet-card span { color: var(--muted); font-size: 13px; }
.avatar { width: 52px; height: 52px; border-radius: 50%; object-fit: cover; background: var(--teal-soft); flex-shrink: 0; display: grid; place-items: center; color: var(--teal); font-weight: 800; font-size: 20px; }
.photo-box { display: flex; gap: 16px; align-items: center; flex-wrap: wrap; }
.photo-box .photo { width: 120px; height: 120px; border-radius: 18px; object-fit: cover; background: var(--teal-soft); display: grid; place-items: center; color: var(--teal); font-weight: 800; font-size: 40px; }
.file-btn input { display: none; }

/* ---------- Documenti ---------- */
.doc-row { display: flex; justify-content: space-between; align-items: center; gap: 10px; padding: 10px 0; border-bottom: 1px solid var(--line); flex-wrap: wrap; }
.doc-row:first-child { padding-top: 0; }
.doc-main { display: flex; flex-direction: column; min-width: 0; flex: 1 1 200px; }
.doc-main span { color: var(--muted); font-size: 12px; }
.doc-open { background: none; border: 0; padding: 4px 0; font: inherit; font-weight: 700; color: var(--teal); cursor: pointer; text-align: left; text-decoration: underline; text-underline-offset: 3px; word-break: break-word; }
.doc-actions { display: flex; gap: 6px; }

/* ---------- Visite ---------- */
.visit-row a { align-items: flex-start; }
.visit-date { font-weight: 800; color: var(--teal); min-width: 88px; font-size: 14px; }
.visit-row .main { flex: 1; }
@media (max-width: 520px) { .visit-date { min-width: 0; width: 100%; } }
.mod-section { font-size: 14px; margin: 6px 0 0; padding-bottom: 4px; border-bottom: 1px solid var(--line); color: var(--teal-dark); }

/* ---------- Agenda ---------- */
.wrap-wide { max-width: 1280px; }
.cal { background: var(--white); border: 1px solid var(--line); border-radius: var(--radius-lg); overflow: hidden; margin-top: 1rem; }
.cal-head, .cal-body { display: grid; grid-template-columns: 56px repeat(var(--days, 7), minmax(0, 1fr)); }
.cal-head { border-bottom: 1px solid var(--line); background: #FAFCFD; }
.cal-day-head { padding: .6rem .5rem; text-align: center; color: var(--muted); font-size: .9rem; border-left: 1px solid var(--line); }
.cal-day-head strong { color: var(--navy); font-size: 1.1rem; }
.cal-day-head.is-today { background: #E6F2F1; }
.cal-day-head.is-today strong { color: var(--teal-dark); }
.cal-body { position: relative; }
.cal-times { position: relative; }
.cal-hour { position: absolute; left: 0; right: 6px; text-align: right; font-size: .75rem; color: var(--muted); transform: translateY(-.55em); }
.cal-hour:first-child { transform: none; }
.cal-col {
  position: relative; border-left: 1px solid var(--line); cursor: pointer;
  background-image: repeating-linear-gradient(to bottom, var(--line) 0, var(--line) 1px, transparent 1px, transparent 64px);
  background-color: #F4F6F8;
}
.cal-col.is-closed { background-color: #EEF1F4; }
.cal-open { position: absolute; left: 0; right: 0; background: rgba(255,255,255,.92); pointer-events: none; }
.cal-appt {
  position: absolute; left: 3px; right: 3px; z-index: 1; overflow: hidden;
  text-align: left; font: inherit; font-size: .8rem; line-height: 1.25; cursor: pointer;
  padding: .25rem .4rem; border-radius: 6px; border: 0; border-left: 4px solid var(--teal);
  background: #DDF1EF; color: var(--navy);
}
.cal-appt b { font-weight: 800; }
.cal-appt span { color: var(--muted); }
.cal-appt em { display: block; font-style: normal; color: var(--muted); font-size: .75rem; }
.cal-appt:hover { filter: brightness(.97); }
.cal-appt.st-requested { background: #FFF4DB; border-left-color: #E0A21B; }
.cal-appt.st-done { background: #E9EEF3; border-left-color: #8193A3; }
.cal-appt.st-cancelled, .cal-appt.st-no_show { background: #F6EAEA; border-left-color: #C98785; opacity: .75; text-decoration: line-through; }

/* ---------- Finestra di dialogo ---------- */
.dlg { border: 0; border-radius: var(--radius-lg); padding: 1.5rem; width: min(640px, calc(100vw - 2rem)); max-height: calc(100vh - 2rem); box-shadow: 0 20px 60px rgba(3,56,96,.25); }
.dlg::backdrop { background: rgba(3,56,96,.45); }
.dlg h2 { margin-bottom: 1rem; }
.picker-results { display: flex; flex-direction: column; gap: .25rem; margin-top: .4rem; }
.picker-results button { text-align: left; font: inherit; padding: .55em .8em; border: 1px solid var(--line); border-radius: var(--radius-sm); background: var(--white); cursor: pointer; }
.picker-results button:hover { border-color: var(--teal); background: #F2F9F8; }
.pet-chosen { display: flex; align-items: center; gap: .8rem; flex-wrap: wrap; padding: .6em .8em; border: 2px solid var(--teal); border-radius: var(--radius-sm); background: #F2F9F8; font-weight: 600; color: var(--navy); }

/* ---------- Orari ---------- */
.hours-head, .hours-row { display: grid; grid-template-columns: 170px 1fr 1fr; gap: 1rem; align-items: center; }
.hours-head { color: var(--muted); font-size: .88rem; font-weight: 600; padding-bottom: .5rem; border-bottom: 1px solid var(--line); }
.hours-row { padding: .7rem 0; border-bottom: 1px solid var(--line); }
.hours-row:last-child { border-bottom: 0; }
.hours-row .range { display: flex; align-items: center; gap: .5rem; }
.hours-row.closed .range { opacity: .35; }
input[type="time"] { font: inherit; padding: .55em .6em; border: 2px solid var(--line); border-radius: var(--radius-sm); background: var(--white); color: var(--text); min-width: 0; width: 100%; }
@media (max-width: 720px) {
  .hours-head { display: none; }
  .hours-row { grid-template-columns: 1fr; gap: .5rem; }
}

/* ---------- Impostazioni ---------- */
.asset-box { height: 140px; border: 2px dashed var(--line); border-radius: var(--radius-lg); display: grid; place-items: center; background: repeating-conic-gradient(#F4F6F8 0% 25%, #fff 0% 50%) 50% / 16px 16px; overflow: hidden; }
.asset-box img { max-width: 90%; max-height: 120px; object-fit: contain; }

/* ---------- Editor dei moduli ---------- */
.title-input { font-size: 1.3rem !important; font-weight: 700; color: var(--navy) !important; }
.editor { display: grid; grid-template-columns: minmax(0, 1fr) 340px; gap: 1.5rem; align-items: start; margin-top: 1rem; }
@media (max-width: 980px) { .editor { grid-template-columns: 1fr; } .editor-preview { order: -1; } }
.blocks { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: .5rem; }
.blk { display: flex; gap: .6rem; align-items: flex-start; background: var(--white); border: 1px solid var(--line); border-radius: 12px; padding: .7rem; }
.blk.dragging { opacity: .4; }
.blk.drop-before { box-shadow: 0 -3px 0 var(--teal); }
.blk.drop-after { box-shadow: 0 3px 0 var(--teal); }
.blk.is-hidden { background: #F7F8FA; }
.blk.is-hidden .b-label { color: var(--muted); }
.blk-section { background: #EEF3F8; border-color: #D6E1EC; margin-top: .6rem; }
.blk-section .b-label { font-weight: 800; color: var(--navy); background: transparent; border-color: transparent; }
.blk-section .b-label:focus { background: var(--white); }
.grip { cursor: grab; color: #A6B4C0; font-weight: 800; letter-spacing: -2px; padding: .55rem .1rem; user-select: none; }
.blk-main { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: .5rem; }
.blk-top { display: flex; gap: .5rem; flex-wrap: wrap; }
.blk-top .b-label { flex: 1 1 200px; }
.blk-top .b-type { flex: 0 1 180px; width: auto; }
.blk-opts { display: flex; gap: .75rem; align-items: center; flex-wrap: wrap; }
.blk-opts .b-options, .blk-opts .b-unit { flex: 1 1 200px; padding: .45em .7em; font-size: .92rem; }
.blk input, .blk select { padding: .5em .7em; }
.blk-btns { display: flex; gap: .2rem; }
.blk-btns button { width: 32px; height: 32px; border-radius: 8px; border: 1px solid var(--line); background: var(--white); cursor: pointer; color: var(--muted); font-weight: 700; }
.blk-btns button:hover { color: var(--navy); border-color: var(--navy-2); }
.blk-btns .b-del:hover { color: #A12F2C; border-color: var(--coral); }
.seg { display: inline-flex; border: 1px solid var(--line); border-radius: 999px; overflow: hidden; }
.seg button { font: inherit; font-size: .85rem; font-weight: 600; border: 0; background: var(--white); color: var(--muted); padding: .3em .9em; cursor: pointer; }
.seg button[aria-pressed="true"] { background: var(--navy); color: var(--white); }
.check-small { font-size: .9rem; font-weight: 600; }
.check-small input { width: 17px; height: 17px; }
.add-bar { display: flex; gap: .5rem; align-items: center; flex-wrap: wrap; margin-top: 1rem; padding: .9rem; border: 2px dashed var(--line); border-radius: 12px; }
.add-bar select { flex: 1 1 220px; width: auto; }
.add-sep { color: var(--muted); font-size: .9rem; }

.editor-preview { position: sticky; top: 1rem; }
.a4 { background: var(--white); border: 1px solid var(--line); box-shadow: 0 8px 30px rgba(3,56,96,.08); aspect-ratio: 210 / 297; padding: 18px 16px; font-size: 9px; color: var(--muted); overflow: hidden; display: flex; flex-direction: column; gap: 5px; }
.a4-head { display: flex; justify-content: space-between; border-bottom: 2px solid var(--teal); padding-bottom: 6px; }
.a4-logo { width: 60px; height: 18px; background: #D9EEF0; border-radius: 3px; }
.a4-lines { display: flex; flex-direction: column; gap: 2px; align-items: flex-end; }
.a4-lines i { display: block; height: 3px; width: 70px; background: #E1E7ED; border-radius: 2px; }
.a4-lines i:first-child { width: 90px; background: #B8C7D6; }
.a4-title { font-size: 12px; font-weight: 800; color: var(--navy); margin-top: 4px; }
.a4-boxes { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; }
.a4-boxes span { height: 30px; background: #F3F6F9; border: 1px solid #E4EAF0; border-radius: 3px; }
.a4-core { font-weight: 700; color: #B0BCC7; border-bottom: 1px solid #EDF1F4; padding-bottom: 2px; }
.a4-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 4px 8px; }
.a4-sec { grid-column: 1 / -1; font-weight: 800; color: var(--navy); border-bottom: 1px solid var(--line); padding-bottom: 2px; margin-top: 3px; }
.a4-field { grid-column: 1 / -1; background: #E6F2F1; color: #145C57; border-radius: 3px; padding: 3px 5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.a4-field.half { grid-column: auto; }
.a4-field.off { background: repeating-linear-gradient(45deg, #F3F5F7, #F3F5F7 4px, #fff 4px, #fff 8px); color: #A0ADB8; }
.a4-field em { font-style: normal; font-size: 8px; }
.a4-sign { margin-top: auto; display: flex; justify-content: flex-end; }
.a4-sign span { width: 70px; border-bottom: 1px solid #C9D3DC; height: 14px; }
.mod-section { font-size: 1.05rem; margin: .5rem 0 0; padding-bottom: .3rem; border-bottom: 1px solid var(--line); }

/* ---------- Team ---------- */
.member { display: flex; align-items: center; gap: 1rem; padding: .9rem 0; border-bottom: 1px solid var(--line); flex-wrap: wrap; }
.member:last-child { border-bottom: 0; }
.member-main { flex: 1; min-width: 200px; display: flex; flex-direction: column; }
.member-main strong { color: var(--navy); }
.member-main span { color: var(--muted); font-size: .92rem; }
.member-ctl { display: flex; gap: .5rem; align-items: center; flex-wrap: wrap; }
.member-ctl select { width: auto; padding: .45em .7em; }
.member.is-suspended { opacity: .6; }
.roles-list { margin: 0; padding-left: 1.2rem; color: var(--text); }
.roles-list li { margin-bottom: .4rem; }



/* ---------- Portale proprietario ---------- */
.pill-wait { background: #FFF4DB; color: #7A5300; }
.pill-ok { background: #E6F6F4; color: #145C57; }
.link-form { margin-top: 1rem; padding-top: 1rem; border-top: 1px solid var(--line); }
.row-inline { display: flex; gap: .5rem; flex-wrap: wrap; }
.row-inline input { flex: 1 1 220px; width: auto; text-transform: uppercase; letter-spacing: .08em; }
.ro-block { margin-bottom: 1.4rem; }
.ro-block:last-child { margin-bottom: 0; }
.ro-block h3 { font-size: 1rem; margin: 0 0 .35rem; padding-bottom: .3rem; border-bottom: 1px solid var(--line); }
.ro-block p { margin: 0; white-space: pre-wrap; max-width: none; }
.ro-grid { display: grid; grid-template-columns: 1fr 1fr; gap: .7rem 1.5rem; }
.ro-sec { grid-column: 1 / -1; font-weight: 700; color: var(--teal-dark); margin-top: .4rem; }
.ro-field { grid-column: 1 / -1; display: flex; flex-direction: column; }
.ro-field.half { grid-column: auto; }
.ro-field span { color: var(--muted); font-size: .88rem; }
.ro-field strong { font-weight: 600; white-space: pre-wrap; }
@media (max-width: 600px) { .ro-grid { grid-template-columns: 1fr; } .ro-field.half { grid-column: 1 / -1; } }
.day-slots { margin-bottom: 1.2rem; }
.day-slots h3 { font-size: 1rem; margin: 0 0 .5rem; text-transform: capitalize; }
.slot-list { display: flex; flex-wrap: wrap; gap: .4rem; }
.slot { font: inherit; font-weight: 700; padding: .5em .9em; border-radius: 999px; border: 2px solid var(--line); background: var(--white); color: var(--navy); cursor: pointer; }
.slot:hover { border-color: var(--teal); }
.slot.is-chosen { background: var(--teal); border-color: var(--teal); color: var(--white); }

/* =============================================================
   PORTALE PROPRIETARIO (grafica originale: blu notte, stile app)
   ============================================================= */
.vr-owner-body {
  --teal: var(--owner); --teal-dark: var(--owner-2); --teal-soft: #eff6ff; --teal-line: #bfdbfe;
  background:
    radial-gradient(900px 480px at 10% -10%, rgba(3,56,96,.10), transparent 60%),
    radial-gradient(780px 420px at 90% 0%, rgba(16,185,129,.10), transparent 55%),
    linear-gradient(180deg, #f8fafc, #f6f8fb);
  background-attachment: fixed;
  color: #0f172a;
}
.vr-owner-header {
  position: sticky; top: 0; z-index: 20;
  background: rgba(255,255,255,.85); border-bottom: 1px solid rgba(2,6,23,.06);
  -webkit-backdrop-filter: saturate(180%) blur(14px); backdrop-filter: saturate(180%) blur(14px);
}
.vr-owner-header-row { display: grid; grid-template-columns: 40px minmax(0,1fr) auto; align-items: center; gap: 10px; padding: 10px 14px; max-width: 900px; margin: 0 auto; }
.vr-owner-brand { display: flex; justify-content: center; }
.vr-owner-brand img { height: 32px; width: auto; }
.vr-owner-header-right { display: flex; align-items: center; gap: 8px; justify-content: flex-end; min-width: 0; }
.vr-owner-pill { font-size: 12px; padding: 6px 10px; border-radius: 999px; border: 1px solid rgba(0,0,0,.08); background: rgba(0,0,0,.02); max-width: 200px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.vr-owner-logout { font: inherit; font-size: 13px; font-weight: 700; min-height: 38px; padding: 6px 12px; border-radius: 12px; border: 1px solid rgba(0,0,0,.1); background: #fff; color: #033860; cursor: pointer; }
.vr-icon-btn { display: inline-flex; align-items: center; justify-content: center; width: 40px; height: 40px; border-radius: 14px; border: 1px solid rgba(0,0,0,.08); background: #fff; font-size: 18px; cursor: pointer; color: inherit; }
@media (max-width: 520px) { .vr-owner-pill { display: none; } }
.vr-owner-main { max-width: 900px; margin: 0 auto; padding: 14px 14px calc(120px + env(safe-area-inset-bottom, 0px)); }
.vr-owner-main .panel, .vr-owner-main .rows, .vr-owner-main .pet-card { border-radius: 18px; box-shadow: 0 10px 24px rgba(2,6,23,.06); }

.vr-owner-tabbar {
  position: fixed; left: 0; right: 0; bottom: 0; z-index: 30;
  height: calc(92px + env(safe-area-inset-bottom, 0px));
  padding: 0 max(4px, env(safe-area-inset-right, 0px)) env(safe-area-inset-bottom, 0px) max(4px, env(safe-area-inset-left, 0px));
  background: rgba(255,255,255,.92); border-top: 1px solid rgba(2,6,23,.10);
  -webkit-backdrop-filter: saturate(180%) blur(14px); backdrop-filter: saturate(180%) blur(14px);
  display: flex; justify-content: center;
}
.vr-tab-slot { width: 25%; max-width: 180px; height: 92px; display: flex; align-items: center; justify-content: center; }
.vr-tab {
  width: 92%; height: 78px; text-decoration: none; color: inherit; border-radius: 18px; padding: 8px 4px;
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px;
  border: 1px solid rgba(2,6,23,.06); background: rgba(2,6,23,.02);
  transition: transform .14s ease, background .18s ease, box-shadow .18s ease;
}
.vr-tab:hover { text-decoration: none; }
.vr-tab:active { transform: translateY(1px); }
.vr-tab.is-active { border-color: rgba(3,56,96,.28); background: rgba(3,56,96,.08); box-shadow: 0 10px 22px rgba(3,56,96,.10); }
.vr-tab-ic { width: 40px; height: 40px; object-fit: contain; }
.vr-tab-tx { font-size: 12px; font-weight: 700; }

/* Libretto del proprietario */
.hero { background: linear-gradient(135deg, #033860, #075985); color: #fff; border-radius: 22px; padding: 18px; margin-bottom: 14px; box-shadow: 0 14px 32px rgba(3,56,96,.25); }
.hero h1 { color: #fff; font-size: 22px; margin-bottom: 4px; }
.hero p { color: rgba(255,255,255,.85); margin: 0; }
.hero .btn { margin-top: 12px; background: #fff; color: #033860; }
.book { background: #fff; border-radius: 20px; box-shadow: 0 10px 24px rgba(2,6,23,.06); padding: 14px; margin-bottom: 12px; }
.book-head { display: flex; gap: 12px; align-items: center; text-decoration: none; color: inherit; }
.book-head:hover { text-decoration: none; }
.book-head .avatar { width: 60px; height: 60px; }
.book-head strong { font-size: 18px; color: #0f172a; display: block; }
.book-head span { color: var(--muted); font-size: 13px; }
.book-stats { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 6px; margin-top: 12px; }
.book-stat { background: #f8fafc; border: 1px solid rgba(2,6,23,.06); border-radius: 14px; padding: 8px 4px; text-align: center; }
.book-stat b { display: block; font-size: 18px; color: #033860; }
.book-stat span { font-size: 11px; color: var(--muted); font-weight: 600; }
.book-stat.ok b { color: #059669; } .book-stat.ko b { color: #b45309; }
.book-actions { display: flex; gap: 8px; margin-top: 12px; flex-wrap: wrap; }
.book-actions .btn { flex: 1 1 140px; }

/* ---------- Dashboard ---------- */
.steps { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 6px; }
.steps li a { display: flex; align-items: center; gap: 10px; padding: 10px 12px; border-radius: 12px; background: #f9fafb; border: 1px solid var(--line); color: var(--ink); font-weight: 600; min-height: 48px; }
.steps li a::before { content: ''; width: 22px; height: 22px; border-radius: 50%; border: 2px solid #d1d5db; flex-shrink: 0; }
.steps li.is-done a { color: var(--muted); text-decoration: line-through; background: #f0fdf4; border-color: #bbf7d0; }
.steps li.is-done a::before { background: #16a34a url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M5 12l5 5 9-10' fill='none' stroke='white' stroke-width='3'/%3E%3C/svg%3E") center/14px no-repeat; border-color: #16a34a; }
.code-share { display: flex; gap: 16px; align-items: center; flex-wrap: wrap; }
.code-share .code { font-size: 26px; font-weight: 800; letter-spacing: .14em; color: var(--ink); }
.qr { width: 132px; height: 132px; flex-shrink: 0; background: #fff; border: 1px solid var(--line); border-radius: 12px; padding: 4px; }
.qr svg { width: 100%; height: 100%; display: block; }
.login-roles { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-top: 16px; }
.login-roles div { display: flex; flex-direction: column; align-items: center; gap: 4px; text-align: center; font-size: 12px; font-weight: 600; color: var(--muted); background: #f9fafb; border-radius: 12px; padding: 10px 6px; }
.login-roles img { width: 48px; height: 48px; object-fit: contain; }
.code-input { text-transform: uppercase; letter-spacing: .1em; font-weight: 700; }
@media (max-width: 980px) {
  .editor-preview .a4 { max-width: 240px; margin: 0 auto; }
  .blk-top .b-type { flex: 1 1 100%; }
}

/* ---------- Referto definitivo ---------- */
.final-box { display: flex; gap: 12px; align-items: center; background: #f0fdf4; border: 1px solid #bbf7d0; border-radius: 12px; padding: 10px 12px; margin-bottom: 10px; }
.final-box img { width: 40px; height: 40px; object-fit: contain; }
.final-box strong { display: block; color: #166534; }
.final-box span { font-size: 13px; color: #166534; }

/* ---------- Stile del referto ---------- */
.swatches { display: flex; gap: 8px; flex-wrap: wrap; }
.swatch { width: 40px; height: 40px; border-radius: 50%; border: 3px solid #fff; background: var(--c); box-shadow: 0 0 0 1px var(--line); cursor: pointer; padding: 0; position: relative; display: grid; place-items: center; font-weight: 800; color: #6b7280; }
.swatch[aria-pressed="true"] { box-shadow: 0 0 0 3px var(--ink); }
.swatch-custom input { position: absolute; inset: 0; opacity: 0; cursor: pointer; width: 100%; height: 100%; }

/* ---------- Agenda mensile ---------- */
.seg-big button { padding: .5em 1em; min-height: 36px; }
.month { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 4px; padding: 6px; }
.mhead { text-align: center; font-size: 12px; font-weight: 700; color: var(--muted); padding: 4px 0; }
.mcell { font: inherit; text-align: left; cursor: pointer; min-height: 92px; padding: 6px; border-radius: 10px; border: 1px solid var(--line); background: #fff; display: flex; flex-direction: column; gap: 2px; overflow: hidden; border-left-width: 4px; }
.mcell:hover { border-color: var(--teal); }
.mcell.is-out { opacity: .45; }
.mcell.is-today .mnum { background: var(--teal); color: #fff; border-radius: 999px; padding: 0 7px; }
.mnum { font-weight: 800; color: var(--ink); align-self: flex-start; }
.mcount { font-size: 12px; font-weight: 700; color: var(--teal); }
.mcount b { color: #b45309; }
.mlist { display: flex; flex-direction: column; font-size: 11px; color: var(--muted); line-height: 1.35; }
.mlist i { font-style: normal; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.load-free { border-left-color: #86efac; } .load-low { border-left-color: #22c55e; }
.load-mid { border-left-color: #f59e0b; } .load-full { border-left-color: #ef4444; }
.load-closed { border-left-color: #e5e7eb; background: #f9fafb; }
.mlegend { display: flex; gap: 12px; flex-wrap: wrap; font-size: 12px; color: var(--muted); padding: 4px 10px 10px; }
.mlegend span { border-left-width: 4px; border-left-style: solid; padding-left: 6px; background: none !important; }
@media (max-width: 720px) {
  .month { gap: 2px; padding: 4px; }
  .mcell { min-height: 58px; padding: 4px 3px; border-left-width: 3px; }
  .mlist { display: none; }
  .mnum { font-size: 13px; }
  .mcount { font-size: 11px; }
}

/* ---------- Backup ---------- */
.plain-list { margin: 0 0 12px; padding-left: 20px; }
.plain-list li { margin-bottom: 6px; }
.progress { margin-top: 12px; }
.progress-bar { height: 10px; border-radius: 999px; background: #e5e7eb; overflow: hidden; }
.progress-bar span { display: block; height: 100%; width: 0; background: var(--teal); transition: width .2s ease; }

/* ---------- Pannello piattaforma ---------- */
.stat-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 8px; margin-bottom: 12px; }
.stat { background: #fff; border-radius: 12px; padding: 10px 12px; box-shadow: var(--shadow); }
.stat b { display: block; font-size: 22px; color: var(--ink); line-height: 1.1; }
.stat span { font-size: 12px; color: var(--muted); }
.chart { height: 200px; }
.bars { display: flex; align-items: stretch; gap: 6px; height: 100%; }
.bar-col { flex: 1; display: flex; flex-direction: column; justify-content: flex-end; align-items: center; min-width: 0; }
.bar { width: 100%; max-width: 38px; background: var(--teal); border-radius: 6px 6px 0 0; min-height: 2px; }
.bar-val { font-size: 11px; font-weight: 700; color: var(--ink); height: 16px; }
.bar-lab { font-size: 10px; color: var(--muted); margin-top: 4px; white-space: nowrap; }
.table-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; }
.vtable { width: 100%; border-collapse: collapse; font-size: 13px; }
.vtable th { text-align: left; font-size: 12px; color: var(--muted); font-weight: 600; padding: 8px 8px; border-bottom: 1px solid var(--line); white-space: nowrap; }
.vtable td { padding: 8px; border-bottom: 1px solid var(--line); vertical-align: top; }
.vtable .num { text-align: right; }
.vtable tr.is-suspended td { background: #fef2f2; }
.row-actions { white-space: nowrap; }
.row-actions .btn + .btn { margin-left: 4px; }
.pill-bad { background: #fee2e2; color: #991b1b; }
@media (max-width: 720px) { .bar-lab { font-size: 9px; transform: rotate(-45deg); transform-origin: top center; margin-top: 10px; } .chart { height: 220px; } }
.seg-big { max-width: 100%; overflow-x: auto; }
.seg-big button { flex-shrink: 0; }
.vtable td:first-child { min-width: 170px; }
@media (max-width: 520px) { .stat-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } .stat b { font-size: 18px; } .stat span { font-size: 11px; } }

/* ---------- Lingua ---------- */
.vr-lang { font: inherit; font-size: 12px; font-weight: 800; letter-spacing: .05em; min-height: 36px; min-width: 40px; padding: 6px 8px; border-radius: 10px; border: 1px solid rgba(236,254,255,.5); background: transparent; color: #ecfeff; cursor: pointer; }
.vr-lang:hover { background: rgba(255,255,255,.12); }
.vr-lang-owner { border-color: rgba(0,0,0,.12); color: #033860; background: #fff; }
.lang-switch { text-align: center; margin-top: 14px; font-size: 13px; color: var(--muted); }
.lang-switch button { font: inherit; background: none; border: 0; color: var(--teal); cursor: pointer; padding: 6px; font-weight: 600; }
.lang-switch button[aria-current="true"] { color: var(--ink); font-weight: 800; text-decoration: underline; }

/* ---------- Carta intestata e sfondi ---------- */
.lh-box { margin-top: 14px; padding-top: 12px; border-top: 1px solid var(--line); }
.bg-row { display: flex; gap: 14px; align-items: flex-start; flex-wrap: wrap; }
.bg-thumb { width: 105px; aspect-ratio: 210 / 297; border: 1px solid var(--line); border-radius: 6px; background: #fff; display: grid; place-items: center; overflow: hidden; flex-shrink: 0; font-size: 12px; box-shadow: var(--shadow); }
.bg-thumb img { width: 100%; height: 100%; object-fit: cover; }

/* ---------- Termini ---------- */
.terms-dlg { max-width: 560px; }
.terms-check { align-items: flex-start; font-weight: 500; color: var(--text); margin-top: 10px; line-height: 1.45; }
.terms-check input { margin-top: 2px; }
.terms-changes { margin: 6px 0 4px; padding-left: 1.2em; color: var(--text); line-height: 1.45; }
.terms-changes li { margin: 2px 0; }
.terms-sub { margin: 14px 0 0; font-weight: 700; color: var(--text); }
.danger-zone { border: 1px solid #fecaca; }
.danger-zone h2 { color: #b91c1c; }

/* ---------- Importazione ---------- */
.map-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 8px 14px; }
.map-row { display: flex; flex-direction: column; gap: 4px; padding: 8px 10px; border: 1px solid var(--line); border-radius: 10px; background: #f9fafb; }
.map-src { font-weight: 700; color: var(--ink); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.map-src small { display: block; font-weight: 400; color: var(--muted); overflow: hidden; text-overflow: ellipsis; }

/* ---------- FurrFinder: marchio del portale proprietari ---------- */
.vr-owner-body { --owner: #0b2545; --owner-2: #124c8a; --teal-soft: #eff6ff; --teal-line: #bfdbfe; }
.vr-owner-brand { align-items: center; gap: 8px; text-decoration: none; }
.vr-owner-brand img { height: 32px; width: 32px; }
.vr-owner-brand span { font-weight: 800; font-size: 20px; letter-spacing: -.3px; color: #0b2545; }
.vr-owner-brand:hover { text-decoration: none; }
.vr-owner-body .hero { background: linear-gradient(135deg, #0b2545, #1d6fd6); box-shadow: 0 14px 32px rgba(11,37,69,.25); }
.vr-owner-body .hero .btn { color: #0b2545; }
.vr-tab.is-active { border-color: rgba(29,111,214,.35); background: rgba(14,165,233,.10); box-shadow: 0 10px 22px rgba(11,37,69,.10); }
.vr-owner-logout, .vr-lang-owner { color: #0b2545; }
.vr-owner-body .book-stat b { color: #124c8a; }
/* Pagina di accesso in modalità FurrFinder */
.ff-mode .vr-login-logo { display: none; }
.ff-brand { display: none; align-items: center; justify-content: center; gap: 10px; margin: 0 auto 14px; }
.ff-mode .ff-brand { display: flex; }
.ff-brand img { width: 52px; height: 52px; }
.ff-brand span { font-size: 28px; font-weight: 800; color: #0b2545; letter-spacing: -.5px; }
.ff-mode .login-roles { display: none; }
.ff-mode .btn-google { border-color: #bfdbfe; }
.switch-brand { text-align: center; font-size: 13px; margin-top: 10px; color: var(--muted); }

/* ---------- Fase B: promemoria, grafico peso, dettatura, azioni ---------- */
.appt-card { flex-wrap: wrap; }
.appt-link { display: flex; gap: 12px; align-items: center; flex: 1 1 220px; min-width: 0; color: inherit; text-decoration: none; }
.appt-link:hover { text-decoration: none; }
.appt-acts { display: flex; gap: 6px; flex-wrap: wrap; }
.rem-row { display: flex; justify-content: space-between; align-items: center; gap: 10px; padding: 10px 0; border-bottom: 1px solid var(--line); flex-wrap: wrap; }
.rem-row:last-child { border-bottom: 0; }
.rem-main { display: flex; flex-direction: column; min-width: 0; flex: 1 1 220px; }
.rem-main strong { color: var(--ink); }
.rem-main span { font-size: 13px; color: var(--muted); }
.rem-main .late { color: #b91c1c; font-weight: 700; }
.rem-acts { display: flex; gap: 6px; flex-wrap: wrap; }
.rem-row.is-done { opacity: .55; }
.rem-add { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 10px; align-items: center; }
.rem-add .rem-title { flex: 2 1 200px; width: auto; }
.rem-add .rem-date { flex: 1 1 150px; width: auto; }
.wchart { width: 100%; height: auto; display: block; }
.wchart text { font-size: 12px; fill: var(--muted); }
.wchart { max-width: 640px; }
.wchart .grid { stroke: var(--line); stroke-width: 1; }
.wchart .ln { fill: none; stroke: var(--teal); stroke-width: 3; stroke-linejoin: round; stroke-linecap: round; }
.wchart circle { fill: #fff; stroke: var(--teal); stroke-width: 2.5; }
.dictate-btn { float: right; margin: -30px 0 0; width: 34px; height: 30px; border-radius: 8px; border: 1px solid var(--line); background: #fff; cursor: pointer; font-size: 15px; line-height: 1; }
.dictate-btn.on { background: #fee2e2; border-color: #fca5a5; animation: pulse 1.2s infinite; }
@keyframes pulse { 50% { box-shadow: 0 0 0 4px rgba(220,38,38,.15); } }
@media (prefers-reduced-motion: reduce) { .dictate-btn.on { animation: none; } }
@media (max-width: 720px) {
  .sticky-actions { position: sticky; bottom: 0; z-index: 5; background: rgba(243,244,246,.96); padding: 10px 0 calc(10px + env(safe-area-inset-bottom, 0px)); margin: 0 -2px; border-top: 1px solid var(--line); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); }
  .sticky-actions .btn-primary, .sticky-actions .btn-ghost { flex: 1 1 auto; }
  .sticky-actions .spacer { display: none; }
}
.vr-search-btn { display: inline-flex; align-items: center; gap: 6px; font: inherit; font-size: 13px; font-weight: 700; color: #ecfeff; background: rgba(255,255,255,.12); border: 1px solid rgba(236,254,255,.35); border-radius: 12px; min-height: 36px; padding: 6px 12px; cursor: pointer; }
.vr-search-btn:hover { background: rgba(255,255,255,.2); }
@media (max-width: 480px) { .vr-search-lbl { display: none; } .vr-search-btn { padding: 6px 10px; } }
.vr-guide-btn { display: inline-flex; align-items: center; gap: 6px; font: inherit; font-size: 13px; font-weight: 700; color: #ecfeff; background: rgba(255,255,255,.12); border: 1px solid rgba(236,254,255,.35); border-radius: 12px; min-height: 36px; padding: 6px 12px; text-decoration: none; cursor: pointer; }
.vr-guide-btn:hover { background: rgba(255,255,255,.2); }
.vr-guide-btn:focus-visible { outline: 3px solid #fff; outline-offset: 2px; }
.vr-guide-btn.is-pulse { animation: vr-guide-pulse 1.4s ease-out 4; background: var(--orange); border-color: transparent; }
@keyframes vr-guide-pulse { 0% { box-shadow: 0 0 0 0 rgba(249,115,22,.65); } 100% { box-shadow: 0 0 0 14px rgba(249,115,22,0); } }
@media (prefers-reduced-motion: reduce) { .vr-guide-btn.is-pulse { animation: none; } }
@media (max-width: 480px) { .vr-guide-lbl { display: none; } .vr-guide-btn { padding: 6px 10px; } }
.search-dlg { width: min(640px, calc(100vw - 1.5rem)); margin-top: 8vh; }
.search-res { margin-top: 10px; max-height: 55vh; overflow: auto; display: flex; flex-direction: column; gap: 4px; }
.search-hit { display: flex; gap: 10px; align-items: center; padding: 8px 10px; border-radius: 10px; color: inherit; text-decoration: none; border: 1px solid transparent; }
.search-hit:hover, .search-hit:focus { background: var(--teal-soft); border-color: #99f6e4; text-decoration: none; }
.search-hit img { width: 34px; height: 34px; object-fit: contain; }
.search-hit strong { display: block; color: var(--ink); }
.search-hit small { color: var(--muted); }
.book-rem { display: flex; flex-direction: column; gap: 2px; margin-top: 10px; font-size: 13px; color: #075985; background: #eff6ff; border-radius: 12px; padding: 8px 10px; }
.book-rem .late { color: #b91c1c; font-weight: 700; }

/* ---------- Pannello Piattaforma (patch 09) ---------- */
.plat-segs { display: flex; flex-wrap: wrap; gap: 8px; }
.bars-dense { gap: 2px; }
.bars-dense .bar-lab { font-size: 9px; }
.bars-dense .bar-val { font-size: 10px; }
.bar-col.is-now .bar { background: var(--navy); }
.bar-col.is-now .bar-lab { font-weight: 700; color: var(--ink); }
.pill-new { background: #FFF4DB; color: #7A5300; }
.vtable tr.is-new td { background: #FFFBEB; }
.err-detail { white-space: pre-wrap; word-break: break-word; font-size: 11px; background: #f8fafc; border-radius: 8px; padding: 8px; margin: 6px 0 0; max-height: 260px; overflow: auto; }
#errors summary { cursor: pointer; font-size: 13px; }
@media (max-width: 720px) { .bars-dense .bar-lab { transform: none; margin-top: 4px; font-size: 8px; } }
.plat-segs .seg { max-width: 100%; overflow-x: auto; }
@media (max-width: 520px) { .plat-segs .seg-big button { padding: .45em .65em; font-size: .78rem; white-space: nowrap; } }

/* ---------- Cerca o registra paziente ---------- */
.search-dlg { width: min(680px, calc(100vw - 1.5rem)); }
.search-row { display: flex; align-items: center; gap: 8px; border-radius: 10px; }
.search-row .search-hit { flex: 1; min-width: 0; }
.search-row .search-hit small { display: block; color: var(--muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.search-acts { display: flex; gap: 6px; flex-shrink: 0; }
.search-foot { display: flex; align-items: center; gap: 10px; margin-top: 12px; flex-wrap: wrap; }
.qp-box { border: 1px solid var(--line); border-radius: 12px; padding: 10px 14px 14px; margin: 0 0 10px; }
.qp-box legend { font-weight: 800; color: var(--ink); padding: 0 6px; }
.qp-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px 12px; }
.qp-grid .qp-wide { grid-column: 1 / -1; }
.qp-lbl { display: block; font-weight: 600; font-size: .9rem; margin-bottom: 4px; }
.qp-chips { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.qp-chips select { width: auto; min-width: 150px; }
.qp-chip input { position: absolute; opacity: 0; pointer-events: none; }
.qp-chip span { display: inline-block; padding: .45em 1em; border: 1px solid var(--line); border-radius: 999px; background: var(--white); font-weight: 600; cursor: pointer; }
.qp-chip input:checked + span { background: var(--teal); border-color: var(--teal); color: #fff; }
.qp-chip input:focus-visible + span { outline: 3px solid #99f6e4; }
.qp-dup { margin-top: 10px; padding: 8px 10px; border-radius: 10px; background: #FFF4DB; color: #7A5300; font-size: 13px; display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.qp-fixed { padding: 4px 0 2px; }
@media (max-width: 560px) {
  .qp-grid { grid-template-columns: 1fr; }
  .search-row { flex-wrap: wrap; }
  .search-acts { width: 100%; justify-content: flex-end; padding: 0 8px 6px; }
}
.linklike { background: none; border: 0; padding: 0; font: inherit; color: var(--teal); text-decoration: underline; cursor: pointer; }

/* ---------- Scheda animale: riepilogo in alto ---------- */
.pet-sum { display: flex; gap: 14px; align-items: center; }
.pet-sum-photo { width: 76px; height: 76px; border-radius: 18px; object-fit: cover; background: var(--teal-soft); flex-shrink: 0; display: grid; place-items: center; color: var(--teal); font-weight: 800; font-size: 30px; }
.pet-sum-main { min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.pet-sum-facts { font-weight: 700; color: var(--ink); font-size: 1.02rem; }
.pet-sum-line { color: var(--muted); font-size: .92rem; }
.pet-alert { margin-top: 12px; padding: 10px 12px; border-radius: 10px; background: #FFF4DB; color: #7A5300; white-space: pre-line; }
.pet-sum-acts { margin-top: 12px; }
.edit-box { margin-top: 4px; }
.edit-box > summary { list-style: none; cursor: pointer; font-weight: 700; color: var(--ink); background: var(--white); border-radius: var(--radius-lg); padding: 14px 16px; margin-bottom: 12px; box-shadow: var(--shadow); }
.edit-box > summary::-webkit-details-marker { display: none; }
.edit-box > summary::before { content: '✎  '; color: var(--teal); }
.edit-box[open] > summary { color: var(--teal); }
.edit-box.is-new > summary { display: none; }
@media (max-width: 520px) { .pet-sum-photo { width: 60px; height: 60px; font-size: 24px; } }

/* ---------- Dashboard: barra "chi è in sala d'attesa" ---------- */
.waiting-bar { display: flex; align-items: center; gap: 12px; width: 100%; text-align: left; font: inherit; cursor: pointer; background: var(--white); border: 2px solid var(--teal); border-radius: var(--radius-lg); padding: 14px 16px; margin-bottom: 12px; box-shadow: var(--shadow); color: var(--muted); }
.waiting-bar:hover, .waiting-bar:focus-visible { background: var(--teal-soft); }
.waiting-bar svg { color: var(--teal); flex-shrink: 0; }
.waiting-bar b { color: var(--ink); }
.waiting-bar span { flex: 1; }
.waiting-bar kbd { font: 600 12px/1 system-ui, sans-serif; border: 1px solid var(--line); border-radius: 6px; padding: 4px 7px; color: var(--muted); }
@media (max-width: 720px) { .waiting-bar kbd { display: none; } }

/* ---------- Visita: prossimo richiamo ---------- */
.recall-row { display: flex; flex-wrap: wrap; gap: 8px; }
.recall-row select { flex: 0 0 210px; width: auto; }
.recall-row input[type=date] { flex: 0 0 170px; width: auto; }
.recall-row input[type=text] { flex: 1 1 220px; width: auto; }
@media (max-width: 520px) { .recall-row select, .recall-row input[type=date] { flex: 1 1 100%; } }
.addr-box > summary { cursor: pointer; list-style: none; }
.addr-box > summary::-webkit-details-marker { display: none; }
.addr-box > summary::before { content: '▸ '; color: var(--teal); font-weight: 800; }
.addr-box[open] > summary::before { content: '▾ '; }
.addr-box[open] > summary { margin-bottom: 10px; }

/* ---------- Agenda: giorno per veterinario, trascinamento ---------- */
.agenda-bar { flex-wrap: wrap; }
.cal-appt { -webkit-user-select: none; user-select: none; -webkit-touch-callout: none; }
.cal-appt.can-move { cursor: grab; }
.cal-appt.is-dragging { cursor: grabbing; z-index: 5; box-shadow: 0 8px 22px rgba(3,56,96,.28); opacity: .95; outline: 2px solid var(--teal); }
.cal-resize { position: absolute; left: 0; right: 0; bottom: 0; height: 8px; cursor: ns-resize; }
.cal-resize::after { content: ''; position: absolute; left: 50%; bottom: 2px; width: 22px; height: 3px; margin-left: -11px; border-radius: 2px; background: currentColor; opacity: 0; transition: opacity .15s; }
.cal-appt:hover .cal-resize::after { opacity: .35; }
.cal-now { position: absolute; left: 0; right: 0; height: 2px; background: #E0463C; z-index: 3; pointer-events: none; }
.cal-now::before { content: ''; position: absolute; left: -4px; top: -4px; width: 10px; height: 10px; border-radius: 50%; background: #E0463C; }
.cal-vet { float: right; font-style: normal; font-size: .68rem; font-weight: 800; background: var(--white); color: var(--teal-dark); border-radius: 999px; padding: 0 .4em; margin-left: .25em; }
.cal-vet-name { font-size: .95rem; }
.cal-day-head.is-unassigned, .cal-col.is-unassigned { background-color: #FAFAFB; }
.toast { position: fixed; left: 50%; bottom: calc(18px + env(safe-area-inset-bottom, 0px)); transform: translateX(-50%); z-index: 1000; display: flex; align-items: center; gap: 10px; flex-wrap: wrap; max-width: calc(100vw - 24px); background: var(--ink); color: #fff; padding: 10px 12px 10px 16px; border-radius: 14px; box-shadow: 0 12px 32px rgba(3,56,96,.35); font-size: .92rem; }
.toast .btn { background: #fff; color: var(--ink); border-color: #fff; }
.toast-x { background: none; border: 0; color: #fff; font-size: 20px; line-height: 1; cursor: pointer; padding: 0 4px; opacity: .7; }
@media (max-width: 820px) { .toast { bottom: calc(80px + env(safe-area-inset-bottom, 0px)); } }
.cal-vet-name .vn-short { display: none; }
@media (max-width: 820px) {
  .cal-vet-name .vn-full { display: none; }
  .cal-vet-name .vn-short { display: inline; }
  .cal-vet-name { font-size: .85rem; }
  .cal-appt { font-size: .72rem; padding: .2rem .3rem; }
}

/* ---------- Dashboard "Oggi" ---------- */
.now-card { border: 2px solid var(--teal); }
.now-top { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; font-size: .9rem; }
.now-when { font-weight: 800; color: var(--teal-dark); background: var(--teal-soft); padding: 3px 10px; border-radius: 999px; }
.now-when.is-live { color: #fff; background: #E0463C; }
.now-who { margin-top: 8px; display: flex; flex-direction: column; gap: 2px; }
.now-who strong { font-size: 1.35rem; color: var(--ink); }
.now-owner { color: var(--muted); }
.now-acts { margin-top: 12px; }
.count-badge:empty { display: none; }
.count-badge { display: inline-grid; place-items: center; min-width: 24px; height: 24px; padding: 0 7px; border-radius: 999px; background: var(--orange); color: #fff; font-size: 13px; vertical-align: 2px; margin-left: 4px; }
.todo-list { display: flex; flex-direction: column; gap: 8px; }
.todo-row { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; padding: 10px 12px; border-radius: 12px; border: 1px solid var(--line); background: #fafbfc; }
.todo-main { flex: 1 1 220px; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.todo-main strong { color: var(--ink); }
.todo-main span { color: var(--muted); font-size: .88rem; }
.todo-main .late { color: #b91c1c; }
.todo-acts { display: flex; gap: 6px; flex-wrap: wrap; }
.todo-tag { font-size: 11px; font-weight: 800; text-transform: uppercase; letter-spacing: .03em; padding: 3px 8px; border-radius: 999px; flex-shrink: 0; }
.tag-req { background: #FFF4DB; color: #7A5300; }
.tag-tom { background: #E0F2FE; color: #075985; }
.tag-rem { background: var(--teal-soft); color: var(--teal-dark); }
.tag-late { background: #FEE2E2; color: #991B1B; }
.tag-vis { background: #EDE9FE; color: #5B21B6; }
.appt-card.is-past { opacity: .75; }
.dash-stats { color: var(--muted); font-size: .92rem; margin: 4px 2px 12px; }
.dash-stats a { color: inherit; }
.code-box > summary { cursor: pointer; list-style: none; }
.code-box > summary::-webkit-details-marker { display: none; }
.code-box > summary::before { content: '▸ '; color: var(--teal); font-weight: 800; }
.code-box[open] > summary::before { content: '▾ '; }
@media (max-width: 600px) {
  .todo-acts { width: 100%; }
  .todo-acts .btn { flex: 1 1 auto; }
  .now-acts .btn { flex: 1 1 calc(50% - 8px); }
}

/* ---------- Telefono e tablet: barra in basso + menu a scomparsa ---------- */
.vr-tabbar, .vr-menu-backdrop { display: none; }
@media (max-width: 1024px) {
  .vr-sidebar { display: none; }
  .vr-main { padding-bottom: calc(96px + env(safe-area-inset-bottom, 0px)); }
  .vr-tabbar {
    display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); align-items: end;
    position: fixed; left: 0; right: 0; bottom: 0; z-index: 60;
    background: var(--ink); border-top: 1px solid rgba(255,255,255,.08);
    padding: 6px 4px calc(6px + env(safe-area-inset-bottom, 0px));
  }
  .vr-tb { display: flex; flex-direction: column; align-items: center; gap: 3px; padding: 2px 0; background: none; border: 0; font: inherit; font-size: 11px; font-weight: 700; color: #cbd5e1; text-decoration: none; cursor: pointer; -webkit-tap-highlight-color: transparent; }
  .vr-tb:hover { text-decoration: none; }
  .vr-tb img { width: 34px; height: 34px; object-fit: contain; border-radius: 10px; background: #fff; padding: 3px; border: 1px solid rgba(0,0,0,.5); }
  .vr-tb.is-active { color: var(--orange); }
  .vr-tb.is-active img, .vr-tb.is-active svg rect { outline: 2px solid var(--orange); outline-offset: 1px; }
  .vr-tb-main img { width: 48px; height: 48px; margin-top: -16px; border: 2px solid var(--orange); box-shadow: 0 6px 16px rgba(249,115,22,.4); }
  .vr-tb:active img { transform: scale(.95); }
  .vr-menu-open .vr-sidebar {
    display: grid; position: fixed; left: 8px; right: 8px; bottom: calc(70px + env(safe-area-inset-bottom, 0px)); z-index: 70;
    grid-template-columns: repeat(4, minmax(0, 1fr)); grid-auto-rows: auto; gap: 8px; padding: 14px 10px;
    max-height: 70vh; overflow: auto; border-radius: 18px; box-shadow: 0 -10px 40px rgba(0,0,0,.35);
  }
  .vr-menu-open .vr-nav-item { display: flex; flex-direction: column; align-items: center; gap: 5px; height: auto; padding: 8px 4px; }
  .vr-menu-open .vr-nav-icon { width: 52px; height: 52px; }
  .vr-menu-open .vr-nav-label { position: static; width: auto; height: auto; overflow: visible; clip: auto; font-size: 11.5px; line-height: 1.15; text-align: center; color: #e5e7eb; }
  .vr-menu-open .vr-nav-item.active .vr-nav-label { color: var(--ink-2); }
  .vr-menu-open .vr-menu-backdrop { display: block; position: fixed; inset: 0; z-index: 65; background: rgba(3,20,40,.45); }
  .sticky-actions { bottom: calc(64px + env(safe-area-inset-bottom, 0px)); padding-bottom: 10px; }
  .toast { bottom: calc(78px + env(safe-area-inset-bottom, 0px)); }
}
.next-box { margin-top: 12px; padding: 12px 14px; border-radius: 12px; border: 2px solid var(--teal); background: var(--teal-soft); display: flex; gap: 12px; align-items: center; justify-content: space-between; flex-wrap: wrap; }
.next-box strong { color: var(--ink); font-size: 1.05rem; }
.code-box { border: 0 !important; }
@media (max-width: 720px) {
  .waiting-bar { padding: 11px 14px; }
  .waiting-bar .wb-q { display: none; }
}
@media (max-width: 1024px) {
  .vr-focus .vr-tabbar { display: none; }
  .vr-focus .vr-main { padding-bottom: 40px; }
  .vr-focus .sticky-actions { bottom: 0; padding-bottom: calc(10px + env(safe-area-inset-bottom, 0px)); }
  /* con la tastiera aperta la barra in basso si toglie di mezzo */
  body:has(input:focus, textarea:focus, select:focus) .vr-tabbar { display: none; }
}

/* ---------- Notifiche FurrFinder ---------- */
.push-state { font-weight: 700; margin: 0 0 8px; color: var(--muted); }
.push-state.is-on { color: var(--teal-dark); }
.push-prefs { border: 1px solid var(--line); border-radius: 12px; padding: 10px 14px; margin: 12px 0 0; display: flex; flex-direction: column; gap: 8px; }
.push-prefs legend { font-weight: 700; padding: 0 6px; }
.push-banner { display: flex; gap: 12px; align-items: center; justify-content: space-between; flex-wrap: wrap; padding: 14px 16px; margin: 0 0 14px; border-radius: 16px; background: #FFF7ED; border: 1px solid #FED7AA; }
.push-banner span { display: block; color: var(--muted); font-size: .9rem; margin-top: 2px; }

/* ---------- Pannello Piattaforma: fasi delle cliniche e iscritti ---------- */
.funnel { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin: 4px 0 12px; }
.funnel-step { display: flex; flex-direction: column; align-items: center; min-width: 96px; padding: 8px 12px; border-radius: 12px; background: #f8fafc; border: 1px solid var(--line); }
.funnel-step b { font-size: 1.35rem; color: var(--ink); }
.funnel-step span { font-size: 12px; color: var(--muted); text-align: center; }
.funnel-arrow { color: var(--muted); font-weight: 800; }
.pill.st-empty { background: #F1F5F9; color: #475569; }
.pill.st-started { background: #FFF4DB; color: #7A5300; }
.pill.st-active { background: var(--teal-soft); color: var(--teal-dark); }
.pill.st-room { background: #EDE9FE; color: #5B21B6; }
.pill.st-half { background: #FEE2E2; color: #991B1B; }
.vtable tr.is-half td { background: #FFF7F7; }
.user-filter { margin: 0 0 10px; flex-wrap: wrap; }

/* ---------- FurrFinder per la clinica ---------- */
.ff-cards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.ff-card { border: 1px solid var(--line); border-radius: 14px; padding: 14px; background: #fafbfc; display: flex; flex-direction: column; gap: 6px; }
.ff-card img { width: 42px; height: 42px; object-fit: contain; }
.ff-card strong { font-size: 1.12rem; color: var(--ink); }
.ff-card p { margin: 0; color: var(--muted); font-size: .92rem; line-height: 1.45; }
.ff-big { display: flex; align-items: baseline; gap: 8px; flex-wrap: wrap; }
.ff-big b { font-size: 2.2rem; color: var(--teal-dark); line-height: 1; }
.ff-big span { color: var(--muted); font-weight: 600; }
.ff-bar { height: 12px; border-radius: 999px; background: #eef2f5; overflow: hidden; margin-top: 8px; }
.ff-bar i { display: block; height: 100%; background: linear-gradient(90deg, var(--teal), #7c3aed); border-radius: 999px; }
.ff-month { margin-top: 14px; padding: 12px 14px; border-radius: 12px; background: #EDE9FE; color: #3b1d8f; display: flex; flex-direction: column; gap: 3px; }
.ff-month span { color: #5B21B6; font-size: .92rem; }
.ff-ways { display: flex; flex-direction: column; gap: 14px; }
.ff-way { display: flex; gap: 12px; align-items: flex-start; }
.ff-way p { margin: 4px 0 8px; }
.ff-num { flex-shrink: 0; width: 30px; height: 30px; border-radius: 50%; display: grid; place-items: center; background: var(--orange); color: #fff; font-weight: 800; }
.ff-code { font: 800 1.3rem/1 ui-monospace, Menlo, Consolas, monospace; letter-spacing: .15em; color: var(--ink); }
.ff-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 6px; }
.ff-list li { display: flex; align-items: center; gap: 10px; justify-content: space-between; padding: 8px 12px; border: 1px solid var(--line); border-radius: 12px; }
.ff-list .main { display: flex; flex-direction: column; min-width: 0; }
.ff-list .main span { color: var(--muted); font-size: .88rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ff-badge { display: inline-flex; align-items: center; gap: 4px; padding: .4em .8em; border-radius: 999px; background: #EDE9FE; color: #5B21B6; font-weight: 700; font-size: .88rem; }
.ff-badge-sm { font-size: .72rem; padding: .15em .55em; vertical-align: 1px; }
.chip.ff-chip { background: #EDE9FE; color: #5B21B6; }
.ff-nudge { margin-top: 10px; padding: 10px 12px; border-radius: 12px; background: #EDE9FE; color: #3b1d8f; display: flex; gap: 10px; align-items: center; justify-content: space-between; flex-wrap: wrap; font-size: .92rem; }
@media (max-width: 720px) { .ff-cards { grid-template-columns: 1fr; } }

/* ---------- Presentazioni brevi ---------- */
.intro-dlg { width: min(440px, calc(100vw - 1.5rem)); padding: 0; overflow: hidden; border-radius: 22px; }
.intro-x { position: absolute; top: 8px; right: 10px; z-index: 2; background: rgba(255,255,255,.8); border: 0; border-radius: 50%; width: 34px; height: 34px; font-size: 22px; line-height: 1; cursor: pointer; color: var(--ink); }
.intro-stage { min-height: 372px; }
.intro-slide { display: flex; flex-direction: column; align-items: center; text-align: center; padding: 0 26px 6px; animation: intro-in .28s ease-out; }
.intro-slide.from-left { animation-name: intro-in-left; }
.intro-art { width: calc(100% + 52px); display: grid; place-items: center; padding: 34px 0 26px; margin-bottom: 14px; background: var(--intro-tint); }
.intro-disc { width: 150px; height: 150px; border-radius: 50%; background: #fff; display: grid; place-items: center; box-shadow: 0 10px 28px rgba(3,56,96,.14); }
.intro-art img { width: 104px; height: 104px; object-fit: contain; border-radius: 16px; }
.intro-kicker { font-size: 12px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: var(--orange); }
.intro-slide h2 { margin: 4px 0 8px; font-size: 1.6rem; line-height: 1.15; color: var(--ink); }
.intro-slide p { margin: 0; font-size: 1.05rem; line-height: 1.45; color: var(--muted); max-width: 340px; }
.intro-dots { display: flex; justify-content: center; gap: 7px; padding: 14px 0 4px; }
.intro-dots button { width: 8px; height: 8px; padding: 0; border: 0; border-radius: 999px; background: #cbd5e1; cursor: pointer; transition: width .2s, background .2s; }
.intro-dots button[aria-selected="true"] { width: 22px; background: var(--teal); }
.intro-foot { display: flex; flex-direction: column; gap: 12px; padding: 10px 18px 16px; }
.intro-nav { display: flex; justify-content: space-between; gap: 10px; }
.intro-nav .btn { min-width: 120px; }
.intro-nav [data-next] { margin-left: auto; }
.intro-never { display: flex; align-items: center; justify-content: center; gap: 6px; font-size: 13px; color: var(--muted); cursor: pointer; }
.intro-never input { width: 16px; height: 16px; margin: 0; }
@keyframes intro-in { from { opacity: 0; transform: translateX(24px); } to { opacity: 1; transform: none; } }
@keyframes intro-in-left { from { opacity: 0; transform: translateX(-24px); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) { .intro-slide { animation: none; } }

/* ---------- Messaggi ---------- */
.msg-wrap { max-width: 1100px; }
.msg-layout { display: grid; grid-template-columns: minmax(260px, 340px) 1fr; gap: 14px; align-items: start; }
.msg-list { background: var(--white); border-radius: var(--radius-lg); box-shadow: var(--shadow); padding: 8px; max-height: 72vh; overflow: auto; }
.conv { display: grid; gap: 2px; width: 100%; text-align: left; border: 0; background: none; font: inherit; padding: 10px 12px; border-radius: 12px; cursor: pointer; position: relative; }
.conv:hover { background: #f5f7f9; }
.conv.is-open { background: var(--teal-soft); }
.conv-top { display: flex; justify-content: space-between; gap: 8px; align-items: baseline; }
.conv-top strong { color: var(--ink); }
.conv-when { font-size: 12px; color: var(--muted); flex-shrink: 0; }
.conv-sub, .conv-prev { font-size: .86rem; color: var(--muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.conv.is-unread .conv-prev { color: var(--ink); font-weight: 600; }
.conv-badge { position: absolute; right: 10px; bottom: 10px; min-width: 20px; height: 20px; padding: 0 6px; border-radius: 999px; background: var(--orange); color: #fff; font-size: 12px; font-weight: 700; display: grid; place-items: center; }
.msg-pane { background: var(--white); border-radius: var(--radius-lg); box-shadow: var(--shadow); display: flex; flex-direction: column; min-height: 420px; max-height: 72vh; }
.msg-pane:empty::after { content: 'Scegli una conversazione.'; color: var(--muted); margin: auto; }
.msg-head { display: flex; align-items: center; gap: 10px; padding: 12px 16px; border-bottom: 1px solid var(--line); }
.msg-head strong { display: block; color: var(--ink); }
.msg-head .muted { font-size: .85rem; }
.msg-back { display: none; }
.msg-scroll { flex: 1; overflow-y: auto; padding: 14px 16px; display: flex; flex-direction: column; gap: 8px; }
.msg-day { align-self: center; font-size: 12px; color: var(--muted); background: #f1f5f9; padding: 2px 10px; border-radius: 999px; margin: 6px 0; }
.bubble { max-width: 76%; padding: 8px 12px; border-radius: 16px; position: relative; }
.bubble p { margin: 0; white-space: pre-wrap; overflow-wrap: anywhere; }
.bubble.mine { align-self: flex-end; background: var(--teal); color: #fff; border-bottom-right-radius: 5px; }
.bubble.mine a { color: #ccfbf1; }
.bubble.theirs { align-self: flex-start; background: #f1f5f9; color: var(--ink); border-bottom-left-radius: 5px; }
.bubble.theirs.role-admin { background: #EDE9FE; }
.bubble-who { display: block; font-size: 12px; font-weight: 700; color: var(--teal-dark); margin-bottom: 2px; }
.bubble.role-admin .bubble-who { color: #5B21B6; }
.bubble-when { display: block; font-size: 11px; opacity: .7; text-align: right; margin-top: 2px; }
.msg-form { display: flex; gap: 8px; align-items: flex-end; padding: 10px 16px 4px; border-top: 1px solid var(--line); }
.msg-form textarea { flex: 1; resize: none; min-height: 44px; max-height: 160px; }
.msg-note { margin: 0 16px 10px; color: var(--muted); }
.msg-empty { padding: 16px; }
.nav-dot { position: absolute; top: 6px; right: 8px; min-width: 18px; height: 18px; padding: 0 5px; border-radius: 999px; background: var(--orange); color: #fff; font-size: 11px; font-weight: 800; display: grid; place-items: center; }
.vr-nav-item { position: relative; }
@media (max-width: 820px) {
  .msg-layout { grid-template-columns: 1fr; }
  .msg-pane { display: none; max-height: none; }
  .msg-back { display: inline-flex; }
  body.msg-open .msg-list { display: none; }
  body.msg-open .msg-pane { display: flex; min-height: 60vh; }
  .bubble { max-width: 88%; }
}
.vr-tab { position: relative; }
.vr-tab .nav-dot { top: 2px; right: 10px; }
.msg-support { background: #EDE9FE !important; }
.msg-support .conv-top strong::before { content: '🛟 '; }
.id-box { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; padding: 12px 14px; margin: 0 0 14px; border-radius: 12px; background: var(--teal-soft); border: 1px solid #ccfbf1; }
.id-box p { flex: 1 1 240px; color: var(--muted); }
.id-label { display: block; font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; color: var(--teal-dark); }
.id-code { font: 800 1.35rem/1.1 ui-monospace, Menlo, Consolas, monospace; letter-spacing: .08em; color: var(--ink); }

/* ---------- Pannello: ricerca per codice e schede complete ---------- */
.find-bar { position: relative; margin: 0 0 12px; }
.find-bar input { width: 100%; font-size: 1rem; padding: 12px 14px; border-radius: 14px; border: 1px solid var(--line); background: var(--white); }
.find-res { position: absolute; z-index: 20; left: 0; right: 0; top: calc(100% + 4px); background: var(--white); border: 1px solid var(--line); border-radius: 14px; box-shadow: 0 16px 40px rgba(3,56,96,.18); max-height: 320px; overflow: auto; }
.find-res button { display: block; width: 100%; text-align: left; border: 0; background: none; font: inherit; padding: 10px 14px; cursor: pointer; }
.find-res button:hover { background: var(--teal-soft); }
.id-chip { display: inline-block; font: 700 12px/1.4 ui-monospace, Menlo, Consolas, monospace; letter-spacing: .06em; background: var(--teal-soft); color: var(--teal-dark); padding: 1px 7px; border-radius: 999px; margin-right: 6px; vertical-align: 2px; }
.card-dlg { width: min(760px, calc(100vw - 1.5rem)); max-height: 86vh; overflow: auto; }
.card-dlg h3 { margin: 18px 0 6px; font-size: 1rem; color: var(--teal-dark); }
.kv { display: grid; grid-template-columns: minmax(130px, auto) 1fr; gap: 4px 14px; margin: 0; }
.kv dt { color: var(--muted); font-size: .9rem; }
.kv dd { margin: 0; color: var(--ink); }
.card-nums { display: grid; grid-template-columns: repeat(auto-fill, minmax(110px, 1fr)); gap: 8px; }
.card-nums div { background: #f8fafc; border-radius: 10px; padding: 8px 10px; }
.card-nums b { display: block; font-size: 1.25rem; color: var(--ink); }
.card-nums span { font-size: 12px; color: var(--muted); }
.card-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 6px; }
.card-list li { border: 1px solid var(--line); border-radius: 10px; padding: 8px 12px; font-size: .92rem; }
.card-list li button { width: 100%; text-align: left; border: 0; background: none; font: inherit; cursor: pointer; padding: 0; }

/* ---------- Pannello amministratore ---------- */
.vr-platform .sec-title { margin: 0 0 10px; font-size: 1.3rem; color: var(--ink); }
.vr-platform .vr-logo-title { color: #fff; }
@media (max-width: 1024px) { .vr-platform .vr-tb-main img { margin-top: -16px; } }
.ref-line { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.ref-line b { font: 800 1.05rem/1 ui-monospace, Menlo, Consolas, monospace; letter-spacing: .04em; color: var(--ink); }
.ref-small { display: block; font-size: 12px; color: var(--muted); margin-top: 2px; }
.ref-small b { font-family: ui-monospace, Menlo, Consolas, monospace; letter-spacing: .03em; color: var(--ink); }
.find-ref { padding: 10px 14px; border-top: 1px solid var(--line); }

/* ===================== Cassa e fatture ===================== */
.cash-layout { display: grid; grid-template-columns: minmax(0, 1fr) 320px; gap: 16px; align-items: start; }
.cash-side { position: sticky; top: 76px; }
@media (max-width: 980px) { .cash-layout { grid-template-columns: 1fr; } .cash-side { position: static; } }
.inv-lines { width: 100%; border-collapse: collapse; }
.inv-lines thead { display: none; }
.inv-lines tr { display: grid; grid-template-columns: 76px 104px minmax(110px, 1fr) 118px 64px 96px 34px; gap: 6px 8px; align-items: end; padding: 10px 0; border-bottom: 1px solid var(--line); }
.inv-lines td { padding: 0; border: 0; min-width: 0; }
.inv-lines .c-desc { grid-column: 1 / 7; }
.inv-lines .c-x { grid-column: 7; grid-row: 1; align-self: center; }
.inv-lines .cap { display: block; font-size: 11px; color: var(--muted); font-weight: 600; margin-bottom: 2px; }
.inv-lines input, .inv-lines select { width: 100%; min-width: 0; padding: 7px 8px; font-size: 14px; }
.inv-lines .c-desc input { font-weight: 600; }
.inv-lines .c-en { text-align: center; padding-bottom: 8px; }
.inv-lines .c-en .cap { margin-bottom: 6px; }
.inv-lines .c-amt { text-align: right; white-space: nowrap; padding-bottom: 9px; font-weight: 700; }
.inv-lines .x-btn { border: 0; background: none; font-size: 22px; color: var(--muted); cursor: pointer; padding: 4px 6px; line-height: 1; }
.inv-lines .x-btn:hover { color: var(--danger); }
@media (max-width: 640px) {
  .inv-lines tr { grid-template-columns: 1fr 1fr 1fr 34px; }
  .inv-lines .c-desc { grid-column: 1 / 4; }
  .inv-lines .c-x { grid-column: 4; }
  .inv-lines .c-qty { grid-column: 1; } .inv-lines .c-price { grid-column: 2; } .inv-lines .c-kind { grid-column: 3 / 5; }
  .inv-lines .c-vat { grid-column: 1; } .inv-lines .c-en { grid-column: 2; text-align: left; } .inv-lines .c-amt { grid-column: 3 / 5; }
}
.quick-add { display: flex; flex-wrap: wrap; gap: 6px; margin: 4px 0 12px; }
.quick-add button { font: inherit; font-size: 13px; border: 1px solid var(--teal-line); background: var(--teal-soft); color: var(--teal-dark); border-radius: 999px; padding: 5px 11px; cursor: pointer; }
.quick-add button:hover { background: #ccfbf1; }
.quick-add button small { color: var(--muted); margin-left: 4px; }
.sum-box { background: #fff; border-radius: var(--radius-lg); box-shadow: var(--shadow); padding: 16px; }
.sum-box dl { display: grid; grid-template-columns: 1fr auto; gap: 6px 12px; margin: 0 0 12px; font-size: 14px; }
.sum-box dt { color: var(--muted); } .sum-box dd { margin: 0; text-align: right; font-variant-numeric: tabular-nums; }
.sum-box .tot { font-size: 26px; font-weight: 800; color: var(--ink); text-align: right; margin: 6px 0 14px; font-variant-numeric: tabular-nums; }
.sum-box .btn { width: 100%; justify-content: center; }
.pay-chips { display: flex; flex-wrap: wrap; gap: 6px; }
.pay-chips label { display: inline-flex; align-items: center; gap: 6px; border: 1px solid var(--line); border-radius: 999px; padding: 6px 12px; cursor: pointer; font-size: 14px; background: #fff; }
.pay-chips input { position: absolute; opacity: 0; pointer-events: none; }
.pay-chips label:has(input:checked) { border-color: var(--teal); background: var(--teal-soft); color: var(--teal-dark); font-weight: 600; }
.pay-chips label:has(input:focus-visible) { outline: 2px solid var(--teal); outline-offset: 2px; }
.sugg { position: relative; }
.sugg-list { position: absolute; z-index: 20; left: 0; right: 0; top: 100%; background: #fff; border: 1px solid var(--line); border-radius: 10px; box-shadow: 0 10px 30px rgba(15, 23, 42, .12); max-height: 280px; overflow-y: auto; margin-top: 4px; }
.sugg-list button { display: block; width: 100%; text-align: left; border: 0; background: none; padding: 9px 12px; font: inherit; cursor: pointer; border-bottom: 1px solid var(--line); }
.sugg-list button:hover, .sugg-list button[aria-selected="true"] { background: var(--teal-soft); }
.sugg-list small { color: var(--muted); }
.field-ok { color: #047857; font-size: 12px; } .field-bad { color: var(--danger); font-size: 12px; }
.inv-paper { background: #fff; border-radius: var(--radius-lg); box-shadow: var(--shadow); padding: clamp(16px, 4vw, 34px); max-width: 860px; }
.inv-paper .inv-head { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 10px 20px; border-bottom: 2px solid var(--teal); padding-bottom: 12px; margin-bottom: 14px; }
.inv-paper .inv-title { font-size: 20px; font-weight: 800; color: var(--teal-dark); margin: 0; }
.inv-paper .inv-to { border: 1px solid var(--line); border-radius: 10px; padding: 10px 14px; margin-bottom: 14px; }
.inv-paper table { width: 100%; border-collapse: collapse; font-size: 14px; }
.inv-paper th { text-align: left; font-size: 12px; color: var(--muted); padding: 6px 4px; border-bottom: 1px solid var(--line); }
.inv-paper td { padding: 7px 4px; border-bottom: 1px solid var(--line); }
.inv-paper .r { text-align: right; white-space: nowrap; font-variant-numeric: tabular-nums; }
.inv-paper .inv-sum { margin-left: auto; max-width: 320px; margin-top: 12px; }
.inv-paper .inv-sum div { display: flex; justify-content: space-between; padding: 3px 0; font-size: 14px; color: var(--muted); }
.inv-paper .inv-sum .big { color: var(--ink); font-size: 19px; font-weight: 800; border-top: 2px solid var(--teal); margin-top: 6px; padding-top: 8px; }
.inv-stamp { display: inline-block; transform: rotate(-6deg); border: 3px solid var(--danger); color: var(--danger); font-weight: 900; letter-spacing: .08em; padding: 4px 12px; border-radius: 8px; }
.cash-row-unpaid td:first-child { box-shadow: inset 3px 0 var(--amber); }
.cash-row-void td { color: var(--muted); text-decoration: line-through; }
.cash-row-void td:last-child, .cash-row-void td:nth-last-child(2) { text-decoration: none; }
.pay-split { display: flex; flex-wrap: wrap; gap: 6px 14px; font-size: 13px; color: var(--muted); margin: -4px 0 12px; }
.pay-split b { color: var(--ink); font-weight: 700; }
.vtable tr.row-sel td { background: var(--teal-soft); }
/* Benvenuto: tre percorsi e sotto-moduli */
.paths-3 { grid-template-columns: repeat(3, 1fr); }
.paths-small .path { padding: 14px; }
.paths-small .path strong { font-size: 15px; }
.sub-form { margin-top: 14px; padding-top: 14px; border-top: 1px solid var(--line); }
@media (max-width: 760px) { .paths-3 { grid-template-columns: 1fr; } }
.code-box { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.code-box .code { font-size: 26px; font-weight: 800; letter-spacing: .08em; color: var(--teal); font-variant-numeric: tabular-nums; }

/* ---------- Messaggi avanzati (patch 32) ---------- */
.msg-list { padding: 0; display: flex; flex-direction: column; }
.msg-tools { position: sticky; top: 0; z-index: 2; background: var(--white); padding: 10px 10px 8px; border-bottom: 1px solid var(--line); display: grid; gap: 8px; border-radius: var(--radius-lg) var(--radius-lg) 0 0; }
.msg-q { width: 100%; font: inherit; padding: .5em .8em; border: 2px solid var(--line); border-radius: 999px; background: #f8fafc; }
.msg-q:focus { border-color: var(--teal); background: var(--white); outline: none; }
.msg-filters { display: flex; gap: 4px; flex-wrap: wrap; }
.msg-filters button { font: 600 12.5px var(--font); color: var(--muted); background: transparent; border: 1px solid var(--line); border-radius: 999px; padding: 4px 10px; cursor: pointer; }
.msg-filters button[aria-pressed="true"] { background: var(--teal); border-color: var(--teal); color: #fff; }
.msg-filters .n { font-weight: 800; }
.msg-bulk { display: flex; gap: 6px; flex-wrap: wrap; align-items: center; }
.msg-bulk .btn-small { min-height: 32px; padding: 4px 10px; }
.msg-bulk-act { display: flex; gap: 6px; flex-wrap: wrap; margin-left: auto; }
.msg-selall { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; font-weight: 600; color: var(--ink); }
.msg-flash { margin: 0; font-size: 13px; }
.msg-convs { padding: 6px 8px 8px; overflow: auto; }
.msg-none { padding: 14px 8px; text-align: center; }
.conv { outline-offset: -2px; }
.conv-check { position: absolute; left: 10px; top: 13px; width: 17px; height: 17px; accent-color: var(--teal); pointer-events: none; }
.conv:has(.conv-check) { padding-left: 36px; }
.conv.is-sel { background: var(--teal-soft); box-shadow: inset 0 0 0 1px var(--teal-line); }
.conv-clip { margin-right: 3px; }
.conv-flags:empty { display: none; }
.conv-flags { display: flex; gap: 4px; margin-top: 2px; }
.conv-tag { font-size: 11px; font-weight: 700; padding: 1px 7px; border-radius: 999px; background: #f1f5f9; color: var(--muted); }
.conv-tag.tag-reply { background: var(--orange-soft); color: #9a3412; }
.msg-head { flex-wrap: wrap; }
.msg-head-t { flex: 1; min-width: 0; }
.msg-head-act { display: flex; gap: 6px; }
.msg-head-act .btn-small { min-height: 32px; padding: 4px 10px; }
.bubble.hit { box-shadow: 0 0 0 3px #fde68a; }
.bubble .tick { font-size: 11px; letter-spacing: -2px; margin-left: 2px; opacity: .85; }
.bubble .tick.seen { color: #a5f3fc; opacity: 1; font-weight: 800; }
.att-grid { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 6px; }
.att-img { display: block; width: 132px; height: 132px; border-radius: 10px; overflow: hidden; background: rgba(0,0,0,.08); }
.att-img img { width: 100%; height: 100%; object-fit: cover; display: block; }
.att-file { display: flex; align-items: center; gap: 8px; padding: 8px 10px; border-radius: 10px; background: rgba(255,255,255,.85); color: var(--ink) !important; text-decoration: none; max-width: 260px; }
.bubble.theirs .att-file { background: var(--white); }
.att-file svg { width: 22px; height: 22px; flex: none; stroke: #b91c1c; fill: none; stroke-width: 1.7; }
.att-file b { display: block; font-size: 13px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 190px; }
.att-file small { color: var(--muted); font-size: 12px; }
.msg-attach { display: flex; flex-wrap: wrap; gap: 6px; padding: 8px 16px 0; border-top: 1px solid var(--line); }
.msg-attach + .msg-form { border-top: 0; }
.att-chip { display: inline-flex; align-items: center; gap: 5px; font-size: 13px; padding: 4px 6px 4px 10px; border-radius: 999px; background: var(--teal-soft); border: 1px solid var(--teal-line); max-width: 100%; }
.att-chip small { color: var(--muted); }
.att-chip button { border: 0; background: none; font-size: 18px; line-height: 1; cursor: pointer; color: var(--muted); padding: 0 4px; }
.att-chip.up { opacity: .7; }
.msg-icon-btn { flex: none; width: 44px; height: 44px; display: grid; place-items: center; border: 1px solid var(--line); background: var(--white); border-radius: 12px; cursor: pointer; color: var(--teal-dark); }
.msg-icon-btn:hover { background: var(--teal-soft); border-color: var(--teal-line); }
.msg-icon-btn svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.tpl-anchor { position: relative; flex: none; }
.tpl-pop { position: absolute; bottom: calc(100% + 8px); left: 0; z-index: 20; width: min(360px, 86vw); max-height: 340px; overflow: auto; background: var(--white); border: 1px solid var(--line); border-radius: 12px; box-shadow: 0 12px 32px rgba(15,23,42,.18); padding: 4px; }
.tpl-pop-h { display: flex; justify-content: space-between; align-items: center; padding: 6px 8px; }
.link-btn { border: 0; background: none; color: var(--teal-dark); font: 600 13px var(--font); cursor: pointer; text-decoration: underline; }
.tpl-item { display: block; width: 100%; text-align: left; border: 0; background: none; padding: 8px 10px; border-radius: 8px; cursor: pointer; font: inherit; }
.tpl-item:hover { background: var(--teal-soft); }
.tpl-item b { display: block; font-size: 14px; color: var(--ink); }
.tpl-item span { display: block; font-size: 12.5px; color: var(--muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.msg-dlg label { display: block; font-weight: 600; font-size: 14px; margin: 10px 0 4px; }
.msg-dlg input:not([type]), .msg-dlg input[type="search"], .msg-dlg textarea { width: 100%; }
.msg-dlg-wide { width: min(760px, calc(100vw - 2rem)); }
.tpl-list { display: grid; gap: 6px; margin-bottom: 12px; max-height: 40vh; overflow: auto; }
.tpl-row { display: flex; gap: 10px; align-items: flex-start; justify-content: space-between; padding: 8px 10px; border: 1px solid var(--line); border-radius: 10px; }
.tpl-row strong { display: block; }
.tpl-row span { display: block; font-size: 13px; color: var(--muted); white-space: pre-wrap; }
.tpl-row-act { display: flex; gap: 6px; flex: none; }
.tpl-empty { padding: 10px; text-align: center; border: 2px dashed var(--line); border-radius: 10px; }
.grp-pick { border: 1px solid var(--line); border-radius: 12px; padding: 10px; }
.grp-tools { display: grid; gap: 8px; }
.grp-tools .chips { justify-content: flex-start; }
.grp-tools .chip { cursor: pointer; background: var(--white); border-color: var(--line); color: var(--muted); font: 600 12.5px var(--font); }
.grp-tools .chip.is-on { background: var(--teal); border-color: var(--teal); color: #fff; }
.msg-dlg .grp-all { display: flex; align-items: center; gap: 8px; margin: 10px 0 6px; font-size: 13px; }
.grp-list { max-height: 34vh; overflow: auto; display: grid; gap: 2px; }
.msg-dlg .grp-row { display: flex; align-items: center; gap: 10px; margin: 0; padding: 7px 8px; border-radius: 8px; font-weight: 400; cursor: pointer; }
.grp-row:hover { background: #f8fafc; }
.grp-row input { width: 18px; height: 18px; accent-color: var(--teal); flex: none; }
.grp-row strong { display: block; font-size: 14px; }
.grp-row small { display: block; color: var(--muted); font-size: 12.5px; }
.grp-text { display: flex; gap: 8px; align-items: flex-end; position: relative; }
.grp-text textarea { flex: 1; }
.grp-text .tpl-pop { left: auto; right: 0; }
.grp-foot { margin-top: 12px; }
@media (max-width: 820px) {
  .msg-list { max-height: none; }
  .msg-head-act { width: 100%; justify-content: flex-end; }
  .att-img { width: 110px; height: 110px; }
}

/* ---------- FurrFinder: spese per il 730 (patch 33) ---------- */
.year-chips { justify-content: flex-start; margin: 4px 0 12px; }
.year-chips .chip { cursor: pointer; font-size: 14px; padding: 5px 14px; background: var(--white); border-color: var(--line); color: var(--muted); }
.year-chips .chip.is-on { background: var(--teal); border-color: var(--teal); color: #fff; }
.tax-head { display: flex; flex-direction: column; gap: 2px; }
.tax-big { font-size: 2rem; line-height: 1.1; color: var(--ink); }
.tax-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 8px; margin-top: 12px; }
.tax-grid > div { background: #f8fafc; border-radius: 10px; padding: 10px 12px; }
.tax-grid span { display: block; font-size: 12.5px; color: var(--muted); }
.tax-grid b { font-size: 1.15rem; color: var(--ink); }
.tax-green { color: #15803d !important; }
.exp-list { list-style: none; margin: 0; padding: 0; }
.exp-list li { display: flex; gap: 10px; justify-content: space-between; align-items: center; padding: 10px 0; border-top: 1px solid var(--line); }
.exp-list li:first-child { border-top: 0; }
.exp-main { min-width: 0; display: grid; gap: 1px; }
.exp-main strong { color: var(--ink); }
.exp-main span { font-size: 13px; color: var(--muted); }
.exp-ts { color: #15803d; font-weight: 600; }
.exp-side { display: flex; flex-direction: column; align-items: flex-end; gap: 4px; flex: none; }
.exp-side b { font-size: 1.05rem; color: var(--ink); }
.exp-neg { color: #b91c1c !important; }
.tax-help summary { cursor: pointer; }
.tax-help p { margin: 10px 0 0; }
.home-tax { display: flex; gap: 12px; align-items: center; justify-content: space-between; text-decoration: none; color: inherit; }
.home-tax b { display: block; font-size: 1.35rem; color: var(--ink); }
.home-tax span { font-size: 13px; color: var(--muted); }

/* ---------- Telefono: ritocchi di fruibilità (07g) ---------- */
@media (max-width: 820px) {
  /* conversazione aperta: tutto lo schermo alla chat, il campo di testo sempre in vista */
  body.msg-open .msg-wrap .page-head { display: none; }
  body.msg-open .msg-pane { height: calc(100dvh - 160px - env(safe-area-inset-bottom, 0px)); min-height: 340px; }
  body[data-shell="owner"].msg-open .msg-pane { height: calc(100dvh - 176px - env(safe-area-inset-bottom, 0px)); }
  .msg-filters button { min-height: 34px; padding: 6px 12px; font-size: 13.5px; }
  .msg-tools input[type="search"] { font-size: 16px; }
}
@media (max-width: 640px) {
  /* Cassa: ogni fattura diventa una scheda leggibile, senza scorrere di lato */
  .cash-tbl thead { display: none; }
  .cash-tbl, .cash-tbl tbody { display: block; }
  .cash-tbl tr { display: grid; grid-template-columns: 1fr auto; gap: 3px 12px; padding: 11px 12px; border-bottom: 1px solid var(--line); }
  .cash-tbl td { display: block; padding: 0; border: 0; min-width: 0 !important; }
  .cash-tbl td:nth-child(1) { order: 1; }
  .cash-tbl td:nth-child(4) { order: 2; font-size: 15px; font-weight: 700; }
  .cash-tbl td:nth-child(3) { order: 3; }
  .cash-tbl td:nth-child(2) { order: 4; text-align: right; color: var(--muted); }
  .cash-tbl td:nth-child(5) { order: 5; color: var(--muted); }
  .cash-tbl td:nth-child(6) { order: 6; text-align: right; }
  .cash-tbl td:nth-child(7) { display: none; }
  .cash-tbl td[colspan] { grid-column: 1 / -1; }
  .cash-tbl tr.cash-row-unpaid { box-shadow: inset 3px 0 var(--amber); }
  .cash-tbl tr.cash-row-unpaid td:first-child { box-shadow: none; }
  /* i campi di testo a 16px: il telefono non ingrandisce la pagina quando li tocchi */
  input[type="text"], input[type="search"], input[type="email"], input[type="tel"], input[type="number"], input[type="date"], input[type="time"], input:not([type]), select, textarea { font-size: 16px; }
}

/* ---------- Utilità ---------- */
.visually-hidden { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.notice-warn { background: #fef3c7; color: #92400e; }

/* ---------- Visite a domicilio (patch 36) ---------- */
.addr-row { display: flex; gap: 8px; align-items: center; }
.addr-row input { flex: 1; min-width: 0; }
.cal-appt.is-home { border-left-style: dashed; }
.home-tag { font-style: normal; font-weight: 800; color: var(--teal-dark, #0f766e); }
.home-addr { display: block; color: var(--muted); font-size: .85rem; margin-top: 2px; }
.home-addr a { color: inherit; }
.now-addr { margin-top: 8px; padding: 8px 10px; border-radius: 10px; background: var(--teal-soft, #E6F4F2); color: var(--ink, #0b2545); font-weight: 600; }
.now-addr small { display: block; font-weight: 500; color: var(--muted); }
.arrive { position: relative; display: inline-block; }
.arrive > summary { list-style: none; cursor: pointer; }
.arrive > summary::-webkit-details-marker { display: none; }
.arrive[open] > summary { background: var(--teal-soft, #E6F4F2); }
.arrive-menu { position: absolute; z-index: 5; top: calc(100% + 4px); left: 0; display: flex; flex-direction: column; min-width: 180px; padding: 6px; border: 1px solid var(--line); border-radius: 12px; background: #fff; box-shadow: 0 10px 30px rgba(3,56,96,.15); }
.arrive-menu a { padding: 8px 10px; border-radius: 8px; color: var(--ink, #0b2545); text-decoration: none; font-weight: 600; }
.arrive-menu a:hover { background: #f3f4f6; }
.route-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 8px; }
.route-stop { display: flex; gap: 10px; align-items: flex-start; padding: 10px 12px; border: 1px solid var(--line); border-radius: 12px; background: #f9fafb; }
.route-stop.is-past { opacity: .6; }
.route-num { flex: 0 0 28px; height: 28px; border-radius: 50%; display: grid; place-items: center; font-weight: 800; font-size: .85rem; color: #fff; background: var(--teal, #34AEA7); }
.route-stop.is-past .route-num { background: #8193A3; }
.route-main { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.route-main strong { color: var(--ink, #0b2545); }
.route-main span { color: var(--muted); font-size: .88rem; overflow-wrap: anywhere; }
.route-main .late { color: #b45309; }
.route-acts { display: flex; gap: 6px; flex-wrap: wrap; justify-content: flex-end; }
@media (max-width: 560px) {
  .route-stop { flex-wrap: wrap; }
  .route-acts { width: 100%; display: grid; grid-template-columns: 1fr 1fr; gap: 6px; }
  .route-acts > .btn, .route-acts > .arrive, .route-acts > .arrive > summary { width: 100%; }
}

/* ---------- Turni del personale (patch 37) ---------- */
.tw-panel { padding: 0; overflow: hidden; }
.tw-grid { display: flex; flex-direction: column; }
.tw-row { display: grid; grid-template-columns: minmax(150px, 1.3fr) repeat(7, minmax(0, 1fr)); border-bottom: 1px solid var(--line); }
.tw-row:last-child { border-bottom: 0; }
.tw-row.is-me .tw-name { box-shadow: inset 3px 0 0 var(--orange); }
.tw-row.is-gone { opacity: .7; }
.tw-name { padding: 10px 12px; font-weight: 700; color: var(--ink); display: flex; flex-direction: column; justify-content: center; min-width: 0; overflow-wrap: anywhere; }
.tw-name small { font-weight: 500; color: var(--muted); font-size: 12px; }
.tw-head, .tw-foot { background: #f9fafb; }
.tw-head .tw-name, .tw-foot .tw-name { font-size: 12px; font-weight: 600; color: var(--muted); text-transform: uppercase; letter-spacing: .05em; }
.tw-dh { padding: 8px 6px; text-align: center; font-size: 13px; color: var(--muted); border-left: 1px solid var(--line); }
.tw-dh b { color: var(--ink); font-size: 15px; }
.tw-dh.is-today { background: var(--orange-soft); color: #9a3412; }
.tw-foot .tw-dh { font-weight: 700; color: var(--ink); }
.tw-foot .tw-dh.is-zero { color: #b91c1c; }
.tw-cell { position: relative; border-left: 1px solid var(--line); padding: 6px 5px 26px; min-height: 64px; display: flex; flex-direction: column; gap: 4px; cursor: pointer; min-width: 0; }
.tw-cell.is-today { background: #fffaf5; }
.tw-cell:hover { background: var(--teal-soft); }
.tw-add { position: absolute; left: 50%; bottom: 4px; transform: translateX(-50%); width: 26px; height: 20px; line-height: 18px; border-radius: 999px; border: 1px dashed #cbd5e1; background: #fff; color: var(--muted); font: inherit; font-weight: 700; cursor: pointer; opacity: 0; transition: opacity .12s; }
.tw-cell:hover .tw-add, .tw-add:focus-visible { opacity: 1; }
@media (hover: none) { .tw-add { opacity: .7; } }
.tw-chip { display: flex; flex-direction: column; align-items: flex-start; gap: 1px; width: 100%; text-align: left; font: inherit; font-size: 12.5px; line-height: 1.25; padding: 5px 7px; border-radius: 8px; border: 1px solid; cursor: pointer; min-width: 0; }
.tw-chip .tw-t { font-weight: 700; white-space: nowrap; }
.tw-chip .tw-kl { font-size: 11px; font-weight: 600; }
.tw-note { font-size: 11.5px; opacity: .85; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 100%; }
.tw-k-turno { background: var(--teal-soft); border-color: #99f6e4; color: var(--teal-dark); }
.tw-k-reperibilita { background: #eef2ff; border-color: #c7d2fe; color: #3730a3; }
.tw-k-assenza { background: #f3f4f6; border-color: #d1d5db; color: #4b5563; background-image: repeating-linear-gradient(135deg, transparent 0 6px, rgba(0,0,0,.035) 6px 12px); }
.tw-chip:hover, .tw-line:hover { filter: brightness(.97); }
.tw-legend { display: flex; gap: 8px; flex-wrap: wrap; padding: 10px 12px; border-top: 1px solid var(--line); font-size: 12px; }
.tw-legend span { padding: 2px 9px; border-radius: 999px; border: 1px solid; font-weight: 600; }
.tw-days { display: none; }
.tw-day { padding: 10px 12px; border-bottom: 1px solid var(--line); }
.tw-day.is-today { background: #fffaf5; }
.tw-day-h { display: flex; align-items: center; justify-content: space-between; gap: 8px; font-weight: 700; color: var(--ink); margin-bottom: 6px; }
.tw-day.is-today .tw-day-h > span::after { content: " · oggi"; color: #9a3412; font-weight: 600; }
html[lang="en"] .tw-day.is-today .tw-day-h > span::after { content: " · today"; }
.tw-line { display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 10px; width: 100%; text-align: left; font: inherit; padding: 8px 10px; border-radius: 10px; border: 1px solid; margin-bottom: 6px; cursor: pointer; }
.tw-line-who { font-weight: 700; }
.tw-line-t { font-weight: 600; }
.tw-line .tw-note { flex-basis: 100%; white-space: normal; }
.tw-empty { color: var(--muted); font-size: 13px; margin: 0; list-style: none; }
.tw-hint { margin: -4px 0 14px; }
.tw-quick { display: flex; flex-wrap: wrap; gap: 6px; }
.tw-quick:empty { display: none; }
.tw-q { font: inherit; font-size: 13px; font-weight: 600; padding: 6px 12px; border-radius: 999px; border: 1px solid var(--line); background: #fff; color: var(--ink); cursor: pointer; min-height: 36px; }
.tw-q small { color: var(--muted); font-weight: 500; }
.tw-q:hover { background: var(--teal-soft); border-color: var(--teal-line); }
.tw-dur { display: flex; flex-direction: column; justify-content: flex-end; padding-bottom: 10px; font-weight: 700; color: var(--ink); }
.tw-dur small { font-weight: 600; color: #3730a3; }
.tw-repeat { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 6px; }
.tw-rp { position: relative; cursor: pointer; }
.tw-rp input { position: absolute; opacity: 0; }
.tw-rp span { display: flex; flex-direction: column; align-items: center; padding: 6px 2px; border: 1px solid var(--line); border-radius: 10px; font-size: 12px; color: var(--muted); }
.tw-rp b { color: var(--ink); font-size: 14px; }
.tw-rp input:checked + span { background: var(--teal); border-color: var(--teal); color: #ecfeff; }
.tw-rp input:checked + span b { color: #fff; }
.tw-rp input:focus-visible + span { outline: 3px solid rgba(15,118,110,.45); outline-offset: 2px; }
.tw-rp.is-base span { opacity: .75; }
.tw-log-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap; margin-bottom: 10px; }
.tw-log { list-style: none; margin: 0 0 10px; padding: 0; }
.tw-ev { display: grid; grid-template-columns: 120px 1fr; gap: 4px 12px; padding: 9px 0; border-top: 1px solid var(--line); font-size: 14px; }
.tw-ev:first-child { border-top: 0; }
.tw-ev-when { color: var(--muted); font-size: 13px; white-space: nowrap; }
.tw-ev-what { min-width: 0; overflow-wrap: anywhere; }
.tw-ev-ch, .tw-ev-why { display: block; font-size: 13px; color: #374151; margin-top: 2px; }
.tw-ev-why { color: var(--muted); font-style: italic; }
.tw-ev-eliminato .tw-ev-what { color: #7f1d1d; }
.tw-log-small .tw-ev { grid-template-columns: 1fr; font-size: 13px; padding: 7px 0; }
.tw-mine { position: relative; }
.tw-mine-h { display: flex; justify-content: space-between; align-items: center; gap: 8px; margin-bottom: 4px; }
.tw-mine .tw-ev { border-color: rgba(7,89,133,.15); }
@media (max-width: 820px) {
  .tw-grid { display: none; }
  .tw-days { display: block; }
  .tw-bar { width: 100%; }
  .tw-ev { grid-template-columns: 1fr; gap: 0; }
}
@media print {
  .vr-header, .vr-sidebar, .vr-tabbar, .vr-menu-backdrop, .tw-bar, .tw-hint, .tw-add, #logPanel, #mine, .toast { display: none !important; }
  body, .vr-main { background: #fff; padding: 0; }
  .vr-layout { display: block; }
  .tw-panel { box-shadow: none; border: 1px solid #999; }
  .tw-grid { display: flex !important; }
  .tw-days { display: none !important; }
  .tw-cell { min-height: 40px; padding-bottom: 6px; }
  .tw-chip { break-inside: avoid; }
  .tw-row { break-inside: avoid; }
}

/* =============================================================
   SMARRITO (patch 38) — avviso, avvistamenti, locandina
   ============================================================= */
.lost-pill { color: #fff; }
.lost-aperto { background: #dc2626; }
.lost-ritrovato { background: #16a34a; }
.lost-chiuso, .lost-scaduto { background: #64748b; }
.lost-sospeso { background: #b45309; }
.lost-new { color: #b91c1c; font-weight: 700; font-size: 12px; }
.lost-steps { list-style: none; margin: 0 0 12px; padding: 0; display: flex; gap: 6px; }
.lost-steps li { flex: 1; display: flex; align-items: center; gap: 6px; font-size: 13px; font-weight: 600; color: var(--muted); background: #fff; border-radius: 12px; padding: 8px 10px; box-shadow: var(--shadow); }
.lost-steps li b { display: inline-grid; place-items: center; width: 22px; height: 22px; border-radius: 50%; background: #e5e7eb; color: #374151; font-size: 12px; flex-shrink: 0; }
.lost-steps li.on { color: #991b1b; }
.lost-steps li.on b { background: #dc2626; color: #fff; }
@media (max-width: 480px) { .lost-steps li { font-size: 11.5px; padding: 7px 6px; } }
.lost-map { height: 320px; border-radius: 14px; overflow: hidden; border: 1px solid var(--line); margin: 10px 0 4px; z-index: 0; }
.lost-map-small { height: 260px; }
.lost-search { margin-top: 6px; }
.lost-search input { text-transform: none; letter-spacing: 0; }
.lost-pin { background: none; border: 0; }
.lost-photo-pick { display: flex; gap: 14px; align-items: center; flex-wrap: wrap; }
.lost-photo { width: 120px; height: 120px; border-radius: 16px; overflow: hidden; background: #e2e8f0; display: grid; place-items: center; flex-shrink: 0; }
.lost-photo img { width: 100%; height: 100%; object-fit: cover; }
.lost-nophoto { color: #64748b; font-size: 13px; font-weight: 600; text-align: center; padding: 8px; }
.lost-radio { display: flex; gap: 10px; align-items: flex-start; padding: 12px; border: 1px solid var(--line); border-radius: 14px; margin-bottom: 8px; cursor: pointer; font-weight: 400; }
.lost-radio:has(input:checked) { border-color: #1d6fd6; background: #eff6ff; }
.lost-radio input { width: 20px; height: 20px; margin-top: 2px; flex-shrink: 0; }
.lost-radio b { display: block; color: var(--ink); font-size: 14px; }
.lost-radio small { display: block; color: var(--muted); font-size: 13px; }
.lost-safe-mini { margin-top: 12px; }
.btn.lost-go { background: #dc2626; color: #fff; }
.btn.lost-go:hover { background: #b91c1c; }
.btn.lost-found { background: #16a34a; color: #fff; }
.btn.lost-found:hover { background: #15803d; }
.lost-petpick { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 8px; }
.lost-petbtn { display: flex; align-items: center; gap: 10px; padding: 10px 12px; border: 1px solid var(--line); border-radius: 14px; color: inherit; background: #fff; }
.lost-petbtn:hover { border-color: #dc2626; text-decoration: none; }
.lost-petbtn .avatar { width: 46px; height: 46px; border-radius: 50%; object-fit: cover; flex-shrink: 0; }
.lost-petbtn b { display: block; color: var(--ink); }
.lost-petbtn small { color: #b91c1c; font-weight: 600; }
.lost-petbtn.is-open { border-color: #fecaca; background: #fef2f2; }
.lost-head-top { display: flex; gap: 14px; align-items: center; }
.lost-head-top > img, .lost-head-top > .lost-nophoto { width: 96px; height: 96px; border-radius: 18px; object-fit: cover; flex-shrink: 0; background: #e2e8f0; display: grid; place-items: center; }
.lost-head h1 { margin: 6px 0 4px; font-size: 22px; }
.lost-head p { margin: 0; font-size: 14px; }
.lost-head-aperto { border-top: 5px solid #dc2626; }
.lost-head-ritrovato { border-top: 5px solid #16a34a; }
.lost-stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; margin-top: 12px; }
.lost-stats div { background: #f8fafc; border-radius: 12px; padding: 8px; text-align: center; }
.lost-stats b { display: block; font-size: 20px; color: #0b2545; }
.lost-stats span { font-size: 12px; color: var(--muted); }
.lost-share { display: flex; flex-wrap: wrap; gap: 8px; }
.lost-share .btn { flex: 1 1 130px; }
.btn.lost-btn-wa { background: #25d366; color: #fff; }
.btn.lost-btn-fb { background: #1877f2; color: #fff; }
.btn.lost-btn-tg { background: #229ed9; color: #fff; }
.lost-poster { display: flex; gap: 14px; align-items: flex-start; flex-wrap: wrap; }
.lost-poster-prev { width: 168px; aspect-ratio: 4 / 5; border: 1px solid var(--line); border-radius: 12px; background: #f8fafc; padding: 0; overflow: hidden; cursor: pointer; display: grid; place-items: center; font: inherit; font-size: 12px; }
.lost-poster-prev img { width: 100%; height: 100%; object-fit: cover; display: block; }
.lost-poster-btns { flex: 1 1 220px; display: flex; flex-direction: column; gap: 8px; align-items: stretch; }
.lost-poster-btns .hint-small { margin: 0; }
.lost-dot { display: inline-block; width: 10px; height: 10px; border-radius: 50%; margin: 0 4px 0 8px; vertical-align: middle; }
.lost-dot.red { background: #dc2626; } .lost-dot.amber { background: #f59e0b; } .lost-dot.green { background: #16a34a; }
.lost-avv { border: 1px solid var(--line); border-radius: 14px; padding: 10px 12px; margin-top: 10px; }
.lost-avv.is-new { border-color: #fca5a5; background: #fff7f7; }
.lost-avv-h { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; font-size: 14px; }
.lost-avv p { margin: 6px 0 0; }
.lost-avv-who { font-size: 14px; font-weight: 600; }
.lost-avv-img { display: block; max-width: 220px; max-height: 220px; border-radius: 10px; margin-top: 8px; }
.lost-avv-act { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }
.lost-safe { border-left: 5px solid #f59e0b; }
.lost-safe ul { margin: 0; padding-left: 1.1rem; }
.lost-safe li { margin-bottom: 4px; }
.lost-banner { display: flex; align-items: center; gap: 12px; background: #fef2f2; border: 1px solid #fecaca; border-left: 5px solid #dc2626; border-radius: 16px; padding: 12px 14px; margin-bottom: 12px; color: inherit; }
.lost-banner:hover { text-decoration: none; background: #fee2e2; }
.lost-banner img, .lost-banner .avatar { width: 52px; height: 52px; border-radius: 50%; object-fit: cover; flex-shrink: 0; }
.lost-banner b { display: block; color: #991b1b; font-size: 15px; }
.lost-banner span { font-size: 13px; color: #7f1d1d; }
.lost-banner.found { background: #f0fdf4; border-color: #bbf7d0; border-left-color: #16a34a; }
.lost-banner.found b { color: #166534; } .lost-banner.found span { color: #14532d; }
.lost-cta { display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap; }
.lost-cta p { margin: 0; flex: 1 1 260px; font-size: 14px; color: var(--muted); }

/* ---------- Cliniche vicine (patch 40) ---------- */
.near-search { margin-top: 6px; }
.near-search input { text-transform: none; letter-spacing: 0; flex: 1 1 220px; min-width: 0; }
.near-dot { display: inline-block; width: 10px; height: 10px; border-radius: 50%; margin: 0 4px 0 8px; vertical-align: middle; background: #64748b; }
.near-dot.vr { background: #0f766e; } .near-dot.me { background: #2563eb; }
.near-item .member-main > span { display: block; }
.near-item .member-main .pill { display: inline-block; }
.near-item .member-main .pill { margin-top: 4px; }
.near-item .member-ctl { display: flex; flex-wrap: wrap; gap: 6px; }
.near-pop { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }
.near-pop .btn { font-size: 12px; }
#nearMap { height: 340px; }

/* Prenotazione: scelta del veterinario (patch 43) */
.vet-pick { display: flex; flex-wrap: wrap; gap: .5rem; }
.vet-pick button { display: flex; align-items: center; gap: .6rem; font: inherit; font-weight: 600; text-align: left; padding: .5em .9em .5em .5em; border: 1px solid var(--line); border-radius: 999px; background: var(--white); color: var(--ink); cursor: pointer; min-height: 44px; }
.vet-pick button:hover { border-color: var(--teal); }
.vet-pick button[aria-pressed="true"] { border-color: var(--navy); background: var(--navy); color: var(--white); }
.vet-pick .avatar { width: 32px; height: 32px; font-size: 13px; }
.vet-pick button[aria-pressed="true"] .avatar { background: var(--white); color: var(--navy); }
.vet-pick .vp-any .avatar { font-size: 16px; }
.readonly-note { white-space: pre-line; }

/* Prenotazione per prestazione con prezzo (patch 44) */
.svc-list { display: flex; flex-direction: column; gap: .4rem; }
.svc-item { display: flex; align-items: center; justify-content: space-between; gap: .8rem; width: 100%; font: inherit; text-align: left; padding: .65em .9em; border: 1px solid var(--line); border-radius: 12px; background: var(--white); color: var(--ink); cursor: pointer; min-height: 48px; }
.svc-item:hover { border-color: var(--teal); }
.svc-item[aria-pressed="true"] { border-color: var(--navy); box-shadow: inset 0 0 0 1px var(--navy); background: #F2F7FC; }
.svc-item .svc-n { font-weight: 600; min-width: 0; }
.svc-item .svc-n small { display: block; font-weight: 400; color: var(--muted); font-size: .85rem; margin-top: .1rem; }
.svc-item .svc-p { font-weight: 800; color: var(--navy); white-space: nowrap; }
.svc-item.is-off .svc-p { color: var(--muted); font-weight: 600; }
.svc-item.svc-other .svc-n { color: var(--muted); }
.svc-sub { font-size: 1rem; margin: 1.1rem 0 .5rem; }
.vet-pick .vp-price { display: block; font-weight: 600; font-size: .8rem; opacity: .8; }

/* Team: nome per i clienti (patch 46) */
.member-ctl .dname { display: flex; flex-direction: column; gap: 2px; font-size: 12px; font-weight: 600; color: var(--muted); min-width: 12rem; }
.member-ctl .dname input { font-size: 14px; padding: .35em .6em; min-height: 34px; }
.member-ctl .dname-warn { flex-basis: 100%; font-size: 12.5px; color: #92400e; background: #fef3c7; border-radius: 8px; padding: 6px 10px; }

/* Ricette (patch 47) */
.grid .s2 { grid-column: span 2; }
.rx-tools { margin-bottom: 8px; flex-wrap: wrap; }
.rx-copy { white-space: pre-wrap; font: 13px/1.45 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; background: #f8fafc; border: 1px dashed #cbd5e1; border-radius: 12px; padding: 10px 12px; margin: 0 0 10px; color: var(--ink); user-select: all; }
.rx-row .rem-main strong { display: block; }
.rx-row .rem-main span { white-space: normal; }
.rx-item { margin-bottom: 6px; }
.rx-item-end { display: flex; gap: 6px; align-items: center; }
.rx-item-end input { flex: 1 1 auto; min-width: 0; }
.rx-item-end .btn { padding: 6px 10px; min-height: 34px; }
@media (max-width: 720px) { .rx-item > div { grid-column: span 12 !important; } .rx-item { padding-bottom: 8px; border-bottom: 1px solid var(--line); } }
/* Anagrafe (patch 48) */
.an-region { display: inline-flex; align-items: center; gap: 6px; font-size: 14px; }
.an-region select { width: auto; min-width: 11rem; min-height: 38px; padding: 6px 10px; font-size: 14px; }

/* ===== Pagina di accesso: FurrFinder / Vetroom, email e Apple (2026-11-04) ===== */
.solo-ff { display: none; }
html.ff-mode .solo-ff { display: inline; }
html.ff-mode .solo-vr { display: none; }
html.ff-mode .vr-login-logo, html.ff-mode .login-roles { display: none; }
html.ff-mode .ff-brand { display: flex; }
html.ff-mode .vr-login-wrap { background: #eaf2fa; }
html.ff-mode .vr-login-card { border-radius: 24px; }
html.ff-mode .vr-login-title { font-size: 22px; color: #0b2545; line-height: 1.2; }
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
#metodi { display: flex; flex-direction: column; gap: 10px; margin-top: 18px; }
.btn-apple { background: #000; color: #fff; border-color: #000; width: 100%; min-height: 50px; font-size: 15px; }
.btn-apple:hover { background: #222; }
.login-oppure { display: flex; align-items: center; gap: 10px; color: var(--muted); font-size: 12px; text-transform: uppercase; letter-spacing: .06em; }
.login-oppure::before, .login-oppure::after { content: ""; flex: 1; height: 1px; background: var(--line); }
.login-email { display: flex; flex-direction: column; gap: 8px; }
.login-email input { width: 100%; min-height: 48px; font-size: 16px; padding: 10px 14px; border: 1.5px solid #d1d5db; border-radius: var(--radius-md); background: var(--white); color: var(--text); }
.login-email input:focus { outline: none; border-color: #0ea5e9; box-shadow: 0 0 0 3px rgba(14,165,233,.18); }
.login-email .btn-primary { width: 100%; min-height: 48px; font-size: 15px; }
html.ff-mode .login-email .btn-primary { background: #0b2545; border-color: #0b2545; color: #fff; }
.login-hint { margin: 0 !important; }
.login-sent { font-size: 14px; color: var(--text); text-align: center; margin: 8px 0 4px; line-height: 1.45; }
.login-fiducia { list-style: none; padding: 0; margin: 18px 0 0; display: none; flex-direction: column; gap: 6px; font-size: 13px; color: var(--muted); }
html.ff-mode .login-fiducia { display: flex; }
.login-fiducia li { padding-left: 22px; position: relative; }
.login-fiducia li::before { content: "✓"; position: absolute; left: 0; top: 0; color: #15803d; font-weight: 800; }