/* ============================================================================
   NEO& COMMERCE
   WooCommerce checkout, cart and order-received, on the site's own tokens.

   Loaded only on commerce pages — see neo_commerce_assets() in functions.php.

   The journey is: program page → checkout → /confirmed-seat.
   The product page is bypassed and the cart is unlinked, but both are styled
   here because a visitor can still reach them directly, and an unstyled page
   at that point in the journey costs an order.

   RULES, same as everywhere else in this build:
   - no design value is stated here; every value is a token
   - WooCommerce's own class names are targeted as found; they are stable
     across versions but check after a major WooCommerce release
   ============================================================================ */

/* ============ shell ============ */

.woocommerce-page .site-main,
.woocommerce .site-main {
  max-width: var(--neo-container-max);
  margin-inline: auto;
  padding-inline: var(--neo-gutter-desktop);
  padding-block: var(--space-section);
}

.woocommerce-page h1,
.woocommerce-page h2 {
  font-size: var(--type-section-title);
  font-weight: var(--neo-weight-semi);
  color: var(--text-heading);
  line-height: var(--neo-leading-heading);
  margin-block: 0 var(--space-block);
}

.woocommerce-page h3 {
  font-size: var(--type-card-title);
  font-weight: var(--neo-weight-semi);
  color: var(--text-heading);
  margin-block: 0 var(--space-inline);
}

.woocommerce-page p { color: var(--text-primary); line-height: var(--neo-leading-body); }
.woocommerce-page a { color:var(--text-accent); }

@media (max-width: 850px) {
  .woocommerce-page .site-main,
  .woocommerce .site-main { padding-inline: var(--neo-gutter-mobile); }
}

/* ============ notices ============ */
/* WooCommerce's defaults are green and blue bars that belong to another site. */

.woocommerce-message,
.woocommerce-info,
.woocommerce-error,
.woocommerce-notice {
  border: var(--neo-border-hair) solid var(--border-subtle);
  border-inline-start: var(--neo-border-thick) solid var(--action-primary);
  border-radius: var(--card-radius);
  background: var(--surface-sunken);
  color: var(--text-primary);
  padding: var(--space-card);
  margin-block-end: var(--space-block);
  font-size: var(--type-support);
  line-height: var(--neo-leading-body);
  list-style: none;
}

.woocommerce-error { border-inline-start-color: var(--state-error); }

.woocommerce-message .button,
.woocommerce-info .button { float: none; margin-inline-start: var(--space-inline); }

/* ============ fields ============ */
/* Matched to .form input in neo-global.css, so checkout and the enquiry form
   are visibly the same site. */

.woocommerce form .form-row { padding: 0; margin-block-end: var(--space-inline); }

.woocommerce form .form-row label {
  display: block;
  font-size: var(--type-support);
  color: var(--text-secondary);
  font-weight: var(--neo-weight-regular);
}

.woocommerce form .form-row label .required {
  color: var(--state-error);
  text-decoration: none;
  border: 0;
}

.woocommerce form .form-row .optional { color: var(--text-secondary); }

.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea,
.woocommerce form .form-row select,
.woocommerce-page .select2-container .select2-selection--single {
  display: block;
  width: 100%;
  min-height: var(--input-height);
  padding: 10px 12px;
  margin-top: 6px;
  background: var(--surface-raised);
  border: var(--neo-border-hair) solid var(--border-subtle);
  border-radius: 4px;
  color: var(--text-primary);
  font-family: inherit;
  font-size: 15px;
  line-height: var(--neo-leading-body);
}

.woocommerce form .form-row textarea { min-height: 7.5rem; resize: vertical; }

.woocommerce form .form-row input.input-text::placeholder,
.woocommerce form .form-row textarea::placeholder { color: var(--text-secondary); }

.woocommerce form .form-row input.input-text:focus,
.woocommerce form .form-row textarea:focus,
.woocommerce form .form-row select:focus {
  outline: var(--neo-border-focus) solid var(--accent-focus-ring);
  outline-offset: 2px;
  border-color: var(--action-primary);
}

.woocommerce form .form-row.woocommerce-invalid input.input-text,
.woocommerce form .form-row.woocommerce-invalid select { border-color: var(--state-error); }

