/**
 * Style współdzielonego lightboxa (assets/js/lightbox.js).
 * Używany przez tabelę rankingu i galerię produktu.
 */

.sprzet-lightbox-trigger {
	display: inline-block;
	cursor: zoom-in;
}

.sprzet-lightbox {
	position: fixed;
	inset: 0;
	z-index: 100000; /* ponad wszystkim, w tym ponad ewentualnym stickym headerem Divi */
	display: flex;
	align-items: center;
	justify-content: center;
}

.sprzet-lightbox[hidden] {
	display: none;
}

.sprzet-lightbox__backdrop {
	position: absolute;
	inset: 0;
	background-color: rgba(0, 0, 0, 0.75);
	cursor: zoom-out;
}

.sprzet-lightbox__content {
	position: relative;
	max-width: min(90vw, 1000px);
	max-height: 90vh;
}

.sprzet-lightbox__image {
	display: block;
	max-width: 100%;
	max-height: 90vh;
	object-fit: contain;
	border-radius: 4px;
	box-shadow: 0 10px 40px rgba(0, 0, 0, 0.4);
}

.sprzet-lightbox__close {
	position: absolute;
	top: 0.6em;
	right: 0.6em;
	width: 2.2em;
	height: 2.2em;
	border: none;
	border-radius: 50%;
	background-color: rgba(255, 255, 255, 0.95);
	color: #111;
	font-size: 1.2rem;
	line-height: 1;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
}

.sprzet-lightbox__close:hover,
.sprzet-lightbox__close:focus-visible {
	background-color: #fff;
}

.sprzet-lightbox__nav {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	width: 2.6em;
	height: 2.6em;
	border: none;
	border-radius: 50%;
	background-color: rgba(255, 255, 255, 0.95);
	color: #111;
	font-size: 1.6rem;
	line-height: 1;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
}

.sprzet-lightbox__nav:hover,
.sprzet-lightbox__nav:focus-visible {
	background-color: #fff;
}

.sprzet-lightbox__nav--prev {
	left: clamp(0.5em, 3vw, 2em);
}

.sprzet-lightbox__nav--next {
	right: clamp(0.5em, 3vw, 2em);
}

/* Jedno zdjęcie w grupie — nawigacja nie ma sensu, więc ją chowamy. */
.sprzet-lightbox--single .sprzet-lightbox__nav {
	display: none;
}

/* Blokada scrolla strony w tle, gdy lightbox jest otwarty. */
body.sprzet-lightbox-open {
	overflow: hidden;
}