/**
 * IFAD Inquiries — modal styling, in the site's design language
 * (Nunito Sans inherited, brand navy #0E0E31, 5px radius token).
 */

.ifad-modal {
	--nv: #0e0e31;
	--ln: #e5e5ea;
	--mt: #6b6b76;
	--rd: 5px;
	position: fixed;
	inset: 0;
	z-index: 100000;
	display: none;
}
/* Flex + scroll on the layer itself, dialog margin:auto — the submit button
   stays reachable even when the form is taller than a short viewport. */
.ifad-modal.is-open {
	display: flex;
	justify-content: center;
	overflow-y: auto;
	box-sizing: border-box;
	padding: 24px 16px;
}

.ifad-modal__overlay {
	position: fixed;
	inset: 0;
	background: rgba(14, 14, 49, .55);
}
.ifad-modal.is-open .ifad-modal__overlay { animation: ifadFadeIn .18s ease; }

.ifad-modal__dialog {
	position: relative;
	margin: auto;
	width: min(460px, 100%);
	background: #fff;
	border-radius: var(--rd);
	padding: 30px 30px 28px;
	box-shadow: 0 24px 64px rgba(14, 14, 49, .28);
}
.ifad-modal.is-open .ifad-modal__dialog { animation: ifadModalIn .18s ease; }
/* The dialog receives focus on open (a11y) instead of the first input — no ring
   around the whole box for that programmatic focus. */
.ifad-modal__dialog:focus { outline: none; }

.ifad-modal__close {
	position: absolute;
	top: 14px;
	right: 14px;
	width: 34px;
	height: 34px;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 0;
	background: none;
	border: 0;
	border-radius: var(--rd);
	color: var(--nv);
	cursor: pointer;
	transition: background .15s ease;
}
.ifad-modal__close:hover { background: #f4f4f6; }

/* --- Form panel --- */
.ifad-modal__title {
	margin: 0 0 4px;
	font-size: 20px;
	font-weight: 700;
	line-height: 1.2;
	color: var(--nv);
}
.ifad-modal__product {
	margin: 0 0 14px;
	font-size: 13px;
	font-weight: 600;
	color: var(--mt);
}
.ifad-modal__intro {
	margin: 0 0 16px;
	font-size: 14px;
	line-height: 1.5;
	color: var(--mt);
}

.ifad-field { margin-bottom: 12px; }
.ifad-field__label {
	display: block;
	margin-bottom: 6px;
	font-size: 13px;
	font-weight: 600;
	color: var(--nv);
}
.ifad-field__req { color: #e74c3c; }
.ifad-field__control {
	width: 100%;
	box-sizing: border-box;
	padding: 11px 13px;
	background: #fff;
	border: 1px solid var(--ln);
	border-radius: var(--rd);
	font-family: inherit;
	font-size: 14px;
	color: var(--nv);
	transition: border-color .15s ease;
}
.ifad-field__control::placeholder { color: #a7a7b2; }
.ifad-field__control:focus { outline: none; border-color: var(--nv); }
textarea.ifad-field__control { resize: vertical; min-height: 76px; }
.ifad-field.has-error .ifad-field__control { border-color: #e74c3c; }

.ifad-modal__hp {
	position: absolute;
	left: 0;
	width: 1px;
	height: 1px;
	overflow: hidden;
}

.ifad-modal__error {
	margin: 0 0 12px;
	padding: 10px 13px;
	background: #fdecec;
	border-radius: var(--rd);
	color: #c0392b;
	font-size: 13px;
	line-height: 1.4;
}

.ifad-modal__submit {
	width: 100%;
	margin-top: 6px;
	padding: 13px 20px;
	background: var(--nv);
	border: 1px solid var(--nv);
	border-radius: var(--rd);
	color: #fff;
	font-family: inherit;
	font-size: 15px;
	font-weight: 600;
	cursor: pointer;
	transition: opacity .15s ease;
}
.ifad-modal__submit:hover { opacity: .9; }
.ifad-modal__submit.is-loading,
.ifad-modal__submit:disabled { opacity: .6; cursor: default; }

/* --- Success panel --- */
.ifad-modal__success { text-align: center; padding: 14px 0 6px; }
.ifad-modal__success-icon {
	width: 58px;
	height: 58px;
	margin: 0 auto 18px;
	display: flex;
	align-items: center;
	justify-content: center;
	background: var(--nv);
	border-radius: 50%;
	color: #fff;
}
.ifad-modal__success-text {
	margin: 0 0 22px;
	font-size: 16px;
	line-height: 1.5;
	color: var(--nv);
}
.ifad-modal__done {
	padding: 11px 28px;
	background: none;
	border: 1px solid var(--nv);
	border-radius: var(--rd);
	color: var(--nv);
	font-family: inherit;
	font-size: 14px;
	font-weight: 600;
	cursor: pointer;
	transition: background .15s ease, color .15s ease;
}
.ifad-modal__done:hover { background: var(--nv); color: #fff; }

/* Body scroll lock while a modal is open. */
body.ifad-modal-open { overflow: hidden; }

@keyframes ifadFadeIn { from { opacity: 0; } to { opacity: 1; } }
@keyframes ifadModalIn {
	from { opacity: 0; transform: translateY(-12px); }
	to   { opacity: 1; transform: translateY(0); }
}

@media ( max-width: 520px ) {
	.ifad-modal.is-open { padding: 16px 12px; }
	.ifad-modal__dialog { padding: 28px 20px 22px; }
}