/* ──────────────────────────────────────────────────────────────────────────
   KL Brady — WooCommerce branded styles
   Applies to: checkout, cart, order confirmation, account pages
   Tokens match booking.css exactly.
   ────────────────────────────────────────────────────────────────────────── */

:root {
  --kl-navy:   #0E3957;
  --kl-mint:   #89C9B2;
  --kl-orange: #EE7203;
  --kl-white:  #FFFFFF;
  --kl-offwhite: #F8F7F4;
  --kl-text-dark: #1A2E3B;
  --kl-text-mid:  #4A6070;
  --kl-border: #D0D9E0;
  --kl-radius: 12px;
  --kl-radius-lg: 20px;
  --kl-shadow: 0 4px 24px rgba(14,57,87,0.10);
  --kl-shadow-lg: 0 8px 40px rgba(14,57,87,0.15);
  --kl-font-sans: 'Manrope', system-ui, sans-serif;
  --kl-font-serif: 'DM Serif Text', Georgia, serif;
}

/* ── BASE TYPOGRAPHY ─────────────────────────────────────────────────────── */

body.woocommerce-checkout,
body.woocommerce-cart,
body.woocommerce-account,
body.woocommerce-order-received {
  font-family: var(--kl-font-sans);
}

.woocommerce h1,
.woocommerce h2,
.woocommerce h3,
.woocommerce-page h1,
.woocommerce-page h2,
.woocommerce-page h3,
.woocommerce-order h2,
.woocommerce-order h3 {
  font-family: var(--kl-font-serif);
  color: var(--kl-navy);
}

/* ── BUTTONS ──────────────────────────────────────────────────────────────── */

.woocommerce #respond input#submit,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #place_order,
.woocommerce-cart .wc-proceed-to-checkout a.checkout-button {
  background: var(--kl-orange) !important;
  color: #fff !important;
  border: none !important;
  border-radius: 50px !important;
  font-family: var(--kl-font-sans) !important;
  font-weight: 800 !important;
  font-size: 1rem !important;
  padding: 14px 32px !important;
  cursor: pointer !important;
  transition: background 0.2s, transform 0.2s, box-shadow 0.2s !important;
  text-decoration: none !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  line-height: 1.2 !important;
  letter-spacing: 0 !important;
  box-shadow: none !important;
  outline: none !important;
}

.woocommerce #respond input#submit:hover,
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover,
.woocommerce #place_order:hover,
.woocommerce-cart .wc-proceed-to-checkout a.checkout-button:hover {
  background: #d4650a !important;
  color: #fff !important;
  transform: translateY(-1px) !important;
  box-shadow: 0 6px 20px rgba(238,114,3,0.35) !important;
}

.woocommerce #place_order {
  width: 100% !important;
  font-size: 1.05rem !important;
  padding: 16px 32px !important;
}

.woocommerce-cart .wc-proceed-to-checkout a.checkout-button {
  width: 100% !important;
  padding: 16px 32px !important;
  font-size: 1.05rem !important;
}

/* Secondary / outline buttons */
.woocommerce a.button.alt,
.woocommerce button.button.alt,
.woocommerce input.button.alt {
  background: var(--kl-navy) !important;
}
.woocommerce a.button.alt:hover,
.woocommerce button.button.alt:hover {
  background: #0d3350 !important;
  box-shadow: 0 4px 14px rgba(14,57,87,0.30) !important;
}

/* Disabled state */
.woocommerce #respond input#submit:disabled,
.woocommerce button.button:disabled,
.woocommerce input.button:disabled {
  opacity: 0.6 !important;
  cursor: not-allowed !important;
  transform: none !important;
  box-shadow: none !important;
}

/* ── FORM INPUTS ─────────────────────────────────────────────────────────── */

