/**
 * AMA — Apply Form widget.
 *
 * Colour tokens (--ama-* / --red-deep etc.) are declared once on `body` in
 * style.css; hex fallbacks are given so the block still reads correctly if it
 * is ever rendered outside the theme.
 *
 * Version: 2.7.83 (tracks the theme version — cache-busting uses
 *          AMAINDIATS_CHILD_VERSION, this header is documentation)
 */

.ama-apply { max-width: 100%; }

/* ── Availability lines ──────────────────────────────────────────────── */

.ama-apply__seats,
.ama-apply__low,
.ama-apply__closed,
.ama-apply__intro {
	margin: 0 0 10px;
	font-size: 0.9375rem;
	line-height: 1.5;
}

.ama-apply__seats {
	font-weight: 700;
	color: var(--blue-deep, #1a2744);
}

.ama-apply__low {
	font-weight: 700;
	color: var(--red-deep, #a82720);
}

/* Closed is a statement of fact, not an error: muted, not alarming. */
.ama-apply__closed {
	padding: 12px 16px;
	border: 1px solid var(--border, #d6cfc4);
	border-left: 4px solid var(--ink-soft, #6b6459);
	border-radius: 4px;
	background: var(--paper, #f1ece0);
	color: var(--ink, #1a1f33);
	font-weight: 600;
}

.ama-apply__intro { color: var(--ink-soft, #6b6459); }

/* ── Form ────────────────────────────────────────────────────────────── */

.ama-apply__form {
	display: flex;
	flex-direction: column;
	gap: 12px;
	margin: 0;
}

.ama-apply__row {
	display: flex;
	flex-direction: column;
	gap: 4px;
	margin: 0;
	/* min-width:0 so a field can shrink inside the inline row below rather
	   than forcing the whole form wider than its column. */
	min-width: 0;
}

.ama-apply__label {
	font-family: var(--font-sans, system-ui, sans-serif);
	font-size: 0.8125rem;
	font-weight: 700;
	line-height: 1.4;
	color: var(--ink, #1a1f33);
}

.ama-apply__req { color: var(--red-deep, #a82720); margin-left: 2px; }

.ama-apply__input {
	width: 100%;
	box-sizing: border-box;
	padding: 10px 12px;
	border: 1px solid var(--border, #d6cfc4);
	border-radius: 4px;
	background: #fff;
	font-family: inherit;
	font-size: 0.9375rem;
	line-height: 1.4;
	color: var(--ink, #1a1f33);
	/* 2.5.8 target size, and large enough that iOS does not zoom on focus. */
	min-height: 44px;
}

.ama-apply__input:focus-visible {
	outline: 2px solid var(--blue, #1740a8);
	outline-offset: 1px;
	border-color: var(--blue, #1740a8);
}

/* ── Button ──────────────────────────────────────────────────────────── */

/* Repeated class: theme buttons inside Elementor lose to the kit's own button
   rules on a single class, and this must not be beaten by them. */
.ama-apply__btn.ama-apply__btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 12px 24px;
	min-height: 44px;
	/* --red is the theme CTA colour (#d6362f, declared on body in style.css).
	   The hex is only a fallback for the token being missing, so it names the
	   same colour rather than a second opinion about what the button is. */
	border: 2px solid var(--red, #d6362f);
	border-radius: 4px;
	background: var(--red, #d6362f);
	color: #fff;
	font-family: var(--font-sans, system-ui, sans-serif);
	font-size: 0.875rem;
	font-weight: 700;
	letter-spacing: 0.02em;
	text-transform: uppercase;
	cursor: pointer;
	transition: filter 0.12s ease;
	/* The crimson line under the label is the Elementor Kit Link typography
	   underline bleeding onto the button. edupreme-kit-overrides.css already
	   strips it site-wide with `button { text-decoration: none !important }`,
	   but the Kit declares its own underline !important too, and its selector
	   carries a class (0,1,1) against that bare element selector (0,0,1) - so
	   among two !important rules the Kit wins. A repeated class puts this at
	   0,2,0 and settles it. */
	text-decoration: none !important;
}

.ama-apply__btn.ama-apply__btn:hover,
.ama-apply__btn.ama-apply__btn:focus {
	filter: brightness(0.92);
}

.ama-apply__btn.ama-apply__btn:focus-visible {
	outline: 2px solid var(--blue-deep, #0d2160);
	outline-offset: 2px;
}

/* ── Inline layout ───────────────────────────────────────────────────── */

/* Fields share a row and wrap when they run out of width; the button keeps to
   its own line so it is never squeezed to a sliver beside three inputs. */
.ama-apply__form--inline {
	flex-direction: row;
	flex-wrap: wrap;
	align-items: flex-end;
}

.ama-apply__form--inline .ama-apply__row {
	flex: 1 1 200px;
}

/* Stacked: a column flex stretches its items, so the button would run the full
   width of the block. Held to its own width instead.
   This used to live on the button itself, where it did the same job but also
   overrode the inline row below — align-self always beats the parent align-items,
   so the button pinned to the TOP of the row while the inputs sat at the bottom. */
.ama-apply__form:not(.ama-apply__form--inline) .ama-apply__btn.ama-apply__btn {
	align-self: flex-start;
}

/* Inline: no align-self at all, so the row's align-items: flex-end applies and
   the button sits on the same baseline as the inputs beside it. */
.ama-apply__form--inline .ama-apply__btn {
	flex: 0 0 auto;
}

@media (max-width: 600px) {
	/* One field per row on a phone: three inputs sharing a line leaves each of
	   them too narrow to read what has been typed into it. */
	.ama-apply__form--inline { flex-direction: column; align-items: stretch; }
	.ama-apply__form--inline .ama-apply__row { flex: 1 1 auto; }
	.ama-apply__btn.ama-apply__btn { align-self: stretch; }
}

/* Quantity on an application line: a number, not an input. One line is one
   person, so there is nothing to adjust — see AMA_Apply_Form::lock_quantity(). */
.ama-apply__qty {
	display: inline-block;
	font-weight: 700;
	color: var(--ink, #1a1f33);
}

/* ------------------------------------------------------------------
   ADVISORY FIELD HINT (assets/js/ama-form-hints.js)
   Inserted after an input when what was typed does not look like an
   Indian mobile. It is a suggestion, not an error — the form submits
   either way — so it is deliberately quieter than .ama-apply__error:
   no red, no icon, no border.
   ------------------------------------------------------------------ */
.ama-apply__form .ama-field-hint {
	margin: .35rem 0 0;
	font-size: .8125rem;
	line-height: 1.45;
	color: var(--ink-soft, #6b6459);
}

.ama-apply__form .ama-field-hint[hidden] { display: none; }

/* The notices block that now carries a refused submit's reason. */
.ama-apply__notices { margin: 0 0 1rem; }
