/* Custom formulare */
.si-form {
	width: 100%;
	font-family: var(--si-font);
}

.si-form__row {
	display: flex;
	gap: calc(8px * var(--si-global-margin-padding-scale));
	width: 100%;
}

.si-form__row--two .si-form__field {
	width: 50%;
}

.si-form__field {
	width: 100%;
	margin-bottom: calc(32px * var(--si-global-margin-padding-scale));
}

.si-form__field.si-form__field--textarea {
	margin-bottom: calc(24px * var(--si-global-margin-padding-scale));
}

.si-form__input {
	display: block;
	width: 100%;
	box-sizing: border-box;

	border: 1px solid var(--awb-custom_color_1) !important;
	border-radius: 0;
	background: var(--awb-color1) !important;

	padding: 10px !important;

	font-family: var(--si-font);
	font-size: calc(var(--si-fnt-size1) * var(--si-global-font-scale)) !important;
	line-height: calc(1.35 * var(--si-global-line-height-scale));
	color: var(--awb-color8);

	transition: border-color var(--transition-dur) ease, box-shadow var(--transition-dur) ease;
}

.si-form__textarea {
	height: calc(340px * var(--si-global-margin-padding-scale));
	min-height: calc(280px * var(--si-global-margin-padding-scale));
	resize: vertical;
}

.si-form__input::placeholder {
	color: var(--awb-color8);
	opacity: 0.45;
}

.si-form__input:not(:focus):hover {
	border-color: color-mix(in srgb, var(--awb-color5) 50%, transparent) !important;
}

.si-form__input:focus {
	outline: none !important;
	border-color: var(--awb-color5) !important;
	box-shadow: none !important;
}

/* Cervene zvyraznenie pri dosiahnutom limite */
.si-form__input.is-limit-flash {
	border-color: var(--si-alert-color) !important;
	box-shadow: 0 0 0 2px rgba(198, 40, 40, 0.2) !important;
}

.si-form__actions {
	margin-top: calc(30px * var(--si-global-margin-padding-scale));
}

/* Pri zobrazenej hlaske zrusime medzeru nad buttonom */
.si-form.has-message .si-form__actions {
	margin-top: calc(6px * var(--si-global-margin-padding-scale));
}

.si-form__submit {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	border: 0;
	border-radius: 0;
	background: var(--awb-color5);
	color: var(--awb-color1);
	padding: 4px 6px;
    min-width: calc(180px * var(--si-global-scale2));
    min-height: calc(56px * var(--si-global-scale2));
	font-family: var(--si-font);
	font-size: calc(var(--si-fnt-size2) * var(--si-global-font-scale));
	font-weight: 600;
	cursor: pointer;

	transition: background-color var(--transition-dur) ease, opacity var(--transition-dur) ease;
}

.si-form__submit:hover,
.si-form__submit:focus {
	background: var(--awb-custom_color_4);
}

.si-form__submit:disabled {
	opacity: 0.65;
	cursor: wait;
}

/* Message defaultne nerezervuje miesto */
.si-form__message {
	display: none;
}

/* Ak formular zobrazuje hlasenie, vytvorime priestor pre 2 riadky */
.si-form.has-message .si-form__message {
	min-height: calc(56px * var(--si-global-font-scale));
	display: flex;
	align-items: center;
	font-size: calc(var(--si-fnt-size2) * var(--si-global-font-scale)) !important;
	line-height: calc(1.35 * var(--si-global-line-height-scale));
	color: var(--awb-color8);
}

/* Pri hlaske uberieme vysku textarea, aby layout neskakal zbytocne nizsie */
.si-form.has-message .si-form__textarea {
	height: calc((340px * var(--si-global-margin-padding-scale)) - (56px * var(--si-global-font-scale)));
	min-height: calc((280px * var(--si-global-margin-padding-scale)) - (56px * var(--si-global-font-scale)));
}

.si-form__message.is-error {
	color: var(--si-alert-color) !important;
	font-weight: 600;
}

.si-form__message.is-success {
	color: var(--awb-color5) !important;
	font-weight: 600;
}

.si-form__extra-field {
	position: absolute;
	left: -9999px;
	width: 1px;
	height: 1px;
	overflow: hidden;
}

@media (max-width: 640px) {
	.si-form__row {
		display: block;
	}

	.si-form__row--two .si-form__field {
		width: 100%;
	}

	.si-form__actions {
		justify-self: center;
	}
}