/* Employment Application Form - supplemental styles.
   Tailwind (loaded via CDN in class-eap-shortcode.php) provides the bulk of
   the styling directly in the markup; this file covers the few things
   utility classes can't express cleanly (transitions, checked-radio state,
   focus rings on custom widgets, print, etc.). */

.eap-root {
	--eap-transition: 220ms ease;
}

.eap-step {
	animation: eap-fade-in 320ms ease;
}

@keyframes eap-fade-in {
	from {
		opacity: 0;
		transform: translateY(6px);
	}
	to {
		opacity: 1;
		transform: translateY(0);
	}
}

.eap-radio-pill:has(input:checked) {
	border-color: #6366f1;
	background-color: #eef2ff;
	color: #4338ca;
}

.eap-step-dot.eap-step-dot-active {
	background-color: #eef2ff;
	color: #4338ca;
}

.eap-step-dot.eap-step-dot-complete {
	background-color: #ecfdf5;
	color: #047857;
}

.eap-input.eap-input-error,
.eap-file-drop.eap-input-error {
	border-color: #f43f5e !important;
	box-shadow: 0 0 0 2px rgba(244, 63, 94, 0.15);
}

.eap-file-drop.eap-file-drag {
	border-color: #6366f1;
	background-color: #eef2ff;
}

#eap-submit-btn:disabled,
#eap-next-btn:disabled,
#eap-prev-btn:disabled {
	opacity: 0.6;
	cursor: not-allowed;
}

.eap-review-row {
	display: flex;
	justify-content: space-between;
	gap: 1rem;
	padding: 0.5rem 0;
	border-bottom: 1px solid #f1f5f9;
}

.eap-review-row:last-child {
	border-bottom: none;
}

/* Education step layout (scoped to .eap-step-education only — does not
   affect any other step). This is a defensive fallback that mirrors the
   Tailwind utility classes already on the markup (grid-cols-1 / md:grid-cols-3)
   in case the Tailwind CDN script hasn't finished loading yet. */
.eap-step-education {
	display: grid;
	grid-template-columns: 1fr;
	column-gap: 2rem;
	row-gap: 1.5rem;
}

@media (min-width: 768px) {
	.eap-step-education {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}
}

@media print {
	#eap-nav {
		display: none;
	}
}