/* select2, which WooCommerce uses for country and state */
.woocommerce-page .select2-container--default .select2-selection--single {
  height: auto;
  display: flex;
  align-items: center;
}
.woocommerce-page .select2-container--default .select2-selection--single
  .select2-selection__rendered { color: var(--text-primary); padding: 0; line-height: inherit; }
.woocommerce-page .select2-container--default .select2-selection--single
  .select2-selection__arrow { height: 100%; inset-inline-end: 8px; }
.woocommerce-page .select2-dropdown {
  background: var(--surface-raised);
  border-color: var(--border-subtle);
  color: var(--text-primary);
}
.woocommerce-page .select2-container--default
  .select2-results__option--highlighted[aria-selected] {
  background: var(--surface-accent);
  color: var(--text-accent);
}

/* checkboxes: the same 18px square as the enquiry consent */
.woocommerce form .form-row input[type="checkbox"] {
  width: 18px;
  height: 18px;
  min-height: 0;
  margin: 2px var(--space-inline) 0 0;
  accent-color: var(--action-primary);
}

/* ============ buttons ============ */

.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #respond input#submit,
.woocommerce #place_order {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  min-height: var(--btn-height);
  padding: 11px 22px;
  border: var(--neo-border-hair) solid var(--action-primary);
  border-radius: var(--btn-radius);
  background: var(--action-primary);
  color: var(--action-on-primary);
  font-family: inherit;
  font-weight: var(--neo-weight-semi);
  font-size: 14px;
  line-height: 1.5;
  text-decoration: none;
  text-transform: none;
  transition: background var(--neo-duration);
}

.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover,
.woocommerce #place_order:hover {
  background: var(--action-primary-hover);
  color: var(--action-on-primary);
}

.woocommerce a.button.alt,
.woocommerce button.button.alt { background: var(--action-primary); }

/* secondary: update cart, continue shopping */
.woocommerce button[name="update_cart"],
.woocommerce a.button.wc-backward {
  background: var(--action-secondary-bg);
  border-color: var(--border-subtle);
  color: var(--action-secondary-fg);
}
.woocommerce button[name="update_cart"]:hover,
.woocommerce a.button.wc-backward:hover {
  background: var(--surface-accent);
  border-color: var(--action-primary);
  color: var(--action-secondary-fg);
}

.woocommerce button[name="update_cart"]:disabled { opacity: .45; cursor: not-allowed; }

/* place order is the moment that matters — full width, unmissable */
.woocommerce #place_order { width: 100%; font-size: 15px; }

/* ============ checkout layout ============ */
/* Two columns on desktop: the form, then the order beside it. */

.woocommerce .checkout.woocommerce-checkout {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr);
  gap: var(--space-section-tight);
  align-items: start;
}

/* the form spans both rows, so the order panel sits directly under its
   heading instead of dropping below the whole form */
.woocommerce .checkout #customer_details { grid-column: 1; grid-row: 1 / 3; }
.woocommerce .checkout #order_review_heading { grid-column: 2; grid-row: 1; margin-block-start: 0; }
.woocommerce .checkout #order_review { grid-column: 2; grid-row: 2; }

.woocommerce .checkout #customer_details .col-1,
.woocommerce .checkout #customer_details .col-2 { width: 100%; float: none; }

@media (max-width: 1100px) {
  .woocommerce .checkout.woocommerce-checkout { grid-template-columns: minmax(0, 1fr); }
  .woocommerce .checkout #customer_details { grid-column: 1; grid-row: auto; }
  .woocommerce .checkout #order_review_heading,
  .woocommerce .checkout #order_review { grid-column: 1; grid-row: auto; }
}

/* the order panel: a card, sticky beside a long form */
.woocommerce .checkout #order_review {
  background: var(--surface-sunken);
  border: var(--neo-border-hair) solid var(--border-subtle);
  border-radius: var(--card-radius);
  padding: var(--card-padding);
  position: sticky;
  top: calc(var(--header-height) + var(--space-inline));
}

@media (max-width: 1100px) {
  .woocommerce .checkout #order_review { position: static; }
}

.woocommerce .checkout #order_review_heading {
  font-size: var(--type-subsection);
  margin-block-end: var(--space-inline);
}

