/* Exam Registration System – front-end styles */

.exam-reg-wrap {
	--er-primary: #2563eb;
	--er-primary-dark: #1d4ed8;
	--er-border: #d8dee9;
	--er-error: #dc2626;
	--er-success: #16a34a;
	--er-bg: #ffffff;
	--er-text: #1f2937;
	--er-muted: #6b7280;
	max-width: 760px;
	margin: 0 auto;
	padding: 0 16px;
	box-sizing: border-box;
	color: var(--er-text);
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
	line-height: 1.5;
}

.exam-reg-wrap *,
.exam-reg-wrap *::before,
.exam-reg-wrap *::after {
	box-sizing: border-box;
}

.exam-reg-form {
	background: var(--er-bg);
	border: 1px solid var(--er-border);
	border-radius: 14px;
	padding: 28px;
	box-shadow: 0 4px 18px rgba( 15, 23, 42, 0.06 );
}

.exam-reg-title {
	margin: 0 0 4px;
	font-size: 1.6rem;
	font-weight: 700;
}

.exam-reg-meta {
	margin: 0 0 20px;
	color: var(--er-muted);
	font-size: 0.9rem;
}

.exam-reg-field {
	margin-bottom: 18px;
}

.exam-reg-row {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 18px;
}

.exam-reg-field label,
.exam-reg-grouplabel {
	display: block;
	margin-bottom: 6px;
	font-weight: 600;
	font-size: 0.92rem;
}

.exam-reg-field .req {
	color: var(--er-error);
}

.exam-reg-form input[type="text"],
.exam-reg-form input[type="email"],
.exam-reg-form input[type="tel"],
.exam-reg-form input[type="number"],
.exam-reg-form input[type="date"],
.exam-reg-form input[type="file"],
.exam-reg-form select {
	width: 100%;
	padding: 11px 12px;
	border: 1px solid var(--er-border);
	border-radius: 9px;
	font-size: 0.95rem;
	background: #fff;
	transition: border-color 0.15s ease, box-shadow 0.15s ease;
	color: var(--er-text);
}

.exam-reg-form input:focus,
.exam-reg-form select:focus {
	outline: none;
	border-color: var(--er-primary);
	box-shadow: 0 0 0 3px rgba( 37, 99, 235, 0.15 );
}

.exam-reg-checkboxes {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 8px 16px;
}

.exam-reg-check,
.exam-reg-radio {
	display: flex;
	align-items: center;
	gap: 8px;
	font-weight: 400;
	cursor: pointer;
	margin-bottom: 0;
}

.exam-reg-check input,
.exam-reg-radio input {
	width: auto;
	margin: 0;
}

.exam-reg-radios {
	display: flex;
	flex-wrap: wrap;
	gap: 10px 22px;
}

/* Module groups (A1 / A2 / B1 / B2) */
.exam-reg-module-groups {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 12px;
}

.exam-reg-module-group {
	border: 1px solid var(--er-border);
	border-radius: 10px;
	padding: 12px 14px 14px;
	margin: 0;
	background: #f9fafb;
}

.exam-reg-module-group-title {
	font-weight: 700;
	font-size: 0.95rem;
	padding: 0 6px;
	color: var(--er-primary-dark);
}

.exam-reg-module-items {
	display: flex;
	flex-direction: column;
	gap: 7px;
	margin-top: 4px;
}

.exam-reg-module-items .exam-reg-check {
	font-size: 0.92rem;
}

/* Price breakdown under Amount */
.exam-reg-price-breakdown {
	margin-top: 8px;
	border: 1px dashed var(--er-border);
	border-radius: 9px;
	padding: 10px 12px;
	background: #f9fafb;
}

.er-price-table {
	width: 100%;
	border-collapse: collapse;
	font-size: 0.88rem;
}

.er-price-table td {
	padding: 4px 0;
	border: none;
}

.er-price-table .er-price {
	text-align: right;
	font-variant-numeric: tabular-nums;
	white-space: nowrap;
}

.er-price-table .er-price-total td {
	border-top: 1px solid var(--er-border);
	font-weight: 700;
	padding-top: 7px;
}

