/* ─────────────────────────────────────────────────────────────────────────
   Backflow Core — Front-end Base Styles
   backflow-front.css
   Loaded on every public page (enqueued by backflow-core.php).
   --wits-* tokens are defined here so all other stylesheets can inherit them.
   ───────────────────────────────────────────────────────────────────────── */

/* ── Design tokens ───────────────────────────────────────────────────────── */
:root {
	--wits-navy:         #1A3E6F;
	--wits-navy-deep:    #0B1E38;
	--wits-orange:       #E8601A;
	--wits-orange-dk:    #BF4A10;
	--wits-orange-lt:    #FEF0E8;
	--wits-blue-tint:    #EEF3FB;
	--wits-border:       #DDE3EE;
	--wits-body:         #1F2937;
	--wits-muted:        #5A6478;
	--wits-lighter:      #9AA3B2;
	--wits-green:        #3B6D11;
	--wits-red:          #D92D20;
	--wits-red-dk:       #B42318;
	--wits-red-tint:     #FEF3F2;
	--wits-r-card:       8px;
	--wits-r-btn:        999px;
	--wits-shadow:       0 2px 12px rgba(26, 62, 111, 0.08);
	--wits-shadow-hover: 0 6px 28px rgba(26, 62, 111, 0.14);
}

/* ── My Account — Layout ─────────────────────────────────────────────────── */
@media screen and (min-width: 768px) {
	.woocommerce-account .account-navigation-wrap {
		width: 20%;
	}
	.woocommerce-account .woocommerce-MyAccount-content {
		width: 80%;
	}
}

/* ── My Account — Sidebar ────────────────────────────────────────────────── */
.woocommerce-account .account-navigation-wrap .kadence-customer-name {
	font-family: "Outfit", sans-serif;
	font-size: 1.15em;
	font-weight: 500;
	color: var(--wits-navy);
	line-height: 1.3;
	margin-bottom: 16px;
}

.woocommerce-MyAccount-navigation ul {
	list-style: none;
	margin: 0;
	padding: 0;
}

.woocommerce-MyAccount-navigation ul li {
	margin: 0;
	padding: 0;
}

.woocommerce-MyAccount-navigation ul li a {
	display: block;
	padding: 9px 14px;
	font-family: "Manrope", sans-serif;
	font-size: 13px;
	color: var(--wits-muted);
	text-decoration: none;
	border-left: 3px solid transparent;
	border-radius: 0 4px 4px 0;
	transition: color 0.15s, border-color 0.15s, background 0.15s;
}

.woocommerce-MyAccount-navigation ul li a:hover {
	color: var(--wits-navy);
	border-left-color: var(--wits-orange);
	background: var(--wits-blue-tint);
}

.woocommerce-MyAccount-navigation ul li.is-active > a {
	color: var(--wits-navy);
	font-weight: 600;
	border-left-color: var(--wits-orange);
	background: var(--wits-blue-tint);
}

/* ── My Account — Content area ───────────────────────────────────────────── */
.woocommerce-MyAccount-content {
	font-family: "Manrope", sans-serif;
	font-size: 14px;
	color: var(--wits-body);
}

.woocommerce-MyAccount-content h1,
.woocommerce-MyAccount-content h2,
.woocommerce-MyAccount-content h3 {
	font-family: "Outfit", sans-serif;
	font-weight: 500;
	color: var(--wits-navy);
}

.woocommerce-MyAccount-content p {
	font-size: 14px;
	color: var(--wits-muted);
	line-height: 1.6;
}

.woocommerce-MyAccount-content a {
	color: var(--wits-navy);
	text-decoration: underline;
}

.woocommerce-MyAccount-content a:hover {
	color: var(--wits-orange);
}

/* ── My Account — Orders table ───────────────────────────────────────────── */
.woocommerce-orders-table {
	width: 100%;
	border-collapse: collapse;
	font-size: 13px;
	font-family: "Manrope", sans-serif;
	border: 1px solid var(--wits-border);
	border-radius: var(--wits-r-card);
	overflow: hidden;
}

.woocommerce-orders-table thead tr {
	border-bottom: 1.5px solid var(--wits-border);
}

.woocommerce-orders-table thead th {
	text-align: left;
	padding: 9px 14px;
	font-size: 11px;
	font-weight: 500;
	color: var(--wits-lighter);
	text-transform: uppercase;
	letter-spacing: 0.05em;
	background: transparent;
}

.woocommerce-orders-table tbody td {
	padding: 12px 14px;
	border-bottom: 1px solid #F0F2F5;
	vertical-align: middle;
}

.woocommerce-orders-table tbody tr:last-child td {
	border-bottom: none;
}

.woocommerce-orders-table tbody tr:hover td {
	background: #FAFBFD;
}

/* Order number link */
.woocommerce-orders-table .woocommerce-orders-table__cell-order-number a {
	font-weight: 600;
	color: var(--wits-navy);
	text-decoration: none;
}

.woocommerce-orders-table .woocommerce-orders-table__cell-order-number a:hover {
	color: var(--wits-orange);
}

/* Order status pills */
.woocommerce-orders-table mark.order-status {
	display: inline-block;
	font-size: 11px;
	font-weight: 500;
	padding: 3px 9px;
	border-radius: 20px;
	white-space: nowrap;
	background: transparent;
	box-shadow: none;
}

.woocommerce-orders-table mark.order-status.status-completed {
	background: #F2F2F2;
	color: #888;
}

.woocommerce-orders-table mark.order-status.status-processing {
	background: #E1F5EE;
	color: #0F6E56;
}

.woocommerce-orders-table mark.order-status.status-pending,
.woocommerce-orders-table mark.order-status.status-on-hold {
	background: #FFF8E1;
	color: #8A5C00;
}

.woocommerce-orders-table mark.order-status.status-cancelled,
.woocommerce-orders-table mark.order-status.status-refunded {
	background: #FEE2E2;
	color: #991B1B;
}

/* View order button */
.woocommerce-orders-table .woocommerce-button.button,
.woocommerce-orders-table a.button {
	display: inline-block;
	background: var(--wits-orange);
	color: #fff !important;
	font-family: "Manrope", sans-serif;
	font-size: 12px;
	font-weight: 600;
	padding: 5px 14px;
	border-radius: 18px;
	border: none;
	text-decoration: none !important;
	cursor: pointer;
	line-height: 1.5;
}

.woocommerce-orders-table .woocommerce-button.button:hover,
.woocommerce-orders-table a.button:hover {
	background: var(--wits-orange-dk);
}

/* ── My Account — Account details form ───────────────────────────────────── */
.woocommerce-EditAccountForm fieldset {
	border: 1px solid var(--wits-border);
	border-radius: var(--wits-r-card);
	padding: 18px 20px;
	margin-bottom: 20px;
}

.woocommerce-EditAccountForm fieldset legend {
	font-family: "Outfit", sans-serif;
	font-size: 14px;
	font-weight: 500;
	color: var(--wits-navy);
	padding: 0 8px;
}

.woocommerce-EditAccountForm .woocommerce-form-row {
	margin-bottom: 14px;
}

.woocommerce-EditAccountForm label {
	display: block;
	font-family: "Manrope", sans-serif;
	font-size: 12px;
	font-weight: 600;
	color: var(--wits-muted);
	margin-bottom: 5px;
}

