/* Album fotografici: elenco, griglia delle foto e visore a schermo intero.
   I colori arrivano dalle variabili di parrocchia-home.css, cosi' la galleria
   segue da sola il tema chiaro/scuro e il colore del tempo liturgico. */

/* ---- elenco degli album ---- */

.pbmv-album-elenco{display:grid;gap:24px;margin:26px 0 10px;
  grid-template-columns:repeat(auto-fill,minmax(min(100%,290px),1fr))}

.pbmv-album-carta{display:flex;flex-direction:column;text-decoration:none !important;
  background:var(--pbmv-sfondo);border:1px solid var(--pbmv-bordo);border-radius:16px;
  overflow:hidden;box-shadow:var(--pbmv-ombra);color:var(--pbmv-testo) !important;
  transition:transform .18s ease,box-shadow .18s ease}
.pbmv-album-carta:hover{transform:translateY(-3px);
  box-shadow:0 6px 14px rgba(16,24,40,.10),0 16px 40px rgba(16,24,40,.12)}
.pbmv-album-carta:focus-visible{outline:3px solid var(--liturgico,#2F6B4A);outline-offset:3px}

.pbmv-album-copertina{display:block;aspect-ratio:4/3;background:var(--pbmv-fondo) center/cover no-repeat;
  position:relative}
.pbmv-album-senza{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;
  color:var(--pbmv-tenue);font-size:17px;letter-spacing:.08em;text-transform:uppercase}
.pbmv-album-testo{display:block;padding:16px 18px 19px}
.pbmv-album-testo strong{display:block;font-size:20.5px;line-height:1.3;margin-bottom:5px}
.pbmv-album-testo em{font-style:normal;font-size:15.5px;color:var(--pbmv-tenue)}

/* L'etichetta va scritta con un selettore almeno specifico quanto
   ".pbmv-album-testo em", altrimenti quella regola le ridava il grigio tenue e
   sul tema chiaro spariva dentro il rosso. */
.pbmv-album-testo .pbmv-album-nascosto,
.pbmv-album-nascosto{display:inline-block;margin-left:8px;padding:3px 11px;border-radius:999px;
  background:#a01b1d;color:#fff !important;font-style:normal;font-size:13.5px;font-weight:700;
  letter-spacing:.03em;text-transform:uppercase;vertical-align:middle;line-height:1.35;
  box-shadow:0 1px 2px rgba(0,0,0,.25)}
.pbmv-avviso-nascosto{margin:18px 0;padding:13px 17px;border-radius:12px;
  border:1px solid var(--pbmv-bordo);border-left:5px solid #a01b1d;
  background:var(--pbmv-fondo);font-size:16px;color:var(--pbmv-testo)}
.pbmv-avviso-nascosto strong{color:#a01b1d}
:root:not([data-theme="light"]) .pbmv-avviso-nascosto strong{color:#ff9b9c}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]) .pbmv-album-testo .pbmv-album-nascosto,
  :root:not([data-theme="light"]) .pbmv-album-nascosto{background:#c9302c}
}
:root[data-theme="dark"] .pbmv-album-testo .pbmv-album-nascosto,
:root[data-theme="dark"] .pbmv-album-nascosto{background:#c9302c}
:root[data-theme="dark"] .pbmv-avviso-nascosto strong{color:#ff9b9c}
.pbmv-album-vuoto{font-size:18px;color:var(--pbmv-tenue)}
.pbmv-album-crea{display:inline-block;background:var(--liturgico,#2F6B4A);color:#fff !important;
  padding:10px 22px;border-radius:999px;text-decoration:none;font-weight:600}

.pbmv-archivio-rimando{margin-top:34px;padding-top:18px;border-top:1px solid var(--pbmv-bordo);
  font-size:15.5px;color:var(--pbmv-tenue)}
.pbmv-archivio-rimando a{color:var(--liturgico,var(--pbmv-testo))}

/* ---- la pagina dell'album occupa tutta la larghezza ----
   Il tema dimensiona la scheda sul contenuto: con due righe di descrizione la
   colonna restava larga 441px su 1280 e le fotografie stavano in due file. */
.single-pbmv_album .newsx-single-inner,
.single-pbmv_album .content-area.primary,
.single-pbmv_album .newsx-single-content-wrap,
.single-pbmv_album .newsx-single-content-wrap > article,
.single-pbmv_album .newsx-post-content{width:100% !important;max-width:100% !important;
  flex:1 1 100% !important}

/* ---- griglia delle fotografie dentro un album ---- */

.pbmv-foto-griglia{display:grid;gap:12px;margin:26px 0 14px;
  grid-template-columns:repeat(auto-fill,minmax(min(100%,200px),1fr))}
.pbmv-foto{padding:0;border:0;background:var(--pbmv-fondo);border-radius:12px;overflow:hidden;
  cursor:zoom-in;aspect-ratio:1;display:block;box-shadow:0 1px 3px rgba(16,24,40,.10)}
.pbmv-foto img{width:100%;height:100%;object-fit:cover;display:block;
  transition:transform .3s ease}
.pbmv-foto:hover img{transform:scale(1.05)}
.pbmv-foto:focus-visible{outline:3px solid var(--liturgico,#2F6B4A);outline-offset:3px}
.pbmv-foto-quante{font-size:15.5px;color:var(--pbmv-tenue)}

/* ---- il visore a schermo intero ---- */

.pbmv-visore[hidden]{display:none !important}
/* il blocco dello scorrimento del visore e' suo: quello del menu laterale si
   spegne sopra gli 861px, qui invece serve a ogni larghezza */
html.pbmv-fermo,html.pbmv-fermo body{overflow:hidden}
.pbmv-visore{position:fixed;inset:0;z-index:100000;display:flex;flex-direction:column;
  background:rgba(8,10,12,.94);opacity:0;transition:opacity .2s ease}
.pbmv-visore.pbmv-visibile{opacity:1}
.pbmv-visore-scena{flex:1;display:flex;align-items:center;justify-content:center;
  padding:14px;min-height:0}
.pbmv-visore img{max-width:100%;max-height:100%;object-fit:contain;border-radius:6px;
  box-shadow:0 10px 50px rgba(0,0,0,.5)}
.pbmv-visore-barra{display:flex;align-items:center;justify-content:space-between;gap:14px;
  padding:12px 18px 18px;color:#fff;font-size:16px}
.pbmv-visore-didascalia{flex:1;min-width:0;line-height:1.5}
.pbmv-visore-conta{flex:none;color:#c9ced4;font-variant-numeric:tabular-nums}

.pbmv-visore button{border:0;cursor:pointer;color:#fff;background:rgba(255,255,255,.14);
  border-radius:50%;width:52px;height:52px;font-size:26px;line-height:1;
  display:flex;align-items:center;justify-content:center;
  backdrop-filter:blur(3px);transition:background .15s}
.pbmv-visore button:hover{background:rgba(255,255,255,.28)}
.pbmv-visore button:focus-visible{outline:2px solid #fff;outline-offset:3px}
.pbmv-visore-chiudi{position:absolute;top:14px;right:16px;z-index:2}
.pbmv-visore-prec,.pbmv-visore-succ{position:absolute;top:50%;transform:translateY(-50%);z-index:2}
.pbmv-visore-prec{left:14px}
.pbmv-visore-succ{right:14px}

@media (max-width:860px){
  .pbmv-visore-prec,.pbmv-visore-succ{width:46px;height:46px}
  .pbmv-visore-prec{left:6px}
  .pbmv-visore-succ{right:6px}
  .pbmv-visore-barra{font-size:15px;padding:10px 14px 16px}
  .pbmv-foto-griglia{gap:9px;grid-template-columns:repeat(auto-fill,minmax(min(100%,140px),1fr))}
  .pbmv-album-elenco{gap:18px}
}

@media (prefers-reduced-motion:reduce){
  .pbmv-album-carta,.pbmv-foto img,.pbmv-visore{transition:none}
  .pbmv-foto:hover img{transform:none}
}