.ek-lt {
	max-width: 560px;
	margin: 0 auto;
	padding: 2.5rem 1.25rem 4rem;
	color: #1F2A30;
}

.ek-lt-progress {
	display: flex;
	align-items: center;
	justify-content: center;
	margin-bottom: 2rem;
}

.ek-lt-progress-pont {
	width: 2rem;
	height: 2rem;
	border-radius: 50%;
	background: #FFFFFF;
	border: 1px solid #DEE3E4;
	color: #57666D;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 0.9rem;
	flex: 0 0 auto;
}

.ek-lt-progress-pont.is-aktiv {
	background: #1B4965;
	border-color: #1B4965;
	color: #FFFFFF;
}

.ek-lt-progress-pont.is-kesz {
	background: #3F7D69;
	border-color: #3F7D69;
	color: #FFFFFF;
}

.ek-lt-progress-vonal {
	flex: 1 1 auto;
	height: 1px;
	background: #DEE3E4;
	margin: 0 0.5rem;
}

.ek-lt-uzenet {
	background: rgba( 166, 67, 58, 0.1 );
	color: #A6433A;
	border-radius: 6px;
	padding: 0.75rem 1rem;
	margin-bottom: 1.5rem;
	font-size: 0.9rem;
}

.ek-lt-lepes {
	display: none;
	background: #FFFFFF;
	border-radius: 8px;
	padding: 1.75rem;
}

.ek-lt-lepes.is-aktiv {
	display: block;
}

.ek-lt-lepes h1 {
	margin: 0 0 0.5rem;
	font-size: 1.4rem;
}

.ek-lt-leiras {
	margin: 0 0 1.25rem;
	color: #57666D;
	font-size: 0.95rem;
}

.ek-lt-fajl-mezo {
	border: 1px dashed #DEE3E4;
	border-radius: 6px;
	padding: 1.25rem;
	margin-bottom: 1rem;
}

.ek-lt-fajl-mezo input {
	width: 100%;
}

.ek-lt-elonezet {
	display: block;
	max-width: 100%;
	max-height: 260px;
	border-radius: 6px;
	margin-bottom: 1rem;
	object-fit: cover;
}

.ek-lt-kartyak {
	display: grid;
	grid-template-columns: repeat( 2, 1fr );
	gap: 0.75rem;
	margin-bottom: 1rem;
}

#ek-lt .ek-lt-kartya {
	border: 1px solid #DEE3E4;
	background: #FFFFFF;
	color: #1F2A30;
	border-radius: 6px;
	padding: 1rem 0.75rem;
	font-size: 0.95rem;
	text-align: center;
	cursor: pointer;
}

#ek-lt .ek-lt-kartya:hover {
	border-color: #1B4965;
}

#ek-lt .ek-lt-kartya.is-kivalasztva {
	border-color: #1B4965;
	background: rgba( 27, 73, 101, 0.08 );
	font-weight: 600;
}

.ek-lt-mezo {
	display: flex;
	flex-direction: column;
	gap: 0.3rem;
	margin-bottom: 1rem;
}

.ek-lt-mezo label {
	font-size: 0.85rem;
	color: #57666D;
}

#ek-lt .ek-lt-mezo input {
	padding: 0.6rem 0.75rem;
	border: 1px solid #DEE3E4;
	border-radius: 6px;
	font-size: 1rem;
}

.ek-lt-checkbox {
	display: flex;
	align-items: flex-start;
	gap: 0.5rem;
	font-size: 0.85rem;
	color: #57666D;
	margin-bottom: 1.25rem;
}

.ek-lt-checkbox input {
	margin-top: 0.2rem;
}

.ek-lt-gombsor {
	display: flex;
	justify-content: space-between;
	gap: 0.75rem;
}

#ek-lt .ek-lt-gomb {
	display: inline-block;
	border: none;
	border-radius: 6px;
	padding: 0.7rem 1.5rem;
	font-size: 0.95rem;
	cursor: pointer;
	text-decoration: none;
	text-align: center;
}

#ek-lt .ek-lt-gomb-elsodleges {
	background: #1B4965;
	color: #FFFFFF;
	margin-left: auto;
}

#ek-lt .ek-lt-gomb-elsodleges:hover {
	background: #163b52;
}

#ek-lt .ek-lt-gomb-masodlagos {
	background: transparent;
	color: #57666D;
	border: 1px solid #DEE3E4;
}

.ek-lt-elemzo {
	text-align: center;
	padding: 1rem 0;
	animation: ek-lt-elemzo-fadein 0.4s ease;
}

.ek-lt-elemzo-keret {
	position: relative;
	display: inline-block;
	margin: 0 auto 1.5rem;
}

.ek-lt-elemzo-kep {
	display: block;
	max-width: 100%;
	max-height: 280px;
	border-radius: 4px;
	object-fit: cover;
}