.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea,
.woocommerce form .form-row select,
.woocommerce-page form .form-row input.input-text,
.woocommerce-page form .form-row select {
  border: 1.5px solid var(--kl-border) !important;
  border-radius: 10px !important;
  padding: 12px 14px !important;
  font-family: var(--kl-font-sans) !important;
  font-size: 0.95rem !important;
  color: var(--kl-text-dark) !important;
  transition: border-color 0.2s, box-shadow 0.2s !important;
  background: #fff !important;
  box-shadow: none !important;
}

.woocommerce form .form-row input.input-text:focus,
.woocommerce form .form-row textarea:focus,
.woocommerce form .form-row select:focus {
  border-color: var(--kl-mint) !important;
  box-shadow: 0 0 0 3px rgba(137,201,178,0.20) !important;
  outline: none !important;
}

.woocommerce form .form-row label,
.woocommerce-page form .form-row label {
  font-family: var(--kl-font-sans) !important;
  font-weight: 600 !important;
  font-size: 0.875rem !important;
  color: var(--kl-text-mid) !important;
  margin-bottom: 6px !important;
}

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

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

/* Section headings */
.woocommerce-checkout .woocommerce-billing-fields h3,
.woocommerce-checkout .woocommerce-shipping-fields h3,
.woocommerce-checkout #order_review_heading {
  font-family: var(--kl-font-serif) !important;
  font-size: 1.3rem !important;
  color: var(--kl-navy) !important;
  padding-bottom: 12px !important;
  border-bottom: 2px solid var(--kl-mint) !important;
  margin-bottom: 22px !important;
}

/* Order review table */
.woocommerce-checkout-review-order-table,
#order_review .shop_table {
  border: none !important;
  border-radius: var(--kl-radius) !important;
  overflow: hidden !important;
  box-shadow: var(--kl-shadow) !important;
  border-collapse: separate !important;
  border-spacing: 0 !important;
}
.woocommerce-checkout-review-order-table thead th,
#order_review .shop_table thead th {
  background: var(--kl-navy) !important;
  color: #fff !important;
  font-family: var(--kl-font-sans) !important;
  font-weight: 700 !important;
  font-size: 0.8rem !important;
  text-transform: uppercase !important;
  letter-spacing: 0.06em !important;
  padding: 14px 18px !important;
  border: none !important;
}
.woocommerce-checkout-review-order-table tbody td,
#order_review .shop_table tbody td,
.woocommerce-checkout-review-order-table tfoot td,
.woocommerce-checkout-review-order-table tfoot th,
#order_review .shop_table tfoot td,
#order_review .shop_table tfoot th {
  padding: 14px 18px !important;
  border: none !important;
  border-bottom: 1px solid #ECF1F5 !important;
  font-family: var(--kl-font-sans) !important;
  vertical-align: top !important;
}
.woocommerce-checkout-review-order-table tfoot .order-total td,
.woocommerce-checkout-review-order-table tfoot .order-total th,
#order_review .shop_table tfoot .order-total td,
#order_review .shop_table tfoot .order-total th {
  font-family: var(--kl-font-serif) !important;
  font-size: 1.15rem !important;
  color: var(--kl-navy) !important;
  border-top: 2px solid var(--kl-navy) !important;
  border-bottom: none !important;
}

/* Donation fee row */
.woocommerce-checkout-review-order-table .fee td,
#order_review .shop_table .fee td {
  color: var(--kl-text-mid) !important;
  font-style: italic !important;
}

/* Payment section */
#payment {
  border-radius: var(--kl-radius) !important;
  background: var(--kl-offwhite) !important;
}
#payment .payment_methods li label {
  font-family: var(--kl-font-sans) !important;
  font-weight: 600 !important;
  color: var(--kl-navy) !important;
}
#payment .payment_box {
  background: #fff !important;
  border-radius: 8px !important;
}

/* ── ORDER CONFIRMATION (thank you page) ─────────────────────────────────── */

.woocommerce-order .entry-title,
.woocommerce-order h1 {
  font-family: var(--kl-font-serif) !important;
  color: var(--kl-navy) !important;
}

.woocommerce-thankyou-order-received {
  font-family: var(--kl-font-serif) !important;
  font-size: 1.5rem !important;
  color: var(--kl-navy) !important;
  margin-bottom: 24px !important;
}

