/*
 * aegdonor.nu: Ninja Forms-layout uden "Layout & Styles" (CRM #2945, 23-10-2026)
 *
 * Tilføjelsen ninja-forms-style (Layout & Styles) er fjernet. Den lagde felterne i
 * rækker og celler med JS (.nf-row > .nf-cell, float: left, width 50 %) og skrev
 * felt-styles som inline <style>. Uden den renderer kernen felterne i én liste:
 *   .nf-form-content > nf-fields-wrap > nf-field > .nf-field-container
 * Her bliver hver nf-field en celle med samme float-model som pluginets. Det
 * giver de samme bredder, højder og margener. Med grid i stedet blev hvert felt
 * 5 px højere, og formularen på /book-samtale/ (Elementor) blev bredere.
 *
 * Kilder:
 * - Rækkerne: wp_nf3_form_meta.formContentData for form 3, 4 og 5. Alle
 *   to-kolonne-rækker er 50/50. Kernen viser felterne i samme rækkefølge
 *   (feltets order, så id).
 * - Felt-styles: wp_nf3_field_meta (*_styles_*), dvs. pluginets inline <style>.
 * - Temaets assets/css/styles.css har tre regler, der hang på pluginets DOM
 *   (.nf-cell { padding: 0 10px }, .nf-cell:nth-child(2) .submit-container,
 *   .sidebar-wrapper .widget .nf-multi-cell). De er genskabt nedenfor.
 *
 * De halve celler vælges med :has(), som temaet selv bruger til formularerne.
 * En browser uden :has() viser formularen i én kolonne.
 *
 * Form 1 ("Contact Me") og 6 ("Tilmelding event") er ikke indlejret nogen steder
 * og er ikke med. Nye felter i form 3/4/5 får fuld bredde; skal et nyt felt stå i
 * halv bredde, så tilføj dets id under "Halve celler".
 * Footer-formularen er en ekstra instans af form 4 med id'er som
 * nf-field-61_1-container, derfor både "nf-field-61-" og "nf-field-61_".
 */

/* 1. Celler, som pluginets .nf-cell: float, fuld bredde, 10 px sidepadding
 *    (padding'en er temaets regel), og hver celle starter en ny række. */
:is(#nf-form-3-cont, #nf-form-4-cont, [id^="nf-form-4_"], #nf-form-5-cont) .nf-form-content > nf-fields-wrap {
	display: flow-root;
}

:is(#nf-form-3-cont, #nf-form-4-cont, [id^="nf-form-4_"], #nf-form-5-cont) .nf-form-content > nf-fields-wrap > nf-field {
	float: left;
	clear: both;
	width: 100%;
	padding: 0 10px;
	box-sizing: border-box;
}

/* 2. Halve celler (50 %) fra formContentData. */
:is(#nf-form-3-cont, #nf-form-4-cont, [id^="nf-form-4_"], #nf-form-5-cont) .nf-form-content > nf-fields-wrap > nf-field:has(> :is(
	/* form 4 "Kontaktformular": fornavn | efternavn, accept | send */
	[id^="nf-field-61-"], [id^="nf-field-61_"], [id^="nf-field-62-"], [id^="nf-field-62_"],
	[id^="nf-field-63-"], [id^="nf-field-63_"], [id^="nf-field-60-"], [id^="nf-field-60_"],
	/* form 3 "DK Ansøgning - ægdonor": fornavn | efternavn, postnr. | by, højde | vægt,
	   diagnoser | hvilke, medicin | hvilke, accept | send */
	[id^="nf-field-30-"], [id^="nf-field-31-"], [id^="nf-field-54-"], [id^="nf-field-55-"],
	[id^="nf-field-38-"], [id^="nf-field-39-"], [id^="nf-field-41-"], [id^="nf-field-42-"],
	[id^="nf-field-43-"], [id^="nf-field-44-"], [id^="nf-field-51-"], [id^="nf-field-52-"],
	/* form 5 "Kan vi hjælpe? - DK": fornavn | efternavn */
	[id^="nf-field-64-"], [id^="nf-field-65-"]
)) {
	width: 50%;
}

/* Rækkens anden celle står ved siden af den første. */
:is(#nf-form-3-cont, #nf-form-4-cont, [id^="nf-form-4_"], #nf-form-5-cont) .nf-form-content > nf-fields-wrap > nf-field:has(> :is(
	[id^="nf-field-62-"], [id^="nf-field-62_"], [id^="nf-field-60-"], [id^="nf-field-60_"],
	[id^="nf-field-31-"], [id^="nf-field-55-"], [id^="nf-field-39-"], [id^="nf-field-42-"],
	[id^="nf-field-44-"], [id^="nf-field-52-"],
	[id^="nf-field-65-"]
)) {
	clear: none;
}

/* 3. Responsivt: én kolonne under 600 px, som pluginets
 *    @media only screen and (max-width: 600px) { .nf-cell { width: 100% !important } } */
@media only screen and (max-width: 600px) {
	:is(#nf-form-3-cont, #nf-form-4-cont, [id^="nf-form-4_"], #nf-form-5-cont) .nf-form-content > nf-fields-wrap > nf-field {
		width: 100% !important;
	}
}

/* 4. Temaets regler, der før ramte pluginets DOM. */

/* Submit-knappen i rækkens anden celle står til højre
 * (før: .nf-form-content .nf-cell:nth-child(2) .submit-container). */
:is(#nf-form-3-cont, #nf-form-4-cont, [id^="nf-form-4_"]) .submit-container:is([id^="nf-field-60-"], [id^="nf-field-60_"], [id^="nf-field-52-"]) {
	text-align: right;
}

/* Formularer i en sidebar-widget går ud til kanten (form 5 på /spoergeskema/;
 * før: .sidebar-wrapper .widget .nf-multi-cell). */
.sidebar-wrapper .widget :is(#nf-form-3-cont, #nf-form-4-cont, [id^="nf-form-4_"], #nf-form-5-cont) .nf-form-wrap {
	margin-inline: -15px;
}

/* 5. Felt-styles fra Layout & Styles (wp_nf3_field_meta), med pluginets egne
 *    selektorer, så de vinder over kernens :hover som før. */

/* Orange submit: form 4 felt 60 (også footer-instansen 60_1) og form 3 felt 52. */
.nf-form-content .nf-field-container #nf-field-60-wrap .nf-field-element .ninja-forms-field,
.nf-form-content .nf-field-container #nf-field-60_1-wrap .nf-field-element .ninja-forms-field,
.nf-form-content .nf-field-container #nf-field-60_2-wrap .nf-field-element .ninja-forms-field,
.nf-form-content .nf-field-container #nf-field-52-wrap .nf-field-element .ninja-forms-field {
	background-color: #ef7d00;
	color: #ffffff;
}

/* Skillelinjen i form 3 (felt 56). */
.nf-form-content .nf-field-container #nf-field-56-wrap .nf-field-element .ninja-forms-field {
	margin: 10px 0;
}