/* Mini-mappa sedi (scheda Sedi del cliente, testata della commessa) e stati di posizione nella tabella delle sedi. Solo test:
   ogni regola sta sotto body.nh-v2. Solo token del sito (il colore primario cambia con il tema dell'azienda).
   Pin e gruppi sono quelli della pagina Mappa sedi (smap-pin / smap-clu, in site-map.css); qui si definiscono solo le variabili che
   quelle regole si aspettano e lo stile del contenitore, della barra, dei controlli di zoom e delle pillole della tabella. */

body.nh-v2 .nh-mm,
body.nh-v2 .nh-mm__empty {
  --smap-site: var(--primary);
  --smap-customer: #b45309; /* ambra pieno (5:1 col testo bianco dei pin): l'indirizzo base del cliente si distingue dalle sedi, che seguono il colore primario */
  --smap-warn: var(--warning-ink, #b45309);
  --smap-ease: cubic-bezier(.16, 1, .3, 1);
}

/* ---------- contenitore ---------- */
body.nh-v2 .nh-mm {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: var(--bg-soft);
}

body.nh-v2 .nh-mm__map { height: 250px; }
body.nh-v2 .nh-mm__map--cliente { height: 250px; }
body.nh-v2 .nh-mm__map--commessa { height: 170px; }
body.nh-v2 .nh-mm__map.leaflet-container {
  background: var(--bg-soft);
  font-family: var(--app-font-family, inherit);
}
/* il riquadro focalizzato da tastiera: l'anello sta sul contenitore, perche' le tile (z-index 400) coprirebbero un anello sul riquadro stesso */
@supports selector(:has(*)) {
  body.nh-v2 .nh-mm__map.leaflet-container:focus-visible { outline: 0; }
  body.nh-v2 .nh-mm:has(.nh-mm__map:focus-visible) { outline: 2px solid var(--primary); outline-offset: -2px; }
}

/* tile piu' chiare: meno saturazione e piu' luce, cosi' i pin restano il punto focale */
body.nh-v2 .nh-mm .leaflet-tile-pane { filter: saturate(.45) brightness(1.07) contrast(.9); }

body.nh-v2 .nh-mm .leaflet-control-attribution {
  background: color-mix(in srgb, var(--surface) 75%, transparent);
  font-size: 10px;
}
body.nh-v2 .nh-mm .leaflet-control-attribution a,
body.nh-v2 .nh-mm .leaflet-control-attribution a:hover {
  color: var(--primary-strong);
  text-decoration: none;
}

/* ---------- zoom: stessi bordi e raggi dei controlli del sito ---------- */
body.nh-v2 .nh-mm .leaflet-bar {
  overflow: hidden;
  border: 1px solid var(--border);
  border-radius: 10px;
  box-shadow: 0 2px 8px rgba(15, 23, 42, .1);
}
body.nh-v2 .nh-mm .leaflet-bar a {
  width: 32px;
  height: 32px;
  border-bottom: 1px solid var(--border);
  background: color-mix(in srgb, var(--surface) 96%, transparent);
  color: var(--slate, #475569);
  font: 600 19px/31px var(--app-font-family, inherit);
  text-indent: 0;
  text-decoration: none;
}
body.nh-v2 .nh-mm .leaflet-bar a:last-child { border-bottom: 0; }
body.nh-v2 .nh-mm .leaflet-bar a:hover { background: var(--primary-soft); color: var(--primary-strong); }
body.nh-v2 .nh-mm .leaflet-bar a:focus-visible { outline: 2px solid var(--primary); outline-offset: -3px; }
body.nh-v2 .nh-mm .leaflet-bar a.leaflet-disabled { background: var(--surface-soft); color: var(--border-strong); cursor: default; }
body.nh-v2 .nh-mm .leaflet-top.leaflet-right .leaflet-control { margin: 10px 10px 0 0; }

/* ---------- barra sopra la mappa: conteggio e ritorno alla vista d'insieme ---------- */
body.nh-v2 .nh-mm__bar {
  position: absolute;
  z-index: 500;
  top: 10px;
  left: 10px;
  display: flex;
  gap: 8px;
  pointer-events: none;
}
body.nh-v2 .nh-mm__chip,
body.nh-v2 .nh-mm__all {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  height: 28px;
  margin: 0;
  padding: 0 11px;
  border: 1px solid var(--border);
  border-radius: 999px;
  background: color-mix(in srgb, var(--surface) 94%, transparent);
  color: var(--text);
  font: 600 13px/1 var(--app-font-family, inherit);
  white-space: nowrap;
  box-shadow: 0 2px 8px rgba(15, 23, 42, .08);
}
body.nh-v2 .nh-mm__chip--warn {
  border-color: color-mix(in srgb, var(--warning) 40%, var(--surface));
  background: var(--warning-soft);
  color: var(--warning-ink, #b45309);
}
body.nh-v2 .nh-mm__all {
  appearance: none;
  border-color: var(--primary-tint-12);
  color: var(--primary-strong);
  cursor: pointer;
  pointer-events: auto;
  text-decoration: none;
  transition: background .15s;
}
body.nh-v2 .nh-mm__all:hover { background: var(--primary-soft); text-decoration: none; }
body.nh-v2 .nh-mm__all:focus-visible { outline: 2px solid var(--primary); outline-offset: 2px; }

/* pin e gruppi raggiunti da tastiera: l'anello segue il cerchio, non il riquadro di 34 px */
body.nh-v2 .nh-mm .smap-pinwrap:focus-visible { outline: 0; }
body.nh-v2 .nh-mm .smap-pinwrap:focus-visible .smap-pin,
body.nh-v2 .nh-mm .smap-pinwrap:focus-visible .smap-clu {
  outline: 2px solid var(--primary-ink);
  outline-offset: 4px;
}

/* l'attributo hidden vince sul display dei blocchi sopra */
body.nh-v2 .nh-mm [hidden] { display: none; }

/* ---------- nessuna sede con posizione ---------- */
/* stessa cornice della mappa (250 px + 1 px di bordo per lato), cosi' la scheda non cambia misura quando una sede ottiene la posizione; dentro .nh-mm la cornice e' gia' quella del contenitore */
body.nh-v2 .nh-mm__empty {
  display: grid;
  place-items: center;
  min-height: 252px;
  padding: 18px;
  overflow: hidden;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: var(--bg-soft);
}
body.nh-v2 .nh-mm > .nh-mm__empty { border: 0; border-radius: 0; }

/* scheda Sedi: la tabella segue la mappa, con la stessa distanza dell'anteprima; in commessa la distanza la da' la colonna della banda */
body.nh-v2 .nh-mm:not(.nh-mm--commessa),
body.nh-v2 .nh-mm__empty:not(.nh-mm__empty--commessa) { margin-bottom: 14px; }

/* scheda Sedi: tabella a sinistra, mappa a destra (a fianco, ferma mentre la tabella scorre); senza mappa resta la sola tabella */
body.nh-v2 .nh-sites-split { display: block; }
body.nh-v2 .nh-sites-split:has(> .nh-mm, > .nh-mm__empty) {
  display: grid;
  grid-template-columns: minmax(0, 1fr) clamp(340px, 38%, 560px);
  gap: 16px;
  align-items: start;
}
body.nh-v2 .nh-sites-split > .nh-mm,
body.nh-v2 .nh-sites-split > .nh-mm__empty {
  grid-column: 2;
  grid-row: 1;
  margin-bottom: 0;
  position: sticky;
  top: calc(var(--topbar-height, 72px) + 16px);
}
body.nh-v2 .nh-sites-split > .nh-mm { position: sticky; }
body.nh-v2 .nh-sites-split > .nh-sites-split__table { grid-column: 1; grid-row: 1; min-width: 0; }
body.nh-v2 .nh-sites-split > .nh-mm .nh-mm__map--cliente { height: 380px; }
body.nh-v2 .nh-sites-split > .nh-mm__empty { min-height: 382px; }
/* sede di timbratura (punto fisso): l'altezza segue lo schermo cosi' la scheda non scorre su 1366x768 e 1280x720 */
body.nh-v2 .nh-sites-split > .nh-mm .nh-mm__map--punto { height: clamp(250px, 44vh, 380px); }
body.nh-v2 .nh-sites-split > .nh-mm__empty.nh-mm__empty--punto { min-height: clamp(252px, 44vh, 382px); }
/* sticky della mappa: in site.css il pannello di dettaglio (overflow:hidden) e html/body (overflow-x:hidden) diventano contenitori di scorrimento
   e la mappa si aggancia a loro invece che alla pagina. clip ritaglia uguale (angoli, sporgenze) senza creare un contenitore; overflow-y resta visible. */
body.nh-v2 .work-surface:has(.nh-sites-split > .nh-mm),
body.nh-v2 .work-surface:has(.nh-sites-split > .nh-mm__empty) { overflow: clip; }
html:has(body.nh-v2 .nh-sites-split > .nh-mm),
body.nh-v2:has(.nh-sites-split > .nh-mm) { overflow-x: clip; }

/* sotto ~1100px la colonna dei campi (o della tabella) diventa troppo stretta: mappa sopra, non piu' ferma, poi il resto */
@media (max-width: 1100px) {
  body.nh-v2 .nh-sites-split:has(> .nh-mm, > .nh-mm__empty) { grid-template-columns: minmax(0, 1fr); }
  body.nh-v2 .nh-sites-split > .nh-mm,
  body.nh-v2 .nh-sites-split > .nh-mm__empty { grid-column: 1; grid-row: 1; position: relative; top: auto; }
  body.nh-v2 .nh-sites-split > .nh-sites-split__table { grid-row: 2; }
  body.nh-v2 .nh-sites-split > .nh-mm .nh-mm__map--cliente { height: 250px; }
  body.nh-v2 .nh-sites-split > .nh-mm .nh-mm__map--punto { height: 250px; }
  body.nh-v2 .nh-sites-split > .nh-mm__empty,
  body.nh-v2 .nh-sites-split > .nh-mm__empty.nh-mm__empty--punto { min-height: 252px; }
}

/* sede di timbratura: la scheda e' un pannello a meta' pagina (max-width 50%), quindi la larghezza utile dipende dal pannello e non dallo schermo:
   la media query sul viewport non basta (a 1366/1280 il form restava ~110 px accanto ai 340 della mappa). Sotto 780 px di pannello la mappa passa sopra. */
body.nh-v2 .nh-sede-host { container: nh-sede / inline-size; }
@container nh-sede (max-width: 780px) {
  body.nh-v2 .nh-sites-split:has(> .nh-mm, > .nh-mm__empty) { grid-template-columns: minmax(0, 1fr); }
  body.nh-v2 .nh-sites-split > .nh-mm,
  body.nh-v2 .nh-sites-split > .nh-mm__empty { grid-column: 1; grid-row: 1; position: relative; top: auto; }
  body.nh-v2 .nh-sites-split > .nh-sites-split__table { grid-row: 2; }
  body.nh-v2 .nh-sites-split > .nh-mm .nh-mm__map--punto { height: 250px; }
  body.nh-v2 .nh-sites-split > .nh-mm__empty.nh-mm__empty--punto { min-height: 252px; }
}

/* commessa base (Anagrafiche): mappa a fianco dei campi, alta come quella del cliente */
body.nh-v2 .nh-sites-split > .nh-mm .nh-mm__map--commessa { height: 380px; }
@media (max-width: 1100px) {
  body.nh-v2 .nh-sites-split > .nh-mm .nh-mm__map--commessa { height: 250px; }
}

/* commessa: stesso ingombro della mappa (170 px + bordo), stato vuoto ridotto per starci dentro */
body.nh-v2 .nh-mm__empty--commessa { height: 172px; min-height: 0; padding: 0; }
body.nh-v2 .nh-mm__empty--commessa .smap-state.is-compact,
body.nh-v2 .nh-mm--commessa .nh-mm__fail .smap-state.is-compact { gap: 6px; padding: 0 12px; }
body.nh-v2 .nh-mm__empty--commessa .smap-art,
body.nh-v2 .nh-mm--commessa .nh-mm__fail .smap-art { width: 110px; }
body.nh-v2 .nh-mm__empty--commessa .smap-state.is-compact h3,
body.nh-v2 .nh-mm--commessa .nh-mm__fail .smap-state.is-compact h3 { font-size: 14px; }

/* la mappa non si carica: copre il riquadro (i pannelli di Leaflet arrivano a z-index 400, la barra a 500) */
body.nh-v2 .nh-mm__fail {
  position: absolute;
  inset: 0;
  z-index: 600;
  display: grid;
  place-items: center;
  padding: 16px;
  background: color-mix(in srgb, var(--bg-soft) 92%, transparent);
}
body.nh-v2 .nh-mm__fail .smap-state.is-compact { padding: 0; }
body.nh-v2 .nh-mm--commessa .nh-mm__fail { padding: 8px; }

/* testata della commessa: binario delle revisioni e mappa nella colonna destra della banda */
body.nh-v2 .cm-band-side { display: flex; flex-direction: column; gap: 12px; }
/* lo spazio in piu' lo chiede la mappa stessa (anche il riquadro d'attesa e lo stato vuoto): senza mappa la colonna resta quella del solo binario */
body.nh-v2 .cm-band-side > .nh-mm,
body.nh-v2 .cm-band-side > .nh-mm__empty { min-width: 330px; max-width: 100%; }
/* con la mappa la colonna si allarga: il binario delle revisioni resta sul bordo destro, non salta a sinistra */
body.nh-v2 .cm-band-side > .cm-revs { align-self: flex-end; }
/* lo scorrimento verso la mappa non deve finire sotto la barra superiore fissa */
body.nh-v2 .nh-mm__map { scroll-margin-top: calc(var(--topbar-height, 72px) + 16px); }

/* ---------- tabella delle sedi: nome, stato della posizione ---------- */
body.nh-v2 .nh-mm-namecell { display: inline-flex; flex-wrap: wrap; align-items: center; }
body.nh-v2 .nh-mm-name {
  appearance: none;
  margin: 0;
  padding: 6px 0;
  border: 0;
  border-radius: 4px;
  background: none;
  color: var(--text);
  font-family: var(--app-font-family, inherit);
  font-size: inherit;
  font-weight: 700;
  line-height: inherit;
  text-align: left;
  text-decoration: none;
  cursor: pointer;
}
body.nh-v2 .nh-mm-name:hover,
body.nh-v2 .nh-mm-name:focus-visible { color: var(--primary-strong); text-decoration: none; }
body.nh-v2 .nh-mm-name:focus-visible { outline: 2px solid var(--primary); outline-offset: 2px; }

/* "Mostra sulla mappa": icona discreta accanto al nome (il nome apre la sede) */
body.nh-v2 .nh-mm-show {
  appearance: none;
  display: inline-flex;
  flex: none;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  margin: 0 0 0 4px;
  padding: 0;
  border: 0;
  border-radius: 4px;
  background: transparent;
  color: var(--muted);
  cursor: pointer;
  transition: color .15s, background .15s;
}
body.nh-v2 .nh-mm-show svg {
  width: 16px;
  height: 16px;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}
body.nh-v2 .nh-mm-show:hover,
body.nh-v2 .nh-mm-show:focus-visible { color: var(--primary-strong); background: var(--primary-soft); }
body.nh-v2 .nh-mm-show:focus-visible { outline: 2px solid var(--primary); outline-offset: 2px; }
body.nh-v2 .nh-mm-show[aria-pressed="true"],
body.nh-v2 .nh-mm-namecell.is-selected .nh-mm-show { color: var(--primary); }
body.nh-v2 .nh-mm-show[aria-pressed="true"]:hover,
body.nh-v2 .nh-mm-show[aria-pressed="true"]:focus-visible,
body.nh-v2 .nh-mm-namecell.is-selected .nh-mm-show:hover,
body.nh-v2 .nh-mm-namecell.is-selected .nh-mm-show:focus-visible { color: var(--primary-strong); }
body.nh-v2 .nh-mm-show[aria-pressed="true"] svg { fill: color-mix(in srgb, var(--primary) 18%, transparent); }

/* sede in primo piano sulla mappa: la riga resta evidenziata finche' non si sceglie "Tutte le sedi" o un'altra sede.
   Non solo colore: barra a sinistra della riga e nome nel colore forte (piu' aria-pressed sul pulsante). */
body.nh-v2 .nh-mm-namecell.is-selected .nh-mm-name { color: var(--primary-strong); }
@supports selector(:has(*)) {
  body.nh-v2 .nh-sites-split__table tbody tr:has(.nh-mm-namecell.is-selected) > td { background: var(--primary-soft); }
  body.nh-v2 .nh-sites-split__table tbody tr:has(.nh-mm-namecell.is-selected) > td:first-child { box-shadow: inset 3px 0 0 var(--primary); }
}

body.nh-v2 .nh-mm-nopos,
body.nh-v2 .nh-mm-calc {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin: 0 0 0 6px;
  border-radius: 999px;
  font-family: var(--app-font-family, inherit);
  white-space: nowrap;
}
body.nh-v2 .nh-mm-nopos {
  padding: 3px 10px;
  border: 1px solid color-mix(in srgb, var(--warning) 40%, var(--surface));
  background: var(--warning-soft);
  color: var(--warning-ink, #b45309);
  font-size: 12.5px;
  font-weight: 600;
  line-height: 1.2;
}
body.nh-v2 .nh-mm-nopos--err {
  border-color: color-mix(in srgb, var(--danger) 25%, var(--surface));
  background: var(--danger-soft);
  color: var(--danger-ink, #991b1b);
}
body.nh-v2 .nh-mm-nopos--muto {
  border-color: var(--border);
  background: var(--surface-soft);
  color: var(--muted);
}

/* "Calcola posizione": pillola ambra al posto dello stato, cosi' l'azione si capisce dal colore */
body.nh-v2 .nh-mm-calc {
  appearance: none;
  height: 26px;
  padding: 0 11px;
  border: 1px solid color-mix(in srgb, var(--warning) 60%, var(--surface));
  background: var(--warning-soft);
  color: var(--warning-ink, #b45309);
  font-size: 12.5px;
  font-weight: 700;
  line-height: 1;
  cursor: pointer;
  transition: background .15s, border-color .15s;
}
body.nh-v2 .nh-mm-calc:hover:not(:disabled) {
  border-color: var(--warning);
  background: color-mix(in srgb, var(--warning) 20%, var(--surface));
}
body.nh-v2 .nh-mm-calc:focus-visible { outline: 2px solid var(--primary); outline-offset: 2px; }
body.nh-v2 .nh-mm-calc:disabled { cursor: default; }

body.nh-v2 .nh-mm-spin {
  flex: none;
  width: 11px;
  height: 11px;
  border: 2px solid currentColor;
  border-right-color: transparent;
  border-radius: 50%;
  animation: nh-mm-gira .7s linear infinite;
}
@keyframes nh-mm-gira { to { transform: rotate(360deg); } }

@media (prefers-reduced-motion: reduce) {
  body.nh-v2 .nh-mm .smap-pin,
  body.nh-v2 .nh-mm__all,
  body.nh-v2 .nh-mm-calc,
  body.nh-v2 .nh-mm-show { transition: none; }
  /* il cerchio di attesa resta, ma piano: segnala che il calcolo e' in corso senza girare veloce */
  body.nh-v2 .nh-mm-spin { animation-duration: 2s; }
}

/* ---------- "Correggi posizione": pulsante sotto la mappa del cliente, pulsante nella riga della sede e modale ---------- */
body.nh-v2 .nh-mm__foot {
  display: flex;
  padding: 8px 10px;
  border-top: 1px solid var(--border);
  background: var(--surface);
}
body.nh-v2 .nh-mm-namecell .btn.nh-mm-fix {
  height: 28px;
  margin: 0 0 0 6px;
  padding: 0 12px;
  border-radius: 999px;
  font-size: 13px;
  line-height: 1;
  white-space: nowrap;
}

/* modale: la mappa prende tutto lo spazio che resta tra testata e azioni, senza scroll interno (1366x768 e 1280x720 compresi) */
body.nh-v2 .editor-dialog.nh-pos-dialog {
  width: min(94vw, 1180px);
  height: min(calc(100dvh - 32px), 820px);
  max-height: none;
}
body.nh-v2 .editor-dialog.nh-pos-dialog > .editor-body {
  display: flex;
  flex-direction: column;
  min-height: 0;
  overflow: hidden;
}
body.nh-v2 .nh-pos {
  --smap-site: var(--primary);
  --smap-warn: var(--warning-ink, #b45309);
  --smap-ease: cubic-bezier(.16, 1, .3, 1);
  position: relative;
  flex: 1 1 auto;
  min-height: 220px;
  isolation: isolate;
}
body.nh-v2 .nh-pos__map {
  position: absolute;
  inset: 0;
  overflow: hidden;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: var(--bg-soft);
  font-family: var(--app-font-family, inherit);
}
body.nh-v2 .nh-pos .leaflet-control-attribution {
  background: color-mix(in srgb, var(--surface) 80%, transparent);
  font-size: 13px;
}
body.nh-v2 .nh-pos .leaflet-control-attribution a { color: var(--primary-strong); text-decoration: none; }
body.nh-v2 .nh-pos .leaflet-bar {
  overflow: hidden;
  border: 1px solid var(--border);
  border-radius: 10px;
  box-shadow: 0 2px 8px rgba(15, 23, 42, .1);
}
body.nh-v2 .nh-pos .leaflet-bar a {
  width: 34px;
  height: 34px;
  border-bottom: 1px solid var(--border);
  background: var(--surface);
  color: var(--text);
  line-height: 34px;
}
body.nh-v2 .nh-pos .leaflet-bar a:last-child { border-bottom: 0; }
body.nh-v2 .nh-pos .leaflet-bar a:hover { background: var(--primary-soft); color: var(--primary-strong); }
body.nh-v2 .nh-pos .leaflet-top.leaflet-right .leaflet-control { margin: 10px 10px 0 0; }

/* selettore Stradale / Satellite: un riquadro con due scelte, etichette a 14px */
body.nh-v2 .nh-pos .leaflet-control-layers {
  border: 1px solid var(--border);
  border-radius: 10px;
  background: var(--surface);
  box-shadow: 0 2px 8px rgba(15, 23, 42, .1);
  color: var(--text);
  font: 600 14px/1.2 var(--app-font-family, inherit);
}
body.nh-v2 .nh-pos .leaflet-control-layers-list { padding: 4px 6px; }
body.nh-v2 .nh-pos .leaflet-control-layers label { display: block; margin: 0; padding: 5px 4px; cursor: pointer; }
body.nh-v2 .nh-pos .leaflet-control-layers label > span { display: flex; align-items: center; gap: 8px; }
body.nh-v2 .nh-pos .leaflet-control-layers-selector { width: 16px; height: 16px; margin: 0; accent-color: var(--primary); }
body.nh-v2 .nh-pos .leaflet-control-layers label:has(:focus-visible) { outline: 2px solid var(--primary); outline-offset: -2px; border-radius: 6px; }

/* punto da spostare raggiunto da tastiera: l'anello segue il cerchio */
body.nh-v2 .nh-pos .smap-pinwrap:focus-visible { outline: 0; }
body.nh-v2 .nh-pos .smap-pinwrap:focus-visible .smap-pin { outline: 2px solid var(--primary-ink); outline-offset: 4px; }
body.nh-v2 .nh-pos .smap-pinwrap.leaflet-dragging { cursor: grabbing; }

/* coordinate attuali: una riga compatta sotto la mappa, valori a larghezza fissa perche' non saltino mentre cambiano */
body.nh-v2 .nh-pos__coords {
  flex: 0 0 auto;
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 4px 28px;
  padding: 10px 2px 0;
  font-size: 14px;
  line-height: 1.3;
  color: var(--text);
}
body.nh-v2 .nh-pos__coord { display: inline-flex; align-items: baseline; gap: 8px; }
body.nh-v2 .nh-pos__coord-k { color: var(--muted); font-weight: 500; }
body.nh-v2 .nh-pos__coord-v {
  min-width: 9ch;
  font-weight: 600;
  font-variant-numeric: tabular-nums;
}

body.nh-v2 .nh-pos__fail {
  position: absolute;
  inset: 0;
  z-index: 600;
  display: grid;
  place-items: center;
  border-radius: 12px;
  background: color-mix(in srgb, var(--bg-soft) 92%, transparent);
}
body.nh-v2 .nh-pos__fail .smap-state.is-compact { padding: 0; }