.vv-container {
  box-sizing: border-box;
  width: min(92vw, var(--vv-maxw));
  max-width: var(--vv-maxw);
  margin: calc(var(--vv-top) + 8px) auto 24px;
  padding: var(--vv-pad);
  border-radius: var(--vv-radius);
  background: rgba(255, 255, 255, var(--vv-container-alpha));
  backdrop-filter: blur(var(--vv-container-blur));
}

.vv-container--list {
  min-height: calc(100vh - var(--vv-top) - var(--vv-bottom) - 24px);
  overflow: auto;
}

.vv-container--edit {
  min-height: calc(100vh - var(--vv-top) - 32px);
}

.vv-post-container {
  max-width: 100%;
  overflow-wrap: anywhere;
}

.vv-container img,
.vv-container video,
.vv-container iframe,
.vv-post-container img,
.vv-post-container video,
.vv-post-container iframe {
  max-width: 100%;
  height: auto;
  display: block;
}

body.page-diario-lista #pjax-root.vv-container {
  position: static !important;
  left: auto;
  right: auto;
  top: auto;
  width: min(92vw, var(--vv-maxw, 1200px));
  max-width: var(--vv-maxw, 1200px);
  margin: calc(var(--vv-top) + 8px) auto var(--vv-bottom, 24px);
  padding: .75rem 1rem;
  background: rgba(255, 255, 255, .78);
  backdrop-filter: blur(3px);
  border-radius: 12px;
  box-shadow: 0 6px 18px rgba(0, 0, 0, .12);
  overflow: auto;
  max-height: calc(100vh - var(--vv-top) - var(--vv-bottom, 24px) - 24px);
  box-sizing: border-box;
}

/* =========================================================
   VRV VIEW RESET
   Nuovo guscio per visualizza_post.php
   ========================================================= */
.vrv-view-shell {
  box-sizing: border-box;
  width: min(92vw, 1200px);
  margin: calc(var(--vv-top) + 8px) auto 24px;
  padding: 14px;
  /* guscio esterno SPENTO (era una scatola bianca/blur/angoli): solo centratura+respiro.
     L'unica CORNICE e' il passepartout .vv-postbg; il fondo-pagina lo da' .vrv-view-article. */
  background: transparent;
  /* contenitore FERMO ancorato alla finestra: non cresce col contenuto, il post scorre DENTRO.
     (-40px = respiro per il footer in fondo; si tara dal vivo) */
  height: calc(100dvh - var(--vv-top) - var(--vv-bottom, 42px) - 40px);
  min-height: 0;
  display: flex;
  flex-direction: column;
}

/* contenitore articolo visualizza */
.vrv-view-article {
  box-sizing: border-box;
  width: 100%;
  max-width: 100%;
  margin: 0 auto;
  padding: 1.25rem 1.25rem 0.1rem 1.25rem;
  /* fondo-PAGINA del post (sotto titolo+intestazione+accordion): velo piatto per leggibilita'
     sul wallpaper. NON e' una cornice: niente ombra/bordo, angoli appena arrotondati.
     La cornice vera e' il passepartout .vv-postbg dentro il contenuto. */
  background-color: rgba(255, 255, 255, 0.90);
  border-radius: 10px;
  box-shadow: none;
  /* riempie il guscio fermo e CLIPpa: titolo in cima, accordion che riempie, scroll interno. */
  flex: 1 1 auto;
  min-height: 0;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  line-height: 1.55;
  font-size: 1.05rem;
}

/* intestazione (titolo) fissa in cima alla card; il resto scorre nell'accordion */
.vrv-view-article > .vv-post-header { flex: 0 0 auto; }

/* =========================================================
   ADATTIVO — schermo piccolo o basso (telefono, landscape corto)
   La "card ferma con scroll interno" e' un lusso da desktop: su mobile
   da' fastidio (scroll annidato al tocco, cornici che mangiano spazio,
   100vh dietro la barra URL). Qui si torna al FLUSSO NATURALE: niente
   altezza fissa, scorre tutta la pagina come ci si aspetta sul telefono.
   ========================================================= */