.woocommerce-EditAccountForm input[type="text"],
.woocommerce-EditAccountForm input[type="email"],
.woocommerce-EditAccountForm input[type="password"],
.woocommerce-EditAccountForm input[type="tel"] {
	width: 100%;
	height: 40px;
	border: 1px solid var(--wits-border) !important;
	border-radius: 7px !important;
	padding: 0 12px !important;
	font-size: 14px !important;
	font-family: "Manrope", sans-serif !important;
	color: var(--wits-body) !important;
	background: #fff !important;
	outline: none;
	box-shadow: none !important;
}

.woocommerce-EditAccountForm input[type="text"]:focus,
.woocommerce-EditAccountForm input[type="email"]:focus,
.woocommerce-EditAccountForm input[type="password"]:focus,
.woocommerce-EditAccountForm input[type="tel"]:focus {
	border-color: var(--wits-navy) !important;
}

.woocommerce-EditAccountForm .woocommerce-Button,
.woocommerce-EditAccountForm button[type="submit"] {
	background: var(--wits-navy);
	color: #fff;
	font-family: "Manrope", sans-serif;
	font-size: 14px;
	font-weight: 600;
	padding: 10px 26px;
	border-radius: var(--wits-r-btn);
	border: none;
	cursor: pointer;
}

.woocommerce-EditAccountForm .woocommerce-Button:hover,
.woocommerce-EditAccountForm button[type="submit"]:hover {
	background: var(--wits-orange);
}

/* ── Lost password confirmation: Return to Login ─────────────────────────── */
/* Two classes so Kadence's content link colour and underline do not win. */
.woocommerce .backflow-lost-password__btn {
	display: inline-block;
	background: var(--wits-navy);
	color: #fff;
	font-family: "Manrope", sans-serif;
	font-size: 14px;
	font-weight: 600;
	padding: 10px 26px;
	border-radius: var(--wits-r-btn);
	text-decoration: none;
}

.woocommerce .backflow-lost-password__btn:hover,
.woocommerce .backflow-lost-password__btn:focus {
	background: var(--wits-orange);
	color: #fff;
}

/* ── WooCommerce notices ─────────────────────────────────────────────────── */
.woocommerce-notices-wrapper .woocommerce-message,
.woocommerce-notices-wrapper .woocommerce-info {
	border-top: 3px solid var(--wits-navy);
	background: var(--wits-blue-tint);
	color: var(--wits-body);
	font-family: "Manrope", sans-serif;
	font-size: 14px;
	padding: 14px 18px;
	border-radius: 0 0 var(--wits-r-card) var(--wits-r-card);
	margin-bottom: 16px;
}

.woocommerce-notices-wrapper .woocommerce-error {
	border-top: 3px solid #E53E3E;
	background: #FEE2E2;
	color: #991B1B;
	font-family: "Manrope", sans-serif;
	font-size: 14px;
	padding: 14px 18px;
	border-radius: 0 0 var(--wits-r-card) var(--wits-r-card);
	margin-bottom: 16px;
}

/* ── WooCommerce — Global typography ─────────────────────────────────────── */

/* Cart, checkout, thank-you page body font */
body.woocommerce-cart,
body.woocommerce-checkout,
body.woocommerce-order-received {
	font-family: "Manrope", sans-serif;
	color: var(--wits-body);
}

body.woocommerce-cart h1,
body.woocommerce-cart h2,
body.woocommerce-cart h3,
body.woocommerce-cart h4,
body.woocommerce-checkout h1,
body.woocommerce-checkout h2,
body.woocommerce-checkout h3,
body.woocommerce-checkout h4,
body.woocommerce-order-received h1,
body.woocommerce-order-received h2,
body.woocommerce-order-received h3 {
	font-family: "Outfit", sans-serif;
	font-weight: 500;
	color: var(--wits-navy);
}

/* Order detail + billing/shipping address sections (in My Account) */
.woocommerce-order-details,
.woocommerce-customer-details {
	font-family: "Manrope", sans-serif;
	font-size: 14px;
	color: var(--wits-body);
}

.woocommerce-order-details h2,
.woocommerce-customer-details h2 {
	font-family: "Outfit", sans-serif;
	font-weight: 500;
	color: var(--wits-navy);
}

/* ── WooCommerce — Checkout form inputs ──────────────────────────────────── */
.woocommerce-checkout .form-row input[type="text"],
.woocommerce-checkout .form-row input[type="email"],
.woocommerce-checkout .form-row input[type="tel"],
.woocommerce-checkout .form-row input[type="password"],
.woocommerce-checkout .form-row select {
	height: 36px;
	border: 1px solid #E8ECF2 !important;
	border-radius: 7px !important;
	font-family: "Manrope", sans-serif !important;
	font-size: 13px !important;
	color: #222 !important;
	background: #fff !important;
	padding: 0 10px !important;
	box-shadow: none !important;
	outline: none;
}

.woocommerce-checkout .form-row textarea {
	border: 1px solid #E8ECF2 !important;
	border-radius: 7px !important;
	font-family: "Manrope", sans-serif !important;
	font-size: 13px !important;
	color: #222 !important;
	background: #fff !important;
	padding: 8px 10px !important;
	box-shadow: none !important;
	outline: none;
	min-height: 72px;
	resize: vertical;
}

.woocommerce-checkout .form-row input[type="text"]:focus,
.woocommerce-checkout .form-row input[type="email"]:focus,
.woocommerce-checkout .form-row input[type="tel"]:focus,
.woocommerce-checkout .form-row input[type="password"]:focus,
.woocommerce-checkout .form-row select:focus,
.woocommerce-checkout .form-row textarea:focus {
	border-color: var(--wits-navy) !important;
	box-shadow: none !important;
}

.woocommerce-checkout .form-row label {
	font-family: "Manrope", sans-serif;
	font-size: 12px;
	font-weight: 500;
	color: #555;
}

/* ── WooCommerce — Button pill radius ────────────────────────────────────── */
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #respond input#submit,
.woocommerce-cart a.button,
.woocommerce-cart button.button,
.woocommerce-checkout button.button,
.woocommerce .wc-proceed-to-checkout a.checkout-button {
	border-radius: 18px !important;
	font-family: "Manrope", sans-serif;
	font-weight: 600;
}

/* ─────────────────────────────────────────────────────────────────────────
   CHECKOUT PAGE
   ───────────────────────────────────────────────────────────────────────── */

/* Section headings */
.woocommerce-checkout h3 {
	font-family: "Outfit", sans-serif;
	font-weight: 500;
	font-size: 18px;
	color: var(--wits-navy);
	margin-bottom: 16px;
}

/* Required asterisk */
.woocommerce-checkout .required {
	color: var(--wits-orange) !important;
}

/* Card containers — billing, additional info, order review */
.woocommerce-checkout .woocommerce-billing-fields,
.woocommerce-checkout .woocommerce-additional-fields,
.woocommerce-checkout #order_review {
	background: #fff;
	border: 1px solid #E8ECF2;
	border-radius: 10px;
	padding: 22px 24px;
	margin-bottom: 16px;
}

/* ── Order review table (right column) ───────────────────────── */
.woocommerce-checkout-review-order-table {
	width: 100%;
	border-collapse: collapse;
	font-size: 13px;
	font-family: "Manrope", sans-serif;
}