.er-price-table .er-price-discount td {
	color: var(--er-success);
	font-size: 0.8rem;
	padding-top: 0;
	padding-left: 10px;
}

.er-price-table .er-price-savings td {
	color: var(--er-success);
	font-weight: 600;
}

.er-price-table .er-price-group-head td {
	font-weight: 700;
	padding-top: 8px;
}

.er-price-table .er-price-item td:first-child {
	padding-left: 14px;
	color: var(--er-muted);
}

.er-price-table .er-price-subtotal td {
	color: var(--er-muted);
	border-top: 1px dashed var(--er-border);
	padding-top: 6px;
}

.er-price-table .er-price-bundle td {
	font-weight: 600;
}

/* Skills auto-included by a Full Module selection */
.exam-reg-check.er-included {
	opacity: 0.65;
}

.exam-reg-check.er-included span::after {
	content: " (included)";
	color: var(--er-muted);
	font-size: 0.8rem;
}

/* Single-level forms: one full-width module box */
.exam-reg-module-groups.er-single-level {
	grid-template-columns: 1fr;
}

/* WhatsApp button under the success message */
.exam-reg-whatsapp-wrap {
	text-align: center;
	margin-top: 14px;
}

.exam-reg-whatsapp {
	display: inline-block;
	background: #25d366;
	color: #fff !important;
	text-decoration: none;
	font-weight: 600;
	padding: 11px 22px;
	border-radius: 999px;
	box-shadow: 0 2px 6px rgba(37, 211, 102, 0.4);
	transition: background 0.15s ease, transform 0.15s ease;
}

.exam-reg-whatsapp:hover,
.exam-reg-whatsapp:focus {
	background: #1ebe5b;
	transform: translateY(-1px);
	color: #fff;
}

.er-price-note {
	color: var(--er-muted);
	font-size: 0.85rem;
}

.exam-reg-upload-group {
	border: 1px dashed var(--er-border);
	border-radius: 10px;
	padding: 16px;
	margin-bottom: 18px;
	background: #f9fafb;
}

.exam-reg-hint {
	display: block;
	margin-top: 6px;
	color: var(--er-muted);
	font-size: 0.8rem;
}

.exam-reg-error {
	display: block;
	margin-top: 5px;
	color: var(--er-error);
	font-size: 0.82rem;
	min-height: 0;
}

.exam-reg-field.has-error input,
.exam-reg-field.has-error select {
	border-color: var(--er-error);
	box-shadow: 0 0 0 3px rgba( 220, 38, 38, 0.12 );
}

.exam-reg-actions {
	margin-top: 8px;
}

.exam-reg-submit {
	background: var(--er-primary);
	color: #fff;
	border: none;
	border-radius: 9px;
	padding: 13px 28px;
	font-size: 1rem;
	font-weight: 600;
	cursor: pointer;
	transition: background 0.15s ease, transform 0.05s ease;
	width: 100%;
}

.exam-reg-submit:hover {
	background: var(--er-primary-dark);
}

.exam-reg-submit:active {
	transform: translateY( 1px );
}

.exam-reg-submit:disabled {
	opacity: 0.7;
	cursor: not-allowed;
}

.exam-reg-notice {
	padding: 12px 14px;
	border-radius: 9px;
	margin-bottom: 18px;
	font-size: 0.92rem;
	font-weight: 500;
}

.exam-reg-notice.is-error {
	background: #fef2f2;
	color: var(--er-error);
	border: 1px solid #fecaca;
}

.exam-reg-notice.is-success {
	background: #f0fdf4;
	color: var(--er-success);
	border: 1px solid #bbf7d0;
}

/* Mobile */
@media ( max-width: 600px ) {
	.exam-reg-row,
	.exam-reg-checkboxes,
	.exam-reg-module-groups {
		grid-template-columns: 1fr;
	}
	.exam-reg-form {
		padding: 20px;
	}
	.exam-reg-title {
		font-size: 1.35rem;
	}
}