.ek-lt-sarok {
	position: absolute;
	width: 26px;
	height: 26px;
	border-color: #1B4965;
	animation: ek-lt-sarok-lelegzes 1.8s ease-in-out infinite;
}

.ek-lt-sarok-bf {
	top: -8px;
	left: -8px;
	border-top: 3px solid;
	border-left: 3px solid;
}

.ek-lt-sarok-jf {
	top: -8px;
	right: -8px;
	border-top: 3px solid;
	border-right: 3px solid;
}

.ek-lt-sarok-ba {
	bottom: -8px;
	left: -8px;
	border-bottom: 3px solid;
	border-left: 3px solid;
}

.ek-lt-sarok-ja {
	bottom: -8px;
	right: -8px;
	border-bottom: 3px solid;
	border-right: 3px solid;
}

.ek-lt-elemzo-statusz {
	color: #1B4965;
	font-size: 0.9rem;
	font-weight: 600;
	margin: 0;
}

@keyframes ek-lt-sarok-lelegzes {
	0%, 100% {
		opacity: 0.45;
	}
	50% {
		opacity: 1;
	}
}

@keyframes ek-lt-elemzo-fadein {
	from {
		opacity: 0;
	}
	to {
		opacity: 1;
	}
}

.ek-lt-galeria {
	display: grid;
	grid-template-columns: repeat( 3, 1fr );
	gap: 0.75rem;
	margin: 0.5rem 0 1.5rem;
}

.ek-lt-galeria img {
	display: block;
	width: 100%;
	height: auto;
	border-radius: 8px;
	animation: ek-lt-elemzo-fadein 0.4s ease;
}

.ek-lt-galeria-elem {
	display: flex;
	flex-direction: column;
	gap: 0.5rem;
}

.ek-lt-galeria-akciok {
	display: flex;
	gap: 0.5rem;
}

/* #ek-lt elofeccel: a Hello Elementor szulotema [type="button"]-szabalya (lasd site.css
   fenti megjegyzese) azonos specificitasu egy sima osztallyal, csak igy feluliheto biztosan. */
#ek-lt .ek-lt-galeria-akcio {
	flex: 1;
	border: 1px solid #DEE3E4;
	background: #FFFFFF;
	color: #1B4965;
	border-radius: 6px;
	padding: 0.6rem 0.4rem;
	font-size: 0.8rem;
	cursor: pointer;
	text-align: center;
}

#ek-lt .ek-lt-galeria-akcio:hover {
	background: #F4F6F6;
}

#ek-lt .ek-lt-galeria-akcio:disabled {
	opacity: 0.6;
	cursor: default;
}

/* --- "Ez a kedvencem" (BUILD.md 3.6/e) -- ugyanaz az #ek-lt elofecc-ok mint a tobbi galeria-gombnal. --- */
#ek-lt .ek-lt-galeria-kedvenc {
	width: 100%;
	border: 1px solid #DEE3E4;
	background: #FFFFFF;
	color: #1B4965;
	border-radius: 6px;
	padding: 0.5rem 0.4rem;
	font-size: 0.8rem;
	cursor: pointer;
	text-align: center;
}

#ek-lt .ek-lt-galeria-kedvenc:hover {
	background: #F4F6F6;
}

#ek-lt .ek-lt-galeria-kedvenc.is-kivalasztva {
	background: #FFF6E0;
	border-color: #E8A33D;
	color: #8A5A00;
	font-weight: 600;
}

/* --- Elotte-utana csuszka (BUILD.md 3.6/b) --- */
.ek-lt-oh {
	position: relative;
	width: 100%;
	aspect-ratio: 4 / 3;
	border-radius: 8px;
	overflow: hidden;
	background: #DEE3E4;
	animation: ek-lt-elemzo-fadein 0.4s ease;
}

/* A ket kep a teljes dobozt kitolti; az "elotte" reteg clip-path-jat a csuszka allitja,
   igy mindket kep sajat (esetleg elteru meretu) forrasat azonos keretre "vagja" a boxhoz
   kepesti szazalekos inset -- nincs szukseg JS-bol szamolt pixelmeretre. Nagyobb
   specificitas kell a .ek-lt-galeria img altalanos szabaly felulirasahoz. */
.ek-lt-galeria .ek-lt-oh-utana,
.ek-lt-galeria .ek-lt-oh-elotte {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	border-radius: 0;
	animation: none;
	display: block;
}

.ek-lt-oh-elotte {
	clip-path: inset( 0 50% 0 0 );
}

.ek-lt-oh-cimke {
	position: absolute;
	top: 0.5rem;
	font-size: 0.7rem;
	font-weight: 600;
	color: #FFFFFF;
	background: rgba( 31, 42, 48, 0.55 );
	padding: 0.2rem 0.5rem;
	border-radius: 4px;
	letter-spacing: 0.02em;
	text-transform: uppercase;
	pointer-events: none;
}