.woocommerce-checkout-review-order-table thead th {
	font-size: 11px;
	font-weight: 500;
	color: #999;
	text-transform: uppercase;
	letter-spacing: 0.05em;
	padding: 0 0 10px;
	border-bottom: 1.5px solid #E8ECF2;
}

.woocommerce-checkout-review-order-table tbody td,
.woocommerce-checkout-review-order-table tfoot th,
.woocommerce-checkout-review-order-table tfoot td {
	padding: 10px 0;
	border-bottom: 1px solid #f0f2f5;
	vertical-align: middle;
}

.woocommerce-checkout-review-order-table tbody tr:last-child td {
	border-bottom: none;
}

.woocommerce-checkout-review-order-table .product-name {
	color: #333;
	font-weight: 500;
}

.woocommerce-checkout-review-order-table .product-total {
	color: var(--wits-navy);
	font-weight: 500;
	text-align: right;
	white-space: nowrap;
}

.woocommerce-checkout-review-order-table tfoot .order-total th,
.woocommerce-checkout-review-order-table tfoot .order-total td {
	font-family: "Outfit", sans-serif;
	font-weight: 500;
	font-size: 15px;
	color: var(--wits-navy);
	border-top: 1.5px solid #E8ECF2;
	border-bottom: none;
	padding-top: 12px;
}

/* ── Refund policy note ───────────────────────────────────────── */
.backflow-refund-note {
	background: var(--wits-orange-lt);
	color: var(--wits-orange-dk);
	border-radius: 7px;
	padding: 10px 12px;
	font-size: 12px;
	font-family: "Manrope", sans-serif;
	margin: 14px 0;
}

.backflow-refund-note strong {
	color: inherit;
}

/* ── Payment options ──────────────────────────────────────────── */
.woocommerce #payment .wc_payment_methods {
	list-style: none;
	padding: 0;
	margin: 0;
}

.woocommerce #payment .wc_payment_method {
	border: 1px solid #E8ECF2;
	border-radius: 8px;
	padding: 12px 14px;
	margin-bottom: 8px;
}

.woocommerce #payment .wc_payment_method > label {
	display: flex;
	align-items: center;
	gap: 8px;
	font-size: 13px;
	font-weight: 500;
	color: #333;
	font-family: "Manrope", sans-serif;
	cursor: pointer;
	margin: 0;
}

.woocommerce #payment .wc_payment_method input.input-radio {
	accent-color: var(--wits-navy);
	width: 15px;
	height: 15px;
	margin: 0;
	flex-shrink: 0;
	cursor: pointer;
}

.woocommerce #payment .payment_box {
	margin-top: 12px;
	padding-top: 12px;
	border-top: 1px solid #f0f2f5;
}

/* Selected payment option — :has() supported in all modern browsers */
@supports selector(:has(input:checked)) {
	.woocommerce #payment .wc_payment_method:has(input.input-radio:checked) {
		border-color: var(--wits-navy);
		background: #f9fbff;
	}
}

/* ── Attendee radio ──────────────────────────────────────────── */
#backflow_reg_for_field input[type="radio"] {
	accent-color: var(--wits-orange);
}

/* ── Student information card ────────────────────────────────── */
#backflow_student_first_name_field,
#backflow_student_last_name_field,
#backflow_student_email_field {
	background: var(--wits-blue-tint) !important;
	border-left: 1px solid #d0ddf0 !important;
	border-right: 1px solid #d0ddf0 !important;
	border-top: none !important;
	border-bottom: none !important;
	border-radius: 0 !important;
	padding: 4px 16px !important;
	margin: 0 !important;
}

#backflow_student_first_name_field {
	border-top: 1px solid #d0ddf0 !important;
	border-radius: 8px 8px 0 0 !important;
	padding-top: 38px !important;
	position: relative;
	margin-top: 8px !important;
}

#backflow_student_email_field {
	border-bottom: 1px solid #d0ddf0 !important;
	border-radius: 0 0 8px 8px !important;
	padding-bottom: 14px !important;
	margin-bottom: 16px !important;
}

#backflow_student_first_name_field::before {
	content: "Student information";
	display: block;
	position: absolute;
	top: 14px;
	left: 16px;
	font-size: 11px;
	font-weight: 500;
	color: var(--wits-navy);
	text-transform: uppercase;
	letter-spacing: 0.05em;
	font-family: "Manrope", sans-serif;
}

/* Override the legacy inline styles on student fields */
.woocommerce form .form-row.backflow-student-field {
	background: var(--wits-blue-tint) !important;
	border-left: 1px solid #d0ddf0 !important;
}

/* ── Terms & conditions ──────────────────────────────────────── */
.woocommerce-terms-and-conditions-wrapper input[type="checkbox"] {
	accent-color: var(--wits-orange);
}

.woocommerce-terms-and-conditions-wrapper a {
	color: var(--wits-orange);
	text-decoration: underline;
}

.woocommerce-terms-and-conditions-wrapper a:hover {
	color: var(--wits-orange-dk);
}

/* ── Place order button ───────────────────────────────────────── */
.woocommerce-checkout #place_order {
	display: block;
	width: 100% !important;
	height: 46px;
	background: var(--wits-orange) !important;
	color: #fff !important;
	border: none !important;
	border-radius: 22px !important;
	font-family: "Outfit", sans-serif !important;
	font-weight: 500 !important;
	font-size: 15px !important;
	letter-spacing: 0.01em;
	cursor: pointer;
	margin-top: 16px;
}

.woocommerce-checkout #place_order:hover {
	background: var(--wits-orange-dk) !important;
}

/* ── Autofill override ────────────────────────────────────────── */
.woocommerce-checkout input:-webkit-autofill,
.woocommerce-checkout input:-webkit-autofill:hover,
.woocommerce-checkout input:-webkit-autofill:focus {
	-webkit-box-shadow: 0 0 0px 1000px #ffffff inset;
	box-shadow: 0 0 0px 1000px #ffffff inset;
	-webkit-text-fill-color: #222;
}

/* ─────────────────────────────────────────────────────────────────────────
   THANK YOU (ORDER RECEIVED) PAGE
   ───────────────────────────────────────────────────────────────────────── */

/* Grid layout — hero full-width, details + sidebar below */
.woocommerce-order-received .woocommerce-order {
	display: grid;
	grid-template-columns: 1fr 300px;
	column-gap: 20px;
	row-gap: 0;
	align-items: start;
}

/* ── Hero — navy banner ───────────────────────────────────────── */
.woocommerce-order-received .woocommerce-thankyou-order-received {
	grid-column: 1 / -1;
	grid-row: 1;
	background: var(--wits-navy);
	padding: 36px 32px 0;
	margin: 0 !important;
	text-align: center;
	border-radius: 10px 10px 0 0;
	font-family: "Outfit", sans-serif;
	font-weight: 500;
	font-size: 30px;
	color: #fff;
	line-height: 1.2;
}

/* Check circle above heading */
.woocommerce-order-received .woocommerce-thankyou-order-received::before {
	content: "✓";
	display: flex;
	align-items: center;
	justify-content: center;
	width: 48px;
	height: 48px;
	border-radius: 50%;
	background: var(--wits-orange);
	color: #fff;
	font-size: 22px;
	font-weight: 700;
	font-family: "Manrope", sans-serif;
	margin: 0 auto 14px;
}