/* ============ order table ============ */

.woocommerce table.shop_table {
  width: 100%;
  border: 0;
  border-radius: 0;
  border-collapse: collapse;
  margin: 0;
}

.woocommerce table.shop_table th,
.woocommerce table.shop_table td {
  padding-block: var(--space-inline);
  padding-inline: 0;
  border: 0;
  border-block-end: var(--neo-border-hair) solid var(--border-subtle);
  font-size: var(--type-support);
  color: var(--text-primary);
  vertical-align: middle;   /* was top: logos and prices floated above the row */
}

.woocommerce table.shop_table thead th {
  font-size: var(--type-label);
  letter-spacing: var(--neo-tracking-wide);
  text-transform: uppercase;
  color: var(--text-secondary);
  font-weight: var(--neo-weight-semi);
}

.woocommerce table.shop_table td.product-name { color: var(--text-heading); font-weight: var(--neo-weight-medium); }
.woocommerce table.shop_table td.product-total,
.woocommerce table.shop_table td.product-subtotal,
.woocommerce table.shop_table .amount { text-align: end; white-space: nowrap; font-variant-numeric: tabular-nums; }

.woocommerce table.shop_table tfoot th,
.woocommerce table.shop_table tfoot td {
  font-weight: var(--neo-weight-semi);
  color: var(--text-heading);
}

.woocommerce table.shop_table tfoot tr.order-total th,
.woocommerce table.shop_table tfoot tr.order-total td {
  font-size: var(--type-body);
  border-block-end: 0;
  padding-block-start: var(--space-inline);
}

/* the struck standard fee, when a sale price is set on the product.
   Same treatment as .fee-was on the built pages, so a discount reads
   identically on the program page and at checkout. */
.woocommerce del,
.woocommerce del .amount {
  color: var(--text-secondary);
  text-decoration: line-through;
  font-weight: var(--neo-weight-regular);
  margin-inline-end: 6px;
}
.woocommerce ins,
.woocommerce ins .amount { text-decoration: none; font-weight: var(--neo-weight-semi); }

/* the cohort dates, added to the line item by inc-commerce.php */
.woocommerce table.shop_table .variation,
.woocommerce table.shop_table dl.variation {
  display: flex;
  gap: 6px;
  margin: 6px 0 0;
  font-size: var(--type-label);
  color: var(--text-secondary);
}
.woocommerce table.shop_table dl.variation dt { font-weight: var(--neo-weight-regular); margin: 0; }
.woocommerce table.shop_table dl.variation dd { margin: 0; }
.woocommerce table.shop_table dl.variation dd p { margin: 0; font-size: inherit; color: inherit; }

/* ============ quantity ============ */
/* Editable at checkout so an organisation can book two or three seats
   without running checkout twice. Enabled in functions.php. */

.woocommerce .quantity input.qty {
  width: 5.5rem;
  min-height: var(--input-height);
  padding: 8px 10px;
  background: var(--surface-raised);
  border: var(--neo-border-hair) solid var(--border-subtle);
  border-radius: 4px;
  color: var(--text-primary);
  font-family: inherit;
  font-size: 15px;
  text-align: center;
}

.woocommerce td.product-quantity { white-space: nowrap; }

/* at checkout the input sits inside the product cell, under the name */
.woocommerce #order_review .product-name .quantity { display: block; margin-block-start: var(--space-inline); }

/* ============ payment ============ */

.woocommerce #payment {
  background: transparent;
  border-radius: 0;
  margin-block-start: var(--space-block);
}

.woocommerce #payment ul.payment_methods {
  border: 0;
  border-block-end: var(--neo-border-hair) solid var(--border-subtle);
  padding: 0 0 var(--space-inline);
  margin: 0 0 var(--space-inline);
  list-style: none;
}

.woocommerce #payment ul.payment_methods li {
  margin-block-end: var(--space-inline);
  color: var(--text-primary);
  font-size: var(--type-support);
}

.woocommerce #payment ul.payment_methods li label { font-weight: var(--neo-weight-medium); }

