/* Mappa sedi (Clienti). Solo classi "smap-": usa i token del sito (colori, raggi, font) e non ridefinisce nulla di globale.
   La pagina occupa tutta l'altezza dello schermo e non scorre: l'altezza la imposta nh-site-map.js (--smap-h), scorre solo l'elenco. */

.work-surface.smap-page {
  --smap-site: var(--primary);
  --smap-customer: var(--primary-ink);
  --smap-warn: #b45309;
  --smap-warn-soft: #fffbeb;
  --smap-warn-edge: #f59e0b;
  --smap-ease: cubic-bezier(.16, 1, .3, 1);
  display: flex;
  flex-direction: column;
  gap: 8px;
  height: var(--smap-h, calc(100dvh - 190px));
  min-height: 420px;
  margin: 0;
  padding: 0;
  overflow: hidden;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

.smap-page .sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }

/* ---------- riepilogo ---------- */
.smap-summary { flex: none; display: flex; align-items: center; padding: 8px 8px 8px 16px; border: 1px solid var(--border); border-radius: 14px; background: var(--surface); box-shadow: 0 1px 2px rgba(15, 23, 42, .05); }
.smap-kpi { display: flex; align-items: baseline; gap: 8px; margin: 0 26px 0 0; padding: 2px 26px 2px 0; border: 0; border-right: 1px solid var(--border); background: none; text-align: left; font: inherit; color: var(--text); }
.smap-kpi:nth-last-child(1), .smap-kpi:has(+ .smap-summary-action) { border-right: 0; }
.smap-kpi strong { font-size: 22px; font-weight: 800; letter-spacing: -.02em; line-height: 1; font-variant-numeric: tabular-nums; }
.smap-kpi span { font-size: 13.5px; font-weight: 600; color: var(--slate, #475569); }
.smap-kpi small { font-size: 13px; color: var(--muted); font-variant-numeric: tabular-nums; }
.smap-kpi-btn { cursor: pointer; border-radius: 8px; }
.smap-kpi-btn:hover span { color: var(--text); }
.smap-kpi-btn.is-warn strong { color: var(--smap-warn); }
.smap-summary-action { margin-left: auto; }
.smap-sk { display: inline-block; width: 38px; height: 24px; border-radius: 6px; }

/* ---------- filtri: una sola riga ---------- */
.smap-filters { flex: none; display: flex; flex-wrap: nowrap; align-items: center; gap: 10px 14px; min-width: 0; }
.smap-filters .field { margin: 0; flex: none; }
.smap-f-search { width: 220px; }
.smap-f-client { width: 230px; }
.smap-f-prov { width: 110px; }
.smap-filters .legend-filter { display: flex; align-items: center; gap: 8px; flex: none; margin: 0; }
.smap-filters .legend-filter-title { white-space: nowrap; }
.smap-filters .legend-filter-options { flex-wrap: nowrap; }

/* ---------- scena ---------- */
.smap-stage { flex: 1; min-height: 0; display: grid; grid-template-columns: minmax(0, 1fr) 440px; grid-template-rows: minmax(0, 1fr); gap: 12px; }
@media (min-width: 1700px) { .smap-stage { grid-template-columns: minmax(0, 1fr) 520px; } }
.smap-mapcard { position: relative; min-height: 0; border: 1px solid var(--border); border-radius: 14px; overflow: hidden; background: var(--bg-soft); box-shadow: 0 1px 2px rgba(15, 23, 42, .06), 0 12px 24px -14px rgba(30, 58, 138, .25); }
.smap-map { position: absolute; inset: 0; z-index: 0; font-family: inherit; }
.smap-fill { position: absolute; inset: 0; }
.smap-panel { display: flex; flex-direction: column; min-height: 0; border: 1px solid var(--border); border-radius: 14px; background: var(--surface); box-shadow: 0 1px 2px rgba(15, 23, 42, .06), 0 12px 24px -14px rgba(30, 58, 138, .25); overflow: hidden; }
.smap-tabs { flex: none; margin: 0; padding: 0 18px; }
.smap-tabs .settings-tab { display: inline-flex; align-items: center; gap: 8px; }
.smap-pbody { flex: 1; min-height: 0; overflow-x: hidden; overflow-y: auto; }

/* ---------- sovrapposti alla mappa ---------- */
.smap-ring { position: absolute; z-index: 2; top: 12px; right: 12px; padding: 10px 12px; border: 1px solid var(--border); border-radius: 12px; background: rgba(255, 255, 255, .96); box-shadow: 0 8px 20px -8px rgba(15, 23, 42, .45); }
.smap-ring.off { visibility: hidden; }
.smap-ring-label { display: block; margin-bottom: 6px; font-size: 12.5px; font-weight: 700; color: var(--slate, #475569); }
.smap-ring-out { margin-top: 8px; font-size: 13px; color: var(--slate, #475569); font-variant-numeric: tabular-nums; }
.smap-ring-out b { color: var(--text); font-weight: 800; }
.smap-legend { position: absolute; z-index: 2; left: 12px; bottom: 28px; display: grid; gap: 5px; padding: 10px 12px; border: 1px solid var(--border); border-radius: 12px; background: rgba(255, 255, 255, .96); box-shadow: 0 8px 20px -8px rgba(15, 23, 42, .45); font-size: 12.5px; font-weight: 600; color: var(--slate, #475569); }
.smap-legend > div { display: flex; align-items: center; gap: 8px; }
.smap-lg { flex: none; width: 16px; height: 16px; display: grid; place-items: center; }
.smap-lg i { display: block; width: 14px; height: 14px; border-radius: 50%; background: var(--smap-site); }
.smap-lg i.is-customer { border-radius: 4px; background: var(--smap-customer); }
.smap-lg i.is-empty { background: #fff; border: 3px solid var(--smap-site); }
.smap-overlay { position: absolute; inset: 0; z-index: 3; display: grid; place-items: center; padding: 24px; background: color-mix(in srgb, var(--bg-soft) 90%, transparent); }

/* ---------- stati ---------- */
.smap-state { display: flex; flex-direction: column; align-items: center; gap: 12px; max-width: 360px; text-align: center; }
.smap-state h3 { margin: 0; font-size: 19px; font-weight: 800; }
.smap-state.is-compact { margin: 0 auto; padding: 28px 16px; gap: 8px; }
.smap-state.is-compact h3 { font-size: 16px; }
.smap-art { width: 240px; height: auto; }
.is-compact .smap-art { width: 150px; }
.smap-art-base { fill: var(--primary-soft); stroke: var(--primary-tint-10); stroke-width: 2; }
.smap-art-river { stroke: var(--primary-tint-13); stroke-width: 9; stroke-linecap: round; opacity: .7; }
.smap-art-road { stroke: #fff; stroke-width: 5; opacity: .9; }
.smap-art-block { fill: var(--primary-tint-9); }
.smap-art-lens { fill: rgba(255, 255, 255, .75); stroke: var(--primary-ink); stroke-width: 7; }
.smap-art-handle { stroke: var(--primary-ink); stroke-width: 10; stroke-linecap: round; }
.smap-art-cross { stroke: var(--primary); stroke-width: 5; stroke-linecap: round; fill: none; }
.smap-art-ghost path { fill: none; stroke: var(--smap-site); stroke-width: 3; stroke-dasharray: 5 4; }
.smap-art-ghost.is-alt path { stroke: var(--smap-customer); }
.smap-art-done path { fill: var(--smap-site); }
.smap-art-done.is-alt path { fill: var(--smap-customer); }
.smap-art-veil { fill: #f1f5f9; fill-opacity: .72; }
.smap-art-fail { fill: var(--danger, #dc2626); }
.smap-art-x { stroke: #fff; stroke-width: 5; stroke-linecap: round; fill: none; }

.smap-shim { background: linear-gradient(90deg, var(--border) 0%, #fff 50%, var(--border) 100%) 0 0 / 200% 100%; animation: smap-shimmer 1.4s linear infinite; }
@keyframes smap-shimmer { to { background-position: -200% 0; } }
.smap-skel { display: grid; gap: 10px; padding: 16px; }
.smap-skel i { display: block; height: 44px; border-radius: 10px; }
.smap-skel i:nth-child(2n) { width: 86%; }
.smap-skel i:nth-child(3n) { width: 70%; }

/* ---------- tabella Elenco (SmartTable di produzione) ---------- */
.smap-table-surface { margin: 0; padding: 0; border: 0; box-shadow: none; background: none; }
.smap-table-surface .table-responsive { overflow: hidden; }
.smap-table { table-layout: fixed; width: 100%; }
.smap-table td { overflow: hidden; text-overflow: ellipsis; }
.smap-table tbody tr:hover td, .smap-table tbody tr.smap-row-hl td { background: var(--primary-soft); }
.smap-table tbody tr.smap-row-sel td { background: var(--primary-tint-9); }
.smap-name { display: flex; align-items: center; gap: 10px; min-width: 0; max-width: 100%; padding: 0; border: 0; background: none; text-align: left; font: inherit; color: inherit; cursor: pointer; }
.smap-name-text { display: block; min-width: 0; line-height: 1.2; }
.smap-name-text b { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: 800; }
.smap-name-text small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--slate, #475569); font-size: 12.5px; }
.smap-name:hover b { color: var(--primary-strong); }
.smap-ti { flex: none; width: 14px; height: 14px; border-radius: 50%; background: var(--smap-site); }
.smap-ti.is-customer { border-radius: 4px; background: var(--smap-customer); }

/* ---------- Senza posizione ---------- */
.smap-runbar { margin: 14px 16px 0; padding: 12px 14px; border: 1px solid var(--primary-tint-10); border-radius: 12px; background: var(--primary-tint-4); }
.smap-runbar-top { display: flex; align-items: center; gap: 10px; font-size: 14px; font-weight: 700; color: var(--primary-ink); }
.smap-runbar-top > :last-child { margin-left: auto; }
.smap-track { margin-top: 9px; height: 8px; border-radius: 8px; background: var(--primary-tint-9); overflow: hidden; }
.smap-track i { display: block; width: 100%; height: 100%; border-radius: 8px; background: var(--primary); transform-origin: left center; transition: transform .4s var(--smap-ease); }
.smap-banner { display: flex; align-items: center; gap: 10px; margin: 14px 16px 0; padding: 9px 12px; border-radius: 12px; font-size: 14px; font-weight: 600; }
.smap-banner > :last-child { margin-left: auto; flex: none; }
.smap-banner.is-ok { background: var(--success-soft, #ecfdf5); color: var(--success-ink, #047857); }
.smap-banner.is-warn { background: var(--smap-warn-soft); color: var(--smap-warn); }
.smap-ul { margin: 8px 0 0; }
.smap-up { box-sizing: border-box; min-height: 74px; padding: 10px 16px; border-bottom: 1px solid #eef2f7; }
.smap-up.is-editing { background: var(--primary-soft); }
.smap-up-top { display: flex; align-items: center; gap: 10px; }
.smap-up-main { flex: 1; min-width: 0; line-height: 1.25; }
.smap-up-main b { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: 800; }
.smap-up-main span { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 13px; color: var(--slate, #475569); }
.smap-up-main em { display: block; font-style: normal; font-size: 12.5px; font-weight: 600; color: var(--smap-warn); }
.smap-up-act { display: flex; align-items: center; gap: 4px; margin-top: 6px; padding-left: 24px; }
.smap-chip { flex: none; display: inline-flex; align-items: center; height: 22px; padding: 0 9px; border: 1.5px solid var(--border-strong); border-radius: 999px; background: #fff; font-size: 12.5px; font-weight: 800; color: var(--slate, #475569); }
.smap-chip.imp { border-color: var(--smap-warn-edge); background: var(--smap-warn-soft); color: var(--smap-warn); }
.smap-chip.nf { border-color: var(--danger, #dc2626); background: var(--danger-soft, #fef2f2); color: var(--danger-ink, #991b1b); }
.smap-chip.run { border-color: var(--primary); background: var(--primary-soft); color: var(--primary-ink); }
.smap-chip.found { border-color: var(--success, #059669); background: var(--success-soft, #ecfdf5); color: var(--success-ink, #047857); }

/* inserimento o correzione a mano */
.smap-edit { flex: none; display: grid; gap: 8px; margin: 10px 12px 0; padding: 12px; border: 1px solid var(--primary-tint-10); border-radius: 12px; background: var(--primary-tint-1); }
.smap-edit-head { display: grid; line-height: 1.25; }
.smap-edit-head span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 13px; color: var(--slate, #475569); }
.smap-edit-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.smap-hint { margin: 0; font-size: 12.5px; color: var(--slate, #475569); }

/* ---------- punti sulla mappa (disegnati dal modulo JS) ---------- */
.smap-pinwrap { background: none; border: 0; }
.smap-pin { position: relative; width: 34px; height: 34px; display: grid; place-items: center; border: 3px solid #fff; border-radius: 50%; background: var(--smap-site); color: #fff; font: 800 14px/1 var(--app-font-family, inherit); font-variant-numeric: tabular-nums; box-shadow: 0 0 0 2px var(--smap-site), 0 6px 14px -4px rgba(15, 23, 42, .5); transition: transform .15s var(--smap-ease); }
.smap-pin.is-customer { border-radius: 10px; background: var(--smap-customer); box-shadow: 0 0 0 2px var(--smap-customer), 0 6px 14px -4px rgba(15, 23, 42, .5); }
.smap-pin.is-empty { background: #fff; }
.smap-pin.is-empty::before { content: ""; width: 8px; height: 8px; border-radius: inherit; background: var(--smap-site); }
.smap-pin.is-customer.is-empty::before { background: var(--smap-customer); }
.smap-pin.hl, .smap-pin.sel { transform: scale(1.3); }
.smap-pin.sel { box-shadow: 0 0 0 3px var(--text), 0 8px 18px -4px rgba(15, 23, 42, .6); }
.smap-pin.is-placer { background: #fff; border-style: dashed; border-color: var(--smap-warn); box-shadow: 0 6px 14px -4px rgba(15, 23, 42, .5); }
.smap-pin.is-placer::before { content: ""; width: 10px; height: 10px; border-radius: 50%; background: var(--smap-warn); }
.leaflet-marker-icon:has(.smap-pin.hl), .leaflet-marker-icon:has(.smap-pin.sel) { z-index: 900 !important; }
.smap-clu { width: 46px; height: 46px; display: grid; place-items: center; border: 3px solid #fff; border-radius: 50%; background: var(--primary-ink); color: #fff; font: 800 15px/1 var(--app-font-family, inherit); font-variant-numeric: tabular-nums; box-shadow: 0 0 0 4px rgba(255, 255, 255, .85), 0 8px 16px -6px rgba(15, 23, 42, .5); }
.smap-ringlbl { padding: 2px 8px; border: 1px solid var(--primary); border-radius: 6px; background: #fff; color: var(--primary-ink); font: 800 12px/1.4 var(--app-font-family, inherit); white-space: nowrap; transform: translate(-50%, -50%); }
.smap-ringlbl.on { background: var(--primary); color: #fff; }

.smap-popup .leaflet-popup-content-wrapper { padding: 0; border-radius: 14px; box-shadow: 0 18px 36px -12px rgba(15, 23, 42, .45); }
.smap-popup .leaflet-popup-content { width: 290px !important; margin: 0; font-family: var(--app-font-family, inherit); }
.smap-popup a.leaflet-popup-close-button { top: 8px; right: 8px; width: 26px; height: 26px; font-size: 20px; line-height: 26px; color: var(--slate, #475569); }
.smap-pp { padding: 14px 16px; }
.smap-pp-wait { height: 96px; border-radius: 10px; background: linear-gradient(90deg, var(--border) 0%, #fff 50%, var(--border) 100%) 0 0 / 200% 100%; animation: smap-shimmer 1.4s linear infinite; }
.smap-pp-k { display: inline-flex; align-items: center; gap: 6px; font-size: 12.5px; font-weight: 700; color: var(--slate, #475569); }
.smap-pp-k i { width: 10px; height: 10px; border-radius: 50%; background: var(--smap-site); }
.smap-pp-k i.is-customer { border-radius: 3px; background: var(--smap-customer); }
.smap-pp h3 { margin: 3px 24px 0 0; font-size: 17px; font-weight: 800; line-height: 1.2; }
.smap-pp-c { font-size: 13.5px; color: var(--slate, #475569); }
.smap-pp p { margin: 8px 0 0; font-size: 13.5px; }
.smap-pp-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; margin-top: 10px; padding: 8px 0; border-top: 1px solid var(--border); font-size: 13px; color: var(--slate, #475569); }
.smap-pp-big { font-size: 20px; font-weight: 800; line-height: 1; color: var(--text); }
.smap-pp-act { display: flex; flex-wrap: wrap; gap: 8px; }
.smap-pp-act .btn { flex: 1; text-align: center; white-space: nowrap; }

@media (prefers-reduced-motion: reduce) {
  .smap-page *, .smap-popup * { animation: none !important; transition: none !important; }
}

/* Il pager resta in fondo al pannello mentre l'elenco scorre. */
.smap-table-surface .table-pager { position: sticky; bottom: 0; z-index: 3; background: var(--surface); border-top: 1px solid var(--border); }
.smap-table-surface thead th { position: sticky; top: 0; z-index: 2; }
.smap-table-surface .standard-table-shell { grid-template-columns: minmax(0, 1fr); }
/* Nel pannello stretto il pager tiene solo conteggio, righe per pagina e pagine: le impostazioni tabella (raggruppa, colonne) non servono qui. */
.smap-table-surface .table-pager .smart-table-settings-toggle { display: none; }
.smap-table-surface .table-pager { flex-wrap: wrap; gap: 6px 10px; padding: 8px 12px; }