/* Subtext */
.woocommerce-order-received .woocommerce-thankyou-order-received::after {
	content: "Your order has been received and your spot is confirmed.";
	display: block;
	font-family: "Manrope", sans-serif;
	font-size: 16px;
	font-weight: 400;
	color: rgba(255, 255, 255, 0.7);
	margin-top: 8px;
	padding-bottom: 28px;
}

/* ── Order meta bar ───────────────────────────────────────────── */
.woocommerce-order-received .woocommerce-order-overview {
	grid-column: 1 / -1;
	grid-row: 2;
	display: flex !important;
	justify-content: center;
	flex-wrap: wrap;
	list-style: none;
	padding: 20px 32px 28px!important;
	margin: 0 !important;
	margin-bottom: 20px !important;
	background: var(--wits-navy);
	border-top: 1px solid rgba(255, 255, 255, 0.15);
	border-radius: 0 0 10px 10px;
	font-size: 15px;
	text-transform: uppercase;
	letter-spacing: 0.06em;
	color: rgba(255, 255, 255, 0.5);
	font-family: "Manrope", sans-serif;
	border: none;
}

.woocommerce-order-received .woocommerce-order-overview li {
	padding: 0 20px;
	border-right: 1px solid rgba(255, 255, 255, 0.15);
	text-align: center;
	list-style: none;
}

.woocommerce-order-received .woocommerce-order-overview li:last-child {
	border-right: none;
}

.woocommerce-order-received .woocommerce-order-overview li strong {
	display: block;
	font-family: "Outfit", sans-serif;
	font-weight: 500;
	font-size: 14px;
	color: #fff;
	margin-bottom: 3px;
	text-transform: none;
	letter-spacing: normal;
}

/* ── Order details card ───────────────────────────────────────── */
.woocommerce-order-received .woocommerce-order-details {
	grid-column: 1;
	grid-row: 3;
	background: #fff;
	border: 1px solid #E8ECF2;
	border-radius: 10px;
	padding: 20px 22px;
	margin-bottom: 16px;
}

.woocommerce-order-received .woocommerce-order-details h2 {
	font-family: "Outfit", sans-serif;
	font-weight: 500;
	font-size: 16px;
	color: var(--wits-navy);
	margin-bottom: 14px;
}

/* Order details table */
.woocommerce-table--order-details {
	width: 100%;
	border-collapse: collapse;
	font-size: 14px;
	font-family: "Manrope", sans-serif;
}

.woocommerce-table--order-details thead th {
	font-size: 11px;
	font-weight: 500;
	color: #999;
	text-transform: uppercase;
	letter-spacing: 0.05em;
	padding: 0 0 10px;
	border-bottom: 1.5px solid #E8ECF2;
}

.woocommerce-table--order-details tbody td,
.woocommerce-table--order-details tfoot th,
.woocommerce-table--order-details tfoot td {
	padding: 10px 0;
	border-bottom: 1px solid #f0f2f5;
	vertical-align: middle;
}

.woocommerce-table--order-details tbody tr:last-child td {
	border-bottom: none;
}

.woocommerce-table--order-details .product-name {
	color: #333;
	font-weight: 500;
}

.woocommerce-table--order-details .product-total {
	color: var(--wits-navy);
	font-weight: 500;
	text-align: right;
}

.woocommerce-table--order-details .wc-item-meta {
	font-size: 12px;
	color: #999;
	margin-top: 2px;
}

.woocommerce-table--order-details tfoot .order-total th,
.woocommerce-table--order-details tfoot .order-total td {
	font-family: "Outfit", sans-serif;
	font-weight: 500;
	font-size: 14px;
	color: var(--wits-navy);
	border-top: 1.5px solid #E8ECF2;
	border-bottom: none;
	padding-top: 12px;
}

/* ── Billing address card ─────────────────────────────────────── */
.woocommerce-order-received .woocommerce-customer-details {
	grid-column: 1;
	grid-row: 4;
	background: #fff;
	border: 1px solid #E8ECF2;
	border-radius: 10px;
	padding: 20px 22px;
}

.woocommerce-order-received .woocommerce-customer-details h2 {
	font-family: "Outfit", sans-serif;
	font-weight: 500;
	font-size: 16px;
	color: var(--wits-navy);
	margin-bottom: 12px;
}

.woocommerce-order-received .woocommerce-customer-details address {
	background: #f9fbff;
	border: 1px solid #E8ECF2;
	border-radius: 7px;
	padding: 12px 14px;
	font-size: 14px;
	color: #444;
	line-height: 1.7;
	font-style: normal;
}

/* ── "What happens next" sidebar card ────────────────────────── */
.backflow-ty-next {
	grid-column: 2;
	grid-row: 3 / 5;
	background: #fff;
	border: 1px solid #E8ECF2;
	border-radius: 10px;
	padding: 20px 22px;
}

.backflow-ty-next__heading {
	font-family: "Outfit", sans-serif;
	font-weight: 500;
	font-size: 16px;
	color: var(--wits-navy);
	margin-bottom: 4px;
}

.backflow-ty-next__step {
	display: flex;
	gap: 12px;
	padding: 12px 0;
	border-bottom: 1px solid #f0f2f5;
}

.backflow-ty-next__step:last-of-type {
	border-bottom: none;
}

.backflow-ty-next__num {
	width: 26px;
	height: 26px;
	min-width: 26px;
	border-radius: 50%;
	background: var(--wits-orange);
	color: #fff;
	font-family: "Outfit", sans-serif;
	font-weight: 500;
	font-size: 12px;
	display: flex;
	align-items: center;
	justify-content: center;
	margin-top: 1px;
}

.backflow-ty-next__title {
	font-family: "Manrope", sans-serif;
	font-weight: 500;
	font-size: 14px;
	color: var(--wits-navy);
	margin-bottom: 3px;
}

.backflow-ty-next__desc {
	font-family: "Manrope", sans-serif;
	font-size: 13px;
	color: #666;
	line-height: 1.6;
	margin: 0;
}

.backflow-ty-next__btn {
	display: block;
	width: 100%;
	height: 42px;
	background: var(--wits-orange);
	color: #fff !important;
	border: none;
	border-radius: 20px;
	font-family: "Outfit", sans-serif;
	font-weight: 500;
	font-size: 14px;
	text-align: center;
	line-height: 42px;
	text-decoration: none !important;
	margin-top: 16px;
	cursor: pointer;
}

.backflow-ty-next__btn:hover {
	background: var(--wits-orange-dk);
	color: #fff !important;
}

/* ── Responsive — stack at 700px ─────────────────────────────── */
@media (max-width: 700px) {
	.woocommerce-order-received .woocommerce-order {
		grid-template-columns: 1fr;
	}

	.woocommerce-order-received .woocommerce-thankyou-order-received,
	.woocommerce-order-received .woocommerce-order-overview {
		grid-column: 1;
	}

	.woocommerce-order-received .woocommerce-order-details,
	.woocommerce-order-received .woocommerce-customer-details {
		grid-column: 1;
	}

	.woocommerce-order-received .backflow-ty-next {
		grid-column: 1;
		grid-row: auto;
	}

	.woocommerce-order-received .woocommerce-order-overview {
		justify-content: flex-start;
		flex-wrap: wrap;
		gap: 12px 0;
	}

	.woocommerce-order-received .woocommerce-order-overview li {
		padding: 0 14px;
	}
}