.ek-lt-oh-cimke-eredeti {
	left: 0.5rem;
}

.ek-lt-oh-cimke-uj {
	right: 0.5rem;
}

.ek-lt-oh-vonal {
	position: absolute;
	top: 0;
	bottom: 0;
	left: 50%;
	width: 2px;
	background: #FFFFFF;
	box-shadow: 0 0 0 1px rgba( 0, 0, 0, 0.25 );
	pointer-events: none;
	transform: translateX( -1px );
}

.ek-lt-oh-fogantyu {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate( -50%, -50% );
	width: 2.2rem;
	height: 2.2rem;
	border-radius: 50%;
	background: #FFFFFF;
	box-shadow: 0 1px 4px rgba( 0, 0, 0, 0.35 );
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 0.95rem;
	color: #1B4965;
}

/* A range-thumb-ot a teljes dobozra huzva a "fogas" barhol mukodik a kepen, nem csak
   egy kis pontban -- ez a szokasos trukk kulon pointer/touch JS nelkuli osszehasonlito-
   csuszkakhoz. Maga a bemenet lathatatlan, csak a fenti dekortativ vonal/fogantyu latszik. */
#ek-lt .ek-lt-oh-csuszka {
	-webkit-appearance: none;
	appearance: none;
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	margin: 0;
	background: transparent;
	cursor: ew-resize;
}

#ek-lt .ek-lt-oh-csuszka:focus-visible {
	outline: 2px solid #1B4965;
	outline-offset: -2px;
}

.ek-lt-oh-csuszka::-webkit-slider-runnable-track {
	-webkit-appearance: none;
	width: 100%;
	height: 100%;
	background: transparent;
}

.ek-lt-oh-csuszka::-webkit-slider-thumb {
	-webkit-appearance: none;
	width: 100%;
	height: 100%;
	background: transparent;
	cursor: ew-resize;
}

.ek-lt-oh-csuszka::-moz-range-track {
	width: 100%;
	height: 100%;
	background: transparent;
	border: none;
}

.ek-lt-oh-csuszka::-moz-range-thumb {
	width: 100%;
	height: 100%;
	background: transparent;
	border: none;
	cursor: ew-resize;
}

/* --- "Ez tetszik, finomítanám" (BUILD.md 3.6/c) --- */
.ek-lt-galeria-finomit {
	margin-top: -0.15rem;
}

/* #ek-lt elofeccel: ugyanaz az ok mint a .ek-lt-galeria-akcio-nal (a Hello Elementor
   [type="button"]-szabalya azonos specificitasu egy sima osztallyal). */
#ek-lt .ek-lt-galeria-finomit-nyito {
	width: 100%;
	background: transparent;
	border: 1px dashed #DEE3E4;
	color: #1B4965;
	border-radius: 6px;
	padding: 0.5rem 0.4rem;
	font-size: 0.8rem;
	cursor: pointer;
	text-align: center;
}

#ek-lt .ek-lt-galeria-finomit-nyito:disabled {
	opacity: 0.6;
	cursor: default;
	border-style: solid;
}

.ek-lt-galeria-finomit-mezo {
	margin-top: 0.5rem;
}

#ek-lt .ek-lt-galeria-finomit-mezo textarea {
	width: 100%;
	border: 1px solid #DEE3E4;
	border-radius: 6px;
	padding: 0.6rem 0.75rem;
	font-size: 0.9rem;
	font-family: inherit;
	resize: vertical;
	box-sizing: border-box;
}

.ek-lt-galeria-finomit-szamlalo {
	display: block;
	text-align: right;
	font-size: 0.7rem;
	color: #57666D;
	margin: 0.2rem 0 0.5rem;
}

#ek-lt .ek-lt-galeria-finomit-kuldes {
	width: 100%;
	background: #1B4965;
	border: 1px solid #1B4965;
	color: #FFFFFF;
	border-radius: 6px;
	padding: 0.6rem 0.4rem;
	font-size: 0.85rem;
	cursor: pointer;
	text-align: center;
}

#ek-lt .ek-lt-galeria-finomit-kuldes:hover {
	background: #14384E;
}

#ek-lt .ek-lt-galeria-finomit-kuldes:disabled {
	opacity: 0.6;
	cursor: default;
}

/* --- 2. lepes: belepo halksor --- */
.ek-lt-halksor {
	font-size: 0.85rem;
	color: #57666D;
	background: #F4F6F6;
	border-radius: 6px;
	padding: 0.6rem 0.85rem;
	margin: 0 0 1.25rem;
}