.woocommerce #payment div.payment_box {
  background: var(--surface-raised);
  border: var(--neo-border-hair) solid var(--border-subtle);
  border-radius: var(--card-radius);
  padding: var(--space-card);
  margin-block-start: var(--space-inline);
  color: var(--text-primary);
  font-size: var(--type-support);
  line-height: var(--neo-leading-body);
}

/* WooCommerce draws a triangle pointing at the selected method; it is drawn
   in its own colour and shows as a grey wedge against our surface */
.woocommerce #payment div.payment_box::before { border-block-end-color: var(--surface-raised); }

/* the Stripe card field */
.woocommerce #payment div.payment_box .wc-stripe-elements-field,
.woocommerce #payment div.payment_box .wc-payment-form input {
  background: var(--surface-page);
  border: var(--neo-border-hair) solid var(--border-subtle);
  border-radius: 4px;
  padding: 12px;
  min-height: var(--input-height);
}

.woocommerce #payment .woocommerce-privacy-policy-text,
.woocommerce #payment .woocommerce-terms-and-conditions-wrapper {
  font-size: var(--type-label);
  line-height: var(--neo-leading-body);
  color: var(--text-secondary);
  margin-block: var(--space-inline);
}

.woocommerce-terms-and-conditions-checkbox-text { font-size: var(--type-label); }

/* ============ coupon ============ */

.woocommerce-form-coupon-toggle .woocommerce-info { font-size: var(--type-support); }

.woocommerce form.checkout_coupon {
  border: var(--neo-border-hair) solid var(--border-subtle);
  border-radius: var(--card-radius);
  background: var(--surface-sunken);
  padding: var(--space-card);
  margin-block-end: var(--space-block);
}

/* ============ cart ============ */
/* Unlinked, but reachable. Styled so it never looks broken. */

.woocommerce table.cart td.product-remove a.remove {
  color: var(--text-secondary);
  font-size: 20px;
  line-height: 1;
  text-decoration: none;
}
.woocommerce table.cart td.product-remove a.remove:hover {
  color: var(--state-error);
  background: transparent;
}

.woocommerce table.cart td.product-thumbnail { display: none; }
.woocommerce table.cart th.product-thumbnail { display: none; }

.woocommerce .cart-collaterals { margin-block-start: var(--space-section-tight); }

.woocommerce .cart-collaterals .cart_totals {
  width: 100%;
  max-width: 28rem;
  margin-inline-start: auto;
  background: var(--surface-sunken);
  border: var(--neo-border-hair) solid var(--border-subtle);
  border-radius: var(--card-radius);
  padding: var(--card-padding);
}

.woocommerce .cart-collaterals .cart_totals h2 { font-size: var(--type-subsection); }

.woocommerce .wc-proceed-to-checkout { padding: 0; margin-block-start: var(--space-inline); }
.woocommerce .wc-proceed-to-checkout a.checkout-button { width: 100%; }

/* no cross-sells: one seat, nothing to upsell */
.woocommerce .cross-sells,
.woocommerce .up-sells,
.woocommerce .related { display: none; }

/* ============ order received ============ */
/* The site redirects to /confirmed-seat, but a visitor returning to an order
   link from their email lands here. */

.woocommerce ul.order_details {
  list-style: none;
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-block);
  padding: var(--card-padding);
  margin: 0 0 var(--space-block);
  background: var(--surface-sunken);
  border: var(--neo-border-hair) solid var(--border-subtle);
  border-radius: var(--card-radius);
}

.woocommerce ul.order_details li {
  border: 0;
  padding: 0;
  margin: 0;
  font-size: var(--type-label);
  letter-spacing: var(--neo-tracking-wide);
  text-transform: uppercase;
  color: var(--text-secondary);
}

.woocommerce ul.order_details li strong {
  display: block;
  margin-block-start: 6px;
  font-size: var(--type-body);
  letter-spacing: normal;
  text-transform: none;
  color: var(--text-heading);
  font-weight: var(--neo-weight-semi);
}

/* ============ product page ============ */
/* Bypassed by Book a seat, but reachable by direct URL. */

.woocommerce div.product .product_title { font-size: var(--type-page-title); }

.woocommerce div.product p.price,
.woocommerce div.product span.price {
  color: var(--text-heading);
  font-size: var(--type-subsection);
  font-weight: var(--neo-weight-semi);
}