/* ── Waiver checklist [backflow_waiver_checklist] ────────────────────────────
   Default card, plus a red --alert modifier when the LearnDash gate sent the student here
   (?waivers=required). The doubled selectors outrank .woocommerce-MyAccount-content h2/p/a (0,1,1). */
.backflow-waiver-checklist {
	margin: 0 0 28px;
	border: 1px solid var(--wits-border);
	border-radius: var(--wits-r-card);
	overflow: hidden;
	background: #fff;
	font-family: "Manrope", sans-serif;
	color: var(--wits-navy);
}

.backflow-waiver-checklist--alert {
	border: 2px solid var(--wits-red);
}

.backflow-waiver-checklist__head {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 12px 16px;
	background: var(--wits-blue-tint);
}

.backflow-waiver-checklist--alert .backflow-waiver-checklist__head {
	background: var(--wits-red);
	color: #fff;
}

.backflow-waiver-checklist__head-icon {
	display: inline-flex;
	flex: none;
}

.backflow-waiver-checklist__head-icon svg {
	width: 22px;
	height: 22px;
}

.backflow-waiver-checklist--alert .backflow-waiver-checklist__head-icon svg {
	width: 24px;
	height: 24px;
}

.backflow-waiver-checklist .backflow-waiver-checklist__title {
	margin: 0;
	font-family: "Outfit", sans-serif;
	font-size: 15px;
	font-weight: 600;
	line-height: 1.4;
	text-transform: none;
	color: inherit;
}

.backflow-waiver-checklist--alert .backflow-waiver-checklist__title {
	font-size: 18px;
}

.backflow-waiver-checklist__sub {
	font-size: 13px;
	line-height: 1.4;
}

.backflow-waiver-checklist ul.backflow-waiver-checklist__list {
	list-style: none;
	margin: 0;
	padding: 0;
}

.backflow-waiver-checklist .backflow-waiver-checklist__row {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 6px 10px;
	margin: 0;
	padding: 10px 16px;
	border-top: 1px solid var(--wits-border);
}

.backflow-waiver-checklist--alert .backflow-waiver-checklist__row--unsigned {
	background: var(--wits-red-tint);
}

.backflow-waiver-checklist__icon {
	display: inline-flex;
	flex: none;
	color: var(--wits-lighter);
}

.backflow-waiver-checklist__icon svg {
	width: 20px;
	height: 20px;
}

.backflow-waiver-checklist__row--signed .backflow-waiver-checklist__icon,
.backflow-waiver-checklist__row--signed .backflow-waiver-checklist__status {
	color: var(--wits-green);
}

.backflow-waiver-checklist--alert .backflow-waiver-checklist__row--unsigned .backflow-waiver-checklist__icon {
	color: var(--wits-red);
}

.backflow-waiver-checklist__name {
	flex: 1 1 140px;
	min-width: 0;
}

.backflow-waiver-checklist__status {
	font-size: 13px;
	color: var(--wits-muted);
}

.backflow-waiver-checklist--alert .backflow-waiver-checklist__row--unsigned .backflow-waiver-checklist__status {
	font-weight: 600;
	color: var(--wits-red-dk);
}

.backflow-waiver-checklist__pdf {
	font-size: 13px;
}

.backflow-waiver-checklist a.backflow-waiver-checklist__btn {
	flex: none;
	padding: 6px 14px;
	border-radius: var(--wits-r-btn);
	background: var(--wits-orange);
	color: #fff;
	font: 600 13px/1.4 "Manrope", sans-serif;
	text-decoration: none;
}

.backflow-waiver-checklist a.backflow-waiver-checklist__btn:hover,
.backflow-waiver-checklist a.backflow-waiver-checklist__btn:focus-visible {
	background: var(--wits-orange-dk);
	color: #fff;
}

.backflow-waiver-checklist--alert a.backflow-waiver-checklist__btn {
	background: var(--wits-red);
}

.backflow-waiver-checklist--alert a.backflow-waiver-checklist__btn:hover,
.backflow-waiver-checklist--alert a.backflow-waiver-checklist__btn:focus-visible {
	background: var(--wits-red-dk);
}

/* ── LearnDash profile ───────────────────────────────────────────────────── */
.learndash-wrapper .ld-profile-summary .ld-profile-card {
	display: none !important;
}

.learndash-wrapper .ld-profile-summary .ld-profile-stats {
	justify-content: left;
}

/* Courses list on /my-account/courses/ (dashboard-and-waivers.php). Selectors are scoped to the profile's
   course rows (.ld-item-list-item-course); the expanded panel's exam rows use other classes.
   Helper line above the list. */
.woocommerce-MyAccount-content .backflow-courses-help {
	margin: 0 0 12px;
	font-size: 14px;
	color: var(--wits-muted);
}

/* The active course (in progress, else the soonest upcoming): the same tint and navy left edge as the
   course page's Today row (below). 0,4,0 beats LearnDash's row background and border radius (0,3,0). */
.learndash-wrapper .ld-item-list .ld-item-list-item.ld-item-list-item-course {
	border-radius: var(--wits-r-card);
}

.learndash-wrapper .ld-item-list .ld-item-list-item.ld-item-list-item-course.backflow-course-row--active {
	background: var(--wits-blue-tint);
	box-shadow: inset 4px 0 0 var(--wits-navy);
}

/* Title as a link: underline and an arrow on the title only. The session-date line sits inside the same
   anchor, and an underline on the anchor would run through it, so the date wraps onto its own line under
   the title. The title is an inline flex box so a wrapped title cannot strand the arrow on a line of its
   own (and the whitespace LearnDash prints inside the span is not underlined). */
.learndash-wrapper .ld-item-list-item-course .ld-item-name {
	flex-wrap: wrap;
}

.learndash-wrapper .ld-item-list-item-course .ld-item-name .backflow-dashboard-session-date {
	flex: 0 0 100%;
	margin-top: 2px;
}

.learndash-wrapper .ld-item-list-item-course .ld-item-name .ld-course-title {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	font-family: "Outfit", sans-serif;
	font-size: 17px;
	font-weight: 600;
	color: var(--wits-navy);
	text-decoration: underline;
	text-underline-offset: 3px;
}

.learndash-wrapper .ld-item-list-item-course .ld-item-name:hover .ld-course-title,
.learndash-wrapper .ld-item-list-item-course .ld-item-name:focus-visible .ld-course-title {
	color: var(--wits-orange);
}

.learndash-wrapper .ld-item-list-item-course .ld-item-name .ld-course-title::after {
	content: "";
	flex: none;
	width: 16px;
	height: 16px;
	background: currentColor;
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14'/%3E%3Cpath d='M13 18l6-6'/%3E%3Cpath d='M13 6l6 6'/%3E%3C/svg%3E") center / contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14'/%3E%3Cpath d='M13 18l6-6'/%3E%3Cpath d='M13 6l6 6'/%3E%3C/svg%3E") center / contain no-repeat;
}

/* Course progress is not shown to students. Hidden here: LearnDash's progress ring left of the title (the
   green "completed" check stays) and the expanded panel's bar and "% Complete / N/N Steps" line. The panel
   itself stays: the student's exams and their Statistics "View" links are in it (.ld-item-contents).
   The status pill is ours (dashboard-and-waivers.php), not LearnDash's progress-based bubble. */
