/* Galéria modul — [tolto_galeria] képrács + lightbox (design-forrás: uploads/Galéria aloldal). */

/* ---- számláló ---- */

.ga-szamlalo-sor {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 20px;
	padding: 24px 0 20px;
}

.ga-szamlalo {
	font-family: Quicksand, sans-serif;
	font-weight: 600;
	font-size: 13px;
	letter-spacing: 1.6px;
	text-transform: uppercase;
	color: #587089;
}

/* ---- képrács (masonry) ---- */

/* Erősebb szelektorok: az Elementor „.elementor .elementor-widget:not(…):not(…) figure { margin: 0 }”
   szabálya (0,4,1) különben lenullázza a képek közti térközt — ez (0,5,1). */
.ga-galeria .ga-racs {
	columns: 3 280px;
	column-gap: 20px;
}

.elementor .ga-galeria .ga-racs figure.ga-kep.ga-kep,
.ga-galeria .ga-racs .ga-kep {
	break-inside: avoid;
	-webkit-column-break-inside: avoid;
	margin: 0 0 20px;
	background: #EDEAE3;
	border-radius: 14px;
	overflow: hidden;
}

.ga-kep-link {
	display: block;
	position: relative;
	cursor: zoom-in;
	overflow: hidden;
	border-radius: 14px;
}

.ga-kep-link:focus-visible {
	outline: 2px solid #C17F57;
	outline-offset: 3px;
}

.ga-kep .ga-kep-img {
	display: block;
	width: 100%;
	height: auto;
	max-width: none;
	border-radius: 0;
	transition: transform 0.5s cubic-bezier(0.22, 1, 0.36, 1), opacity 0.3s ease;
}

.ga-kep-link:hover .ga-kep-img {
	transform: scale(1.03);
	opacity: 0.94;
}

/* ---- lightbox ---- */

.ga-lightbox {
	position: fixed;
	inset: 0;
	z-index: 100000;
	display: flex;
	align-items: center;
	justify-content: center;
	background: rgba(35, 44, 53, 0.94);
	opacity: 0;
	visibility: hidden;
	transition: opacity 0.25s ease, visibility 0s linear 0.25s;
	touch-action: pan-y;
}

.ga-lightbox.is-nyitva {
	opacity: 1;
	visibility: visible;
	transition: opacity 0.25s ease;
}

.ga-lightbox__kep {
	display: block;
	max-width: calc(100vw - 180px);
	max-height: calc(100vh - 120px);
	width: auto;
	height: auto;
	object-fit: contain;
	border-radius: 10px;
	box-shadow: 0 20px 60px rgba(0, 0, 0, 0.35);
	user-select: none;
	-webkit-user-drag: none;
	transition: opacity 0.2s ease;
}

.ga-lightbox__kep.is-tolt {
	opacity: 0;
}

/* Kettős osztály: a téma button / button:hover szabályai ellen. */
.ga-lightbox .ga-lightbox__gomb {
	position: absolute;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 52px;
	height: 52px;
	padding: 0;
	margin: 0;
	color: #F5F3EE;
	background: rgba(245, 243, 238, 0.08);
	border: 1px solid rgba(245, 243, 238, 0.22);
	border-radius: 50%;
	cursor: pointer;
	transition: background-color 0.2s, border-color 0.2s, color 0.2s;
}

.ga-lightbox .ga-lightbox__gomb:hover,
.ga-lightbox .ga-lightbox__gomb:focus-visible {
	color: #FFFFFF;
	background: #C17F57;
	border-color: #C17F57;
	outline: none;
}

.ga-lightbox__gomb svg {
	width: 22px;
	height: 22px;
}

.ga-lightbox .ga-lightbox__zar {
	top: 20px;
	right: 20px;
}

.ga-lightbox .ga-lightbox__elozo {
	left: 24px;
	top: 50%;
	transform: translateY(-50%);
}

.ga-lightbox .ga-lightbox__kovetkezo {
	right: 24px;
	top: 50%;
	transform: translateY(-50%);
}

.ga-lightbox__szamlalo {
	position: absolute;
	top: 34px;
	left: 50%;
	transform: translateX(-50%);
	font-family: Quicksand, sans-serif;
	font-weight: 600;
	font-size: 13px;
	letter-spacing: 1.6px;
	color: #D6DBE0;
}

.ga-lightbox--egy .ga-lightbox__elozo,
.ga-lightbox--egy .ga-lightbox__kovetkezo,
.ga-lightbox--egy .ga-lightbox__szamlalo {
	display: none;
}

html.ga-lightbox-nyitva {
	overflow: hidden;
}

@media (max-width: 767px) {
	.ga-galeria .ga-racs {
		columns: 2;
		column-gap: 12px;
	}

	.elementor .ga-galeria .ga-racs figure.ga-kep.ga-kep,
	.ga-galeria .ga-racs .ga-kep {
		margin-bottom: 12px;
		border-radius: 10px;
	}

	.ga-kep-link {
		border-radius: 10px;
	}

	.ga-lightbox__kep {
		max-width: calc(100vw - 24px);
		max-height: calc(100vh - 170px);
	}

	.ga-lightbox .ga-lightbox__elozo,
	.ga-lightbox .ga-lightbox__kovetkezo {
		top: auto;
		bottom: 28px;
		transform: none;
	}

	.ga-lightbox .ga-lightbox__elozo {
		left: calc(50% - 64px);
	}

	.ga-lightbox .ga-lightbox__kovetkezo {
		right: calc(50% - 64px);
	}

	.ga-lightbox .ga-lightbox__zar {
		top: 14px;
		right: 14px;
	}

	.ga-lightbox__szamlalo {
		top: 30px;
	}
}

@media (max-width: 420px) {
	.ga-galeria .ga-racs {
		columns: 1;
	}
}

@media (prefers-reduced-motion: reduce) {
	.ga-kep .ga-kep-img,
	.ga-lightbox,
	.ga-lightbox__kep {
		transition: none;
	}

	.ga-kep-link:hover .ga-kep-img {
		transform: none;
	}
}