/* Order summary strip */
.woocommerce-order-overview.woocommerce-thankyou-order-details {
  background: var(--kl-navy) !important;
  border-radius: var(--kl-radius-lg) !important;
  padding: 24px 28px !important;
  margin-bottom: 36px !important;
  list-style: none !important;
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 28px 40px !important;
  border: none !important;
}
.woocommerce-order-overview li {
  font-family: var(--kl-font-sans) !important;
  font-size: 0.72rem !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.07em !important;
  color: rgba(255,255,255,0.65) !important;
  border-right: none !important;
  padding: 0 !important;
  margin: 0 !important;
}
.woocommerce-order-overview li strong {
  display: block !important;
  color: #fff !important;
  font-size: 1rem !important;
  font-weight: 700 !important;
  text-transform: none !important;
  letter-spacing: 0 !important;
  margin-top: 5px !important;
}

/* Order details table */
.woocommerce-order-details .woocommerce-table,
.woocommerce-table--order-details {
  border: none !important;
  border-radius: var(--kl-radius) !important;
  overflow: hidden !important;
  box-shadow: var(--kl-shadow) !important;
  width: 100% !important;
  border-collapse: separate !important;
  border-spacing: 0 !important;
}
.woocommerce-table--order-details thead th {
  background: var(--kl-navy) !important;
  color: #fff !important;
  font-family: var(--kl-font-sans) !important;
  font-weight: 700 !important;
  font-size: 0.8rem !important;
  text-transform: uppercase !important;
  letter-spacing: 0.06em !important;
  padding: 14px 20px !important;
  border: none !important;
}
.woocommerce-table--order-details tbody td {
  padding: 18px 20px !important;
  border: none !important;
  border-bottom: 1px solid #ECF1F5 !important;
  font-family: var(--kl-font-sans) !important;
  vertical-align: top !important;
  color: var(--kl-text-dark) !important;
}
.woocommerce-table--order-details tbody tr:last-child td {
  border-bottom: none !important;
}
.woocommerce-table--order-details tfoot th,
.woocommerce-table--order-details tfoot td {
  padding: 14px 20px !important;
  font-family: var(--kl-font-sans) !important;
  border-top: 1px solid #ECF1F5 !important;
  color: var(--kl-text-dark) !important;
}
.woocommerce-table--order-details tfoot .order-total th,
.woocommerce-table--order-details tfoot .order-total td {
  font-family: var(--kl-font-serif) !important;
  font-size: 1.1rem !important;
  color: var(--kl-navy) !important;
  border-top: 2px solid var(--kl-navy) !important;
}

/* Product / session name in order table */
.woocommerce-table--order-details .product-name {
  font-weight: 700 !important;
  color: var(--kl-navy) !important;
}

/* Donation fee row */
.woocommerce-table--order-details .fee th,
.woocommerce-table--order-details .fee td {
  color: var(--kl-text-mid) !important;
  font-style: italic !important;
}

/* ── ORDER ITEM META (booking details) ───────────────────────────────────── */

.woocommerce-order .wc-item-meta,
.woocommerce-checkout .wc-item-meta,
.woocommerce-cart .wc-item-meta {
  list-style: none !important;
  margin: 8px 0 0 !important;
  padding: 8px 12px !important;
  background: #F4F8FB !important;
  border-radius: 8px !important;
  border-left: 3px solid var(--kl-mint) !important;
}
.woocommerce-order .wc-item-meta li,
.woocommerce-checkout .wc-item-meta li,
.woocommerce-cart .wc-item-meta li {
  font-size: 0.82rem !important;
  color: var(--kl-text-mid) !important;
  margin-bottom: 4px !important;
  font-family: var(--kl-font-sans) !important;
  line-height: 1.5 !important;
}
.woocommerce-order .wc-item-meta li:last-child,
.woocommerce-checkout .wc-item-meta li:last-child,
.woocommerce-cart .wc-item-meta li:last-child {
  margin-bottom: 0 !important;
}
.woocommerce-order .wc-item-meta li p,
.woocommerce-checkout .wc-item-meta li p {
  display: inline !important;
  margin: 0 !important;
}
.wc-item-meta-label {
  font-weight: 700 !important;
  color: var(--kl-navy) !important;
  margin-right: 4px !important;
}