/* --- 2/A–C: alkerdes-fejlec-sav --- */
.ek-lt-alkerdes-fejlec {
	display: flex;
	align-items: center;
	gap: 0.6rem;
	margin-bottom: 1.25rem;
}

#ek-lt .ek-lt-vissza-nyil {
	flex: 0 0 auto;
	width: 2rem;
	height: 2rem;
	border: 1px solid #DEE3E4;
	background: #FFFFFF;
	border-radius: 50%;
	color: #57666D;
	font-size: 1.1rem;
	line-height: 1;
	cursor: pointer;
}

#ek-lt .ek-lt-vissza-nyil:hover {
	border-color: #1B4965;
	color: #1B4965;
}

.ek-lt-fejlec-belyeg {
	flex: 0 0 auto;
	width: 2.2rem;
	height: 2.2rem;
	border-radius: 6px;
	object-fit: cover;
}

.ek-lt-fejlec-tipus {
	font-size: 0.9rem;
	font-weight: 600;
	color: #1F2A30;
}

.ek-lt-pottyok {
	display: flex;
	align-items: center;
	gap: 0.35rem;
	margin-left: auto;
}

.ek-lt-potty {
	width: 0.5rem;
	height: 0.5rem;
	border-radius: 50%;
	background: #DEE3E4;
}

.ek-lt-potty.is-aktiv {
	background: #1B4965;
}

/* --- Kerdescim --- */
.ek-lt-alkerdes-cim {
	margin: 0 0 1.25rem;
	font-size: 1.4rem;
}

.ek-lt-alkerdes-cim:focus {
	outline: none;
}

/* --- Chip-kartyak --- */
.ek-lt-chipek {
	display: flex;
	flex-direction: column;
	gap: 0.6rem;
	margin-bottom: 1.25rem;
}

#ek-lt .ek-lt-chip {
	position: relative;
	border: 1px solid #DEE3E4;
	background: #FFFFFF;
	color: #1F2A30;
	border-radius: 8px;
	padding: 0.95rem 1rem;
	font-size: 1rem;
	text-align: left;
	cursor: pointer;
}

#ek-lt .ek-lt-chip:hover {
	border-color: #1B4965;
}

#ek-lt .ek-lt-chip.is-kivalasztva {
	border-color: #1B4965;
	background: rgba( 27, 73, 101, 0.06 );
	font-weight: 600;
}

/* Sarok-zarojel-felvillanas a kivalasztott chipen (spec 7.4) */
#ek-lt .ek-lt-chip.is-kivalasztva::before,
#ek-lt .ek-lt-chip.is-kivalasztva::after {
	content: "";
	position: absolute;
	width: 14px;
	height: 14px;
	border-color: #1B4965;
	animation: ek-lt-sarok-felvillan 0.5s ease-out;
}

#ek-lt .ek-lt-chip.is-kivalasztva::before {
	top: 5px;
	left: 5px;
	border-top: 2px solid;
	border-left: 2px solid;
}

#ek-lt .ek-lt-chip.is-kivalasztva::after {
	bottom: 5px;
	right: 5px;
	border-bottom: 2px solid;
	border-right: 2px solid;
}

@keyframes ek-lt-sarok-felvillan {
	0% {
		opacity: 0;
		transform: scale( 0.6 );
	}
	60% {
		opacity: 1;
		transform: scale( 1.05 );
	}
	100% {
		opacity: 0.85;
		transform: scale( 1 );
	}
}

/* --- Kivansag-expander --- */
.ek-lt-kivansag {
	margin-bottom: 1.25rem;
}

#ek-lt .ek-lt-kivansag-nyito {
	background: transparent;
	border: none;
	color: #1B4965;
	font-size: 0.9rem;
	cursor: pointer;
	padding: 0;
}

.ek-lt-kivansag-mezo {
	margin-top: 0.6rem;
}

#ek-lt .ek-lt-kivansag-mezo textarea {
	width: 100%;
	border: 1px solid #DEE3E4;
	border-radius: 6px;
	padding: 0.6rem 0.75rem;
	font-size: 0.95rem;
	font-family: inherit;
	resize: vertical;
	box-sizing: border-box;
}

.ek-lt-kivansag-szamlalo {
	display: block;
	text-align: right;
	font-size: 0.75rem;
	color: #57666D;
	margin-top: 0.25rem;
}

.ek-lt-alkerdes-gombsor {
	justify-content: flex-end;
}

@media ( prefers-reduced-motion: reduce ) {
	#ek-lt .ek-lt-chip.is-kivalasztva::before,
	#ek-lt .ek-lt-chip.is-kivalasztva::after {
		animation: none;
		opacity: 0.85;
	}
}

@media ( max-width: 480px ) {
	.ek-lt-kartyak {
		grid-template-columns: 1fr;
	}

	.ek-lt-galeria {
		grid-template-columns: 1fr;
	}
}
