/* ============================================================
   Rev Cycle Insights subscribe form — horizontal layout (v2)
   Scope: .new-rev-cycle-form (add to the Spectra container's
   "Additional CSS Class(es)" on pages that get the new design)
   Form: CF7 — markup unchanged, layout only
   Verified on bg-menu-2 dev 2026-08-26. Lived in the Customizer
   "Additional CSS" box until 2026-09-24, when it was migrated
   here (Phase 3); loaded from wp_head prio 101, the same cascade
   slot the Customizer inline block occupied.
   ============================================================ */

.new-rev-cycle-form .wpcf7-form {
	display: grid;
	grid-template-columns: 1fr 1fr 2fr; /* First | Last | Email */
	gap: 20px 24px;
}

/* CF7 wraps each field in a <p> — kill its default margins */
.new-rev-cycle-form .contact-form-input p { margin: 0; }

/* CF7 gives every direct form child 1.2em margin-bottom — the grid gap
   handles row spacing, so zero them (also fixes 20px excess after the
   submit/consent wrapper) */
.new-rev-cycle-form .wpcf7-form > div { margin-bottom: 0; }

/* Stray trailing grid items after the submit wrapper (CF7's script <p>
   and honeypot input) each claim a grid row + gap — remove them */
.new-rev-cycle-form .apply-form-bottom--wrapper ~ p,
.new-rev-cycle-form .apply-form-bottom--wrapper ~ .wpcf7_hp_field {
	display: none;
}

/* Row 2: Organization spans under First+Last, Role under Email */
.new-rev-cycle-form .contact-form-input:has([data-name="organization"]) { grid-column: 1 / 3; }
.new-rev-cycle-form .contact-form-input:has([data-name="role"]) { grid-column: 3; }

/* Hidden tracking field's wrapper — don't let it occupy a grid cell */
.new-rev-cycle-form .wpcf7-form > div:has([data-name="page_url_new"]) { display: none; }

/* Bottom block: submit first, consent line below it (design order) */
.new-rev-cycle-form .apply-form-bottom--wrapper {
	grid-column: 1 / -1;
	display: flex;
	flex-direction: column;
	gap: 20px;
	margin-top: 20px;
}
.new-rev-cycle-form .apply-form-bottom--wrapper .marketing-disclaimer {
	order: 2;
	text-align: center;
	margin: 0;
}
.new-rev-cycle-form .consultation-submit-btn--wrapper { order: 1; }
.new-rev-cycle-form .consultation-submit-btn--wrapper p { margin: 0; }
.new-rev-cycle-form .wpcf7-submit { width: 100%; }

/* Validation/response messages span the full band */
.new-rev-cycle-form .wpcf7-response-output { grid-column: 1 / -1; }

/* Submit arrow: re-anchor the absolutely-positioned ::after to the
   button's center (site CSS positions it with an offset tuned to the
   old, narrower button) */
.new-rev-cycle-form .consultation-submit-btn--wrapper p { position: relative; }
.new-rev-cycle-form .consultation-submit-btn--wrapper p::after { left: calc(50% + 34px); }

/* Field styling per Figma (the old styles were scoped to the removed
   .contact-form-right column) */
