/* Kapcsolat Űrlap – front-end stílusok. A színek/méretek CSS-változókból jönnek (Stílus fül). */
.ku-form-wrap {
	--ku-input-pad-y: 8px;
	--ku-input-pad-x: 14px;
	--ku-input-font: 15px;
	--ku-btn-font: 15px;
	position: relative;
}
.ku-form-wrap *, .ku-form-wrap *::before, .ku-form-wrap *::after { box-sizing: border-box; }

/* Mezőméret (Input Size) */
.ku-size-xs { --ku-input-pad-y: 4px; --ku-input-pad-x: 10px; --ku-input-font: 13px; }
.ku-size-sm { --ku-input-pad-y: 8px; --ku-input-pad-x: 14px; --ku-input-font: 15px; }
.ku-size-md { --ku-input-pad-y: 11px; --ku-input-pad-x: 16px; --ku-input-font: 16px; }
.ku-size-lg { --ku-input-pad-y: 14px; --ku-input-pad-x: 18px; --ku-input-font: 18px; }
.ku-size-xl { --ku-input-pad-y: 18px; --ku-input-pad-x: 22px; --ku-input-font: 20px; }

/* Gombméret */
.ku-btn-size-xs { --ku-btn-font: 13px; --ku-btn-scale: .6; }
.ku-btn-size-sm { --ku-btn-font: 15px; --ku-btn-scale: 1; }
.ku-btn-size-md { --ku-btn-font: 16px; --ku-btn-scale: 1.3; }
.ku-btn-size-lg { --ku-btn-font: 18px; --ku-btn-scale: 1.6; }
.ku-btn-size-xl { --ku-btn-font: 20px; --ku-btn-scale: 2; }

/* Rács */
.ku-fields {
	display: flex;
	flex-wrap: wrap;
	margin: 0 calc(var(--ku-col-gap) / -2);
	row-gap: var(--ku-row-gap);
}
.ku-fields[hidden] { display: none; }
.ku-field-group {
	flex: 0 0 auto;
	width: 100%;
	padding: 0 calc(var(--ku-col-gap) / 2);
	display: flex;
	flex-direction: column;
	min-width: 0;
}
.ku-col-100 { width: 100%; }
.ku-col-80 { width: 80%; }
.ku-col-75 { width: 75%; }
.ku-col-70 { width: 70%; }
.ku-col-66 { width: 66.666%; }
.ku-col-60 { width: 60%; }
.ku-col-50 { width: 50%; }
.ku-col-40 { width: 40%; }
.ku-col-33 { width: 33.333%; }
.ku-col-30 { width: 30%; }
.ku-col-25 { width: 25%; }
.ku-col-20 { width: 20%; }
@media (max-width: 767px) {
	.ku-field-group { width: 100%; }
}

/* Címkék */
.ku-label {
	display: block;
	margin-bottom: var(--ku-label-spacing);
	color: var(--ku-label-color);
	font-size: var(--ku-label-size);
	font-weight: 600;
	line-height: 1.3;
}
.ku-hide-labels .ku-label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.ku-show-required .ku-required .ku-label::after { content: " *"; color: var(--ku-error); }

/* Mezők */
.ku-form .ku-input {
	width: 100%;
	max-width: 100%;
	margin: 0;
	padding: var(--ku-input-pad-y) var(--ku-input-pad-x);
	font: inherit;
	font-size: var(--ku-input-font);
	line-height: 1.4;
	color: var(--ku-field-text);
	background-color: var(--ku-field-bg);
	border: var(--ku-field-border-w) solid var(--ku-field-border);
	border-radius: var(--ku-field-radius);
	box-shadow: none;
	transition: border-color .15s, box-shadow .15s;
	min-height: 0;
}
.ku-form textarea.ku-input { resize: vertical; }
.ku-form .ku-input::placeholder { color: var(--ku-placeholder); opacity: 1; }
.ku-form .ku-input:focus {
	outline: none;
	border-color: var(--ku-focus);
	box-shadow: 0 0 0 3px color-mix(in srgb, var(--ku-focus) 20%, transparent);
}
.ku-select-wrap { position: relative; }
.ku-select-wrap:not(.ku-multiple)::after {
	content: "";
	position: absolute;
	right: calc(var(--ku-input-pad-x) + 2px);
	top: 50%;
	width: 7px;
	height: 7px;
	border-right: 2px solid var(--ku-field-text);
	border-bottom: 2px solid var(--ku-field-text);
	transform: translateY(-70%) rotate(45deg);
	pointer-events: none;
	opacity: .6;
}
.ku-select-wrap:not(.ku-multiple) select.ku-input { appearance: none; -webkit-appearance: none; padding-right: calc(var(--ku-input-pad-x) * 2 + 10px); }
.ku-form input.ku-file { padding: calc(var(--ku-input-pad-y) - 2px) var(--ku-input-pad-x); }
.ku-hint { display: block; margin-top: 4px; font-size: 12px; color: var(--ku-placeholder); }