.woocommerce div.product .woocommerce-tabs ul.tabs { display: none; }

.woocommerce div.product form.cart { margin-block: var(--space-block); }
.woocommerce div.product form.cart div.quantity { margin-inline-end: var(--space-inline); }

/* ============ my account ============ */
/* Exists because WooCommerce requires it. Nothing links to it. */

.woocommerce-account .woocommerce-MyAccount-navigation ul {
  list-style: none;
  padding: 0;
  margin: 0 0 var(--space-block);
}
.woocommerce-account .woocommerce-MyAccount-navigation li a {
  display: block;
  padding-block: var(--space-inline);
  border-block-end: var(--neo-border-hair) solid var(--border-subtle);
  color: var(--text-primary);
  text-decoration: none;
}
.woocommerce-account .woocommerce-MyAccount-navigation li.is-active a { color:var(--text-accent); }

/* ============ print ============ */

@media print {
  .woocommerce a.button,
  .woocommerce button.button,
  .woocommerce #place_order { display: none; }
}

/* ── checkout consent ──────────────────────────────────────────────────── */
.neo-consent{margin:var(--neo-space-md) 0 var(--neo-space-sm);padding:var(--neo-space-sm) var(--neo-space-md);
  border:var(--neo-border-hair) solid var(--border-subtle);border-radius:4px;background:var(--surface-raised)}
.neo-consent .form-row{margin:0;padding:0}
.neo-consent label{display:flex;align-items:flex-start;gap:10px;font-size:13px;line-height:1.6;color:var(--text-secondary);cursor:pointer}
.neo-consent input[type="checkbox"]{width:18px;height:18px;min-width:18px;flex:0 0 18px;margin:2px 0 0;accent-color:var(--action-primary)}
.neo-consent a{color:var(--text-primary);text-decoration:underline}
.neo-consent .required{color:var(--accent-eyebrow);text-decoration:none}

/* ════════════════════════════════════════════════════════════════════════
   The booking page.

   The site's own surfaces and type, following the light/dark toggle like
   every other page. One reading order at every width: what is being bought,
   then 01 details, 02 terms, 03 payment. The summary carries no number, so
   the three steps are never met out of sequence — on a phone it sits above
   the details rather than pushing 02 and 03 to the top, which is what put
   the terms before the form.
   ════════════════════════════════════════════════════════════════════════ */

.neo-bk{padding-block:var(--space-section)}
.neo-bk .eyebrow{margin:0 0 var(--neo-space-2xs)}
.neo-bk h1{margin:0 0 var(--neo-space-2xs);white-space:nowrap}
.neo-bk__lede{color:var(--text-secondary);font-size:var(--type-support);max-width:52ch;margin:0 0 var(--space-block)}

.neo-bk__grid{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(340px,.85fr);
  grid-template-areas:"details summary" "details pay";gap:var(--neo-space-xl);align-items:start}
.neo-bk__summary{grid-area:summary}
.neo-bk__pay{grid-area:pay}
.neo-bk__grid>section:not(.neo-bk__summary){grid-area:details}
.neo-bk__panel{background:var(--surface-sunken);border:var(--neo-border-hair) solid var(--border-subtle);
  border-radius:var(--card-radius);padding:var(--neo-space-xl)}

.neo-bk__head{display:flex;align-items:center;gap:var(--neo-space-sm);margin:0 0 var(--neo-space-lg)}
.neo-bk__head--tight{margin-top:0}
.neo-bk__num{display:grid;place-items:center;width:28px;height:28px;border-radius:50%;
  background:var(--surface-raised);border:var(--neo-border-hair) solid var(--border-subtle);
  color:var(--accent-eyebrow);font-size:var(--type-label);font-weight:600;flex:0 0 28px}
.neo-bk__head h2{font-size:var(--type-card-title);margin:0;color:var(--text-heading)}

