/* =============================================================================
   Shared Lightbox + Gallery Components
   Loaded on: page-color-lab.php and single-product-software.php (product 3190)
   ============================================================================= */


/* ── Lightbox overlay ── */

#andp-lb {
	display: none;
	position: fixed;
	inset: 0;
	z-index: 9999;
	background: rgba(0, 0, 0, 0.93);
	align-items: center;
	justify-content: center;
}

#andp-lb.is-open {
	display: flex;
}

.andp-lb__stage {
	max-width: 90vw;
	max-height: 86vh;
	display: flex;
	align-items: center;
	justify-content: center;
}

.andp-lb__img {
	max-width: 90vw;
	max-height: 86vh;
	width: auto;
	height: auto;
	object-fit: contain;
	display: block;
}

.andp-lb__close {
	position: fixed;
	top: 16px;
	right: 20px;
	background: none;
	border: none;
	color: rgba(255, 255, 255, 0.65);
	font-size: 36px;
	line-height: 1;
	padding: 8px 12px;
	cursor: pointer;
	transition: color 0.15s;
	z-index: 10001;
}

.andp-lb__close:hover {
	color: #fff;
}

.andp-lb__prev,
.andp-lb__next {
	position: fixed;
	top: 50%;
	transform: translateY(-50%);
	background: rgba(255, 255, 255, 0.06);
	border: 1px solid rgba(255, 255, 255, 0.1);
	color: rgba(255, 255, 255, 0.65);
	font-size: 18px;
	padding: 18px 22px;
	cursor: pointer;
	transition: background 0.15s, color 0.15s;
	z-index: 10001;
	line-height: 1;
}

.andp-lb__prev { left: 16px; }
.andp-lb__next { right: 16px; }

.andp-lb__prev:hover,
.andp-lb__next:hover {
	background: rgba(255, 255, 255, 0.13);
	color: #fff;
}

.andp-lb__counter {
	position: fixed;
	bottom: 20px;
	left: 50%;
	transform: translateX(-50%);
	font-family: var(--andp-font-mono, monospace);
	font-size: 10px;
	letter-spacing: 0.25em;
	text-transform: uppercase;
	color: rgba(255, 255, 255, 0.35);
	pointer-events: none;
	white-space: nowrap;
}


/* ── Marketing page: gallery label ── */

.andp-cl-gallery-label {
	font-family: var(--andp-font-mono);
	font-size: var(--andp-size-label);
	text-transform: uppercase;
	letter-spacing: 0.2em;
	color: var(--andp-gold);
	margin: 0 0 12px;
}


/* ── Marketing page: screenshot gallery grid ── */

.andp-cl-gallery-grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 8px;
}

.andp-cl-gallery-grid__item {
	aspect-ratio: 16 / 10;
	overflow: hidden;
	cursor: zoom-in;
	background: var(--andp-surface);
	border: 1px solid var(--andp-border-light);
}

.andp-cl-gallery-grid__item--hero {
	grid-column: 1 / -1;
	aspect-ratio: 16 / 9;
}

.andp-cl-gallery-grid__item img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
	transition: opacity 0.2s;
	pointer-events: none;
}

.andp-cl-gallery-grid__item:hover img {
	opacity: 0.75;
}

.andp-cl-gallery-grid--empty {
	aspect-ratio: 4 / 3;
	display: flex;
	align-items: center;
	justify-content: center;
	font-family: var(--andp-font-mono, monospace);
	font-size: 11px;
	text-transform: uppercase;
	letter-spacing: 0.25em;
	color: var(--andp-text-dim);
	background: var(--andp-surface);
	border: 1px solid var(--andp-border-mid);
}


/* ── Product page: screenshot grid with lightbox ── */

.andp-sw-screenshots__section-header {
	margin-bottom: 32px;
}

.andp-sw-screenshots__item {
	cursor: zoom-in;
}

.andp-sw-screenshots__item:hover .andp-sw-screenshots__img {
	opacity: 0.8;
}

.andp-sw-screenshots__img {
	transition: opacity 0.2s;
}