@media (max-width: 820px), (max-height: 600px) {
  .vrv-view-shell {
    height: auto;          /* niente card ferma: cresce col contenuto */
    display: block;
    padding: 8px;
  }
  .vrv-view-article {
    display: block;        /* via il flex/clip: flusso normale */
    overflow: visible;
    min-height: 0;
  }

  /* post SENZA mappa: scorre tutta la pagina, niente scroll interno */
  .vrv-postmap[data-nomap] { height: auto; }
  body.page-visualizza-post .vrv-postmap[data-nomap] #vv-post-body {
    max-height: none;
    overflow: visible;
  }

  /* post CON mappa: l'iframe ha bisogno d'altezza → accordion limitato, ma in dvh */
  .vrv-postmap:not([data-nomap]) { height: 72dvh; }
}

/* body scrollabile vero del post */
body.page-visualizza-post #vv-post-body {
  width: 100%;
  /* colonna del testo al massimo --vv-colonna (vrv-post-content.css), uguale all'editor:
     + i margini scelti (--vv-mx) + la cornice da 10px. Foglio centrato. */
  max-width: min(100%, calc(var(--vv-colonna, 1060px) + 2 * var(--vv-mx, 20px) + 20px));
  margin-inline: auto;
  max-height: 85vh;
  display: flow-root;
  box-sizing: border-box;
  overflow: auto;
  resize: none;
  background-color: var(--post-fill, transparent); /* sfondo del CONTENUTO = colore scelto (--post-fill, ereditato da .vrv-view-article); fallback trasparente. Prima 'transparent' fisso vinceva sul sistema nuovo e lasciava trasparire la tinta-pagina. */
  /* testo staccato dal bordo come nell'editor.
     I lati leggono --vv-mx (impostata dal marcatore margini .vv-mx-* in
     vrv-post-content.css): cosi' i margini del menu Layout VINCONO senza
     guerre di specificita'. Senza marcatore: 20px come prima. */
  padding-block: 14px;
  padding-inline: var(--vv-mx, 20px);
  /* niente piu' zoom 0.85 (vitti 24/10/2026): stessa scala dell'editor */
}

/* ultimo elemento del contenuto: niente margine finale */
#vv-post-body>*:last-child {
  margin-bottom: 0;
}

/* firma compatta (16/10/2026: via i 4 `!important`, nessuno la contendeva) */
.vv-view-signature {
  margin-top: 2px;
  line-height: 1.1;
  font-size: 0.85rem;
  opacity: 0.85;
}

/* l'ancora vuota in fondo al post: `overflow:hidden` la rende un blocco a se'
   e ferma la fusione dei margini (senza, la firma sale di 1-2 px; misurato 16/10) */
#vv-post-bottom { overflow: hidden; }

/* la firma apre la faccia dell'autore (lib/firma.php, 21/09/2026) */
.vv-firma-autore { cursor: zoom-in; }
.vv-firma-autore:hover,
.vv-firma-autore:focus-visible { text-decoration: underline dotted; }

/* =========================================================
   TUTTA ALTEZZA nella VISTA (gemello del bottone dell'editor, 13/09/2026)
   Il post si prende tutta l'altezza della finestra. La larghezza NO: resta
   quella della pagina, se no si perde la proporzione di come e' impaginato.
   Qui non c'e' TinyMCE e non serve: il guscio .vrv-view-shell e' GIA' ancorato
   alla finestra, gli si tolgono solo il margine in cima e la slitta in fondo
   (-40px di respiro + 24 di margine + 42 di --vv-bottom che nessuno usa).
   In cima restano 44px: tanto basta al cartellino dell'utente, che sta fisso
   in alto a destra sopra ogni cosa (z-index 2147483647 in theme-default.css)
   e che NON si nasconde - dentro ci sono i comandi della radio.
   ========================================================= */