.ku-options { display: flex; flex-direction: column; gap: 6px; color: var(--ku-label-color); font-size: var(--ku-input-font); }
.ku-options.ku-inline { flex-direction: row; flex-wrap: wrap; gap: 6px 20px; }
.ku-option { display: inline-flex; align-items: flex-start; gap: 8px; line-height: 1.4; }
.ku-option input { margin: 3px 0 0; accent-color: var(--ku-focus); width: 16px; height: 16px; flex: 0 0 auto; }
.ku-option label { cursor: pointer; }

.ku-html { color: var(--ku-html-color); }
.ku-html > :first-child { margin-top: 0; }
.ku-html > :last-child { margin-bottom: 0; }

.ku-hp { position: absolute !important; left: -9999px !important; width: 1px; height: 1px; overflow: hidden; }

/* Hibák */
.ku-error { margin-top: 5px; color: var(--ku-inline); font-size: 13px; line-height: 1.3; }
.ku-error[hidden] { display: none; }
.ku-has-error .ku-input { border-color: var(--ku-inline); }

/* Gombok */
.ku-buttons { flex-direction: row; flex-wrap: wrap; gap: 10px; align-items: center; }
.ku-align-start { justify-content: flex-start; }
.ku-align-center { justify-content: center; }
.ku-align-end { justify-content: flex-end; }
.ku-align-stretch .ku-button { flex: 1 1 0; }
.ku-form .ku-button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	margin: 0;
	padding: calc(var(--ku-btn-padding) * var(--ku-btn-scale, 1)) calc(var(--ku-btn-padding) * 2 * var(--ku-btn-scale, 1));
	font: inherit;
	font-size: var(--ku-btn-font);
	font-weight: 600;
	line-height: 1.2;
	color: var(--ku-btn-color);
	background: var(--ku-btn-bg);
	border: 0;
	border-radius: var(--ku-btn-radius);
	cursor: pointer;
	transition: background-color .2s, color .2s, opacity .2s;
	text-decoration: none;
}
.ku-form .ku-button:hover, .ku-form .ku-button:focus-visible { background: var(--ku-btn-hover-bg); color: var(--ku-btn-hover-color); }
.ku-form .ku-button:focus-visible { outline: 2px solid var(--ku-focus); outline-offset: 2px; }
.ku-form .ku-button.ku-prev { background: var(--ku-prev-bg); color: var(--ku-prev-color); }
.ku-form .ku-button.ku-prev:hover { filter: brightness(.95); }

.ku-spinner { display: none; width: 1em; height: 1em; border: 2px solid currentColor; border-right-color: transparent; border-radius: 50%; animation: ku-spin .7s linear infinite; }
.ku-loading .ku-spinner { display: inline-block; }
.ku-loading .ku-submit { opacity: .75; pointer-events: none; }
@keyframes ku-spin { to { transform: rotate(360deg); } }

/* Üzenetek */
.ku-message { margin-top: 16px; padding: 12px 16px; border-radius: var(--ku-field-radius); font-size: 15px; line-height: 1.4; }
.ku-message[hidden] { display: none; }
.ku-message-success { color: var(--ku-success); background: color-mix(in srgb, var(--ku-success) 10%, transparent); }
.ku-message-error { color: var(--ku-error); background: color-mix(in srgb, var(--ku-error) 10%, transparent); }

/* Lépésjelző */
.ku-steps { display: flex; align-items: center; margin-bottom: 28px; gap: 8px; }
.ku-step-item { display: flex; flex-direction: column; align-items: center; gap: 6px; flex: 0 0 auto; color: var(--ku-step-inactive); font-size: 13px; font-weight: 600; text-align: center; }
.ku-step-number {
	display: inline-flex; align-items: center; justify-content: center;
	width: 34px; height: 34px;
	border: 2px solid var(--ku-step-inactive);
	color: var(--ku-step-inactive);
	background: transparent;
	font-size: 14px;
	transition: all .2s;
}
.ku-shape-circle .ku-step-number { border-radius: 50%; }
.ku-shape-rounded .ku-step-number { border-radius: 8px; }
.ku-shape-square .ku-step-number { border-radius: 0; }
.ku-shape-none .ku-step-number { border: 0; }
.ku-step-item.ku-active, .ku-step-item.ku-completed { color: var(--ku-step-active); }
.ku-step-item.ku-active .ku-step-number { border-color: var(--ku-step-active); color: var(--ku-step-active); }
.ku-step-item.ku-completed .ku-step-number { border-color: var(--ku-step-active); background: var(--ku-step-active); color: #fff; }
.ku-step-divider { flex: 1 1 auto; height: var(--ku-step-divider-w); background: var(--ku-step-inactive); border-radius: 2px; transition: background .2s; }
.ku-steps-number_text .ku-step-divider { margin-bottom: 22px; }
.ku-step-divider.ku-completed { background: var(--ku-step-active); }
.ku-steps-progress_bar { display: block; }
.ku-progress { width: 100%; height: 22px; background: var(--ku-step-inactive); border-radius: 11px; overflow: hidden; }
.ku-progress-fill { height: 100%; width: 0; background: var(--ku-step-active); display: flex; align-items: center; justify-content: flex-end; transition: width .3s; min-width: 44px; }
.ku-progress-pct { color: #fff; font-size: 12px; font-weight: 600; padding-right: 10px; }