.neo-bk__fields{display:grid;grid-template-columns:1fr 1fr;gap:0 var(--neo-space-md)}
.neo-bk .row{margin:0 0 var(--neo-space-md)}
.neo-bk .row--full,.neo-bk__promo{grid-column:1/-1}
.neo-bk label{display:block;font-size:13px;color:var(--text-secondary);margin:0 0 6px}
.neo-bk input[type="text"],.neo-bk input[type="email"],.neo-bk select{
  display:block;width:100%;height:48px;padding:12px 14px;background:var(--surface-raised);
  border:var(--neo-border-hair) solid var(--border-subtle);border-radius:4px;color:var(--text-primary);
  font-family:inherit;font-size:15px;box-sizing:border-box}
.neo-bk input::placeholder{color:var(--text-secondary)}
.neo-bk input:focus-visible,.neo-bk select:focus-visible,.neo-bk .neo-sea__input:focus-visible{outline:3px solid var(--accent-focus-ring);outline-offset:3px}
/* the search box must outrank .neo-bk input[type="text"] above: that rule uses the
   `background` shorthand, which resets background-image to none, so a weaker
   selector here would lose the chevron and the room made for it. */
.neo-bk select,.neo-bk input[type="text"].neo-sea__input{appearance:none;-webkit-appearance:none;padding-inline-end:40px;cursor:pointer;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%239a93b3' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 14px center}
.neo-bk select option{background:var(--surface-page);color:var(--text-primary)}
/* the chevron follows the reading direction */
.neo-bk--rtl select,.neo-bk--rtl input[type="text"].neo-sea__input{background-position:left 14px center;padding-inline-end:14px;padding-inline-start:40px}

.neo-bk__promo{margin-bottom:var(--neo-space-md)}
.neo-bk__promo summary{cursor:pointer;font-size:13px;color:var(--text-secondary);list-style:none;padding:2px 0}
.neo-bk__promo summary::-webkit-details-marker{display:none}
.neo-bk__promo summary span{color:var(--text-primary);text-decoration:underline}
.neo-bk__promo input{margin-top:10px}

.neo-bk__note{margin:var(--neo-space-lg) 0 0;padding:var(--neo-space-md);
  border-inline-start:3px solid var(--accent-eyebrow);background:var(--surface-raised);
  font-size:13px;line-height:1.6;color:var(--text-secondary)}
.neo-bk__note strong{color:var(--text-heading);font-weight:500}
.neo-bk__note a{color:var(--text-primary);text-decoration:underline}

.neo-bk__kicker{font-size:var(--type-label);letter-spacing:.08em;color:var(--accent-eyebrow);
  font-weight:600;margin:0 0 var(--neo-space-sm)}
.neo-bk__course{display:flex;align-items:center;gap:var(--neo-space-sm);font-size:var(--type-card-title);
  line-height:1.3;color:var(--text-heading);font-weight:500}
.neo-bk__course img{width:52px;height:52px;flex:0 0 52px;border-radius:50%;background:var(--surface-raised);
  border:var(--neo-border-hair) solid var(--border-subtle);padding:5px;box-sizing:border-box;object-fit:contain}
.neo-bk__meta{display:flex;flex-wrap:wrap;gap:8px;list-style:none;margin:var(--neo-space-md) 0 0;padding:0}
.neo-bk__meta li{border:var(--neo-border-hair) solid var(--border-subtle);border-radius:999px;
  padding:5px 10px;font-size:12px;color:var(--text-secondary)}
/* The timing sits in the same row of outlined pills as the dates and the
   language, so it wears that pill rather than bringing its own fill. A coloured
   chip inside an outlined pill read as a mistake. The calendar keeps its colour,
   where the chip has to be picked out of a table. */
.neo-bk__meta .tchip{background:none;border:0;color:inherit;font-weight:inherit;
  letter-spacing:inherit;padding:0;margin:0;min-width:0;font-size:inherit;display:inline}
.neo-bk__price{display:flex;align-items:baseline;justify-content:space-between;
  margin-top:var(--neo-space-md);padding-top:var(--neo-space-md);
  border-top:var(--neo-border-hair) solid var(--border-subtle)}
.neo-bk__price span{font-size:13px;color:var(--text-secondary)}
.neo-bk__price strong{font-size:1.4rem;color:var(--text-heading)}

.neo-bk__consent{display:grid;grid-template-columns:18px 1fr;gap:10px;align-items:start;
  padding:var(--neo-space-md);background:var(--surface-raised);
  border:var(--neo-border-hair) solid var(--border-subtle);border-radius:var(--card-radius);
  margin-bottom:var(--neo-space-xl)}
.neo-bk__consent input{width:18px;height:18px;margin:2px 0 0;accent-color:var(--action-primary)}
.neo-bk__consent label{font-size:13px;line-height:1.65;margin:0;color:var(--text-secondary)}
.neo-bk__consent a{color:var(--text-primary);text-decoration:underline}

.neo-bk__go{width:100%;justify-content:center;min-height:54px}
.neo-bk__secure{font-size:11px;color:var(--text-secondary);text-align:center;line-height:1.5;margin:var(--neo-space-sm) 0 0}

.neo-bk__errors{margin:0 0 var(--space-block);padding:var(--neo-space-md) var(--neo-space-lg);
  background:var(--surface-sunken);border:var(--neo-border-hair) solid var(--accent-focus-ring);
  border-radius:var(--card-radius);color:var(--text-primary);font-size:var(--type-support)}
.neo-bk__errors ul{margin:0;padding-inline-start:18px}
.neo-bk__errors li+li{margin-top:4px}

@media(max-width:900px){
  .neo-bk__grid{grid-template-columns:1fr;grid-template-areas:"summary" "details" "pay"}
}
@media(max-width:560px){
  .neo-bk__fields{grid-template-columns:1fr}
  .neo-bk .row--full{grid-column:auto}
  .neo-bk__panel{padding:var(--neo-space-lg)}
  .neo-bk h1{white-space:normal}
}

/* the booking reference on the confirmation page: a quiet card after the
   page's own message, not a table across the top of it */
.neo-confirm{max-width:520px;margin:0 auto var(--space-section);padding:var(--neo-space-lg);
  background:var(--surface-sunken);border:var(--neo-border-hair) solid var(--border-subtle);
  border-radius:var(--card-radius)}
.neo-confirm__k{font-size:var(--type-label);letter-spacing:.08em;color:var(--accent-eyebrow);
  font-weight:600;margin:0 0 var(--neo-space-sm)}
.neo-confirm dl{display:grid;gap:0;margin:0}
.neo-confirm dl>div{display:flex;justify-content:space-between;gap:var(--neo-space-md);
  padding:var(--neo-space-2xs) 0;border-bottom:var(--neo-border-hair) solid var(--border-subtle)}
.neo-confirm dl>div:last-of-type{border-bottom:0}
.neo-confirm dt{font-size:13px;color:var(--text-secondary);margin:0}
.neo-confirm dd{margin:0;color:var(--text-heading);text-align:end;font-size:14px}
.neo-confirm__note{margin:var(--neo-space-sm) 0 0;font-size:12px;color:var(--text-secondary)}
.neo-confirm__wait{padding:var(--neo-space-md);background:var(--surface-sunken);
  border:var(--neo-border-hair) solid var(--border-subtle);border-radius:var(--card-radius);
  font-size:var(--type-support);color:var(--text-secondary);max-width:520px;margin-inline:auto;text-align:center}
.neo-confirm--rtl{direction:rtl;text-align:right;font-family:var(--neo-font-arabic)}
.neo-confirm--rtl dd{text-align:start}

/* ── the booking page in Arabic ─────────────────────────────────────────
   Right to left, Alexandria for the prose, and the Latin fragments that must
   not reverse — the email a buyer types, a promo code, the price — pinned
   left to right where they sit. */
.neo-bk__lang{display:flex;gap:var(--neo-space-2xs);margin-bottom:var(--neo-space-lg)}
.neo-bk__lang a,.neo-bk__lang span{font-size:var(--type-label);letter-spacing:.06em;
  padding:var(--neo-space-3xs) var(--neo-space-sm);border-radius:var(--neo-radius-sm);
  min-height:var(--neo-target-min);display:inline-flex;align-items:center;text-decoration:none}
.neo-bk__lang span{background:var(--surface-sunken);color:var(--text-primary)}
.neo-bk__lang a{color:var(--text-secondary);border:var(--neo-border-hair) solid var(--border-subtle)}
.neo-bk__lang a:hover{color:var(--text-accent);border-color:var(--action-primary)}
.neo-bk__lang a[lang="ar"]{font-family:var(--neo-font-arabic);font-size:13px}

.neo-bk--rtl{direction:rtl;text-align:right;font-family:var(--neo-font-arabic);line-height:1.9}
.neo-bk--rtl h1,.neo-bk--rtl h2{letter-spacing:0;line-height:1.4}
.neo-bk--rtl .neo-bk__lang{flex-direction:row-reverse}
.neo-bk--rtl .neo-bk__lang a[lang="en"]{font-family:var(--neo-font-latin)}
.neo-bk--rtl input[dir="ltr"]{direction:ltr;text-align:left}
.neo-bk--rtl .neo-bk__price strong,.neo-bk--rtl .woocommerce-Price-amount{direction:ltr;unicode-bidi:embed;display:inline-block}
.neo-bk--rtl .neo-bk__note{border-inline-start:3px solid var(--accent-eyebrow)}
.neo-bk--rtl select,.neo-bk--rtl input[type="text"].neo-sea__input{background-position:left 14px center;padding-inline-end:14px;padding-inline-start:40px}
.neo-bk--rtl .neo-bk__meta li{font-family:var(--neo-font-arabic)}

/* the two columns end level: the details panel stretches to the height of the
   summary and payment stacked beside it, rather than stopping short */
.neo-bk__grid{align-items:stretch}
.neo-bk__grid>section:not(.neo-bk__summary){align-self:stretch}
.neo-bk__opt{color:var(--text-secondary);font-weight:400;margin-inline-start:4px}
@media(max-width:900px){.neo-bk__grid>section:not(.neo-bk__summary){align-self:auto}}

/* ── the country and dial-code fields ───────────────────────────────────
   A list of 245 in a native select is unusable on a phone, so each is a text
   box that filters the list beneath it. The box carries a chevron so it reads
   as a chooser rather than a plain field, and the rows are set at the size of
   the form's own supporting text — a list this long has to be scannable. */


/* the code is a narrow field: AE (+971) needs no more.
   The combobox rules that used to sit above here went with the widget —
   both fields are native selects now and .neo-bk select already styles them. */
.neo-tel{display:grid;grid-template-columns:minmax(0,148px) minmax(0,1fr);gap:10px}
.neo-tel input[type="tel"]{display:block;width:100%;height:48px;padding:12px 14px;
  background:var(--surface-raised);border:var(--neo-border-hair) solid var(--border-subtle);
  border-radius:4px;color:var(--text-primary);font-family:inherit;font-size:15px;box-sizing:border-box}
@media(max-width:480px){.neo-tel{grid-template-columns:1fr}}

/* the number box while no code is chosen: plainly not ready yet */
.neo-tel input[type="tel"][readonly]{background:var(--surface-sunken);color:var(--text-secondary);cursor:pointer}
.neo-tel input[type="tel"][readonly]::placeholder{color:var(--text-secondary);opacity:.9}

/* T-13 — returning from Stripe without paying is not an error, so it does not use
   the error styling. Calm, informational, and it keeps the entered details visible. */
.neo-bk__notice{
  margin:0 0 var(--neo-space-md);
  padding:var(--neo-space-sm) var(--neo-space-md);
  border-inline-start:3px solid var(--action-primary);
  background:var(--surface-sunken);
  border-radius:var(--neo-radius-sm);
}
.neo-bk__notice p{margin:0;color:var(--text-primary);font-size:var(--type-body-sm)}

/* 3.15.0 — the page a closed, finished or sold-out cohort's link opens:
   the cohort asked for, beside the program's next open cohort. */
.neo-bk--closed h1{white-space:normal;max-width:none;text-wrap:balance}
.neo-bk__grid--closed{grid-template-columns:repeat(2,minmax(0,1fr));grid-template-areas:none}
.neo-bk__grid--closed>section{grid-area:auto!important}
@media(max-width:900px){.neo-bk__grid--closed{grid-template-columns:1fr}}
.neo-bk__grid--closed .btn{margin-top:var(--neo-space-md)}
.neo-bk__back{margin-top:var(--space-block)}
/* the struck standard fee beside the price payable, when a discount runs */
.neo-bk__price .fee-was{font-size:14px;font-weight:400;color:var(--text-secondary);margin-inline-end:10px}