/* Honeypot — visually hidden, off-screen, not display:none */
.exam-reg-hp {
	position: absolute !important;
	left: -9999px !important;
	top: auto;
	width: 1px;
	height: 1px;
	overflow: hidden;
}

/* ==================================================================== *
 * Module cards
 * ==================================================================== */
.exam-reg-cards {
	display: grid;
	grid-template-columns: repeat( auto-fill, minmax( 260px, 1fr ) );
	gap: 22px;
	margin: 20px 0;
	align-items: stretch;
}

.exam-reg-cards.er-cards-single {
	grid-template-columns: minmax( 260px, 320px );
}

.exam-reg-card {
	background: #0d1329;
	border: 1px solid #1d2544;
	border-radius: 16px;
	padding: 28px 26px 26px;
	display: flex;
	flex-direction: column;
	gap: 12px;
	box-shadow: 0 8px 24px rgba( 6, 10, 28, 0.35 );
	height: 100%;
	box-sizing: border-box;
}

.er-card-badge {
	font-size: 2.4rem;
	font-weight: 800;
	line-height: 1;
	letter-spacing: 0.02em;
	color: #f4364c;
}

.er-card-subtitle {
	margin: 0;
	font-size: 1.05rem;
	font-weight: 700;
	color: #ffffff;
}

.er-card-row {
	display: flex;
	align-items: center;
	gap: 10px;
	font-size: 0.92rem;
	color: #c7cde4;
}

.er-card-row svg {
	flex: 0 0 auto;
	opacity: 0.85;
}

.er-card-seats {
	color: #2fd08c;
	font-weight: 600;
}

.er-card-seats.er-card-full {
	color: #f4364c;
}

.er-card-btn {
	display: block;
	margin-top: auto;
	padding: 13px 18px;
	text-align: center;
	text-decoration: none;
	text-transform: uppercase;
	letter-spacing: 0.06em;
	font-size: 0.85rem;
	font-weight: 700;
	color: #ffffff !important;
	background: transparent;
	border: 1px solid #39415f;
	border-radius: 10px;
	transition: background 0.15s ease, border-color 0.15s ease, transform 0.15s ease;
}

.er-card-btn:hover,
.er-card-btn:focus {
	background: #f4364c;
	border-color: #f4364c;
	color: #fff;
	transform: translateY( -1px );
}

.er-card-btn-disabled,
.er-card-btn-disabled:hover {
	opacity: 0.45;
	cursor: not-allowed;
	background: transparent;
	border-color: #39415f;
	transform: none;
}

/* Payment section (QR + screenshot upload) */
.exam-reg-payment {
	margin: 26px 0 6px;
	padding: 20px 18px;
	border: 1px solid var(--er-border);
	border-radius: 12px;
	background: #f9fafb;
	text-align: center;
}

.exam-reg-payment-title {
	margin: 0 0 12px;
	font-size: 1.1rem;
}

.exam-reg-qr img {
	max-width: 220px;
	width: 100%;
	height: auto;
	border: 1px solid var(--er-border);
	border-radius: 10px;
	background: #fff;
	padding: 10px;
}

.exam-reg-payment .exam-reg-field {
	margin-top: 16px;
	text-align: left;
}

/* Fee table on module cards */
.er-card-fees {
	width: 100%;
	border-collapse: collapse;
	margin-top: 6px;
	font-size: 0.82rem;
	color: #c7cde4;
}

.er-card-fees th,
.er-card-fees td {
	padding: 6px 4px;
	border-bottom: 1px solid #1d2544;
	text-align: right;
	font-variant-numeric: tabular-nums;
	white-space: nowrap;
}

.er-card-fees .er-fee-name {
	text-align: left;
	white-space: normal;
}

.er-card-fees thead th {
	color: #ffffff;
	font-size: 0.72rem;
	text-transform: uppercase;
	letter-spacing: 0.05em;
	border-bottom: 1px solid #39415f;
}

.er-card-fees tbody tr:first-child td {
	color: #ffffff;
	font-weight: 600;
}

.er-card-fees tbody tr:last-child td {
	border-bottom: none;
}