.learndash-wrapper .ld-item-list-item-course .ld-item-name > .ld-status-icon:not(.ld-status-complete) {
	display: none;
}

.learndash-wrapper .ld-item-list-item-course .ld-item-list-item-expanded > .ld-progress {
	display: none;
}

/* LearnDash indents the status pill under the title on phones to clear the ring, which is hidden now. */
@media (max-width: 640px) {
	.learndash-wrapper .ld-item-list .ld-item-list-item.ld-item-list-item-course .ld-item-list-item-preview .ld-item-details {
		margin-left: 0;
	}
}

/* With the progress block gone, a course with no exam attempts or assignments has an empty panel, so its
   expand button (desktop and the mobile text button, which LearnDash forces with !important) goes too,
   and so does the list's Expand All when no course has anything to show. */
.learndash-wrapper .ld-item-list-item-course:not(:has(.ld-item-contents)) .ld-item-details .ld-expand-button,
.learndash-wrapper .ld-item-list.ld-course-list:not(:has(.ld-item-contents)) .ld-section-heading .ld-expand-button {
	display: none !important;
}

/* ── Upcoming Classes widget [wits_upcoming_classes] ─────────────────────── */
.wits-upcoming-classes {
	display: flex;
	flex-direction: column;
	gap: 8px;
}

.wits-upcoming-card {
	border: 1.5px solid #E8ECF2;
	border-radius: 10px;
	padding: 14px 16px;
	display: flex;
	flex-direction: column;
	gap: 12px;
}

.wits-upcoming-card__top {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 6px 12px;
}

.wits-upcoming-card__date {
	font-size: 20px;
	font-weight: 700;
	line-height: 1.2;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	color: #E8601A;
}

.wits-upcoming-card__tag {
	display: inline-block;
	font-family: "Manrope", sans-serif;
	font-size: 11px;
	font-weight: 600;
	color: var(--wits-orange-dk);
	background: var(--wits-orange-lt);
	border-radius: 4px;
	padding: 3px 10px;
	margin-bottom: 6px;
	letter-spacing: 0.02em;
}

/* Hero cards only — the homepage bento cards reuse the base tag class. */
.wits-upcoming-card .wits-upcoming-card__tag {
	margin-bottom: 0;
	white-space: nowrap;
}

.wits-upcoming-card__title {
	font-family: 'Outfit', sans-serif;
	font-size: 24px;
	font-weight: 500;
	line-height: 1.2;
	color: #1A3E6F;
}

.wits-upcoming-card__bottom {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
}

.wits-upcoming-card__meta {
	font-size: 12px;
	color: #666666;
}

.wits-upcoming-card__btn {
	display: inline-block;
	background: #E8601A;
	color: #fff;
	border-radius: 12px;
	padding: 6px 18px;
	font-size: 12px;
	font-weight: 600;
	text-decoration: none;
	flex-shrink: 0;
	margin-left: auto;
}

.wits-upcoming-card__btn:hover {
	background: #BF4A10;
	color: #fff;
}

.wits-upcoming-all {
	display: block;
	text-align: center;
	font-size: 13px;
	font-weight: 500;
	color: #1A3E6F;
	margin-top: 12px;
	text-decoration: none;
}

.wits-upcoming-all:hover {
	color: #E8601A;
}

.wits-upcoming-empty {
	font-size: 14px;
	color: #666;
	padding: 24px 0;
	text-align: center;
}

/* ── All Upcoming Sessions page [wits_all_upcoming_sessions] ─────────────── */
.wits-all-sessions {
	display: flex;
	flex-direction: column;
}

.wits-session-filters {
	display: flex;
	gap: 8px;
	flex-wrap: wrap;
	margin-bottom: 28px;
}

.wits-filter-btn {
	font-size: 13px;
	font-weight: 500;
	padding: 7px 16px;
	border-radius: 20px;
	border: 1.5px solid #E8ECF2;
	background: #fff;
	color: #666;
	cursor: pointer;
	transition: border-color 0.15s, color 0.15s;
}

.wits-filter-btn:hover {
	border-color: #E8601A;
	color: #E8601A;
}

.wits-filter-btn.active {
	background: #1A3E6F;
	color: #fff;
	border-color: #1A3E6F;
}

.wits-session-list {
	display: flex;
	flex-direction: column;
	gap: 12px;
}

.wits-session-month-label {
	font-size: 11px;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.08em;
	color: #999;
	margin: 24px 0 10px;
}

.wits-session-card {
	border: 1.5px solid #E8ECF2;
	border-radius: 10px;
	padding: 18px 22px;
	display: grid;
	grid-template-columns: 64px 1fr auto;
	gap: 0 20px;
	align-items: center;
}

.wits-session-card__date {
	background: #EEF3FB;
	border-radius: 8px;
	padding: 8px 6px;
	text-align: center;
}

.wits-session-card__month {
	display: block;
	font-size: 11px;
	font-weight: 600;
	color: #E8601A;
	text-transform: uppercase;
	letter-spacing: 0.06em;
}

.wits-session-card__day {
	display: block;
	font-size: 26px;
	font-weight: 500;
	color: #1A3E6F;
	line-height: 1.1;
}

.wits-session-card__year {
	display: block;
	font-size: 11px;
	color: #999;
}

.wits-session-card__tag {
	display: inline-block;
	font-family: "Manrope", sans-serif;
	font-size: 11px;
	font-weight: 600;
	color: var(--wits-orange-dk);
	background: var(--wits-orange-lt);
	border-radius: 4px;
	padding: 3px 10px;
	margin-bottom: 8px;
	letter-spacing: 0.02em;
}

.wits-session-card__title {
	font-size: 16px;
	font-weight: 500;
	color: #1A3E6F;
	margin-bottom: 4px;
}

.wits-session-card__meta {
	font-size: 12px;
	color: #666;
	display: flex;
	gap: 12px;
}

.wits-session-card__actions {
	display: flex;
	flex-direction: column;
	align-items: flex-end;
	gap: 8px;
}

.wits-session-card__enroll {
	display: inline-block;
	background: #E8601A;
	color: #fff;
	border-radius: 12px;
	padding: 8px 20px;
	font-size: 13px;
	font-weight: 600;
	text-decoration: none;
	white-space: nowrap;
}

.wits-session-card__enroll:hover {
	background: #BF4A10;
	color: #fff;
}

.wits-session-card__seats {
	font-size: 11px;
	color: #999;
	white-space: nowrap;
}

.wits-seats-low {
	color: #cc4444;
	font-weight: 500;
}

.wits-session-empty {
	display: none;
	text-align: center;
	padding: 48px 24px;
	color: #666;
	font-size: 14px;
}

/* ── Homepage program cards (Training Programs) ──────────────────────────────
   Markup lives in a Custom HTML block per card; the date is [wits_next_session].
   Reuses .wits-upcoming-card__tag for the pill — base rule untouched, scoped overrides only. */
.wits-program-card__top {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 8px 16px;
	margin-bottom: 14px;
}

/* ACV: its Details button is in another Kadence column, so the label sits next to the date. */
.wits-program-card--wide .wits-program-card__top {
	justify-content: flex-start;
}

.wits-program-card .wits-upcoming-card__tag {
	margin-bottom: 0;
	padding: 5px 12px;
	border-radius: 6px;
	font-size: 14px;
	white-space: nowrap;
}

