/*
Theme Name: Fullscreen Gallery
Description: Tema per gallerie fotografiche a schermo intero con album e colori personalizzabili dal Customizer.
Version: 1.0
Text Domain: fullscreen-gallery
*/

*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth}
html.fg-open{overflow:hidden}
body{margin:0;background:var(--fg-bg);color:var(--fg-text);font-family:system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;line-height:1.6}
a{color:var(--fg-accent);text-decoration:none}
a:hover{text-decoration:underline}
img{max-width:100%;height:auto;display:block}

/* Header */
.site-header{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:1rem;padding:1rem clamp(1rem,4vw,3rem);background:var(--fg-header-bg);position:sticky;top:0;z-index:50}
.site-title{font-size:1.25rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--fg-text)}
.site-title:hover{text-decoration:none;color:var(--fg-accent)}
.main-nav ul{display:flex;flex-wrap:wrap;gap:1.5rem;list-style:none;margin:0;padding:0}
.main-nav a{color:var(--fg-text);font-size:.9rem;letter-spacing:.05em;text-transform:uppercase}
.main-nav a:hover,.main-nav .current-menu-item>a{color:var(--fg-accent);text-decoration:none}

main{padding:clamp(1rem,4vw,3rem)}
.page-title,.album-head h1{font-weight:300;font-size:clamp(1.8rem,4vw,3rem);margin:0 0 1rem}

/* Griglia album (archivio) */
.album-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:1.25rem}
.album-card{position:relative;display:block;aspect-ratio:4/3;overflow:hidden;background:var(--fg-card-bg)}
.album-card img{width:100%;height:100%;object-fit:cover;transition:transform .6s ease,opacity .3s}
.album-card:hover img{transform:scale(1.06);opacity:.85}
.album-title{position:absolute;inset:auto 0 0 0;padding:2.5rem 1rem 1rem;color:#fff;font-size:1.1rem;background:linear-gradient(transparent,rgba(0,0,0,.75))}
.album-count{display:block;font-size:.8rem;opacity:.75}

/* Album singolo */
.album-head{max-width:70ch;margin-bottom:2rem}
.fg-play{background:var(--fg-accent);color:var(--fg-bg);border:0;padding:.7rem 1.4rem;font-size:.9rem;letter-spacing:.06em;text-transform:uppercase;cursor:pointer;margin-top:.5rem}
.fg-play:hover{opacity:.85}
.fg-grid{column-count:var(--fg-cols);column-gap:var(--fg-gap)}
.fg-item{display:block;margin-bottom:var(--fg-gap);break-inside:avoid;background:var(--fg-card-bg);cursor:zoom-in;overflow:hidden}
.fg-item img{width:100%;transition:opacity .3s,transform .5s}
.fg-item:hover img{opacity:.85;transform:scale(1.03)}
@media (max-width:900px){.fg-grid{column-count:min(var(--fg-cols),3)}}
@media (max-width:600px){.fg-grid{column-count:2}}

.album-nav{display:flex;justify-content:space-between;margin-top:3rem;gap:1rem}

/* Lightbox a schermo intero */
.fg-lightbox{position:fixed;inset:0;z-index:9999;background:var(--fg-lightbox-bg);display:flex;align-items:center;justify-content:center}
.fg-lightbox[hidden]{display:none}
.fg-lightbox img{max-width:100vw;max-height:100vh;object-fit:contain;user-select:none}
.fg-lightbox button{position:absolute;background:rgba(0,0,0,.35);color:#fff;border:0;cursor:pointer;line-height:1;transition:background .2s,color .2s}
.fg-lightbox button:hover{background:var(--fg-accent);color:var(--fg-bg)}
.fg-close{top:1rem;right:1rem;width:2.8rem;height:2.8rem;font-size:1.8rem}
.fg-fs{top:1rem;right:4.2rem;width:2.8rem;height:2.8rem;font-size:1.3rem}
.fg-prev,.fg-next{top:50%;transform:translateY(-50%);width:3.2rem;height:5rem;font-size:2.6rem}
.fg-prev{left:.5rem}.fg-next{right:.5rem}
.fg-cap{position:absolute;bottom:0;left:0;right:0;margin:0;padding:1.5rem 1rem 1rem;text-align:center;color:#fff;background:linear-gradient(transparent,rgba(0,0,0,.6));pointer-events:none}
.fg-cap:empty{display:none}
.fg-count{position:absolute;top:1.3rem;left:1.2rem;color:#fff;font-size:.85rem;opacity:.8}

.site-footer{text-align:center;padding:2rem 1rem;font-size:.85rem;opacity:.7}
.screen-reader-text{position:absolute;left:-9999px}

/* Immagine di intestazione */
.site-hero{position:relative;height:var(--fg-hero-h,50vh);min-height:200px;background-size:cover;background-position:center;background-color:var(--fg-card-bg);display:flex;align-items:center;justify-content:center;text-align:center}
.site-hero.has-text::before{content:"";position:absolute;inset:0;background:rgba(0,0,0,.35)}
.site-hero-text{position:relative;color:#fff;padding:1rem;text-shadow:0 2px 12px rgba(0,0,0,.5)}
.site-hero-text p{margin:0}
.hero-title{font-size:clamp(2rem,6vw,4.5rem);font-weight:300;letter-spacing:.12em;text-transform:uppercase}
.hero-tagline{margin-top:.5rem;font-size:clamp(1rem,2vw,1.3rem);opacity:.9}

/* Footer personalizzabile */
.site-footer{background:var(--fg-footer-bg);opacity:1;color:var(--fg-text)}
.site-footer p{margin:.25rem 0}

/* Griglia album dentro una pagina */
.album-list--embedded{margin-top:2rem}
