/**
 * NHCIBOR Member Profile Edit styles
 *
 * Themes ACF's default form output (.acf-form, .acf-field, .acf-label,
 * .acf-input, .acf-tab-wrap, etc.) to match the rest of the site.
 *
 * Scoped to .nhcibor-edit wrapper so ACF forms elsewhere on the site (admin,
 * other front-end forms) are unaffected.
 */

.nhcibor-edit {
	--nhc-ink:          #252121;
	--nhc-ink-soft:     #555555;
	--nhc-muted:        #767676;
	--nhc-border:       #e5e5e5;
	--nhc-surface:      #ffffff;
	--nhc-surface-alt:  #f3f3f3;
	--nhc-button:       #322d2d;
	--nhc-button-hover: #1f1c1c;
	--nhc-peach:        #f1dbc4;
	--nhc-peach-light:  #f6e9d8;
	--nhc-success-bg:   #e7f4e4;
	--nhc-success-ink:  #1e6e14;

	--nhc-font-head: var(--wp--preset--font-family--roboto-condensed, "Roboto Condensed", "Arial Narrow", sans-serif);
	--nhc-font-body: var(--wp--preset--font-family--roboto, "Roboto", "Helvetica Neue", Arial, sans-serif);

	display: block;
	max-width: 1000px;
	margin-inline: auto;
	color: var(--nhc-ink);
	font-family: var(--nhc-font-body);
	font-size: 16px;
	line-height: 1.6;
}

.nhcibor-edit *,
.nhcibor-edit *::before,
.nhcibor-edit *::after {
	box-sizing: border-box;
}

.nhcibor-edit p,
.nhcibor-edit h1,
.nhcibor-edit h2 {
	margin: 0;
	padding: 0;
}

/* --- Header --------------------------------------------------------- */

.nhcibor-edit__header {
	margin-bottom: 24px;
	padding-bottom: 20px;
	border-bottom: 2px solid var(--nhc-border);
}

.nhcibor-edit__title {
	font-family: var(--nhc-font-head);
	font-size: 24px;
	font-weight: 500;
	line-height: 1.2;
	color: var(--nhc-ink);
	margin-bottom: 8px;
}

.nhcibor-edit__intro {
	font-size: 15px;
	line-height: 1.5;
	color: var(--nhc-ink-soft);
	max-width: 60ch;
}

/* --- Success / error notices --------------------------------------- */

.nhcibor-edit__notice {
	padding: 16px 20px;
	margin-bottom: 24px;
	border-left: 4px solid var(--nhc-ink);
	background: var(--nhc-surface-alt);
	font-family: var(--nhc-font-head);
	font-size: 14px;
	font-weight: 500;
	letter-spacing: 0.06em;
	text-transform: uppercase;
}

.nhcibor-edit__notice--success {
	background: var(--nhc-success-bg);
	border-left-color: var(--nhc-success-ink);
	color: var(--nhc-success-ink);
}

.nhcibor-edit__error {
	padding: 24px;
	background: var(--nhc-surface-alt);
	border-left: 4px solid var(--nhc-ink);
	color: var(--nhc-ink-soft);
}

/* --- ACF form container --------------------------------------------- */

.nhcibor-edit__form-wrap {
	background: transparent;
	padding: 0;
}

/* ACF emits .acf-form — reset its default styles that conflict with ours. */
.nhcibor-edit .acf-form {
	margin: 0;
	padding: 0;
}

.nhcibor-edit .acf-fields,
.nhcibor-edit .acf-fields > .acf-field {
	background: transparent;
}

/* Tabs at the top — ACF renders these as a horizontal nav. Style to match. */
.nhcibor-edit .acf-tab-wrap {
	background: transparent;
	border: 0;
	margin: 0 0 24px;
	padding: 0;
}

.nhcibor-edit .acf-tab-group {
	display: flex;
	flex-wrap: wrap;
	gap: 0;
	border-bottom: 2px solid var(--nhc-border);
	margin: 0 0 24px;
	padding: 0;
}

.nhcibor-edit .acf-tab-group li {
	list-style: none;
	margin: 0;
	padding: 0;
}

.nhcibor-edit .acf-tab-group li a {
	display: inline-block;
	padding: 12px 20px;
	margin-bottom: -2px;
	font-family: var(--nhc-font-head);
	font-size: 13px;
	font-weight: 500;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--nhc-ink-soft);
	background: transparent;
	border: 0;
	border-bottom: 2px solid transparent;
	text-decoration: none;
	cursor: pointer;
	transition: color 0.15s ease, border-color 0.15s ease;
}