.wits-program-card .wits-program-card__date {
	font-family: "Outfit", sans-serif;
	font-size: 20px;
	font-weight: 700;
	line-height: 1.2;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	color: var(--wits-orange);
}

.wits-program-card .wits-program-card__date--empty {
	font-size: 15px;
	letter-spacing: 0.06em;
	color: var(--wits-muted);
}

.wits-program-card .wits-program-card__title {
	margin: 0 0 8px;
	font-family: "Outfit", sans-serif;
	font-size: 28px;
	font-weight: 600;
	line-height: 1.2;
	color: var(--wits-navy);
}

.wits-program-card .wits-program-card__meta {
	margin: 0;
	font-family: "Manrope", sans-serif;
	font-size: 16px;
	line-height: 1.4;
	color: var(--wits-muted);
}

/* Featured (navy) card. The muted light blue is the blue tint mixed toward navy.
   The 22px bold orange date is what keeps its ~3.1:1 contrast on navy acceptable. */
.wits-program-card--featured {
	--wits-program-soft: color-mix(in srgb, var(--wits-blue-tint) 75%, var(--wits-navy));
}

.wits-program-card--featured .wits-program-card__date {
	font-size: 22px;
}

.wits-program-card--featured .wits-program-card__date--empty {
	font-size: 15px;
	color: var(--wits-program-soft);
}

/* Stands in for the old 66px spacer block. Kadence's inner column is display:block,
   so the title can't be bottom-anchored from here without overriding Kadence. */
.wits-program-card--featured .wits-program-card__title {
	margin-top: 52px;
	font-size: clamp(34px, 4vw, 48px);
	color: #fff;
}

.wits-program-card--featured .wits-program-card__meta {
	font-size: 18px;
	color: var(--wits-program-soft);
}

/* The gap above the Kadence Details button lives here, not in the button block's margin.
   The doubled card class outranks Kadence's .single-content p:last-child { margin-bottom: 0 }. */
.wits-program-card.wits-program-card--featured .wits-program-card__meta {
	margin-bottom: 40px;
}

/* Kadence stacks its columns at 767px. Balanced wrapping keeps "Hands-On" from splitting at its hyphen
   in the narrower stacked cards; the featured title no longer needs the desktop gap above it. */
@media (max-width: 767px) {
	.wits-program-card:not(.wits-program-card--featured) .wits-program-card__title {
		font-size: 24px;
	}

	.wits-program-card .wits-program-card__title,
	.wits-program-card .wits-program-card__meta {
		text-wrap: balance;
	}

	.wits-program-card--featured .wits-program-card__title {
		margin-top: 20px;
	}
}

/* Registration closed notice */
.backflow-course-registration-closed {
	margin-top: 1em;
}
.backflow-course-registration-closed p {
	margin: 0;
}

/* Ended quiz notice */
.backflow-quiz-access-notice,
.backflow-ended-quiz-notice {
	margin: 1em 0;
}
.backflow-quiz-access-notice p,
.backflow-ended-quiz-notice p {
	margin: 0;
}

/* Checkout field layout */
/* Make "Registering for" radios inline */
#backflow_reg_for_field .woocommerce-input-wrapper {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
}
#backflow_reg_for_field .woocommerce-input-wrapper label {
	display: inline-flex;
	align-items: center;
	gap: 0.25em;
	margin: 0;
}
/* Make the student fields look like a grouped block */
.woocommerce form .form-row.backflow-student-field {
	background: #eee;
	border-left: 3px solid #ddd;
	padding: .5em;
	margin-bottom: 0;
}
.woocommerce form .form-row.backflow-student-field:last-of-type {
	margin-bottom: 12px;
}
/* Hide the "(optional)" text on student fields */
#backflow_student_first_name_field .optional,
#backflow_student_last_name_field .optional,
#backflow_student_email_field .optional {
	display: none;
}
/* Add a fake asterisk to student labels */
#backflow_student_first_name_field > label::after,
#backflow_student_last_name_field > label::after,
#backflow_student_email_field > label::after {
	content: ' *';
	color: #d63638;
	font-weight: normal;
}

/* Course grid lifecycle ribbons */
.backflow-course-grid-ribbon--session-date {
	font-size: 0.82rem !important;
	line-height: 1.2 !important;
	white-space: normal !important;
	text-align: center !important;
}
.backflow-course-grid-ribbon--in-progress {
	background: #8a5b00 !important;
	color: #fff !important;
}
.backflow-product-session-date {
	margin: 0.35rem 0 1rem;
	padding: 0.75rem 1rem;
	border-left: 4px solid currentColor;
	background: rgba(0, 0, 0, 0.035);
}
.backflow-product-session-date__label {
	display: block;
	margin-bottom: 0.15rem;
	font-size: 0.85rem;
	line-height: 1.2;
	opacity: 0.72;
	text-transform: uppercase;
	letter-spacing: 0.04em;
}
.backflow-product-session-date__value {
	display: block;
	font-size: 1.05rem;
	line-height: 1.35;
	font-weight: 700;
}

/* Dashboard session dates */
.backflow-dashboard-session-date {
	display: block;
	margin-top: 4px;
	font-size: 0.9em;
	font-weight: 500;
	line-height: 1.35;
	color: #5f6b75;
}
.ld-profile .backflow-dashboard-session-date,
.learndash-wrapper .backflow-dashboard-session-date {
	text-decoration: none;
}

/* ── LearnDash Modern — course page lesson list, lesson Next, start-screen exam count ─────
   The course page lists the days only: course-page-tweaks.php skips the exam rows, the expand toggles
   and the header's Expand All. What is left in the list header is the "Course Content" heading, hidden here. */
.ld-accordion--course > .ld-accordion__header {
	display: none;
}

/* Today's day row: tinted with a navy left edge, small navy tag beside the title.
   The edge is an inset shadow, not border-left, so the row's text stays aligned with the other days.
   The selector is 0,4,0 to beat LearnDash's row background on hover and focus (0,2,0). */
.ld-accordion--course .ld-accordion__item.ld-accordion__item--lesson.ld-accordion__item--today {
	background: var(--wits-blue-tint);
	border-radius: var(--wits-r-card);
	box-shadow: inset 4px 0 0 var(--wits-navy);
}
.ld-accordion--course .backflow-today-tag {
	display: inline-block;
	margin-left: 0.6em;
	padding: 2px 10px;
	border-radius: var(--wits-r-btn);
	background: var(--wits-navy);
	color: #fff;
	font-family: "Manrope", sans-serif;
	font-size: 11px;
	font-weight: 600;
	letter-spacing: 0.02em;
	line-height: 1.5;
	vertical-align: middle;
}

/* "N questions" above the exam's Start button (quiz-flow-tweaks.php). */
.backflow-quiz-count {
	color: var(--wits-muted);
	font-size: 0.875em;
}
.backflow-quiz-count--start {
	margin: 0 0 1em;
}

/* Lesson page: hide Next but keep its box, because Mark Complete posts to #ld-navigation__next-link
   and display:none would drop that scroll target. Hidden also removes it from the tab order. */
.ld-navigation--lesson .ld-navigation__next {
	visibility: hidden;
}

/* ── Exam results (quiz-flow-tweaks.php, quiz-result-view.php) ───────────── */

