/**
 * Pedagogy Enrolments — public styles.
 *
 * Conservative, theme-friendly CSS. Inherits font-family from the theme.
 * No !important, no framework dependency, no external fonts.
 */

.pedagogy-enrolment { max-width: 1100px; margin: 2rem auto; font-size: 16px; }
.pedagogy-enrolment * { box-sizing: border-box; }

.pedagogy-enrolment .pe-empty {
	padding: 1.5rem;
	background: #f7f7f8;
	border: 1px solid #e5e5e8;
	border-radius: 8px;
	text-align: center;
	color: #555;
}

/* --- Class table ---------------------------------------------------------- */

.pe-table-wrap { overflow-x: auto; border: 1px solid #e5e5e8; border-radius: 10px; }
.pe-classes {
	width: 100%;
	border-collapse: collapse;
	background: #fff;
}
.pe-classes th,
.pe-classes td {
	padding: 14px 16px;
	text-align: left;
	border-bottom: 1px solid #eee;
	vertical-align: middle;
}
.pe-classes th {
	background: #fafafa;
	font-weight: 600;
	font-size: 13px;
	text-transform: uppercase;
	letter-spacing: 0.03em;
	color: #555;
}
.pe-classes tbody tr:last-child td { border-bottom: 0; }
.pe-classes tbody tr:hover { background: #fafcfb; }
.pe-class-row.pe-status-cancelled,
.pe-class-row.pe-status-closed { opacity: 0.55; }

/* --- Availability badges -------------------------------------------------- */

.pe-badge {
	display: inline-block;
	padding: 4px 10px;
	border-radius: 999px;
	font-size: 13px;
	font-weight: 600;
	line-height: 1.4;
	white-space: nowrap;
}
.pe-badge-ok   { background: #e8f5ee; color: #1a6b3c; }
.pe-badge-low  { background: #fff3e0; color: #8a4b00; }
.pe-badge-full { background: #fde8e8; color: #a61c1c; }
.pe-badge-off  { background: #eee; color: #666; }

/* --- Buttons -------------------------------------------------------------- */

.pe-btn {
	display: inline-block;
	padding: 9px 16px;
	border-radius: 8px;
	border: 1px solid #d4d4d8;
	background: #fff;
	color: #1f2937;
	font: inherit;
	font-weight: 600;
	cursor: pointer;
	transition: background 0.15s, border-color 0.15s;
}
.pe-btn:hover { background: #f9fafb; border-color: #a1a1aa; }
.pe-btn-select { border-color: #0f766e; color: #0f766e; }
.pe-btn-select:hover { background: #0f766e; color: #fff; }
.pe-btn-primary {
	background: #0f766e;
	border-color: #0f766e;
	color: #fff;
}
.pe-btn-primary:hover { background: #0b5e57; border-color: #0b5e57; }
.pe-btn[disabled] { opacity: 0.5; cursor: not-allowed; }

.pe-disabled { color: #8a8a8a; font-style: italic; }

/* --- Modal ---------------------------------------------------------------- */

.pe-modal,
.pe-confirmation {
	position: fixed;
	inset: 0;
	background: rgba(15, 23, 42, 0.55);
	display: flex;
	align-items: flex-start;
	justify-content: center;
	padding: 40px 16px;
	overflow-y: auto;
	z-index: 9999;
}
.pe-modal[hidden],
.pe-confirmation[hidden] { display: none; }

.pe-modal-inner {
	background: #fff;
	border-radius: 12px;
	width: 100%;
	max-width: 620px;
	padding: 28px;
	box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25);
	position: relative;
}
.pe-modal-close {
	position: absolute;
	top: 12px;
	right: 14px;
	background: transparent;
	border: 0;
	font-size: 28px;
	line-height: 1;
	cursor: pointer;
	color: #6b7280;
}
.pe-modal-close:hover { color: #111; }

.pe-modal h3 { margin: 0 0 6px; font-size: 22px; }
.pe-modal-subtitle { margin: 0 0 20px; color: #6b7280; }

/* --- Form ----------------------------------------------------------------- */

.pe-form fieldset {
	border: 1px solid #e5e5e8;
	border-radius: 8px;
	padding: 14px 16px 4px;
	margin: 0 0 16px;
}
.pe-form legend {
	padding: 0 6px;
	font-weight: 600;
	color: #1f2937;
	font-size: 14px;
}
.pe-row { margin-bottom: 12px; }
.pe-row label {
	display: block;
	font-weight: 500;
	margin-bottom: 4px;
	font-size: 14px;
	color: #374151;
}
.pe-row input[type=text],
.pe-row input[type=email],
.pe-row input[type=tel],
.pe-row input[type=date],
.pe-row textarea {
	width: 100%;
	padding: 9px 12px;
	border: 1px solid #d4d4d8;
	border-radius: 6px;
	font: inherit;
	background: #fff;
}
.pe-row input:focus,
.pe-row textarea:focus {
	outline: none;
	border-color: #0f766e;
	box-shadow: 0 0 0 3px rgba(15, 118, 110, 0.15);
}
.pe-row textarea { resize: vertical; min-height: 60px; }

.pe-check label {
	display: flex;
	gap: 10px;
	align-items: flex-start;
	font-weight: 400;
	font-size: 13px;
	line-height: 1.5;
	color: #374151;
	cursor: pointer;
}
.pe-check input[type=checkbox] { margin-top: 3px; flex-shrink: 0; }

.pe-req { color: #a61c1c; }

.pe-form-footer {
	margin-top: 16px;
	display: flex;
	flex-direction: column;
	gap: 10px;
}
.pe-error {
	background: #fde8e8;
	color: #8a1a1a;
	padding: 10px 12px;
	border-radius: 6px;
	font-size: 14px;
	margin: 0;
}

.pe-form-footer .pe-btn-primary { align-self: flex-end; padding: 11px 22px; }

/* --- Confirmation --------------------------------------------------------- */

.pe-confirmation .pe-modal-inner { max-width: 480px; text-align: center; }
.pe-confirmation h3 { font-size: 22px; color: #0f766e; }
.pe-confirmation code {
	display: inline-block;
	background: #f3f4f6;
	padding: 4px 10px;
	border-radius: 6px;
	font-size: 15px;
	letter-spacing: 0.04em;
}

/* --- Mobile --------------------------------------------------------------- */

@media (max-width: 640px) {
	.pe-classes thead { display: none; }
	.pe-classes,
	.pe-classes tbody,
	.pe-classes tr,
	.pe-classes td { display: block; width: 100%; }
	.pe-classes tr {
		padding: 12px 0;
		border-bottom: 1px solid #eee;
	}
	.pe-classes td {
		padding: 6px 16px;
		border: 0;
	}
	.pe-classes td::before {
		content: attr(data-label) ": ";
		font-weight: 600;
		color: #555;
		display: inline-block;
		min-width: 90px;
	}
	.pe-modal-inner { padding: 20px; }
}

/* --- Payment note --------------------------------------------------------- */

.pe-payment-note {
	background: #fffbeb;
	border: 1px solid #fde68a;
	color: #78350f;
	padding: 10px 12px;
	border-radius: 6px;
	font-size: 13px;
	margin: 0 0 10px;
	line-height: 1.5;
}

/* =====================================================================
   Closed-state notice (master switch off)
   Shown to public visitors when bookings are closed.
   ===================================================================== */
.pedagogy-bookings-closed-notice {
	max-width: 640px;
	margin: 1.5em auto;
	padding: 1.6em 1.8em;
	background: #f6f4ee;
	border-left: 4px solid #1a2d4d;
	border-radius: 4px;
}
.pedagogy-bookings-closed-heading {
	margin: 0 0 0.6em;
	font-size: 1.25em;
	color: #1a2d4d;
}
.pedagogy-bookings-closed-notice p {
	margin: 0 0 0.8em;
	color: #34384a;
	line-height: 1.55;
}
.pedagogy-bookings-closed-notice p:last-child {
	margin-bottom: 0;
}