/* ZŠ Bělá – lightbox fotek s náhledy (zs-lightbox.js) */
.zs-lb-lock, .zs-lb-lock body{ overflow:hidden; }
.zs-lb{
	--lb-bg:rgba(14,30,28,.97); --lb-cream:#ffe4aa; --lb-forest:#31645e; --lb-ease:cubic-bezier(.2,.8,.2,1);
	position:fixed; inset:0; z-index:100000; display:grid; grid-template-rows:auto 1fr auto;
	background:var(--lb-bg); color:#fff; opacity:0; visibility:hidden; transition:opacity .3s var(--lb-ease), visibility 0s .3s;
	font-family:inherit; -webkit-backdrop-filter:blur(8px); backdrop-filter:blur(8px);
}
.zs-lb.is-open{ opacity:1; visibility:visible; transition:opacity .3s var(--lb-ease); }

/* horní lišta: počítadlo, popisek, zavřít */
.zs-lb__top{ display:flex; align-items:center; gap:18px; padding:14px 18px 10px 24px; min-height:64px; }
.zs-lb__count{ font-size:14px; font-weight:700; letter-spacing:.08em; color:var(--lb-cream); white-space:nowrap; font-variant-numeric:tabular-nums; }
.zs-lb__cap{ flex:1; font-size:15px; line-height:1.4; color:rgba(255,255,255,.85); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.zs-lb__close{
	width:46px; height:46px; border-radius:50%; border:1.5px solid rgba(255,255,255,.35); background:transparent; color:#fff;
	font-size:30px; line-height:1; cursor:pointer; transition:background .25s, color .25s, border-color .25s, transform .3s var(--lb-ease);
}
.zs-lb__close:hover, .zs-lb__close:focus-visible{ background:var(--lb-cream); border-color:var(--lb-cream); color:#1f4541; transform:rotate(90deg); outline:none; }

/* fotka */
.zs-lb__stage{ position:relative; display:flex; align-items:center; justify-content:center; min-height:0; padding:0 88px; }
.zs-lb__fig{ margin:0; display:flex; align-items:center; justify-content:center; width:100%; height:100%; min-height:0; }
.zs-lb__img{
	max-width:100%; max-height:calc(100vh - 64px - 132px); width:auto; height:auto; object-fit:contain;
	box-shadow:0 30px 60px -20px rgba(0,0,0,.7); opacity:0; transform:scale(.985);
	transition:opacity .35s var(--lb-ease), transform .45s var(--lb-ease);
}
.zs-lb__img.is-in{ opacity:1; transform:none; }

/* šipky */
.zs-lb__nav{
	position:absolute; top:50%; transform:translateY(-50%); width:56px; height:56px; border-radius:50%;
	border:1.5px solid rgba(255,255,255,.35); background:rgba(0,0,0,.15); color:#fff; font-size:30px; line-height:1;
	display:flex; align-items:center; justify-content:center; cursor:pointer; transition:background .25s, color .25s, border-color .25s;
}
.zs-lb__nav--prev{ left:20px; } .zs-lb__nav--next{ right:20px; }
.zs-lb__nav:hover, .zs-lb__nav:focus-visible{ background:var(--lb-cream); border-color:var(--lb-cream); color:#1f4541; outline:none; }

/* náhledy */
.zs-lb__thumbs{
	display:flex; gap:10px; padding:16px 24px 20px; overflow-x:auto; scrollbar-width:thin; scrollbar-color:rgba(255,255,255,.3) transparent;
	justify-content:safe center;
}
.zs-lb__thumb{
	flex:0 0 auto; width:96px; height:72px; padding:0; border:0; background:none; cursor:pointer; position:relative;
	opacity:.45; transition:opacity .25s, transform .3s var(--lb-ease);
}
.zs-lb__thumb img{ width:100%; height:100%; object-fit:cover; display:block; }
.zs-lb__thumb::after{ content:''; position:absolute; inset:0; box-shadow:inset 0 0 0 3px transparent; transition:box-shadow .25s; }
.zs-lb__thumb:hover, .zs-lb__thumb:focus-visible{ opacity:.85; outline:none; }
.zs-lb__thumb.is-active{ opacity:1; }
.zs-lb__thumb.is-active::after{ box-shadow:inset 0 0 0 3px var(--lb-cream); }

.zs-lb.is-single .zs-lb__nav, .zs-lb.is-single .zs-lb__thumbs{ display:none; }
.zs-lb.is-single .zs-lb__img{ max-height:calc(100vh - 64px - 40px); }

@media (max-width:767px){
	.zs-lb__top{ padding:10px 10px 8px 16px; min-height:56px; }
	.zs-lb__stage{ padding:0 8px; }
	.zs-lb__nav{ width:44px; height:44px; font-size:24px; background:rgba(0,0,0,.35); }
	.zs-lb__nav--prev{ left:10px; } .zs-lb__nav--next{ right:10px; }
	.zs-lb__img{ max-height:calc(100vh - 56px - 100px); }
	.zs-lb__thumbs{ gap:8px; padding:10px 12px 14px; justify-content:flex-start; }
	.zs-lb__thumb{ width:64px; height:48px; }
}
@media (prefers-reduced-motion:reduce){
	.zs-lb, .zs-lb__img, .zs-lb__thumb, .zs-lb__close{ transition:none; }
}