/* Interfaccia comunale chiara; i colori della cartografia rimangono indipendenti. */
body.comunale { --rail-w: 220px; --panel-w: 306px; --scheda-w: 350px; --testa: 72px; --titolo-h: 78px; --dx: 0px; --fondo: 0px; --accent: #1767d3; --fg: #172445; --muted: #627694; --line: #dce5f0; background: #f3f6fb; }
body.comunale.vista-panoramica { --attivita-h: 142px; --fondo: calc(var(--attivita-h) + 20px); }
body.comunale.vista-panoramica.attivita-brevi { --attivita-h: 110px; }
body.comunale.vista-panoramica.attivita-compatte { --fondo: 72px; }
.comunale.scheda-aperta { --dx: var(--scheda-w); }
body.comunale:is(.sc-aperto,.pv-aperto,.ro-aperto) { --fondo: 0px; }
.comunale.sc-aperto { --dx: 472px; }
.comunale.pv-aperto { --dx: 520px; }
.comunale.ro-aperto { --dx: 470px; }
#vista-home { position: absolute; top: calc(var(--testa) + var(--titolo-h)); left: calc(var(--sx) + 20px); right: calc(var(--dx) + 20px); bottom: calc(var(--fondo) + 20px); background: #fff; border: 1px solid var(--line); border-radius: 10px; overflow: hidden; }
.comunale #map { top: 52px; left: 6px; right: 6px; bottom: 6px; border-radius: 6px; }
#intestazione { position: absolute; inset: 0 0 auto; height: var(--testa); box-sizing: border-box; display: flex; align-items: center; gap: 30px; padding: 12px 28px; z-index: 40; background: #fff; border-bottom: 1px solid var(--line); }
#intestazione .marchio { display: flex; gap: 14px; align-items: center; color: var(--fg); text-decoration: none; flex: none; }
.marchio > svg { width: 38px; height: 38px; color: #385579; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.marchio strong { display: block; font-size: 19px; font-weight: 650; letter-spacing: -.4px; }
.marchio small { display: block; color: #526a8b; font-size: 12px; margin-top: 2px; }
#intestazione .cerca { width: min(610px, 47vw); margin: 0 auto; }
#intestazione .cerca > svg { position: absolute; top: 12px; left: 14px; width: 19px; height: 19px; fill: none; stroke: #456083; stroke-width: 1.7; pointer-events: none; }
#intestazione input { padding: 12px 14px 12px 44px; background: #f7f9fc; border: 1px solid var(--line); border-radius: 6px; font: 13px system-ui; }
#intestazione input::placeholder { color: #7386a2; }
#apri-account { display: flex; align-items: center; gap: 10px; color: var(--fg); border: 0; background: none; font: 13px system-ui; cursor: pointer; padding: 0; }
.icona-account { display: grid; place-items: center; width: 36px; height: 36px; border-radius: 50%; background: #2677de; color: #fff; }
#apri-account svg { width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 1.7; }
#apri-account .chevron { width: 15px; }
#testa-vista { position: absolute; top: var(--testa); left: calc(var(--sx) + 20px); right: calc(var(--dx) + 20px); height: var(--titolo-h); display: flex; flex-direction: column; justify-content: center; gap: 2px; }
#testa-vista h1 { font-size: 28px; letter-spacing: -.7px; margin: 0; line-height: 1.2; font-weight: 670; }
#data-vista { color: #6c80a0; font-size: 13px; }
.comunale #viste { top: var(--testa); padding: 16px 6px; z-index: 35; background: #f9fbfe; border-right: 1px solid var(--line); gap: 20px; }
.viste-principali, .viste-servizio { display: flex; flex-direction: column; gap: 4px; }
.viste-principali { flex: 1; }
.comunale #viste button, .comunale #viste #vai-validazione { display: flex; flex: none; flex-direction: row; align-items: center; min-height: 46px; padding: 11px 18px; gap: 14px; border-radius: 0 6px 6px 0; font-size: 13px; line-height: 1.35; justify-content: flex-start; text-align: left; width: 100%; box-sizing: border-box; color: #3c567d; border: 0; }
.comunale #viste button svg, .comunale #viste #vai-validazione svg { flex-shrink: 0; width: 21px; height: 21px; }
.comunale #viste button[aria-selected=true], .comunale.ro-aperto #tab-attivita { background: #e5f0ff; box-shadow: -6px 0 #2477e5; color: #075fc9; }
.comunale #viste button:hover, .comunale #viste #vai-validazione:hover { background: #edf3fc; color: #075fc9; }
.viste-servizio { padding-top: 12px; gap: 2px; }
.comunale #viste #apri-guida { color: #3c567d; }
.comunale #pannello { top: var(--testa); bottom: 0; height: auto; box-shadow: none; }
.comunale .testa-pannello { display: flex; align-items: center; justify-content: space-between; font-size: 13px; font-weight: 650; padding: 16px; }
.testa-pannello button { border: none; background: transparent; cursor: pointer; padding: 5px; }
.comunale .vista { padding: 0 18px 20px; }
.comunale .vista > h2 { font-size: 20px; margin-top: 20px; letter-spacing: -.5px; }
.comunale .sotto { line-height: 1.55; margin: 6px 0 18px; }
.comunale .blocco { padding: 16px 0; }
.comunale select { padding: 9px; margin-bottom: 8px; }
.comunale button:focus-visible, .comunale a:focus-visible, .comunale summary:focus-visible { outline: 3px solid #2677de; outline-offset: 2px; }
.gruppo-livelli { border-top: 1px solid var(--line); padding: 14px 0; }
.gruppo-livelli summary { font-weight: 650; font-size: 13px; cursor: pointer; }
.gruppo-livelli .blocco { border: 0; padding-bottom: 0; }
.comunale .vista button { cursor: pointer; }
#azioni-mappa { position: absolute; inset: 0 0 auto; min-height: 52px; padding: 8px 10px 8px 16px; box-sizing: border-box; z-index: 6; display: flex; align-items: center; gap: 10px; }
#azioni-mappa h2 { margin: 0 auto 0 0; font-size: 18px; letter-spacing: -.3px; }
.azioni-rapide { display: flex; align-items: center; gap: 8px; }
#azioni-mappa button { display: inline-flex; align-items: center; justify-content: center; gap: 7px; background: #fff; color: #29446e; border: 1px solid #d6e1ef; padding: 7px 10px; border-radius: 6px; font: 500 12px system-ui; cursor: pointer; white-space: nowrap; }
#azioni-mappa button[aria-pressed=true] { background: #e6f0ff; border-color: #b6d2f7; color: #0c5fc8; }
#azioni-mappa svg { width: 17px; height: 17px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
#azioni-mappa span { font-weight: 400; font-size: 10px; color: #667993; }
#azioni-mappa button:disabled { opacity: .6; cursor: wait; }
.modo-vista { display: flex; flex: none; border: 1px solid #d6e1ef; border-radius: 6px; padding: 2px; }
#azioni-mappa .modo-vista button { border: 0; padding: 5px 12px; }
.comunale:not(.pannello-chiuso) .azioni-rapide, .comunale:is(.sc-aperto,.pv-aperto,.ro-aperto) .azioni-rapide { display: none; }
.comunale .maplibregl-ctrl button[title^="Passa alla vista"] { display: none; }
#movimento-traffico { position: absolute; left: calc(var(--sx) + 38px); bottom: calc(var(--fondo) + 40px); z-index: 8; background: #ffffffef; color: #243c61; border: 1px solid #d6e1ef; border-radius: 10px; padding: 12px 14px; font-size: 12px; display: flex; flex-direction: column; gap: 10px; max-width: calc(100vw - var(--sx) - var(--dx) - 90px); box-sizing: border-box; }
#movimento-traffico[hidden] { display: none; }
.traffico-intestazione { display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.traffico-intestazione strong { display: block; font-size: 13px; font-weight: 650; }
.traffico-intestazione small { display: block; color: #607797; font-size: 10px; margin-top: 3px; }
#legenda-traffico { display: flex; gap: 14px; flex-wrap: wrap; border-top: 1px solid #dfe7f1; padding-top: 10px; font-size: 10px; }
#legenda-traffico[hidden] { display: none; }
#legenda-traffico span { display: flex; align-items: center; gap: 6px; white-space: nowrap; }
#legenda-traffico i { width: 18px; height: 4px; background: var(--colore); border-radius: 3px; }
.comunale.sc-aperto #movimento-traffico { bottom: 112px; }
.comunale #scheda, .comunale.pv-aperto #scheda { left: auto; right: 0; top: var(--testa); bottom: 0; width: var(--scheda-w); max-height: none; border-radius: 0; box-shadow: none; border: 0; border-left: 1px solid var(--line); }
.comunale #scheda > header { padding: 16px 18px; min-height: 22px; }
.comunale #info { padding: 22px; }
.comunale #info h2 { font-size: 23px; line-height: 1.2; margin-bottom: 10px; letter-spacing: -.6px; }
.comunale #info h3 { margin-top: 24px; }
.comunale #info td { padding: 8px 0; border-bottom: 1px solid #edf0f1; }
.comunale #info .nota { line-height: 1.6; margin: 10px 0; }
.comunale #info .foto { margin: 20px 0; }
.comunale #info .foto img { max-width: 100%; border-radius: 8px; }
.comunale #info .indicatore { font-size: 25px; margin: 22px 0; color: #1767d3; }
.comunale #info .indicatore span { display: block; font-size: 12px; line-height: 1.6; margin-top: 8px; }
.dettaglio-bene { padding: 16px 0; border-bottom: 1px solid var(--line); }
.dettaglio-bene summary { font-size: 13px; font-weight: 650; cursor: pointer; }
.sintesi-bene { margin: 18px 0; }
.comunale .maplibregl-ctrl-top-right { right: 0 !important; top: 12px; }
.comunale .maplibregl-ctrl-bottom-right { right: 0; }
.comunale #legenda-mappa { bottom: calc(var(--fondo) + 40px); left: calc(var(--sx) + 38px); top: auto; max-height: 30vh; overflow-y: auto; background: #ffffffef; border-color: #d6e1ef; color: #243c61; }
.comunale:has(#movimento-traffico:not([hidden])) #legenda-mappa { bottom: calc(var(--fondo) + 140px); }
.comunale #legenda-mappa button { color: inherit; background: transparent; }
.comunale #legenda-mappa button.voce[aria-pressed=true] { color: #075fc9; background: #e6f0ff; box-shadow: inset 2px 0 #2677de; }
.comunale #legenda-mappa button.voce.spenta { opacity: 1; color: #7b8aa1; }
.comunale #legenda-mappa button.voce.spenta .col { opacity: .55; }
.comunale #legenda-mappa .suggerimento { color: #607797; }
.comunale #legenda-mappa button.voce:focus-visible { outline: 2px solid #2677de; outline-offset: 2px; }
.comunale #legenda-mappa .estremi { color: #607797; }
#attivita-home { position: absolute; left: calc(var(--sx) + 20px); right: calc(var(--dx) + 20px); bottom: 20px; height: var(--attivita-h, 142px); box-sizing: border-box; padding: 8px 12px; background: #fff; border: 1px solid var(--line); border-radius: 9px; overflow: auto; }
#attivita-home > header { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 32px; }
#attivita-home h2 { margin: 0; font-size: 15px; }
#attivita-home button { font: inherit; cursor: pointer; border: 0; background: none; }
#espandi-attivita { display: flex; align-items: center; gap: 10px; color: var(--fg); font-weight: 650 !important; padding: 3px 4px; }
#espandi-attivita svg { width: 18px; height: 18px; fill: none; stroke: #395c8a; stroke-width: 1.8; }
#espandi-attivita[aria-expanded=false] svg { transform: rotate(-90deg); }
#attivita-home #tutte-attivita { color: #1767d3; font-size: 12px; padding: 5px 8px; }
#tutte-attivita span { margin-left: 8px; }
#attivita-home table { width: 100%; border-collapse: collapse; font-size: 12px; text-align: left; }
#attivita-home th { background: #f3f6fb; color: #486083; font-weight: 550; padding: 6px 12px; }
#attivita-home td { padding: 7px 12px; border-bottom: 1px solid #edf1f7; }
#attivita-home th:first-child { width: 55%; }
#attivita-home td:first-child button { text-align: left; color: var(--fg); padding: 0; }
#attivita-home td:first-child button:hover { color: #1767d3; text-decoration: underline; }
.stato-attivita { display: inline-block; white-space: nowrap; padding: 3px 9px; border-radius: 14px; font-size: 11px; background: #dff2f1; color: #0c797a; }
.stato-attivita.in-carico { background: #e3efff; color: #0c5fc8; }
.nessuna-attivita { color: #6c7f98; }
.comunale.attivita-compatte #attivita-home { height: 52px; }
.comunale:not(.vista-panoramica) #attivita-home, .comunale:is(.sc-aperto,.pv-aperto,.ro-aperto) #attivita-home { display: none; }
.comunale .sc-scheda, .comunale .pv-pannello { top: var(--testa); bottom: 0; right: 0; max-height: calc(100vh - var(--testa)); border-radius: 0; }
.comunale .sc-legenda-mappa { top: calc(var(--testa) + var(--titolo-h) + 68px); left: calc(var(--sx) + 38px); }
.comunale .ro-pannello { top: var(--testa); right: 0; left: auto; bottom: 0; width: 470px; max-width: calc(100vw - var(--rail-w)); max-height: calc(100vh - var(--testa)); border-radius: 0; }
.comunale .pv-pannello { width: 520px; }
.comunale.pv-aperto #scheda, .comunale.ro-aperto #scheda { display: none; }
.comunale #asset[hidden] { display: none; }
.catalogo .conta { display: block; padding: 10px 0; font-size: 13px; color: #1767d3; font-weight: 600; }
.catalogo .risultato-bene { width: 100%; display: block; padding: 10px 0; text-align: left; background: none; border: 0; border-bottom: 1px solid var(--line); font: 13px system-ui; }
.catalogo .risultato-bene small { display: block; color: var(--muted); margin-top: 4px; }
.catalogo .vuoto { padding: 13px; background: #f3f6fb; border-radius: 6px; line-height: 1.6; font-size: 12px; }
@media (max-width: 1200px) {
  body.comunale { --rail-w: 184px; --panel-w: 290px; --scheda-w: 320px; }
  .comunale #viste button, .comunale #viste #vai-validazione { padding-left: 12px; gap: 10px; font-size: 12px; }
  #intestazione { gap: 24px; padding-left: 20px; padding-right: 20px; }
  .comunale.scheda-aperta #azioni-mappa h2 { display: none; }
  #azioni-mappa { justify-content: space-between; gap: 6px; padding-left: 10px; }
  #azioni-mappa button { font-size: 11px; padding: 7px; }
  .azioni-rapide { gap: 5px; }
  .comunale.scheda-aperta:not(.pannello-chiuso):not(.sc-aperto):not(.pv-aperto) { --dx: 0px; }
  .comunale.scheda-aperta:not(.pannello-chiuso) #scheda { z-index: 20; }
}
@media (max-width: 960px) {
  body.comunale { --rail-w: 72px; }
  .comunale #viste button, .comunale #viste #vai-validazione { flex-direction: column; text-align: center; justify-content: center; font-size: 9px; gap: 4px; padding: 9px 3px; min-height: 58px; }
  .marchio strong { font-size: 17px; }
  .marchio > svg { width: 30px; height: 30px; }
  #apri-account > span:not(.icona-account), #apri-account .chevron { display: none; }
  #intestazione .cerca { width: auto; flex: 1; }
}
@media (max-width: 720px) {
  body.comunale { --rail-w: 62px; --testa: 110px; --titolo-h: 62px; --sx: var(--rail-w); --panel-w: min(320px, calc(100vw - 62px)); --scheda-w: min(350px, calc(100vw - 62px)); --dx: 0px !important; }
  body.comunale.pannello-chiuso { --sx: var(--rail-w); }
  body.comunale.vista-panoramica { --fondo: 154px; }
  body.comunale.vista-panoramica.attivita-compatte { --fondo: 66px; }
  #intestazione { flex-wrap: wrap; justify-content: space-between; gap: 7px; padding: 10px 14px; }
  #intestazione .cerca { flex: auto; order: 3; width: 100%; }
  #intestazione input { padding-top: 8px; padding-bottom: 8px; font-size: 12px; }
  #intestazione .cerca > svg { top: 8px; }
  .marchio strong { font-size: 16px; }
  .marchio small { font-size: 11px; }
  #testa-vista { left: calc(var(--sx) + 10px); right: 10px; }
  #testa-vista h1 { font-size: 23px; }
  #data-vista { font-size: 11px; }
  #vista-home { left: calc(var(--sx) + 8px); right: 8px; bottom: calc(var(--fondo) + 8px); }
  .comunale #map { top: 84px; left: 4px; right: 4px; bottom: 4px; }
  .comunale #viste { top: var(--testa); bottom: 0; right: auto; width: var(--rail-w); height: auto; flex-direction: column; display: flex; gap: 12px; padding: 10px 4px; }
  .comunale #viste button, .comunale #viste #vai-validazione { font-size: 8px; min-height: 50px; padding: 7px 1px; }
  .comunale #viste button svg, .comunale #viste #vai-validazione svg { width: 19px; height: 19px; }
  .comunale #pannello { left: var(--rail-w); width: var(--panel-w); max-width: none; z-index: 15; display: flex; }
  .comunale.pannello-chiuso #pannello { display: none; }
  .comunale #scheda, .comunale.pv-aperto #scheda { right: 0; left: auto; max-width: none; }
  #azioni-mappa { min-height: 84px; flex-wrap: wrap; align-content: center; gap: 6px; padding: 7px; }
  #azioni-mappa h2, .comunale.scheda-aperta #azioni-mappa h2 { display: block; font-size: 15px; }
  .azioni-rapide { order: 3; width: 100%; justify-content: space-between; }
  #azioni-mappa button { padding: 6px; font-size: 10px; gap: 4px; }
  #azioni-mappa svg { width: 14px; height: 14px; }
  #azioni-mappa .modo-vista button { padding: 4px 10px; }
  .comunale:not(.pannello-chiuso) #map, .comunale:is(.sc-aperto,.pv-aperto,.ro-aperto) #map { top: 52px; }
  #attivita-home { left: calc(var(--sx) + 8px); right: 8px; bottom: 8px; height: 146px; padding: 8px; }
  #attivita-home h2 { font-size: 12px; }
  #attivita-home table { font-size: 10px; }
  #attivita-home th, #attivita-home td { padding: 6px; }
  #attivita-home th:first-child { width: auto; }
  #attivita-home #tutte-attivita { font-size: 10px; padding: 2px; }
  .stato-attivita { font-size: 9px; padding: 3px 6px; white-space: normal; }
  #movimento-traffico { left: calc(var(--sx) + 18px); bottom: calc(var(--fondo) + 90px); max-width: calc(100vw - var(--rail-w) - 75px); gap: 6px; font-size: 10px; padding: 8px; }
  .traffico-intestazione { gap: 6px; flex-wrap: wrap; }
  .traffico-intestazione strong { font-size: 11px; }
  .traffico-intestazione small { display: none; }
  #legenda-traffico { gap: 6px 10px; font-size: 9px; }
  #legenda-traffico i { width: 12px; }
  .comunale .sc-scheda, .comunale .pv-pannello { left: var(--rail-w); right: 0; top: auto; bottom: 0; width: auto; max-height: 52vh; }
  .comunale .ro-pannello { left: var(--rail-w); width: auto; }
  .comunale .sc-tempo { left: calc(var(--rail-w) + 8px); }
}

.beni-da-validare { padding: 12px; margin: 10px 0; background: #edf4ff; border: 1px solid #cbdcf3; border-radius: 7px; font-size: 12px; line-height: 1.6; }
.beni-da-validare p { margin: 7px 0 0; }
.beni-da-validare a { display: inline-block; margin-top: 5px; color: #155fb8; font-weight: 600; }
.comunale #asset .banner-demo, .comunale .asset-provenienza { background: #f2eef9; border: 1px solid #dcd0ed; color: #56406d; padding: 10px; border-radius: 6px; line-height: 1.55; font-size: 12px; }
.comunale #pannello .asset-categoria { display: flex; gap: 8px; align-items: flex-start; margin: 5px 0; }
.asset-categoria input { margin-top: 3px; }
.asset-categoria small { display: block; margin-top: 3px; font-size: 10px; color: #627694; }
.asset-fonti { font-size: 11px; line-height: 1.55; color: var(--muted); margin-top: 12px; }
.asset-fonti summary { cursor: pointer; font-size: 12px; color: #155fb8; }
#avviso-asset-mappa { position: absolute; z-index: 5; top: 64px; left: 18px; pointer-events: none; padding: 6px 9px; background: #fff; color: #56406d; border: 1px solid #dcd0ed; border-radius: 5px; font-size: 10px; }
#avviso-asset-mappa[hidden] { display: none; }
/* Durante un'analisi gli asset del bando sono spenti (isolaMappa): l'etichetta dichiarerebbe una provenienza sbagliata. */
.comunale.sc-aperto #avviso-asset-mappa { display: none; }

/* Un solo accento per i controlli; i campioni cartografici conservano il colore del dato. */
.origine-dato { display: inline-block; padding: 3px 7px; border: 1px solid #c8d8ed; border-radius: 5px; font-size: 10px; line-height: 1.4; font-weight: 600; }
.origine-interna { background: #edf3fc; color: #315781; }
.nota-origine, .sc-aggiornamento { padding: 10px 12px; background: #f4f7fb; border: 1px solid #d6e1ef; border-radius: 7px; color: #526a8b; font-size: 12px; line-height: 1.6; }
.nota-origine .origine-dato { margin-right: 5px; }
#attivita-home .origine-dato { margin-left: 8px; padding: 1px 5px; font-size: 9px; }
.ro-voce .origine-dato { margin-top: 6px; }
.comunale input:is([type=checkbox], [type=radio], [type=range]) { accent-color: var(--accent); }
.comunale :is(select, input[type=search], input[type=date], input[type=number]) { color: var(--fg); background-color: #f7f9fc; border-color: var(--line); }
.comunale :is(select, input):focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.comunale #pannello label.check { padding: 6px 8px; border-radius: 5px; font-size: 13px; }
.comunale #pannello label.check:has(input:checked) { background: #e6f0ff; color: #155fb8; }
.comunale #pannello label.check:hover { background: #edf3fc; }
.comunale .filtro-attivo { background: #e6f0ff; color: #155fb8; border-color: #b6d2f7; padding: 8px; }
.comunale .filtro-attivo .mini { color: #155fb8; background: #fff; border-color: #b6d2f7; }
.comunale .sc-scheda .pulsanti button[aria-pressed=true], .comunale .sc-sezioni button[aria-pressed=true] { background: #e6f0ff; color: #155fb8; border-color: #b6d2f7; box-shadow: inset 0 0 0 1px #b6d2f7; }
.comunale #pannello .tag { color: #526a8b; background: #f3f6fb; border-color: #d6e1ef; }
.dimensione-mappa { display: flex; flex: none; gap: 5px; }
#azioni-mappa .dimensione-mappa :is(button, a) { display: inline-flex; align-items: center; justify-content: center; box-sizing: border-box; width: 32px; height: 32px; padding: 6px; background: #fff; color: #29446e; border: 1px solid #d6e1ef; border-radius: 6px; }
#azioni-mappa .dimensione-mappa button[aria-pressed=true] { background: #e6f0ff; color: #0c5fc8; border-color: #b6d2f7; }
#azioni-mappa :is(button, a):hover { background: #edf3fc; }
/* Il contenitore governa le due righe anche quando i pannelli riducono la mappa. */
#vista-home { container-type: inline-size; }
@container (max-width: 710px) {
  #avviso-asset-mappa { top: 100px; }
  .comunale:not(.pannello-chiuso) #avviso-asset-mappa, .comunale:is(.pv-aperto,.ro-aperto) #avviso-asset-mappa { top: 64px; }
  #azioni-mappa { flex-wrap: wrap; align-content: center; gap: 6px; min-height: 88px; padding: 7px; }
  #azioni-mappa h2 { display: block; font-size: 15px; }
  .azioni-rapide { order: 3; width: 100%; justify-content: flex-start; }
  .comunale #map { top: 88px; }
  .comunale:not(.pannello-chiuso) #map, .comunale:is(.sc-aperto,.pv-aperto,.ro-aperto) #map { top: 52px; }
  .comunale:not(.pannello-chiuso) #azioni-mappa, .comunale:is(.sc-aperto,.pv-aperto,.ro-aperto) #azioni-mappa { min-height: 52px; }
}
@container (max-width: 300px) {
  #azioni-mappa h2 { display: none; }
  #azioni-mappa { justify-content: space-between; }
  #azioni-mappa button { padding: 6px; font-size: 10px; gap: 4px; }
}
body.comunale.mappa-ampliata { --rail-w: 0px; --testa: 0px; --titolo-h: 0px; --fondo: 0px; --sx: var(--panel-w); }
body.comunale.mappa-ampliata.pannello-chiuso { --sx: 0px; }
.comunale.mappa-ampliata :is(#intestazione, #viste, #testa-vista, #attivita-home, #prossimi-home) { display: none; }
.comunale.mappa-ampliata #vista-home { top: 0; left: var(--sx); right: var(--dx); bottom: 0; border-radius: 0; border: 0; }
.comunale.mappa-ampliata #movimento-traffico { left: calc(var(--sx) + 18px); bottom: 40px; }
.comunale.mappa-ampliata #legenda-mappa { left: calc(var(--sx) + 18px); bottom: 40px; }
.comunale.mappa-ampliata:has(#movimento-traffico:not([hidden])) #legenda-mappa { bottom: 150px; }
.comunale.mappa-ampliata.sc-aperto #movimento-traffico { bottom: 112px; }
@media (max-width: 720px) {
  body.comunale.mappa-ampliata { --sx: 0px; --panel-w: min(320px, calc(100vw - 48px)); --scheda-w: min(350px, calc(100vw - 48px)); }
  .comunale.mappa-ampliata #movimento-traffico { bottom: 80px; }
}

/* Testata: menu dell'account (chi, ruolo e portata; Account e aggiornamenti; Esci). */
#intestazione .account { position: relative; flex: none; }
#apri-account[aria-expanded=true] .chevron { transform: rotate(180deg); }
#apri-account[aria-current=page] #nome-account { color: #075fc9; font-weight: 650; }
#menu-account { position: absolute; top: calc(100% + 12px); right: 0; z-index: 45; width: 280px; padding: 6px; box-sizing: border-box; background: #fff; border: 1px solid var(--line); border-radius: 8px; box-shadow: 0 10px 28px rgba(23, 36, 69, .16); }
#menu-account[hidden], #menu-account form[hidden] { display: none; }
#menu-account-chi { margin: 0 0 4px; padding: 8px 10px 10px; border-bottom: 1px solid var(--line); color: var(--fg); font-size: 13px; line-height: 1.45; }
#menu-account-chi small { display: block; margin-top: 3px; color: var(--muted); font-size: 11px; }
#menu-account form { margin: 0; }
#menu-account [role=menuitem] { display: flex; align-items: center; gap: 10px; width: 100%; padding: 9px 10px; border: 0; border-radius: 5px; background: none; color: #29446e; font: 13px system-ui; text-align: left; cursor: pointer; }
#menu-account [role=menuitem]:is(:hover, :focus-visible) { background: #edf3fc; color: #075fc9; }
#menu-account [role=menuitem] svg { width: 18px; height: 18px; flex: none; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }

/* Data unica sotto il titolo: «oggi», «data scelta» con «Torna a oggi», «data dell'analisi»; «ambiente tecnico» quando serve. */
#data-riga { display: flex; align-items: center; gap: 2px 6px; min-width: 0; margin: 0; color: #6c80a0; font-size: 13px; }
#uffici-stato a { color: #155fb8; font-weight: 600; }

/* Pulsanti secondari del layout (bordo chiaro, testo blu) al posto dei grigi di sistema. */
.comunale :is(.secondario, #data-oggi, [data-pg-oggi]) { display: inline-flex; align-items: center; justify-content: flex-start; gap: 6px; box-sizing: border-box; margin: 0; padding: 7px 11px; background: #fff; color: #155fb8; border: 1px solid #d6e1ef; border-radius: 6px; font: 500 12px system-ui; line-height: 1.3; text-align: left; cursor: pointer; }
.comunale :is(.secondario, #data-oggi, [data-pg-oggi]):hover { background: #edf3fc; border-color: #b6d2f7; }
.comunale :is(#data-oggi, [data-pg-oggi]) { padding: 2px 9px; font-size: 11px; }
.comunale #data-oggi[hidden] { display: none; }
.azioni-secondarie { display: flex; flex-direction: column; align-items: stretch; gap: 8px; }
.comunale .vista > .apri-storico { margin-bottom: 8px; }

/* Panoramica: Attività aperte e Prossimi giorni affiancate in fondo, stessa altezza, ridotte insieme a una riga. */
body.comunale.vista-panoramica { --pgh-w: min(440px, calc((100vw - var(--sx) - var(--dx) - 52px) * .4)); }
body.comunale.vista-panoramica.attivita-brevi:has(.pgh-voci li + li) { --attivita-h: 142px; }
.comunale.vista-panoramica #attivita-home { right: calc(var(--dx) + 32px + var(--pgh-w)); }
#prossimi-home { position: absolute; right: calc(var(--dx) + 20px); bottom: 20px; width: var(--pgh-w, 400px); height: var(--attivita-h, 142px); box-sizing: border-box; padding: 8px 12px; background: #fff; border: 1px solid var(--line); border-radius: 9px; overflow: auto; }
#prossimi-home > header { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 32px; }
#prossimi-home h2 { margin: 0; padding: 3px 4px; font-size: 15px; font-weight: 650; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
#pgh-conta { color: var(--muted); font-size: 12px; font-weight: 400; }
#tutti-prossimi { flex: none; padding: 5px 8px; border: 0; background: none; color: #1767d3; font: 12px system-ui; cursor: pointer; }
#tutti-prossimi span { margin-left: 8px; }
.pgh-sintesi { margin: 2px 4px 4px; color: #526a8b; font-size: 12px; line-height: 1.5; }
.pgh-voci { list-style: none; margin: 0; padding: 0; }
.pgh-voci li { display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: center; gap: 3px 8px; padding: 5px 4px; border-top: 1px solid #edf1f7; font-size: 12px; }
.pgh-voci .pg-l { margin: 0; }
.pgh-voci button { min-width: 0; padding: 0; border: 0; background: none; color: var(--fg); font: 12px system-ui; text-align: left; cursor: pointer; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pgh-voci button:hover { color: #1767d3; text-decoration: underline; }
.pgh-d { grid-column: 1 / -1; display: flex; align-items: center; gap: 8px; min-width: 0; }
.pgh-f { flex: none; }
.pgh-f .sc-fonte { font-size: 10px; padding: 0 6px; }
.pgh-q { flex: 1 1 0; min-width: 0; color: #627694; font-size: 11px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pgh-d .sigla-settore { flex: none; margin-left: 0; }
.comunale.attivita-compatte #prossimi-home { height: 52px; }
.comunale:not(.vista-panoramica) #prossimi-home, .comunale:is(.sc-aperto,.pv-aperto,.ro-aperto) #prossimi-home { display: none; }

/* Sigla del settore della barra accanto all'ufficio (com'è, a volte un ente esterno): Attività aperte, Prossimi giorni. */
.sigla-settore, .pg-settore { display: inline-block; margin-left: 6px; padding: 0 5px; border: 1px solid #c8d8ed; border-radius: 4px; color: #526a8b; font-size: 9px; font-weight: 650; line-height: 1.6; vertical-align: 1px; }

/* Nota sotto le voci del settore: cosa la voce non fa (Urbanistica › Prova modifiche alla viabilità). */
.uf-nota { margin: 8px 0 0; color: #526a8b; font-size: 11px; line-height: 1.5; }

/* Procedura aperta: sotto la testata e i comandi della mappa, accanto ai controlli; non copre ricerca, titolo e scheda. */
.comunale .procedura:not(.procedura-ridotta) { top: calc(var(--testa) + var(--titolo-h) + 64px); right: calc(var(--dx) + 80px); max-height: calc(100vh - var(--testa) - var(--titolo-h) - 100px); }
/* Procedura ridotta a un richiamo al cambio di settore: l'attività resta presa in carico, «riprendi» riapre i passi.
   Il richiamo sta nella riga della data (procedura.js), accorciato con i puntini se lo spazio non basta. */
.procedura.procedura-ridotta { display: none; }
#data-riga > :not(.procedura-richiamo) { flex: none; }
.procedura-richiamo { display: inline-flex; gap: 4px; flex: 0 1 auto; min-width: 0; margin-left: 6px; padding: 2px 10px; border: 1px solid #b6d2f7; border-radius: 11px; background: #edf3fc; color: var(--fg); font: 12px system-ui; line-height: 1.4; text-align: left; cursor: pointer; white-space: nowrap; }
.procedura-richiamo span { min-width: 0; overflow: hidden; text-overflow: ellipsis; }
.procedura-richiamo b { flex: none; color: #1767d3; }
.procedura-richiamo:hover { background: #dfeafa; }

/* Schermi bassi (proiettore 1280×720): barra e titolo più fitti, così Impostazioni e Aiuto restano sopra la piega. */
@media (max-height: 800px) and (min-width: 721px) {
  body.comunale { --titolo-h: 64px; }
  #testa-vista h1 { font-size: 24px; }
  body.comunale #viste { padding-top: 10px; padding-bottom: 10px; gap: 10px; }
  .comunale #viste .viste-principali button, .comunale #viste .viste-servizio :is(button, #vai-validazione) { min-height: 36px; padding-top: 7px; padding-bottom: 7px; }
  .comunale #viste #uffici-elenco button { min-height: 32px; padding-top: 5px; padding-bottom: 5px; }
  .comunale #viste .uf-sigla { width: 22px; height: 22px; }
}
@media (max-width: 720px) {
  body.comunale.vista-panoramica { --fondo: 200px; }
  body.comunale.vista-panoramica.attivita-compatte { --fondo: 112px; }
  .comunale.vista-panoramica #attivita-home { right: 8px; }
  #prossimi-home { left: calc(var(--sx) + 8px); right: 8px; bottom: 160px; width: auto; height: 40px; padding: 4px 8px; }
  .comunale.attivita-compatte #prossimi-home { bottom: 66px; height: 40px; }
  #prossimi-home > header { min-height: 30px; }
  #prossimi-home h2 { font-size: 12px; }
  #tutti-prossimi { font-size: 10px; padding: 2px; }
  #pgh-corpo { display: none; }
  #data-riga { font-size: 11px; }
  #menu-account { right: -6px; width: min(280px, calc(100vw - 24px)); }
  .comunale .procedura:not(.procedura-ridotta) { left: calc(var(--rail-w) + 8px); right: 8px; width: auto; top: calc(var(--testa) + 8px); max-height: calc(100vh - var(--testa) - 16px); }
}

/* «Cambia data» in testata e il suo riquadro (14/10: la data non sta più in «Tutti i previsionali») */
.comunale #azioni-mappa #data-cambia { flex: none; display: inline-flex; align-items: center; gap: 6px; font-weight: 600; white-space: nowrap; }
.comunale #azioni-mappa #data-cambia svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.comunale #azioni-mappa #data-cambia .fm-giu { width: 14px; height: 14px; }
.comunale #azioni-mappa #data-cambia:is([aria-expanded=true], .non-oggi) { background: #e6f0ff; border-color: #b6d2f7; color: #0c5fc8; }
.comunale #data-cambia[hidden] { display: none; }
#scelta-data { position: fixed; z-index: 60; width: 340px; max-width: calc(100vw - 16px); box-sizing: border-box; padding: 12px 14px; background: #fff; border: 1px solid var(--line); border-radius: 9px; box-shadow: 0 8px 24px rgba(16, 32, 60, .18); font-size: 13px; }
#scelta-data[hidden] { display: none; }
#scelta-data h2 { margin: 0 0 6px; font-size: 14px; font-weight: 650; }
#scelta-data .nota { margin: 8px 0 0; }
.comunale.mappa-ampliata #scelta-data { display: none; }