/* ── NOTICES ─────────────────────────────────────────────────────────────── */

.woocommerce-message,
.woocommerce-info {
  background: #F0FAF6 !important;
  border-top-color: var(--kl-mint) !important;
  color: var(--kl-navy) !important;
  font-family: var(--kl-font-sans) !important;
  border-radius: 0 8px 8px 0 !important;
}
.woocommerce-error {
  background: #FFF4EE !important;
  border-top-color: var(--kl-orange) !important;
  font-family: var(--kl-font-sans) !important;
  border-radius: 0 8px 8px 0 !important;
}
.woocommerce-message a.button,
.woocommerce-error a.button,
.woocommerce-info a.button {
  background: var(--kl-orange) !important;
}

/* ── CART TABLE ──────────────────────────────────────────────────────────── */

.woocommerce-cart .woocommerce-cart-form .shop_table {
  border: none !important;
  border-radius: var(--kl-radius) !important;
  overflow: hidden !important;
  box-shadow: var(--kl-shadow) !important;
  border-collapse: separate !important;
  border-spacing: 0 !important;
}
.woocommerce-cart .shop_table thead th {
  background: var(--kl-navy) !important;
  color: #fff !important;
  font-family: var(--kl-font-sans) !important;
  font-weight: 700 !important;
  font-size: 0.8rem !important;
  text-transform: uppercase !important;
  letter-spacing: 0.06em !important;
  padding: 14px 18px !important;
  border: none !important;
}
.woocommerce-cart .shop_table tbody td {
  padding: 16px 18px !important;
  border: none !important;
  border-bottom: 1px solid #ECF1F5 !important;
  font-family: var(--kl-font-sans) !important;
  vertical-align: middle !important;
}
.woocommerce-cart .cart-collaterals .cart_totals {
  background: var(--kl-offwhite) !important;
  border-radius: var(--kl-radius) !important;
  padding: 24px !important;
}
.woocommerce-cart .cart_totals h2 {
  font-family: var(--kl-font-serif) !important;
  color: var(--kl-navy) !important;
  font-size: 1.3rem !important;
  margin-bottom: 16px !important;
}
.woocommerce-cart .cart_totals .shop_table {
  box-shadow: none !important;
  background: transparent !important;
}

/* ── CUSTOMER ACCOUNT ────────────────────────────────────────────────────── */

.woocommerce-account .woocommerce-MyAccount-navigation ul {
  list-style: none !important;
  padding: 0 !important;
}
.woocommerce-account .woocommerce-MyAccount-navigation li a {
  font-family: var(--kl-font-sans) !important;
  font-weight: 600 !important;
  color: var(--kl-navy) !important;
  padding: 10px 16px !important;
  display: block !important;
  border-radius: 8px !important;
  transition: background 0.15s !important;
}
.woocommerce-account .woocommerce-MyAccount-navigation li a:hover,
.woocommerce-account .woocommerce-MyAccount-navigation li.is-active a {
  background: #F0FAF6 !important;
  color: var(--kl-orange) !important;
}

/* ── RESPONSIVE ──────────────────────────────────────────────────────────── */

@media (max-width: 768px) {
  .woocommerce-order-overview.woocommerce-thankyou-order-details {
    gap: 18px 24px !important;
    padding: 18px 20px !important;
  }
  .woocommerce-order-overview li strong {
    font-size: 0.9rem !important;
  }
  .woocommerce-table--order-details thead th,
  .woocommerce-table--order-details tbody td,
  .woocommerce-table--order-details tfoot th,
  .woocommerce-table--order-details tfoot td {
    padding: 12px 14px !important;
  }
}