.new-rev-cycle-form .contact-form-input label {
	font-size: 12px;
	font-weight: 700;
	line-height: 1;
	color: #475569;
}
.new-rev-cycle-form .contact-form-input input {
	width: 100%;
	background: #fff;
	border: 1px solid #BABCBE;
	border-radius: 8px;
	min-height: 53px;
	padding: 15px;
	font-size: 16px;
	font-weight: 500;
	line-height: 1;
	color: #475569;
}
.new-rev-cycle-form .contact-form-input input::placeholder {
	color: #475569;
	opacity: 0.5;
}
.new-rev-cycle-form .wpcf7-submit {
	padding: 13px 30px;
	border-radius: 12px;
}
.new-rev-cycle-form .marketing-disclaimer { color: #475569; }
.new-rev-cycle-form .marketing-disclaimer a { border-bottom: 2px solid; }

/* Mobile: First + Last share row 1 (per mobile comp); everything else spans */
@media (max-width: 768px) {
	.new-rev-cycle-form .wpcf7-form { grid-template-columns: 1fr 1fr; gap: 20px 12px; }
	.new-rev-cycle-form .contact-form-input:has([data-name="your-email"]),
	.new-rev-cycle-form .contact-form-input:has([data-name="organization"]),
	.new-rev-cycle-form .contact-form-input:has([data-name="role"]) { grid-column: 1 / -1; }
}

/* Blog hero title: two-line break is desktop-only (mobile comp = one line) */
@media (max-width: 768px) {
	.blog-header---wrapper .uagb-heading-text br { display: none; }
}

/* Tighten field rows to the comp (theme line-height was inflating each
   row by ~16px) and overlay validation tips so they don't push layout */
.new-rev-cycle-form .contact-form-input p { line-height: 1; }
.new-rev-cycle-form .contact-form-input label {
	display: inline-block;
	margin-bottom: 8px;
}
.new-rev-cycle-form .wpcf7-form-control-wrap {
	display: block;
	position: relative;
}
.new-rev-cycle-form .wpcf7-not-valid-tip {
	position: absolute;
	top: calc(100% + 2px);
	left: 0;
	line-height: 1;
}

/* Band heading: smaller + 2-line fit on mobile, explicit bottom margin */
@media (max-width: 768px) {
	.new-rev-cycle-form .bg-sec-heading .uagb-heading-text { font-size: 24px !important; }
	.new-rev-cycle-form .bg-sec-heading { margin-bottom: 24px !important; }
}

/* nrcf error states */
/* Fluid validation UX (matches P2P calc rhythm): focus rings, tinted
   invalid borders, error tips with reserved room, soft banner card */
.new-rev-cycle-form .contact-form-input input {
	transition: border-color 0.2s ease, box-shadow 0.2s ease;
}
.new-rev-cycle-form .contact-form-input input:focus {
	outline: none;
	border-color: #475569;
	box-shadow: 0 0 0 3px rgba(71, 85, 105, 0.15);
}
.new-rev-cycle-form .contact-form-input input.wpcf7-not-valid {
	border-color: #d63638;
}
.new-rev-cycle-form .wpcf7-not-valid-tip {
	font-size: 12px;
	font-weight: 500;
	color: #d63638;
	top: calc(100% + 6px);
}
/* expand row rhythm while errors are showing so tips breathe */
.new-rev-cycle-form .wpcf7-form {
	transition: row-gap 0.3s ease;
}
.new-rev-cycle-form .wpcf7-form.invalid,
.new-rev-cycle-form .wpcf7-form.unaccepted {
	row-gap: 46px;
}
/* the expanded gap is only needed under the field rows — keep the
   space above the submit block at its normal 40px total */
.new-rev-cycle-form .apply-form-bottom--wrapper {
	transition: margin-top 0.3s ease;
}
.new-rev-cycle-form .wpcf7-form.invalid .apply-form-bottom--wrapper,
.new-rev-cycle-form .wpcf7-form.unaccepted .apply-form-bottom--wrapper {
	margin-top: -6px;
}
/* response banner: soft brand-amber card instead of default bordered box */
.new-rev-cycle-form .wpcf7-response-output {
	margin: 0 !important;
	padding: 14px 20px !important;
	border: 1px solid #F2D06F !important;
	border-radius: 12px;
	background: rgba(242, 208, 111, 0.18);
	color: #1e293b;
	font-weight: 500;
	line-height: 1.5 !important;
}
.new-rev-cycle-form .wpcf7-form.sent .wpcf7-response-output {
	border-color: #4ade80 !important;
	background: rgba(74, 222, 128, 0.15);
}
/* tighten banner to ~12px under the consent line (compensates row-gap) */
.new-rev-cycle-form .wpcf7-form.invalid .wpcf7-response-output,
.new-rev-cycle-form .wpcf7-form.unaccepted .wpcf7-response-output {
	margin-top: -52px !important;
}
.new-rev-cycle-form .wpcf7-form.sent .wpcf7-response-output {
	margin-top: -26px !important;
}

/* Blog pagination: 16 fixed-width buttons overflow narrow viewports —
   wrap onto multiple centered rows on mobile */
@media (max-width: 768px) {
	#blogPagination {
		max-width: 100%;
		flex-wrap: wrap;
		justify-content: center;
	}
}

/* Form band entrance: CSS keyframe instead of AOS so the fade is
   visible regardless of load speed (AOS inits pre-paint on fast
   cached loads and the animation completes before first frame) */
@media (prefers-reduced-motion: no-preference) {
	@keyframes nrcfFadeUp {
		from { opacity: 0; transform: translateY(24px); }
		to { opacity: 1; transform: none; }
	}
	.blog-header---wrapper {
		animation: nrcfFadeUp 0.5s ease both;
	}
	.new-rev-cycle-form {
		animation: nrcfFadeUp 0.5s ease 0.15s both;
	}
}