/* Review after submitting: the correct answer the student missed gets the same green as one they picked, which is
   LearnDash's grid "Correct" square (green outline, light green tint, and a check where the red X sits on a wrong
   answer). LearnDash styles the picked one already; one rule keeps the two identical. LearnDash's own variables,
   so it follows the grid; the hex values are what they hold today. */
.learndash-wrapper .wpProQuiz_content .wpProQuiz_questionListItem:not(.ld-sortable__item).wpProQuiz_answerCorrect label,
.learndash-wrapper .wpProQuiz_content .wpProQuiz_questionListItem:not(.ld-sortable__item).wpProQuiz_answerCorrectIncomplete label {
	background: var(--ld-color-semantic-success-light, #eef7f1);
	border-color: var(--ld-color-semantic-success, #2f8351);
}
.learndash-wrapper .wpProQuiz_content .wpProQuiz_questionListItem:not(.ld-sortable__item).wpProQuiz_answerCorrect label::before,
.learndash-wrapper .wpProQuiz_content .wpProQuiz_questionListItem:not(.ld-sortable__item).wpProQuiz_answerCorrectIncomplete label::before {
	color: var(--ld-color-semantic-success, #2f8351);
	content: "\f15e";
	font-family: "dashicons";
	font-size: 22px;
	line-height: 22px;
	vertical-align: text-top;
}

/* "See Results": one pill button, on the day page rows and under a finished exam's notice. */
a.backflow-results-btn {
	display: inline-block;
	flex: none;
	padding: 6px 14px;
	border-radius: var(--wits-r-btn);
	background: var(--wits-orange);
	color: #fff;
	font: 600 13px/1.4 "Manrope", sans-serif;
	text-decoration: none;
}
a.backflow-results-btn:hover,
a.backflow-results-btn:focus-visible {
	background: var(--wits-orange-dk);
	color: #fff;
}
.backflow-quiz-results {
	margin: 1em 0;
}

/* Day page: notice and one row per exam (title left, button right) above the exam list. The button drops under
   its title when the row is too narrow. */
.backflow-lesson-results {
	margin: 0 0 24px;
	padding: 16px 20px;
	border: 1px solid var(--wits-border);
	border-radius: var(--wits-r-card);
	background: var(--wits-blue-tint);
}
.backflow-lesson-results .backflow-lesson-results__notice {
	margin: 0 0 8px;
	color: var(--wits-body);
	font-weight: 600;
}
.backflow-lesson-results .backflow-lesson-results__list {
	margin: 0;
	padding: 0;
	list-style: none;
}
.backflow-lesson-results .backflow-lesson-results__item {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 8px 16px;
	margin: 0;
	padding: 10px 0;
	border-top: 1px solid var(--wits-border);
}
.backflow-lesson-results .backflow-lesson-results__title {
	flex: 1 1 200px;
	color: var(--wits-body);
}

/* ── Exam flow (quiz-flow-tweaks.php, backflow-exam.js) ──────────────────── */

/* After Start the instructions and the question count go. The title and the breadcrumb stay, and so does all of
   this on the results screen: the class is never removed. */
.backflow-exam--started > .ld-tabs,
.backflow-exam--started > .backflow-quiz-count {
	display: none;
}

/* The stay-on-this-page line takes the count line's slot; the Flag for later help sits under its button. */
.backflow-exam__note {
	margin: 0 0 1em;
	color: var(--wits-navy);
	font-size: 0.875em;
	font-weight: 600;
}
.backflow-exam__flag-help {
	clear: both;
	margin: 12px 0 0;
	color: var(--wits-muted);
	font-size: 0.875em;
}

/* Flagged question in the list. LearnDash draws the flag's dot only while a question is unanswered; backflow-exam.js
   adds this class so the dot also shows once it is answered. Same dot and place as LearnDash's. */
.learndash-wrapper .wpProQuiz_content .wpProQuiz_reviewDiv .wpProQuiz_reviewQuestion li.backflow-exam__flagged {
	position: relative;
}
.learndash-wrapper .wpProQuiz_content .wpProQuiz_reviewDiv .wpProQuiz_reviewQuestion li.backflow-exam__flagged::before {
	content: "";
	position: absolute;
	top: -13px;
	left: 50%;
	width: 8px;
	height: 8px;
	border: 1px solid #fff;
	border-radius: 50%;
	background: var(--wits-orange);
	transform: translateX(-50%);
}

/* Leave-exam and "you left" warnings: a native <dialog>, so the browser does the focus trap, Esc and the inert page. */
.backflow-exam-dialog {
	width: min(28rem, calc(100vw - 32px));
	padding: 24px;
	border: 1px solid var(--wits-border);
	border-radius: var(--wits-r-card);
	background: #fff;
	color: var(--wits-body);
	box-shadow: var(--wits-shadow-hover);
}
.backflow-exam-dialog::backdrop {
	background: rgba(11, 30, 56, 0.55);
	background: color-mix(in srgb, var(--wits-navy-deep) 55%, transparent);
}
.backflow-exam-dialog__title {
	margin: 0 0 8px;
	color: var(--wits-navy);
	font: 600 1.25em/1.3 "Outfit", sans-serif;
	text-transform: none; /* The theme capitalizes every h2 and button; the copy is in sentence case. */
}
.backflow-exam-dialog__body {
	margin: 0 0 20px;
}
.backflow-exam-dialog__actions {
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-end;
	gap: 8px 12px;
}
.backflow-exam-dialog__btn {
	padding: 8px 18px;
	border: 2px solid var(--wits-orange);
	border-radius: var(--wits-r-btn);
	background: transparent;
	color: var(--wits-orange-dk);
	font: 600 14px/1.4 "Manrope", sans-serif;
	text-transform: none;
	cursor: pointer;
}
.backflow-exam-dialog__btn--primary {
	background: var(--wits-orange);
	color: #fff;
}
.backflow-exam-dialog__btn:hover,
.backflow-exam-dialog__btn:focus-visible {
	border-color: var(--wits-orange-dk);
	background: var(--wits-orange-dk);
	color: #fff;
}
.backflow-exam-dialog__btn:focus-visible {
	outline: 2px solid var(--wits-navy);
	outline-offset: 2px;
}
body:has(.backflow-exam-dialog[open]) {
	overflow: hidden;
}

/* Post-Class Survey lesson, after the student has submitted (survey-tweaks.php). */
.backflow-survey-submitted {
	margin: 0 0 24px;
	padding: 16px 20px;
	border: 1px solid var(--wits-border);
	border-radius: var(--wits-r-card);
	background: var(--wits-blue-tint);
	color: var(--wits-body);
	font-weight: 600;
}
.backflow-survey-submitted p {
	margin: 0;
}

/* Gravity Forms. form-styles.php sets the colours, sizes and radius through Gravity Forms' default styles; this is what
   those defaults cannot reach: pill buttons with a deep navy hover, and 16px text in inputs, selects and textareas. */
.gform_wrapper.gform-theme {
	--gf-ctrl-btn-radius: var(--wits-r-btn);
	--gf-ctrl-btn-bg-color-hover-primary: var(--wits-navy-deep);
	--gf-font-size-primary: 16px;
}
/* LearnDash runs a lesson's content through the_content twice (Models/Lesson.php get_content), so wpautop puts <br> and <p>
   into the form's flex footer and the Submit button would stretch to the footer's height. See CONTEXT.md §6.14. */
.gform_wrapper .gform-footer .gform_button {
	align-self: flex-start;
}