.nhcibor-edit .acf-tab-group li a:hover {
	color: var(--nhc-ink);
}

.nhcibor-edit .acf-tab-group li.active a {
	color: var(--nhc-ink);
	border-bottom-color: var(--nhc-peach);
}

/* Individual fields --------------------------------------------------- */

.nhcibor-edit .acf-field {
	padding: 0 0 24px;
	margin: 0;
	border: 0;
	width: 100%;
}

.nhcibor-edit .acf-field + .acf-field {
	border-top: 0;
}

.nhcibor-edit .acf-label {
	margin: 0 0 8px;
	padding: 0;
}

.nhcibor-edit .acf-label label {
	font-family: var(--nhc-font-head);
	font-size: 13px;
	font-weight: 500;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--nhc-ink);
	margin: 0;
	padding: 0;
}

.nhcibor-edit .acf-label .description,
.nhcibor-edit .acf-input .description,
.nhcibor-edit .acf-input p.description {
	font-family: var(--nhc-font-body);
	font-size: 13px;
	font-weight: 400;
	letter-spacing: 0;
	text-transform: none;
	color: var(--nhc-muted);
	margin-top: 4px;
	line-height: 1.4;
}

.nhcibor-edit .acf-label label .acf-required {
	color: #c62828;
	margin-left: 4px;
}

/* Inputs -------------------------------------------------------------- */

.nhcibor-edit input[type="text"],
.nhcibor-edit input[type="email"],
.nhcibor-edit input[type="url"],
.nhcibor-edit input[type="tel"],
.nhcibor-edit input[type="number"],
.nhcibor-edit input[type="date"],
.nhcibor-edit textarea,
.nhcibor-edit select {
	width: 100%;
	max-width: 100%;
	padding: 10px 14px;
	border: 1px solid var(--nhc-border);
	border-radius: 0;
	background: var(--nhc-surface);
	color: var(--nhc-ink);
	font-family: var(--nhc-font-body);
	font-size: 15px;
	line-height: 1.5;
	transition: border-color 0.15s ease;
}

.nhcibor-edit input[type="text"]:hover,
.nhcibor-edit input[type="email"]:hover,
.nhcibor-edit input[type="url"]:hover,
.nhcibor-edit input[type="tel"]:hover,
.nhcibor-edit input[type="number"]:hover,
.nhcibor-edit input[type="date"]:hover,
.nhcibor-edit textarea:hover,
.nhcibor-edit select:hover {
	border-color: var(--nhc-ink-soft);
}

.nhcibor-edit input[type="text"]:focus,
.nhcibor-edit input[type="email"]:focus,
.nhcibor-edit input[type="url"]:focus,
.nhcibor-edit input[type="tel"]:focus,
.nhcibor-edit input[type="number"]:focus,
.nhcibor-edit input[type="date"]:focus,
.nhcibor-edit textarea:focus,
.nhcibor-edit select:focus {
	outline: none;
	border-color: var(--nhc-ink);
}

.nhcibor-edit textarea {
	min-height: 120px;
	resize: vertical;
}

/* Radio + checkbox lists --------------------------------------------- */

.nhcibor-edit .acf-radio-list,
.nhcibor-edit .acf-checkbox-list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 8px;
}

.nhcibor-edit .acf-radio-list.acf-hl,
.nhcibor-edit .acf-checkbox-list.acf-hl {
	flex-direction: row;
	flex-wrap: wrap;
	gap: 24px;
}

.nhcibor-edit .acf-radio-list li,
.nhcibor-edit .acf-checkbox-list li {
	margin: 0;
	padding: 0;
}

.nhcibor-edit .acf-radio-list label,
.nhcibor-edit .acf-checkbox-list label {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font-family: var(--nhc-font-body);
	font-size: 15px;
	font-weight: 400;
	color: var(--nhc-ink);
	letter-spacing: 0;
	text-transform: none;
	cursor: pointer;
}

.nhcibor-edit input[type="radio"],
.nhcibor-edit input[type="checkbox"] {
	accent-color: var(--nhc-ink);
	width: 18px;
	height: 18px;
	margin: 0;
}

/* Button group (used for "Preferred Mailing" etc.) */