@media (min-width: 821px) and (min-height: 601px) {
  /* 13/10/2026: il corpo pagina ha 4px sopra e sotto (theme-default.css). In
     tutta altezza il foglio partiva 4px sotto il bordo e la pagina avanzava
     di 8px (misurato: foglio 4..918 in una finestra da 914). */
  body.theme-default.vv-tutta-altezza { padding: 0; }
  body.vv-tutta-altezza .vrv-view-shell {
    height: 100dvh;
    margin-top: 0;
    margin-bottom: 0;
    padding: 0 14px;
  }
  /* 12/10/2026, vitti: «non e' una vera tutta altezza». Il foglio ora va da
     bordo a bordo: i 44px in cima erano il posto del cartellino dell'utente.
     Il cartellino resta dov'e' (dentro c'e' la radio); quando la finestra e'
     stretta e finirebbe SOPRA i bottoni della testata, la testata si ritira
     di quanto serve. Su finestre larghe il conto fa zero e non cambia niente.
     (--vv-badge-pad = larghezza del cartellino, la misura il JS.) */
  body.vv-tutta-altezza .vv-post-header {
    padding-right: max(0px, calc(var(--vv-badge-pad, 220px) + 10px - (100vw - min(92vw, 1200px)) / 2));
  }
}

/* =========================================================
   IL PIEDE DELLA PAGINA nella VISTA
   (vitti, 15/09/2026: "e' sempre presente, e da' fastidio")

   PERCHE' ERA SEMPRE LI'. Il piede nasce nascosto (theme-default.css:
   position:fixed, opacity:0), e ad accenderlo c'e' `body:hover footer`:
   cioe' basta che il puntatore sia DENTRO LA PAGINA, e su un computer con
   il mouse quello e' sempre vero. Il "compare passandoci sopra" descritto
   in vrv-footer.js non ha mai funzionato: quel codice cerca una
   `.footer-hover-zone` che nessuno stampa (c'e' il CSS, c'e' il JS, manca
   l'elemento). E il file che avrebbe dovuto sistemarlo nella vista,
   css/theme-default.d/visualizza_post.css, NON E' CARICATO da
   visualizza_post.php: le sue 178 righe sono roba morta - controllato il
   15/09/2026 sui <link> della pagina servita. Da qui il posto giusto e'
   questo, che nella vista c'e' davvero.

   COSA FA ADESSO. Il piede resta fuori dalla finestra, con un lembo di 6px
   invisibile ma sensibile al puntatore: ci si passa sopra e sale. Niente JS.
   In tutta altezza era l'unica cosa che avanzava a video.
   ========================================================= */
body.page-visualizza-post footer.vv-footer {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  width: auto;
  margin: 0;
  z-index: 97;              /* sotto il cartellino dell'utente */
  opacity: 0;
  transform: translateY(calc(100% - 6px));
  transition: transform .25s ease, opacity .25s ease;
  pointer-events: auto;
}

/* spegne `body:hover footer` di theme-default.css: stessa forza della riga
   che segue (due classi + una pseudo-classe), quindi vince quella dopo. */
body.page-visualizza-post:hover footer.vv-footer { opacity: 0; }

body.page-visualizza-post footer.vv-footer:hover {
  opacity: 1;
  transform: translateY(0);
}

/* =========================================================
   LA FOTO DENTRO UN MASERATI RIEMPIE LO SLOT (09/10/2026)
   La regola stava solo in theme-default.d/visualizza_post.css, che carica
   l'ANTEPRIMA ma non la vista (vedi sopra): nella vista l'img restava alta
   quanto la foto, il ritaglio (object-position/zoom di vrp_crop.js) non
   aveva effetto e si vedeva la cima. Post 117, «Il corteo Presidenziale!»:
   giusto nell'anteprima, palazzo e alberi nel post. L'ID #vv-post-body
   batte le `img { height:auto }` sparse senza `!important`.
   ========================================================= */
#vv-post-body .vv-slot img {
  height: 100%;
}