/* ==========================================================================
   Obrazci: polja teme in obrazci Formidable.
   Slog vtičnika Formidable je na spletni strani izklopljen (inc/setup.php),
   zato so obrazci na vseh portalih v barvah in pisavi portala.
   ========================================================================== */

/* ---------- Izbirno polje: lastna puščica, odmaknjena od roba ---------- */

select,
.frm_forms select {
	-webkit-appearance: none;
	appearance: none;
	padding-right: 52px !important;
	background-color: #fff;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23223845' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right 18px center;
	background-size: 18px 18px;
	cursor: pointer;
}
select[multiple] { padding-right: .9em !important; background-image: none; }
select::-ms-expand { display: none; }

/* ---------- Formidable: postavitev ---------- */

.frm_forms { --f-gap: 26px; width: 100%; color: var(--s-text); font-family: inherit; }
.frm_forms form { margin: 0; }
.frm_forms fieldset { margin: 0; padding: 0; border: 0; min-width: 0; }
.frm_forms legend.frm_screen_reader,
.frm_screen_reader,
.frm_hidden { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.frm_forms .frm_hidden_container > label,
.frm_forms .frm_none_container > label { display: none; }

.frm_forms .frm_fields_container {
	display: grid;
	grid-template-columns: repeat(12, minmax(0, 1fr));
	gap: var(--f-gap) 18px;
}
.frm_forms .frm_form_field { grid-column: span 12; min-width: 0; margin: 0; }
.frm_forms .frm1 { grid-column: span 1; } .frm_forms .frm2 { grid-column: span 2; } .frm_forms .frm3, .frm_forms .frm_fourth { grid-column: span 3; }
.frm_forms .frm4, .frm_forms .frm_third { grid-column: span 4; } .frm_forms .frm5 { grid-column: span 5; } .frm_forms .frm6, .frm_forms .frm_half { grid-column: span 6; }
.frm_forms .frm7 { grid-column: span 7; } .frm_forms .frm8, .frm_forms .frm_two_thirds { grid-column: span 8; } .frm_forms .frm9, .frm_forms .frm_three_fourths { grid-column: span 9; }
.frm_forms .frm10 { grid-column: span 10; } .frm_forms .frm11 { grid-column: span 11; } .frm_forms .frm12, .frm_forms .frm_full { grid-column: span 12; }
@media (max-width: 640px) {
	.frm_forms .frm_form_field:not(.frm1):not(.frm2) { grid-column: span 12; }
}
.frm_forms .frm_combo_inputs_container,
.frm_forms .frm_grid_container { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 12px 18px; grid-column: span 12; }
.frm_forms .frm_combo_inputs_container > .frm_form_subfield-first,
.frm_forms .frm_combo_inputs_container > .frm_form_subfield-last { grid-column: span 6; }
@media (max-width: 640px) { .frm_forms .frm_combo_inputs_container > * { grid-column: span 12 !important; } }

/* ---------- Oznake in opisi ---------- */

.frm_forms .frm_primary_label,
.frm_forms label.frm_primary_label {
	display: block;
	margin: 0 0 8px;
	color: var(--s-heading);
	font-size: .95rem;
	font-weight: 650;
	line-height: 1.35;
}
.frm_forms .frm_required { margin-left: 3px; color: var(--c-primary); font-weight: 700; }
.frm_forms .frm_description,
.frm_forms .frm_form_subfield-first .frm_description,
.frm_forms .frm_form_subfield-last .frm_description { margin-top: 6px; color: var(--s-soft); font-size: .84rem; line-height: 1.45; }
.frm_forms .frm_inside_container { position: relative; }
/* Oznake »znotraj polja« izpišemo nad poljem – berljivo in brez prekrivanja. */
.frm_forms .frm_inside_container > label { position: static; display: block; margin: 0 0 8px; color: var(--s-heading); font-size: .95rem; font-weight: 650; pointer-events: auto; }
.frm_forms .frm_inside_container { display: flex; flex-direction: column; }
.frm_forms .frm_inside_container > label { order: -1; }

/* Polja v sklopu (section) so v isti mreži kot ostala. */
.frm_forms .frm_section_heading { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: var(--f-gap) 18px; }
.frm_forms .frm_section_heading > h3,
.frm_forms .frm_section_heading > .frm_description,
.frm_forms .frm_section_heading > .frm_pos_top { grid-column: span 12; }

/* ---------- Polja ---------- */

.frm_forms input[type="text"],
.frm_forms input[type="email"],
.frm_forms input[type="tel"],
.frm_forms input[type="url"],
.frm_forms input[type="number"],
.frm_forms input[type="password"],
.frm_forms input[type="date"],
.frm_forms input[type="search"],
.frm_forms select,
.frm_forms textarea {
	display: block;
	width: 100%;
	min-height: 52px;
	margin: 0;
	padding: 12px 16px;
	border: 1.5px solid color-mix(in srgb, var(--c-dark) 16%, transparent);
	border-radius: var(--radius-sm);
	background-color: #fff;
	color: var(--c-text);
	font: inherit;
	font-size: 1rem;
	line-height: 1.4;
	box-shadow: 0 1px 2px rgb(16 24 40 / 4%);
	transition: border-color .2s, box-shadow .2s, background-color .2s;
}
.frm_forms textarea { min-height: 140px; resize: vertical; }
.frm_forms input::placeholder,
.frm_forms textarea::placeholder { color: color-mix(in srgb, var(--c-text) 45%, transparent); }
.frm_forms input:hover,
.frm_forms select:hover,
.frm_forms textarea:hover { border-color: color-mix(in srgb, var(--c-dark) 32%, transparent); }
.frm_forms input:focus,
.frm_forms select:focus,
.frm_forms textarea:focus { outline: none; border-color: var(--c-primary); box-shadow: 0 0 0 4px var(--c-primary-soft); }
.frm_forms input[readonly],
.frm_forms input:disabled { background-color: color-mix(in srgb, var(--c-dark) 4%, #fff); }

/* ---------- Izbire (radio, checkbox) ---------- */

.frm_forms .frm_opt_container { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 240px), 1fr)); gap: 10px 12px; }
/* Polje »drugo« (npr. e-naslov za račun) se pokaže šele, ko je možnost izbrana (Formidable JS odstrani frm_pos_none). */
.frm_forms .frm_other_input.frm_pos_none { display: none; }
.frm_forms .frm_checkbox .frm_other_input,
.frm_forms .frm_radio .frm_other_input { margin-top: 8px; }
.frm_forms .vertical_radio .frm_opt_container { flex-direction: column; }
.frm_forms .frm_radio,
.frm_forms .frm_checkbox { margin: 0; }
.frm_forms .frm_radio label,
.frm_forms .frm_checkbox label {
	display: flex;
	align-items: flex-start;
	gap: 12px;
	padding: 13px 16px;
	border: 1.5px solid color-mix(in srgb, var(--c-dark) 14%, transparent);
	border-radius: var(--radius-sm);
	background: #fff;
	color: var(--c-text);
	font-weight: 500;
	line-height: 1.45;
	cursor: pointer;
	transition: border-color .2s, background-color .2s, box-shadow .2s;
}
.frm_forms .frm_radio label:hover,
.frm_forms .frm_checkbox label:hover { border-color: color-mix(in srgb, var(--c-primary) 55%, transparent); }
.frm_forms .frm_radio label:has(input:checked),
.frm_forms .frm_checkbox label:has(input:checked) { border-color: var(--c-primary); background: color-mix(in srgb, var(--c-primary) 5%, #fff); box-shadow: 0 0 0 3px var(--c-primary-soft); }
.frm_forms input[type="radio"],
.frm_forms input[type="checkbox"] {
	flex: none;
	width: 20px;
	height: 20px;
	margin: 1px 0 0;
	accent-color: var(--c-primary);
	cursor: pointer;
}
/* Posamezno potrditveno polje (soglasje, obveščanje) brez okvirja. */
.frm_forms .frm_single_option .frm_checkbox label,
.frm_forms .frm_form_field:only-child .frm_checkbox label,
.frm_forms .frm_opt_container:has(> .frm_checkbox:only-child) .frm_checkbox label { border: 0; padding: 4px 0; background: none; box-shadow: none; font-size: .95rem; }
.frm_forms .frm_opt_container:has(> .frm_checkbox:only-child) .frm_checkbox label:has(input:checked) { background: none; box-shadow: none; }

/* ---------- Naslovi sklopov, HTML ---------- */

.frm_forms .frm_section_heading { margin-top: 12px; }
.frm_forms .frm_section_heading:first-of-type { margin-top: 0; }
.frm_forms .frm_section_heading h3,
.frm_forms h3.frm_pos_top {
	margin: 0 0 4px;
	padding-bottom: 12px;
	border-bottom: 1px solid var(--s-border);
	color: var(--c-primary);
	font-size: .8rem;
	font-weight: 800;
	letter-spacing: .16em;
	line-height: 1.3;
	text-transform: uppercase;
}
/* Sklop samo s skritimi polji (npr. CRM koda) obiskovalcu ne kažemo. */
.frm_forms .frm_section_heading:not(:has(.frm_form_field:not(.frm_hidden_container):not(.frm_none_container))) { display: none; }
.frm_forms .frm_section_heading > .frm_description { margin-bottom: 4px; }
.frm_forms .frm_html_container,
.frm_forms .frm_form_field.frm_html_container { color: var(--s-text); font-size: .95rem; }

/* ---------- Gumb ---------- */

.frm_forms .frm_submit { grid-column: span 12; display: flex; flex-wrap: wrap; align-items: center; gap: 12px; margin-top: 8px; }
.frm_forms .frm_submit button,
.frm_forms .frm_submit input[type="submit"],
.frm_forms .frm_button_submit,
.frm_forms .frm_prev_page {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: .5em;
	min-height: 54px;
	padding: .8em 1.8em;
	border: 0;
	border-radius: var(--btn-radius);
	background: var(--c-primary);
	color: var(--c-on-primary);
	font: inherit;
	font-size: 1rem;
	font-weight: 650;
	cursor: pointer;
	box-shadow: 0 6px 16px -6px color-mix(in srgb, var(--c-primary) 60%, transparent);
	transition: background-color .2s, transform .2s, box-shadow .2s;
}
.frm_forms .frm_submit button:hover,
.frm_forms .frm_button_submit:hover { background: var(--c-primary-hover); transform: translateY(-1px); }
.frm_forms .frm_prev_page { background: transparent; color: var(--s-heading); box-shadow: none; border: 1.5px solid var(--s-border); }
.frm_forms .frm_loading_form .frm_button_submit { opacity: .6; pointer-events: none; }
@media (max-width: 600px) {
	.frm_forms .frm_submit button,
	.frm_forms .frm_submit input[type="submit"],
	.frm_forms .frm_button_submit { width: 100%; }
}

/* ---------- Napake in sporočila ---------- */

.frm_forms .frm_blank_field input,
.frm_forms .frm_blank_field select,
.frm_forms .frm_blank_field textarea { border-color: #d93a3a; box-shadow: 0 0 0 3px rgb(217 58 58 / 12%); }
.frm_forms .frm_error { margin-top: 6px; color: #c62828; font-size: .86rem; font-weight: 600; }
.frm_error_style,
.frm_message,
.frm_forms + .frm_message {
	margin: 0 0 20px;
	padding: 16px 18px;
	border-radius: var(--radius-sm);
	font-weight: 550;
}
.frm_error_style { background: #fdecec; color: #8f1d1d; border: 1px solid #f5c2c2; }
.frm_message { background: #eaf6ef; color: #17633a; border: 1px solid #bfe3cd; }
.frm_forms .frm_message p:last-child { margin: 0; }

/* Zaprt obrazec (»This form is currently closed«) – Formidable izpiše golo besedilo. */
.form-blk .frm_forms:empty::after,
.frm-form-closed { display: block; padding: 18px 20px; border-radius: var(--radius-sm); background: var(--s-card-2); color: var(--s-soft); }

/* ---------- Obrazci na temnem ozadju ---------- */

.surface.is-dark .frm_forms .frm_radio label,
.surface.is-dark .frm_forms .frm_checkbox label { background: rgb(255 255 255 / 6%); border-color: rgb(255 255 255 / 18%); color: var(--s-text); }
.surface.is-dark .frm_forms .frm_radio label:has(input:checked),
.surface.is-dark .frm_forms .frm_checkbox label:has(input:checked) { background: rgb(255 255 255 / 12%); border-color: #fff; box-shadow: none; }
.surface--primary .frm_forms .frm_submit button { background: #fff; color: var(--c-primary); }