.nhcibor-edit .acf-button-group {
	display: inline-flex;
	border: 1px solid var(--nhc-border);
}

.nhcibor-edit .acf-button-group label {
	padding: 10px 20px;
	font-family: var(--nhc-font-head);
	font-size: 13px;
	font-weight: 500;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--nhc-ink-soft);
	background: var(--nhc-surface);
	cursor: pointer;
	border-right: 1px solid var(--nhc-border);
	margin: 0;
}

.nhcibor-edit .acf-button-group label:last-child {
	border-right: 0;
}

.nhcibor-edit .acf-button-group label.selected {
	background: var(--nhc-button);
	color: #ffffff;
}

.nhcibor-edit .acf-button-group input {
	position: absolute;
	opacity: 0;
	pointer-events: none;
}

/* Image field (profile photo) --------------------------------------- */

.nhcibor-edit .acf-image-uploader {
	background: var(--nhc-surface-alt);
	border: 1px dashed var(--nhc-border);
	padding: 16px;
}

.nhcibor-edit .acf-image-uploader .acf-actions a,
.nhcibor-edit .acf-image-uploader .acf-actions input[type="button"] {
	background: var(--nhc-button);
	color: #ffffff;
	border: 0;
	padding: 8px 16px;
	font-family: var(--nhc-font-head);
	font-size: 12px;
	font-weight: 500;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	text-decoration: none;
	cursor: pointer;
	border-radius: 0;
}

/* Select2 (when ACF uses it on select fields) */

.nhcibor-edit .select2-container .select2-selection--single,
.nhcibor-edit .select2-container .select2-selection--multiple {
	min-height: 44px;
	border: 1px solid var(--nhc-border);
	border-radius: 0;
	padding: 4px 8px;
	font-family: var(--nhc-font-body);
	font-size: 15px;
}

.nhcibor-edit .select2-container--focus .select2-selection--single,
.nhcibor-edit .select2-container--focus .select2-selection--multiple {
	border-color: var(--nhc-ink);
}

/* Submit button ------------------------------------------------------ */

.nhcibor-edit .acf-form-submit {
	margin-top: 24px;
	padding-top: 24px;
	border-top: 2px solid var(--nhc-border);
}

.nhcibor-edit__submit,
.nhcibor-edit .acf-button,
.nhcibor-edit input[type="submit"].nhcibor-edit__submit {
	display: inline-block;
	padding: 14px 32px;
	background: var(--nhc-button);
	color: #ffffff;
	font-family: var(--nhc-font-head);
	font-size: 14px;
	font-weight: 500;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	text-decoration: none;
	border: 0;
	border-radius: 0;
	cursor: pointer;
	transition: background-color 0.15s ease;
}

.nhcibor-edit__submit:hover,
.nhcibor-edit .acf-button:hover,
.nhcibor-edit input[type="submit"].nhcibor-edit__submit:hover {
	background: var(--nhc-button-hover);
	color: #ffffff;
}

.nhcibor-edit__submit:focus-visible,
.nhcibor-edit input[type="submit"].nhcibor-edit__submit:focus-visible {
	outline: 2px solid var(--nhc-ink);
	outline-offset: 2px;
}

/* Conditional-logic-hidden fields (ACF toggles these) */

.nhcibor-edit .acf-field[data-conditional-logic] {
	/* ACF adds display:none inline when hidden; nothing to do. */
}

/* Validation errors -------------------------------------------------- */

.nhcibor-edit .acf-error-message {
	background: #fce4e4;
	color: #a01c1c;
	padding: 8px 12px;
	border-left: 3px solid #a01c1c;
	margin-top: 8px;
	font-size: 13px;
	font-family: var(--nhc-font-body);
	text-transform: none;
	letter-spacing: 0;
}

.nhcibor-edit .acf-field.acf-error input[type="text"],
.nhcibor-edit .acf-field.acf-error input[type="email"],
.nhcibor-edit .acf-field.acf-error textarea,
.nhcibor-edit .acf-field.acf-error select {
	border-color: #a01c1c;
}

/* --- Responsive ----------------------------------------------------- */

@media (max-width: 640px) {
	.nhcibor-edit__title {
		font-size: 22px;
	}

	.nhcibor-edit .acf-radio-list.acf-hl,
	.nhcibor-edit .acf-checkbox-list.acf-hl {
		gap: 12px;
	}
}