/* ============================================================
   DOSIS — WooCommerce override styles
   Brand-match cart, checkout, order-received, my-account.
   No layout reflow on the rest of the site.
   ============================================================ */

/* ---------- Page chrome shared with /how-to-order/, /shipping/ ---------- */

body.woocommerce-cart,
body.woocommerce-checkout,
body.woocommerce-account,
body.woocommerce-order-received,
body.woocommerce-page {
  background: #F5F3EE;
  color: #1A2A22;
  font-family: 'Outfit', system-ui, -apple-system, sans-serif;
  font-weight: 300;
}

.wc-page-shell {
  max-width: 1180px;
  margin: 0 auto;
  padding: 32px 28px 96px;
}

.wc-hero {
  position: relative;
  max-width: 1180px;
  margin: 0 auto;
  padding: 148px 28px 32px;
}
.wc-hero .kicker {
  font-family: 'DM Mono', monospace;
  font-size:12px;
  letter-spacing: 3px;
  color: #3D7A5A;
  text-transform: uppercase;
  margin-bottom: 18px;
}
.wc-hero h1 {
  font-family: 'Cormorant Garamond', serif;
  font-size: clamp(48px, 7vw, 84px);
  font-weight: 300;
  line-height: .95;
  color: #1A2A22;
  margin: 0;
}
.wc-hero p.lead {
  max-width: 680px;
  margin: 24px 0 0;
  font-size: 18px;
  font-weight: 300;
  line-height: 1.7;
  color: #53645B;
}

/* ---------- Universal WC button reset (uses our brand button) ---------- */

.woocommerce a.button,
.woocommerce-page a.button,
.woocommerce button.button,
.woocommerce-page button.button,
.woocommerce input.button,
.woocommerce-page input.button,
.woocommerce #respond input#submit,
.woocommerce-page #respond input#submit,
.woocommerce #content input.button,
.woocommerce-page #content input.button {
  appearance: none;
  -webkit-appearance: none;
  background: #1A2A22;
  color: #F5F3EE;
  border: 1px solid #1A2A22;
  border-radius: 999px;
  padding: 14px 28px;
  font-family: 'DM Mono', monospace;
  font-size: 12px;
  font-weight: 500;
  letter-spacing: 2.4px;
  text-transform: uppercase;
  text-decoration: none;
  cursor: pointer;
  transition: background .22s ease, color .22s ease, transform .22s ease;
  text-shadow: none;
  box-shadow: none;
}
.woocommerce a.button:hover,
.woocommerce-page a.button:hover,
.woocommerce button.button:hover,
.woocommerce-page button.button:hover,
.woocommerce input.button:hover,
.woocommerce-page input.button:hover,
.woocommerce #respond input#submit:hover,
.woocommerce-page #respond input#submit:hover {
  background: #F5F3EE;
  color: #1A2A22;
  transform: translateY(-1px);
}

.woocommerce a.button.alt,
.woocommerce-page a.button.alt,
.woocommerce button.button.alt,
.woocommerce-page button.button.alt,
.woocommerce input.button.alt,
.woocommerce-page input.button.alt {
  background: #3D7A5A;
  color: #F5F3EE;
  border-color: #3D7A5A;
}
.woocommerce a.button.alt:hover,
.woocommerce-page a.button.alt:hover,
.woocommerce button.button.alt:hover,
.woocommerce-page button.button.alt:hover {
  background: #2D4A3E;
  border-color: #2D4A3E;
  color: #F5F3EE;
}

.woocommerce a.button.disabled,
.woocommerce a.button:disabled {
  opacity: .45;
  cursor: not-allowed;
}

/* ---------- Forms (checkout, my-account) ---------- */

.woocommerce form .form-row label,
.woocommerce-page form .form-row label,
.woocommerce form .form-row .woocommerce-input-wrapper,
.woocommerce-page form .form-row .woocommerce-input-wrapper {
  font-family: 'Outfit', system-ui, sans-serif;
  font-size: 14px;
  color: #1A2A22;
}

.woocommerce form .form-row label,
.woocommerce-page form .form-row label {
  font-family: 'DM Mono', monospace;
  font-size:12px;
  letter-spacing: 2.4px;
  text-transform: uppercase;
  color: #3D7A5A;
  margin-bottom: 6px;
  display: block;
}

.woocommerce form .form-row input.input-text,
.woocommerce-page form .form-row input.input-text,
.woocommerce form .form-row textarea,
.woocommerce-page form .form-row textarea,
.woocommerce form .form-row select,
.woocommerce-page form .form-row select,
.select2-container--default .select2-selection--single {
  background: #FAF8F2;
  border: 1px solid #DDD4C4 !important;
  border-radius: 6px;
  padding: 12px 14px;
  font-family: 'Outfit', system-ui, sans-serif;
  font-size: 16px;
  font-weight: 300;
  color: #1A2A22;
  width: 100%;
  height: auto;
  box-shadow: none;
  transition: border-color .18s ease, background .18s ease;
}

.woocommerce form .form-row input.input-text:focus,
.woocommerce-page form .form-row input.input-text:focus,
.woocommerce form .form-row textarea:focus,
.woocommerce-page form .form-row textarea:focus,
.woocommerce form .form-row select:focus,
.woocommerce-page form .form-row select:focus {
  outline: none;
  border-color: #3D7A5A !important;
  background: #FFFFFF;
}

.select2-container--default .select2-selection--single .select2-selection__rendered {
  line-height: 1.5;
  color: #1A2A22;
  padding-left: 0;
}
.select2-container--default .select2-selection--single .select2-selection__arrow {
  height: 44px;
}

.woocommerce form .form-row.woocommerce-validated input.input-text,
.woocommerce form .form-row.woocommerce-validated select {
  box-shadow: none !important;
}

/* ---------- Cart table ---------- */

.woocommerce-cart table.shop_table,
.woocommerce-checkout table.shop_table,
.woocommerce table.shop_table {
  background: #FAF8F2;
  border: 1px solid #E8E1D0;
  border-radius: 12px;
  border-collapse: separate;
  border-spacing: 0;
  overflow: hidden;
  font-family: 'Outfit', system-ui, sans-serif;
  font-weight: 300;
}

.woocommerce table.shop_table th {
  font-family: 'DM Mono', monospace;
  font-size:12px;
  letter-spacing: 2.4px;
  text-transform: uppercase;
  color: #3D7A5A;
  padding: 18px 16px;
  background: transparent;
  border-bottom: 1px solid #E8E1D0;
}

.woocommerce table.shop_table td {
  padding: 22px 16px;
  border-top: 1px solid #ECE5D5;
  color: #1A2A22;
  font-size: 15px;
  vertical-align: middle;
}

.woocommerce table.shop_table tr:first-child td { border-top: 1px solid #E8E1D0; }

.woocommerce table.shop_table tfoot th,
.woocommerce table.shop_table tfoot td {
  background: rgba(61, 122, 90, 0.04);
  font-weight: 400;
  color: #1A2A22;
}

.woocommerce table.shop_table .order-total .amount,
.woocommerce .cart_totals .order-total .amount {
  font-family: 'Cormorant Garamond', serif;
  font-size: 26px;
  font-weight: 400;
  color: #2D4A3E;
}

.woocommerce-cart .product-name a {
  color: #1A2A22;
  text-decoration: none;
  font-family: 'Cormorant Garamond', serif;
  font-size: 20px;
  font-weight: 400;
}
.woocommerce-cart .product-name a:hover { color: #3D7A5A; }

.woocommerce-cart .product-thumbnail img {
  max-width: 84px;
  height: auto;
  border-radius: 8px;
}

.woocommerce-cart .product-quantity .qty {
  max-width: 80px;
  text-align: center;
  background: #FFFFFF;
  border: 1px solid #DDD4C4;
  border-radius: 6px;
  padding: 8px 10px;
  font-family: 'DM Mono', monospace;
}

.woocommerce-cart .product-remove a.remove {
  color: #B85F5F !important;
  font-size: 20px;
  background: transparent !important;
  border-radius: 50%;
}
.woocommerce-cart .product-remove a.remove:hover {
  background: rgba(184, 95, 95, 0.1) !important;
  color: #8B4747 !important;
}

/* ---------- Cart totals + coupon ---------- */

.woocommerce-cart .cart-collaterals .cart_totals h2,
.woocommerce-checkout #order_review_heading {
  font-family: 'Cormorant Garamond', serif;
  font-size: 32px;
  font-weight: 300;
  color: #1A2A22;
  margin: 0 0 18px;
}

.woocommerce-cart .coupon label {
  display: none;
}
.woocommerce-cart .coupon input.input-text {
  display: inline-block;
  max-width: 220px;
  margin-right: 8px;
}

/* ---------- Checkout layout ---------- */
/* v58: removed legacy grid on .woocommerce — it was pinching form.checkout.
   Grid layout is now defined on form.checkout itself below. */
.woocommerce-checkout .woocommerce {
  display: block !important;
  width: 100% !important;
  max-width: none !important;
}

.woocommerce-checkout #customer_details {
  background: #FAF8F2;
  border: 1px solid #E8E1D0;
  border-radius: 12px;
  padding: 32px;
}

.woocommerce-checkout #order_review_heading,
.woocommerce-checkout #order_review {
  background: #FAF8F2;
  border: 1px solid #E8E1D0;
  border-radius: 12px;
  padding: 28px;
}
.woocommerce-checkout #order_review_heading { padding-bottom: 0; border-bottom: none; border-radius: 12px 12px 0 0; }
.woocommerce-checkout #order_review { border-top: none; border-radius: 0 0 12px 12px; }

.woocommerce-checkout #order_review table.shop_table {
  background: transparent;
  border: none;
  border-radius: 0;
}
.woocommerce-checkout #order_review table.shop_table th,
.woocommerce-checkout #order_review table.shop_table td {
  padding: 14px 0;
  border-color: #ECE5D5;
}

.woocommerce-checkout #order_review .product-name {
  font-family: 'Cormorant Garamond', serif;
  font-size: 18px;
  color: #1A2A22;
}

/* ---------- Payment method box ---------- */

.woocommerce-checkout #payment {
  background: transparent;
  border-radius: 0;
}
.woocommerce-checkout #payment ul.payment_methods {
  background: transparent;
  border: 1px solid #E8E1D0;
  border-radius: 10px;
  padding: 18px;
  margin: 18px 0;
}
.woocommerce-checkout #payment ul.payment_methods li {
  background: transparent;
  border-bottom: 1px dashed #ECE5D5;
  padding-bottom: 14px;
  margin-bottom: 14px;
  list-style: none;
}
.woocommerce-checkout #payment ul.payment_methods li:last-child {
  border-bottom: none;
  padding-bottom: 0;
  margin-bottom: 0;
}
.woocommerce-checkout #payment ul.payment_methods li label {
  font-family: 'Cormorant Garamond', serif;
  font-size: 20px;
  font-weight: 400;
  color: #1A2A22;
  letter-spacing: 0;
  text-transform: none;
  margin-left: 8px;
  cursor: pointer;
}
.woocommerce-checkout #payment ul.payment_methods li .payment_box {
  background: rgba(61, 122, 90, 0.06);
  border-radius: 8px;
  padding: 18px;
  margin-top: 12px;
  color: #3A4940;
  font-size: 14.5px;
  line-height: 1.7;
}
.woocommerce-checkout #payment ul.payment_methods li .payment_box::before {
  display: none;
}
.woocommerce-checkout #payment ul.payment_methods li .payment_box p { margin: 0 0 10px; }
.woocommerce-checkout #payment ul.payment_methods li .payment_box p:last-child { margin-bottom: 0; }

.woocommerce-checkout #payment ul.payment_methods li input[type="radio"] {
  accent-color: #3D7A5A;
  width: 16px;
  height: 16px;
  vertical-align: middle;
}

.woocommerce-checkout #payment div.place-order {
  border-top: 1px solid #E8E1D0;
  padding-top: 20px;
  margin-top: 16px;
}
.woocommerce-checkout #payment #place_order {
  width: 100%;
  padding: 16px 28px;
  font-size: 13px;
}

/* ---------- DOSIS gateway instructions blocks (shared by EMT + Crypto) ---------- */

.dosis-gw-instructions {
  background: rgba(61, 122, 90, 0.06);
  border: 1px solid rgba(61, 122, 90, 0.18);
  border-radius: 10px;
  padding: 22px 24px;
  margin: 18px 0 24px;
  font-family: 'Outfit', system-ui, sans-serif;
  font-size: 15px;
  line-height: 1.72;
  color: #1A2A22;
}
.dosis-gw-instructions h3,
.dosis-gw-instructions h4 {
  font-family: 'Cormorant Garamond', serif;
  font-size: 22px;
  font-weight: 400;
  color: #2D4A3E;
  margin: 0 0 12px;
}
.dosis-gw-instructions code {
  background: #FFFFFF;
  border: 1px solid #DDD4C4;
  border-radius: 6px;
  padding: 6px 10px;
  font-family: 'DM Mono', monospace;
  font-size: 13px;
  color: #1A2A22;
  display: inline-block;
  word-break: break-all;
}
.dosis-gw-instructions strong { color: #2D4A3E; font-weight: 500; }

/* ---------- Order received page ---------- */

.woocommerce-order .woocommerce-order-overview {
  background: #FAF8F2;
  border: 1px solid #E8E1D0;
  border-radius: 12px;
  padding: 22px;
  list-style: none;
  display: flex;
  flex-wrap: wrap;
  gap: 18px 32px;
  margin: 24px 0;
}
.woocommerce-order .woocommerce-order-overview li {
  font-family: 'DM Mono', monospace;
  font-size:12px;
  letter-spacing: 2.4px;
  text-transform: uppercase;
  color: #3D7A5A;
  border: none;
  padding: 0;
  margin: 0;
  flex: 1 1 auto;
}
.woocommerce-order .woocommerce-order-overview li strong {
  display: block;
  font-family: 'Cormorant Garamond', serif;
  font-size: 22px;
  font-weight: 400;
  color: #1A2A22;
  letter-spacing: 0;
  text-transform: none;
  margin-top: 6px;
}

.woocommerce-order h2.woocommerce-order-details__title,
.woocommerce-order h2.woocommerce-column__title,
.woocommerce-order h2 {
  font-family: 'Cormorant Garamond', serif;
  font-size: 32px;
  font-weight: 300;
  color: #1A2A22;
  margin: 40px 0 18px;
}

.woocommerce-order .woocommerce-customer-details address {
  background: #FAF8F2;
  border: 1px solid #E8E1D0;
  border-radius: 12px;
  padding: 20px 22px;
  font-style: normal;
  font-family: 'Outfit', system-ui, sans-serif;
  font-size: 15px;
  line-height: 1.72;
  color: #1A2A22;
}

/* ---------- My-account ---------- */

.woocommerce-account .woocommerce {
  display: grid;
  grid-template-columns: 240px 1fr;
  gap: 48px;
}
@media (max-width: 760px) {
  .woocommerce-account .woocommerce { grid-template-columns: 1fr; gap: 24px; }
}

.woocommerce-account .woocommerce-MyAccount-navigation ul {
  list-style: none;
  padding: 0;
  margin: 0;
  background: #FAF8F2;
  border: 1px solid #E8E1D0;
  border-radius: 12px;
  overflow: hidden;
}
.woocommerce-account .woocommerce-MyAccount-navigation ul li {
  border-bottom: 1px solid #ECE5D5;
}
.woocommerce-account .woocommerce-MyAccount-navigation ul li:last-child { border-bottom: none; }
.woocommerce-account .woocommerce-MyAccount-navigation ul li a {
  display: block;
  padding: 14px 18px;
  color: #1A2A22;
  text-decoration: none;
  font-family: 'DM Mono', monospace;
  font-size:12px;
  letter-spacing: 2.4px;
  text-transform: uppercase;
  transition: background .15s ease, color .15s ease;
}
.woocommerce-account .woocommerce-MyAccount-navigation ul li.is-active a,
.woocommerce-account .woocommerce-MyAccount-navigation ul li a:hover {
  background: rgba(61, 122, 90, 0.08);
  color: #2D4A3E;
}

.woocommerce-account .woocommerce-MyAccount-content {
  font-family: 'Outfit', system-ui, sans-serif;
  font-size: 16px;
  line-height: 1.75;
  color: #3A4940;
}
.woocommerce-account .woocommerce-MyAccount-content h2,
.woocommerce-account .woocommerce-MyAccount-content h3 {
  font-family: 'Cormorant Garamond', serif;
  font-weight: 300;
  color: #1A2A22;
}

/* ---------- Notices (success / error / info) ---------- */

.woocommerce-message,
.woocommerce-info,
.woocommerce-error,
.woocommerce-notice {
  border-radius: 10px;
  border: 1px solid;
  padding: 16px 20px;
  font-family: 'Outfit', system-ui, sans-serif;
  font-size: 14.5px;
  line-height: 1.65;
  font-weight: 300;
  background: #FAF8F2;
  color: #1A2A22;
  margin: 0 0 22px;
}
.woocommerce-message {
  border-color: rgba(61, 122, 90, 0.25);
  background: rgba(61, 122, 90, 0.08);
}
.woocommerce-message::before { color: #3D7A5A; }

.woocommerce-info {
  border-color: rgba(61, 122, 90, 0.18);
}
.woocommerce-info::before { color: #3D7A5A; }

.woocommerce-error {
  border-color: rgba(184, 95, 95, 0.28);
  background: rgba(184, 95, 95, 0.08);
}
.woocommerce-error::before { color: #B85F5F; }

.woocommerce-message a.button,
.woocommerce-info a.button {
  background: transparent;
  color: #2D4A3E;
  border-color: #2D4A3E;
  padding: 8px 18px;
  font-size:12px;
}
.woocommerce-message a.button:hover,
.woocommerce-info a.button:hover {
  background: #2D4A3E;
  color: #F5F3EE;
}

/* ---------- Cart cross-sells: hide (not used) ---------- */
.woocommerce-cart .cross-sells { display: none; }

/* ---------- Shop loop (if a customer ever reaches /shop/) ---------- */

.woocommerce ul.products li.product .woocommerce-loop-product__title {
  font-family: 'Cormorant Garamond', serif;
  font-weight: 400;
  color: #1A2A22;
  font-size: 22px;
  padding: 14px 0 4px;
}
.woocommerce ul.products li.product .price {
  font-family: 'DM Mono', monospace;
  color: #3D7A5A;
  font-size: 14px;
  font-weight: 500;
}
.woocommerce ul.products li.product .button {
  margin-top: 12px;
}

/* ---------- Mini-cart (if used) ---------- */

.woocommerce ul.cart_list,
.woocommerce ul.product_list_widget {
  font-family: 'Outfit', system-ui, sans-serif;
}
.woocommerce ul.cart_list li a,
.woocommerce ul.product_list_widget li a {
  color: #1A2A22;
  font-family: 'Cormorant Garamond', serif;
  font-weight: 400;
}

/* ---------- Footer cushion ---------- */

body.woocommerce-cart .wc-page-shell,
body.woocommerce-checkout .wc-page-shell,
body.woocommerce-order-received .wc-page-shell,
body.woocommerce-account .wc-page-shell {
  padding-bottom: 96px;
}

/* ============================================================
   v55 — deep-skin pass: kill remaining default WC styling so
   nothing renders out of place on cart/checkout/account/order.
   ============================================================ */

/* The page's default H1 (e.g. "Cart") rendered by the_title hook on
   shortcode pages — hide it. The .wc-hero band carries the page title now. */
body.woocommerce-cart .entry-title,
body.woocommerce-cart h1.page-title,
body.woocommerce-checkout .entry-title,
body.woocommerce-checkout h1.page-title,
body.woocommerce-account .entry-title,
body.woocommerce-account h1.page-title {
  display: none !important;
}

/* Cart added-to-cart message (top notice) */
body.woocommerce-cart .woocommerce-message {
  background: rgba(61, 122, 90, 0.08);
  border: 1px solid rgba(61, 122, 90, 0.22);
  color: #1A2A22;
  border-radius: 12px;
  padding: 18px 22px;
  font-family: 'Outfit', system-ui, sans-serif;
  font-size: 15px;
  display: flex;
  align-items: center;
  gap: 14px;
}
body.woocommerce-cart .woocommerce-message::before {
  content: '';
  display: inline-block;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background: #3D7A5A;
  flex-shrink: 0;
}
body.woocommerce-cart .woocommerce-message a.button {
  margin-left: auto;
  background: transparent;
  color: #2D4A3E;
  border: 1px solid #2D4A3E;
  padding: 10px 22px;
  font-size:12px;
}
body.woocommerce-cart .woocommerce-message a.button:hover {
  background: #2D4A3E;
  color: #F5F3EE;
}

/* Cart layout: align the table + collaterals into two columns */
.woocommerce-cart .woocommerce {
  display: grid;
  grid-template-columns: minmax(0, 1.7fr) minmax(0, 1fr);
  gap: 40px;
  align-items: start;
}
@media (max-width: 900px) {
  .woocommerce-cart .woocommerce { grid-template-columns: 1fr; gap: 28px; }
}

/* The cart-form column gets the table + coupon */
.woocommerce-cart .woocommerce-cart-form {
  grid-column: 1;
}
.woocommerce-cart .cart-collaterals {
  grid-column: 2;
  width: 100%;
  max-width: none;
  float: none;
  margin: 0;
}
.woocommerce-cart .cart-collaterals .cart_totals {
  width: 100%;
  float: none;
}

/* Coupon row: clean form, brand-typed input */
.woocommerce-cart .cart .actions .coupon {
  display: flex;
  gap: 10px;
  align-items: center;
}
.woocommerce-cart .cart .actions .coupon label {
  display: none;
}
.woocommerce-cart .cart .actions .coupon input.input-text {
  flex: 1;
  min-width: 0;
  max-width: 220px;
  margin: 0;
  background: #FFFFFF;
  border: 1px solid #DDD4C4;
  border-radius: 999px;
  padding: 12px 18px;
  font-family: 'DM Mono', monospace;
  font-size:12px;
  letter-spacing: 1.6px;
  text-transform: uppercase;
  color: #1A2A22;
}
.woocommerce-cart .cart .actions .button[name="apply_coupon"] {
  background: transparent;
  color: #2D4A3E;
  border-color: #2D4A3E;
}
.woocommerce-cart .cart .actions .button[name="apply_coupon"]:hover {
  background: #2D4A3E;
  color: #F5F3EE;
}

/* Update Cart button */
.woocommerce-cart .cart .actions .button[name="update_cart"] {
  background: transparent;
  color: #1A2A22;
  border-color: rgba(26, 42, 34, 0.4);
  margin-left: auto;
}
.woocommerce-cart .cart .actions .button[name="update_cart"]:hover {
  background: #1A2A22;
  color: #F5F3EE;
  border-color: #1A2A22;
}
.woocommerce-cart .cart .actions {
  display: flex;
  gap: 12px;
  align-items: center;
  background: transparent;
  padding: 22px 0 0;
  border: none;
}

/* Cart totals card */
.woocommerce-cart .cart_totals {
  background: #FAF8F2;
  border: 1px solid #E8E1D0;
  border-radius: 12px;
  padding: 24px 26px;
}
.woocommerce-cart .cart_totals h2 {
  font-family: 'Cormorant Garamond', serif;
  font-size: 30px;
  font-weight: 300;
  color: #1A2A22;
  margin: 0 0 18px;
  letter-spacing: 0;
}
.woocommerce-cart .cart_totals table.shop_table {
  background: transparent;
  border: none;
  border-radius: 0;
}
.woocommerce-cart .cart_totals table.shop_table th,
.woocommerce-cart .cart_totals table.shop_table td {
  background: transparent;
  border-top: 1px solid #ECE5D5;
  padding: 16px 0;
}
.woocommerce-cart .cart_totals table.shop_table tr:first-child th,
.woocommerce-cart .cart_totals table.shop_table tr:first-child td {
  border-top: none;
}
.woocommerce-cart .cart_totals table.shop_table th {
  font-family: 'DM Mono', monospace;
  font-size:12px;
  letter-spacing: 2.4px;
  text-transform: uppercase;
  color: #3D7A5A;
  font-weight: 500;
  text-align: left;
  width: 40%;
}
.woocommerce-cart .cart_totals table.shop_table td {
  font-family: 'Outfit', system-ui, sans-serif;
  font-size: 16px;
  color: #1A2A22;
  text-align: right;
}
.woocommerce-cart .cart_totals .order-total th,
.woocommerce-cart .cart_totals .order-total td {
  border-top: 1px solid #2D4A3E;
  padding-top: 20px;
}
.woocommerce-cart .cart_totals .order-total td {
  font-family: 'Cormorant Garamond', serif;
  font-size: 28px;
  font-weight: 400;
  color: #2D4A3E;
}
.woocommerce-cart .cart_totals .order-total td .amount {
  font-family: 'Cormorant Garamond', serif;
  font-size: 28px;
  color: #2D4A3E;
}

/* Proceed to checkout button — full-width pill matching brand */
.woocommerce-cart .wc-proceed-to-checkout {
  padding: 22px 0 0;
}
.woocommerce-cart .wc-proceed-to-checkout .checkout-button,
.woocommerce-cart .wc-proceed-to-checkout a.checkout-button {
  display: block !important;
  width: 100%;
  background: #1A2A22 !important;
  color: #F5F3EE !important;
  border: 1px solid #1A2A22 !important;
  border-radius: 999px !important;
  padding: 18px 28px !important;
  font-family: 'DM Mono', monospace !important;
  font-size: 12px !important;
  letter-spacing: 2.4px !important;
  text-transform: uppercase !important;
  text-align: center;
  font-weight: 500 !important;
  text-decoration: none;
  transition: background .22s ease, color .22s ease;
}
.woocommerce-cart .wc-proceed-to-checkout .checkout-button:hover,
.woocommerce-cart .wc-proceed-to-checkout a.checkout-button:hover {
  background: #2D4A3E !important;
  color: #F5F3EE !important;
  border-color: #2D4A3E !important;
}

/* Quantity stepper (cart) */
.woocommerce-cart .product-quantity .qty {
  width: 70px !important;
  max-width: 70px;
  text-align: center;
  background: #FFFFFF;
  border: 1px solid #DDD4C4;
  border-radius: 8px;
  padding: 8px 10px;
  font-family: 'DM Mono', monospace;
  font-size: 14px;
  color: #1A2A22;
}

/* Cross-sells already hidden */

/* Estimated total / shipping label tweaks */
.woocommerce-cart .shipping-calculator-button {
  color: #3D7A5A;
  font-family: 'DM Mono', monospace;
  font-size:12px;
  letter-spacing: 1.6px;
  text-transform: uppercase;
  text-decoration: none;
  border-bottom: 1px dashed rgba(61, 122, 90, 0.4);
}

/* Remove the heavy table border WP themes ship */
.woocommerce-cart table.shop_table {
  margin: 0 0 8px;
}

/* ---------- Checkout-page heavy lifting ---------- */

.woocommerce-checkout .woocommerce-form-coupon-toggle .woocommerce-info {
  background: transparent;
  border: 1px dashed rgba(61, 122, 90, 0.3);
}
.woocommerce-checkout .woocommerce-form-coupon-toggle .woocommerce-info a {
  color: #2D4A3E;
  font-family: 'DM Mono', monospace;
  font-size:12px;
  letter-spacing: 1.6px;
  text-transform: uppercase;
  text-decoration: none;
  border-bottom: 1px dashed #2D4A3E;
}

.woocommerce-checkout .woocommerce form.checkout {
  display: grid;
  grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr);
  gap: 48px;
  align-items: start;
}
@media (max-width: 900px) {
  .woocommerce-checkout .woocommerce form.checkout {
    grid-template-columns: 1fr;
    gap: 28px;
  }
}

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

.woocommerce-checkout .woocommerce-billing-fields h3,
.woocommerce-checkout .woocommerce-shipping-fields h3,
.woocommerce-checkout .woocommerce-additional-fields h3,
.woocommerce-checkout #order_review_heading {
  font-family: 'Cormorant Garamond', serif;
  font-size: 30px;
  font-weight: 300;
  color: #1A2A22;
  margin: 0 0 18px;
  letter-spacing: 0;
}

.woocommerce-checkout #order_review {
  background: #FAF8F2;
  border: 1px solid #E8E1D0;
  border-radius: 12px;
  padding: 26px;
}
.woocommerce-checkout #order_review_heading {
  margin-top: 0;
}

/* Checkout login + coupon toggles */
.woocommerce-checkout .woocommerce-form-login {
  background: #FAF8F2;
  border: 1px solid #E8E1D0;
  border-radius: 12px;
  padding: 22px;
  margin-bottom: 24px;
}

/* Order Review table inside checkout */
.woocommerce-checkout #order_review table.shop_table tfoot th {
  font-family: 'DM Mono', monospace;
  font-size:12px;
  letter-spacing: 2.4px;
  text-transform: uppercase;
  color: #3D7A5A;
  background: transparent;
}
.woocommerce-checkout #order_review table.shop_table tfoot td {
  background: transparent;
}
.woocommerce-checkout #order_review .order-total .amount {
  font-family: 'Cormorant Garamond', serif;
  font-size: 28px;
  font-weight: 400;
  color: #2D4A3E;
}

/* Place Order button — brand pill */
.woocommerce-checkout #place_order {
  display: block !important;
  width: 100% !important;
  background: #1A2A22 !important;
  color: #F5F3EE !important;
  border: 1px solid #1A2A22 !important;
  border-radius: 999px !important;
  padding: 18px 28px !important;
  font-family: 'DM Mono', monospace !important;
  font-size: 12px !important;
  letter-spacing: 2.4px !important;
  text-transform: uppercase !important;
  font-weight: 500 !important;
  margin-top: 18px;
}
.woocommerce-checkout #place_order:hover {
  background: #2D4A3E !important;
  border-color: #2D4A3E !important;
}

/* Terms acceptance row */
.woocommerce-checkout .woocommerce-terms-and-conditions-wrapper {
  background: rgba(61, 122, 90, 0.06);
  border: 1px solid rgba(61, 122, 90, 0.18);
  border-radius: 8px;
  padding: 14px 18px;
  margin: 16px 0;
  font-size: 13px;
  color: #3A4940;
}

/* My-account login / register forms */
.woocommerce-account .woocommerce-form-login,
.woocommerce-account .woocommerce-form-register,
.woocommerce-account .woocommerce-LostPassword,
.woocommerce-account .woocommerce-EditAccountForm {
  background: #FAF8F2;
  border: 1px solid #E8E1D0;
  border-radius: 12px;
  padding: 28px;
}
.woocommerce-account .u-columns,
.woocommerce-account .u-column1,
.woocommerce-account .u-column2 {
  float: none !important;
  width: 100% !important;
  max-width: 480px;
}
.woocommerce-account .u-columns {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 28px;
  max-width: 100%;
}
@media (max-width: 760px) {
  .woocommerce-account .u-columns { grid-template-columns: 1fr; }
}

.woocommerce-account h2 {
  font-family: 'Cormorant Garamond', serif;
  font-size: 30px;
  font-weight: 300;
  color: #1A2A22;
  margin: 0 0 18px;
}

/* Order-received page */
.woocommerce-order .woocommerce-thankyou-order-received {
  font-family: 'Cormorant Garamond', serif;
  font-size: 28px;
  font-weight: 300;
  color: #2D4A3E;
  margin: 0 0 20px;
  letter-spacing: 0;
}

/* Hide WC default page title where the brand hero already covers it */
.wc-page .woocommerce > h1:first-child,
.wc-page .woocommerce > .entry-header,
.wc-page > article > .entry-header,
.wc-page .entry-header {
  display: none;
}

/* Default WP page wrapping divs that bypass our layout */
.wc-page .entry-content {
  background: transparent;
  border: none;
  padding: 0;
  margin: 0;
  max-width: none;
}

/* Image placeholder squares (when products have no thumbnail) */
.woocommerce-cart .product-thumbnail img,
.woocommerce-checkout .product-thumbnail img {
  width: 72px;
  height: 72px;
  border-radius: 10px;
  object-fit: cover;
  background: rgba(61, 122, 90, 0.08);
}
.woocommerce-cart .product-thumbnail img[src*="woocommerce-placeholder"],
.woocommerce-checkout .product-thumbnail img[src*="woocommerce-placeholder"] {
  filter: opacity(0.4);
}

/* Empty cart state */
.cart-empty.woocommerce-info {
  background: #FAF8F2;
  border: 1px solid #E8E1D0;
  border-radius: 12px;
  padding: 36px;
  text-align: center;
  font-family: 'Cormorant Garamond', serif;
  font-size: 28px;
  font-weight: 300;
  color: #1A2A22;
}
.return-to-shop {
  text-align: center;
  margin-top: 22px;
}
.return-to-shop .button {
  display: inline-block;
}

/* Quantity input — make sure spin buttons styled cleanly */
.woocommerce-cart .quantity input[type="number"]::-webkit-inner-spin-button,
.woocommerce-cart .quantity input[type="number"]::-webkit-outer-spin-button {
  opacity: 1;
}

/* Block-cart shim (in case any block cart UI does leak through) */
.wp-block-woocommerce-cart .wc-block-components-button {
  background: #1A2A22 !important;
  color: #F5F3EE !important;
  border-radius: 999px !important;
  font-family: 'DM Mono', monospace !important;
  letter-spacing: 2.4px !important;
  text-transform: uppercase !important;
  font-weight: 500 !important;
}

/* ============================================================
   v56 — Visual fixes from live test
   ============================================================ */

/* (1) FORCE reveal animation visible on WC pages — JS hook never fires for
   shortcode-rendered WC content because the IntersectionObserver runs before
   the content paints. Disable opacity gating entirely on WC routes. */
body.woocommerce-cart .reveal,
body.woocommerce-checkout .reveal,
body.woocommerce-account .reveal,
body.woocommerce-order-received .reveal,
body.dosis-wc-skin .reveal {
  opacity: 1 !important;
  transform: none !important;
}

/* (2) Cart layout — stack cart table FULL WIDTH above the totals, and make
   totals a horizontal summary band beneath. This matches how the rest of the
   site uses full-width content blocks above sub-bands. */
.woocommerce-cart .woocommerce {
  display: block !important;
  grid-template-columns: none !important;
}
.woocommerce-cart .woocommerce-cart-form,
.woocommerce-cart .cart-collaterals {
  width: 100% !important;
  max-width: none !important;
  float: none !important;
  margin: 0 !important;
}
.woocommerce-cart .cart-collaterals {
  margin-top: 28px !important;
  display: grid !important;
  grid-template-columns: 1fr;
  gap: 18px;
}
.woocommerce-cart .cart-collaterals .cart_totals {
  width: 100% !important;
  max-width: none !important;
  float: none !important;
}

/* (3) Cart row spacing — no more 3-line product-name wrap */
.woocommerce-cart table.shop_table {
  table-layout: auto;
  width: 100%;
}
.woocommerce-cart table.shop_table .product-remove { width: 50px; }
.woocommerce-cart table.shop_table .product-thumbnail { width: 100px; }
.woocommerce-cart table.shop_table .product-name {
  width: auto;
  min-width: 240px;
  white-space: normal;
  word-break: normal;
  overflow-wrap: normal;
}
.woocommerce-cart table.shop_table .product-name a {
  font-size: 22px !important;
  line-height: 1.2;
  display: inline-block;
  max-width: 100%;
}
.woocommerce-cart table.shop_table .product-price,
.woocommerce-cart table.shop_table .product-subtotal {
  width: 110px;
  white-space: nowrap;
  font-family: 'Outfit', system-ui, sans-serif;
  font-size: 16px;
  font-weight: 400;
}
.woocommerce-cart table.shop_table .product-quantity {
  width: 110px;
}

/* Hide the broken thumbnail placeholder square that says nothing useful */
.woocommerce-cart table.shop_table .product-thumbnail img {
  width: 64px;
  height: 64px;
  background: #FAF8F2;
  border: 1px solid #ECE5D5;
  border-radius: 8px;
  object-fit: cover;
}
.woocommerce-cart table.shop_table .product-thumbnail img[src*="placeholder"] {
  filter: opacity(0.4);
}

/* (4) Cart Totals — give it the same hero treatment as the rest */
.woocommerce-cart .cart_totals {
  padding: 28px 32px !important;
}
.woocommerce-cart .cart_totals h2 {
  text-align: left;
  font-size: 36px !important;
  margin-bottom: 24px !important;
}
.woocommerce-cart .cart_totals .wc-proceed-to-checkout {
  margin-top: 28px;
}

/* (5) Header strip — pull it tight so it sits at the very top */
body.woocommerce-cart main.wc-page,
body.woocommerce-checkout main.wc-page,
body.woocommerce-account main.wc-page,
body.woocommerce-order-received main.wc-page {
  background: #F5F3EE;
  min-height: 100vh;
  padding-top: 0;
}

/* (6) The hero — slightly tighter top padding under fixed nav */
body.woocommerce-cart .wc-hero,
body.woocommerce-checkout .wc-hero,
body.woocommerce-account .wc-hero,
body.woocommerce-order-received .wc-hero {
  padding-top: 120px;
  padding-bottom: 24px;
}

/* (7) Page shell padding — pull content tighter to hero */
body.dosis-wc-skin .wc-page-shell {
  padding-top: 12px;
}

/* (8) Checkout coupon row — left-align where the form starts */
.woocommerce-checkout .woocommerce-form-coupon-toggle {
  grid-column: 1 / -1;
  margin-bottom: 18px;
}

/* (9) Order review card — make the heading + table align */
.woocommerce-checkout #order_review_heading {
  background: #FAF8F2;
  border: 1px solid #E8E1D0;
  border-bottom: none;
  border-radius: 12px 12px 0 0;
  margin: 0;
  padding: 28px 28px 0;
}
.woocommerce-checkout #order_review {
  border-radius: 0 0 12px 12px;
  margin-top: 0;
}

/* ============================================================
   v57 — Checkout layout: force full-width grid with equal tracks.
   The live DOM showed form.checkout was computing at 448px wide
   with 233px/167px tracks because WC default CSS sets fixed widths
   on .col2-set, .col-1, .col-2. Override every offender with
   !important so the form fills the 1180px shell.
   ============================================================ */

body.woocommerce-checkout form.checkout {
  display: grid !important;
  grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr) !important;
  gap: 48px !important;
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  align-items: start;
}

body.woocommerce-checkout form.checkout > * {
  min-width: 0;
}

body.woocommerce-checkout .woocommerce-form-coupon-toggle,
body.woocommerce-checkout .woocommerce-notices-wrapper,
body.woocommerce-checkout .woocommerce-form-login {
  grid-column: 1 / -1 !important;
  width: 100% !important;
  max-width: none !important;
}

/* The 2-column floats WC ships — kill them and span full width */
body.woocommerce-checkout #customer_details,
body.woocommerce-checkout .col2-set {
  display: block !important;
  float: none !important;
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: none !important;
}

body.woocommerce-checkout #customer_details .col-1,
body.woocommerce-checkout #customer_details .col-2,
body.woocommerce-checkout .col2-set .col-1,
body.woocommerce-checkout .col2-set .col-2,
body.woocommerce-checkout .woocommerce-billing-fields,
body.woocommerce-checkout .woocommerce-shipping-fields,
body.woocommerce-checkout .woocommerce-additional-fields {
  display: block !important;
  float: none !important;
  width: 100% !important;
  max-width: none !important;
  margin: 0 0 24px 0 !important;
  padding: 0 !important;
}

/* Billing details card */
body.woocommerce-checkout .woocommerce-billing-fields {
  background: #FAF8F2 !important;
  border: 1px solid #E8E1D0 !important;
  border-radius: 12px !important;
  padding: 32px !important;
}

/* Shipping fields card (when "ship to different address" toggled) */
body.woocommerce-checkout .woocommerce-shipping-fields {
  background: #FAF8F2 !important;
  border: 1px solid #E8E1D0 !important;
  border-radius: 12px !important;
  padding: 32px !important;
  margin-top: 24px !important;
}

body.woocommerce-checkout .woocommerce-additional-fields {
  background: #FAF8F2 !important;
  border: 1px solid #E8E1D0 !important;
  border-radius: 12px !important;
  padding: 32px !important;
}

/* Order review (right column) */
body.woocommerce-checkout #order_review_heading {
  grid-column: 2 !important;
  margin: 0 !important;
  padding: 32px 32px 0 !important;
  background: #FAF8F2 !important;
  border: 1px solid #E8E1D0 !important;
  border-bottom: none !important;
  border-radius: 12px 12px 0 0 !important;
  font-size: 28px !important;
}
body.woocommerce-checkout #order_review {
  grid-column: 2 !important;
  margin: 0 !important;
  padding: 24px 32px 32px !important;
  background: #FAF8F2 !important;
  border: 1px solid #E8E1D0 !important;
  border-top: none !important;
  border-radius: 0 0 12px 12px !important;
  width: 100% !important;
  max-width: none !important;
  position: sticky;
  top: 110px;
}

/* Pair heading with table directly */
body.woocommerce-checkout #order_review_heading {
  position: sticky;
  top: 90px;
  z-index: 1;
}

/* Form-row pair: First Name + Last Name side-by-side */
body.woocommerce-checkout .woocommerce-billing-fields .form-row-first,
body.woocommerce-checkout .woocommerce-shipping-fields .form-row-first {
  width: calc(50% - 8px) !important;
  float: left !important;
  margin-right: 16px !important;
}
body.woocommerce-checkout .woocommerce-billing-fields .form-row-last,
body.woocommerce-checkout .woocommerce-shipping-fields .form-row-last {
  width: calc(50% - 8px) !important;
  float: left !important;
}
body.woocommerce-checkout .woocommerce-billing-fields .form-row-wide,
body.woocommerce-checkout .woocommerce-shipping-fields .form-row-wide {
  clear: both !important;
  width: 100% !important;
  float: none !important;
}

/* Section heading inside billing details — "Billing details" */
body.woocommerce-checkout .woocommerce-billing-fields > h3,
body.woocommerce-checkout .woocommerce-shipping-fields > h3,
body.woocommerce-checkout .woocommerce-additional-fields > h3 {
  font-family: 'Cormorant Garamond', serif !important;
  font-size: 32px !important;
  font-weight: 300 !important;
  color: #1A2A22 !important;
  margin: 0 0 24px 0 !important;
  letter-spacing: 0 !important;
}

/* Country select fix (select2 dropdown) */
body.woocommerce-checkout .select2-container {
  width: 100% !important;
}

/* Form rows: cleaner vertical spacing */
body.woocommerce-checkout .form-row {
  display: block;
  margin: 0 0 18px 0;
  padding: 0;
}
body.woocommerce-checkout .form-row::after {
  content: '';
  display: table;
  clear: both;
}

/* Mobile collapse */
@media (max-width: 920px) {
  body.woocommerce-checkout form.checkout {
    grid-template-columns: 1fr !important;
    gap: 24px !important;
  }
  body.woocommerce-checkout #order_review_heading,
  body.woocommerce-checkout #order_review {
    grid-column: 1 !important;
    position: static !important;
  }
}

/* ============================================================
   v59 — Checkout layout, take 3.
   Stop fighting CSS Grid auto-placement. Use plain flexbox-row
   with the order-review wrapped as the right column and the
   left column containing everything else. Implementation:
   1. form.checkout becomes display: flex; flex-wrap: wrap
   2. .woocommerce-notices + .coupon-toggle span 100% (top band)
   3. #customer_details + .woocommerce-additional-fields occupy
      a left column at 60% width via being grouped via order
   4. #order_review_heading + #order_review render as one right
      column at 40% width via order:2 placement
   
   This avoids ALL the grid-row-auto-placement nightmares because
   flexbox doesn't try to align children in rows — it just flows.
   ============================================================ */

body.woocommerce-checkout form.checkout {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 0 !important;
  width: 100% !important;
  max-width: none !important;
  align-items: flex-start !important;
}

/* Full-width band: notices + coupon toggle */
body.woocommerce-checkout form.checkout > .woocommerce-notices-wrapper,
body.woocommerce-checkout form.checkout > .woocommerce-form-coupon-toggle,
body.woocommerce-checkout form.checkout > .woocommerce-form-coupon,
body.woocommerce-checkout form.checkout > .woocommerce-form-login-toggle,
body.woocommerce-checkout form.checkout > .woocommerce-form-login {
  flex: 0 0 100% !important;
  width: 100% !important;
  max-width: none !important;
  margin-bottom: 24px !important;
  order: 1 !important;
}

/* LEFT column container: 60% wide, gets billing + shipping + additional */
body.woocommerce-checkout form.checkout > #customer_details {
  flex: 0 0 calc(60% - 24px) !important;
  width: calc(60% - 24px) !important;
  max-width: calc(60% - 24px) !important;
  margin-right: 24px !important;
  padding: 0 !important;
  background: transparent !important;
  border: none !important;
  order: 2 !important;
}

body.woocommerce-checkout form.checkout > .woocommerce-additional-fields {
  flex: 0 0 calc(60% - 24px) !important;
  width: calc(60% - 24px) !important;
  max-width: calc(60% - 24px) !important;
  margin-right: 24px !important;
  margin-top: 0 !important;
  order: 3 !important;

  background: #FAF8F2 !important;
  border: 1px solid #E8E1D0 !important;
  border-radius: 12px !important;
  padding: 32px !important;
}

/* RIGHT column: order review (heading + table + payment + place order) */
body.woocommerce-checkout form.checkout > h3#order_review_heading {
  flex: 0 0 40% !important;
  width: 40% !important;
  max-width: 40% !important;
  order: 4 !important;
  margin: 0 !important;
  padding: 32px 32px 0 !important;
  background: #FAF8F2 !important;
  border: 1px solid #E8E1D0 !important;
  border-bottom: none !important;
  border-radius: 12px 12px 0 0 !important;
  font-family: 'Cormorant Garamond', serif !important;
  font-size: 32px !important;
  font-weight: 300 !important;
  color: #1A2A22 !important;
  position: sticky;
  top: 90px;
  z-index: 1;
  align-self: flex-start;
}

body.woocommerce-checkout form.checkout > #order_review {
  flex: 0 0 40% !important;
  width: 40% !important;
  max-width: 40% !important;
  order: 5 !important;
  margin: 0 !important;
  padding: 24px 32px 32px !important;
  background: #FAF8F2 !important;
  border: 1px solid #E8E1D0 !important;
  border-top: none !important;
  border-radius: 0 0 12px 12px !important;
  align-self: flex-start;
  position: sticky;
  top: 174px;
}

/* Within #customer_details: billing + shipping cards */
body.woocommerce-checkout #customer_details .woocommerce-billing-fields,
body.woocommerce-checkout #customer_details .woocommerce-shipping-fields {
  width: 100% !important;
  margin-bottom: 24px !important;
}

/* Mobile collapse */
@media (max-width: 980px) {
  body.woocommerce-checkout form.checkout > #customer_details,
  body.woocommerce-checkout form.checkout > .woocommerce-additional-fields,
  body.woocommerce-checkout form.checkout > h3#order_review_heading,
  body.woocommerce-checkout form.checkout > #order_review {
    flex: 0 0 100% !important;
    width: 100% !important;
    max-width: 100% !important;
    margin-right: 0 !important;
    position: static !important;
  }
}

/* ============================================================
   v60 — FINAL checkout layout fix. Reverts the v59 flex attempt.
   Use CSS Grid with explicit grid-row + grid-column on every
   form.checkout child so nothing depends on auto-placement.

     col 1 (~60%)            col 2 (~40%)
   +-----------------------+-------------------+
   | notices/coupon (span 2)                   | row 1
   +-----------------------+-------------------+
   | #customer_details     | order_review_     | row 2
   |                       |   heading         |
   |                       +-------------------+
   |                       | #order_review     | row 3
   +-----------------------+-------------------+
   | .woocommerce-         |                   | row 4
   |   additional-fields   |                   |
   +-----------------------+-------------------+

   #customer_details spans rows 2-3 so #order_review aligns
   beside it from rows 2-3 too. Additional-fields drops to row 4
   on the left.
   ============================================================ */

body.woocommerce-checkout form.checkout {
  display: grid !important;
  grid-template-columns: minmax(0, 1.45fr) minmax(0, 1fr) !important;
  grid-template-areas:
    "notices  notices"
    "billing  review-h"
    "billing  review"
    "extra    review"
    "extra    placeholder" !important;
  grid-auto-rows: min-content !important;
  column-gap: 32px !important;
  row-gap: 24px !important;
  width: 100% !important;
  max-width: none !important;
  flex-wrap: unset !important;
  align-items: start !important;
}

/* Full-width top band */
body.woocommerce-checkout form.checkout > .woocommerce-notices-wrapper,
body.woocommerce-checkout form.checkout > .woocommerce-form-coupon-toggle,
body.woocommerce-checkout form.checkout > .woocommerce-form-coupon,
body.woocommerce-checkout form.checkout > .woocommerce-form-login-toggle,
body.woocommerce-checkout form.checkout > .woocommerce-form-login {
  grid-area: notices !important;
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  order: unset !important;
  flex: unset !important;
}

/* Left col, top: customer_details (Billing + Shipping inside) */
body.woocommerce-checkout form.checkout > #customer_details {
  grid-area: billing !important;
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: none !important;
  align-self: start !important;
  order: unset !important;
  flex: unset !important;
}

/* Right col, top: order_review_heading */
body.woocommerce-checkout form.checkout > h3#order_review_heading {
  grid-area: review-h !important;
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 32px 32px 12px !important;
  background: #FAF8F2 !important;
  border: 1px solid #E8E1D0 !important;
  border-bottom: none !important;
  border-radius: 12px 12px 0 0 !important;
  font-family: 'Cormorant Garamond', serif !important;
  font-size: 32px !important;
  font-weight: 300 !important;
  color: #1A2A22 !important;
  letter-spacing: 0 !important;
  align-self: start !important;
  order: unset !important;
  flex: unset !important;
}

/* Right col, immediately under heading: order_review body */
body.woocommerce-checkout form.checkout > #order_review {
  grid-area: review !important;
  width: 100% !important;
  max-width: none !important;
  margin: -24px 0 0 !important;  /* close the row-gap above so heading + body read as one card */
  padding: 0 32px 32px !important;
  background: #FAF8F2 !important;
  border: 1px solid #E8E1D0 !important;
  border-top: none !important;
  border-radius: 0 0 12px 12px !important;
  align-self: start !important;
  order: unset !important;
  flex: unset !important;
}

/* Left col, below billing: additional-fields (Order notes) */
body.woocommerce-checkout form.checkout > .woocommerce-additional-fields {
  grid-area: extra !important;
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 32px !important;
  background: #FAF8F2 !important;
  border: 1px solid #E8E1D0 !important;
  border-radius: 12px !important;
  order: unset !important;
  flex: unset !important;
}

/* Mobile: collapse everything to 1 column in DOM order */
@media (max-width: 980px) {
  body.woocommerce-checkout form.checkout {
    grid-template-columns: 1fr !important;
    grid-template-areas:
      "notices"
      "billing"
      "review-h"
      "review"
      "extra" !important;
  }
  body.woocommerce-checkout form.checkout > #order_review { margin-top: 0 !important; }
  body.woocommerce-checkout form.checkout > #customer_details,
  body.woocommerce-checkout form.checkout > .woocommerce-additional-fields,
  body.woocommerce-checkout form.checkout > h3#order_review_heading,
  body.woocommerce-checkout form.checkout > #order_review {
    grid-column: 1 !important;
    grid-row: auto !important;
  }
}

/* ============================================================
   v61 — CHECKOUT RESET + clean single-column layout.

   Overrides every checkout-layout rule from v55..v60.1 with a
   simple stacked block layout. No grid, no flex columns. Just
   full-width cards in DOM order. Brand-styled, responsive,
   predictable. Same pattern Apple/Glossier/Aesop use for
   checkout.
   ============================================================ */

/* ---------- RESET — undo every column attempt ---------- */
body.woocommerce-checkout form.checkout,
body.woocommerce-checkout .woocommerce {
  display: block !important;
  grid-template-columns: none !important;
  grid-template-rows: none !important;
  grid-template-areas: none !important;
  grid-auto-rows: auto !important;
  flex-wrap: unset !important;
  column-gap: 0 !important;
  row-gap: 0 !important;
  width: 100% !important;
  max-width: none !important;       /* v61.1 — fill the 1180 brand shell */
  margin: 0 !important;
  align-items: stretch !important;
}

body.woocommerce-checkout form.checkout > * {
  grid-area: unset !important;
  grid-column: unset !important;
  grid-row: unset !important;
  flex: unset !important;
  order: unset !important;
  float: none !important;
  width: 100% !important;
  max-width: none !important;
  position: static !important;
  margin: 0 0 24px 0 !important;
}

/* ---------- TOP BAND: notices + coupon toggle ---------- */
body.woocommerce-checkout form.checkout > .woocommerce-notices-wrapper:empty {
  display: none !important;
}

body.woocommerce-checkout form.checkout > .woocommerce-form-coupon-toggle .woocommerce-info {
  background: transparent !important;
  border: 1px dashed rgba(61, 122, 90, 0.32) !important;
  border-radius: 10px !important;
  padding: 16px 22px !important;
  font-family: 'Outfit', system-ui, sans-serif !important;
  font-size: 14px !important;
  color: #3A4940 !important;
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
}
body.woocommerce-checkout form.checkout > .woocommerce-form-coupon-toggle .woocommerce-info::before {
  content: '' !important;
  display: inline-block !important;
  width: 14px !important;
  height: 14px !important;
  border-radius: 50% !important;
  background: rgba(61, 122, 90, 0.18) !important;
  flex-shrink: 0 !important;
}
body.woocommerce-checkout form.checkout > .woocommerce-form-coupon-toggle .woocommerce-info a {
  color: #2D4A3E !important;
  font-family: 'DM Mono', monospace !important;
  font-size:12px !important;
  letter-spacing: 1.8px !important;
  text-transform: uppercase !important;
  text-decoration: none !important;
  border-bottom: 1px dashed #2D4A3E !important;
}

/* ---------- CUSTOMER DETAILS card (Billing inside) ---------- */
body.woocommerce-checkout form.checkout > #customer_details {
  background: transparent !important;
  border: none !important;
  padding: 0 !important;
}

body.woocommerce-checkout #customer_details .woocommerce-billing-fields,
body.woocommerce-checkout #customer_details .woocommerce-shipping-fields {
  background: #FAF8F2 !important;
  border: 1px solid #E8E1D0 !important;
  border-radius: 14px !important;
  padding: 36px !important;
  margin: 0 0 24px 0 !important;
  width: 100% !important;
  float: none !important;
}

body.woocommerce-checkout #customer_details .woocommerce-billing-fields > h3,
body.woocommerce-checkout #customer_details .woocommerce-shipping-fields > h3,
body.woocommerce-checkout form.checkout > .woocommerce-additional-fields > h3 {
  font-family: 'Cormorant Garamond', serif !important;
  font-size: 36px !important;
  font-weight: 300 !important;
  color: #1A2A22 !important;
  margin: 0 0 24px 0 !important;
  letter-spacing: 0 !important;
  line-height: 1.05 !important;
}

/* Name pair side-by-side */
body.woocommerce-checkout .form-row-first {
  width: calc(50% - 8px) !important;
  float: left !important;
  margin-right: 16px !important;
  margin-bottom: 18px !important;
}
body.woocommerce-checkout .form-row-last {
  width: calc(50% - 8px) !important;
  float: left !important;
  margin-bottom: 18px !important;
}
body.woocommerce-checkout .form-row-wide,
body.woocommerce-checkout .form-row:not(.form-row-first):not(.form-row-last) {
  clear: both !important;
  width: 100% !important;
  float: none !important;
  margin-bottom: 18px !important;
}
body.woocommerce-checkout .form-row::after {
  content: '' !important;
  display: table !important;
  clear: both !important;
}

/* ---------- ADDITIONAL INFORMATION card ---------- */
body.woocommerce-checkout form.checkout > .woocommerce-additional-fields {
  background: #FAF8F2 !important;
  border: 1px solid #E8E1D0 !important;
  border-radius: 14px !important;
  padding: 36px !important;
}

/* ---------- YOUR ORDER card (heading + table + payment + place order) ---------- */
body.woocommerce-checkout form.checkout > h3#order_review_heading {
  background: #FAF8F2 !important;
  border: 1px solid #E8E1D0 !important;
  border-bottom: none !important;
  border-radius: 14px 14px 0 0 !important;
  margin: 0 !important;
  padding: 36px 36px 8px !important;
  font-family: 'Cormorant Garamond', serif !important;
  font-size: 36px !important;
  font-weight: 300 !important;
  color: #1A2A22 !important;
  letter-spacing: 0 !important;
}

body.woocommerce-checkout form.checkout > #order_review {
  background: #FAF8F2 !important;
  border: 1px solid #E8E1D0 !important;
  border-top: none !important;
  border-radius: 0 0 14px 14px !important;
  margin: 0 0 24px !important;
  padding: 0 36px 36px !important;
}

/* Strip the inner table chrome to live cleanly inside the card */
body.woocommerce-checkout #order_review table.shop_table {
  background: transparent !important;
  border: none !important;
  border-radius: 0 !important;
  margin: 0 !important;
  width: 100% !important;
}
body.woocommerce-checkout #order_review table.shop_table th,
body.woocommerce-checkout #order_review table.shop_table td {
  background: transparent !important;
  border-top: 1px solid #ECE5D5 !important;
  padding: 14px 0 !important;
}
body.woocommerce-checkout #order_review table.shop_table tr:first-child th,
body.woocommerce-checkout #order_review table.shop_table tr:first-child td {
  border-top: none !important;
}

body.woocommerce-checkout #order_review .product-name {
  font-family: 'Cormorant Garamond', serif !important;
  font-size: 20px !important;
  font-weight: 400 !important;
  color: #1A2A22 !important;
}
body.woocommerce-checkout #order_review .product-total,
body.woocommerce-checkout #order_review .product-quantity {
  font-family: 'Outfit', system-ui, sans-serif !important;
  font-size: 16px !important;
  color: #1A2A22 !important;
}
body.woocommerce-checkout #order_review tfoot th {
  font-family: 'DM Mono', monospace !important;
  font-size:12px !important;
  letter-spacing: 2.4px !important;
  text-transform: uppercase !important;
  color: #3D7A5A !important;
  font-weight: 500 !important;
  text-align: left !important;
}
body.woocommerce-checkout #order_review tfoot td {
  font-family: 'Outfit', system-ui, sans-serif !important;
  font-size: 16px !important;
  color: #1A2A22 !important;
  text-align: right !important;
}
body.woocommerce-checkout #order_review .order-total th,
body.woocommerce-checkout #order_review .order-total td {
  border-top: 2px solid #2D4A3E !important;
  padding-top: 20px !important;
}
body.woocommerce-checkout #order_review .order-total td,
body.woocommerce-checkout #order_review .order-total td .amount {
  font-family: 'Cormorant Garamond', serif !important;
  font-size: 28px !important;
  font-weight: 400 !important;
  color: #2D4A3E !important;
}

/* ---------- PAYMENT methods inside order review ---------- */
body.woocommerce-checkout #payment {
  background: transparent !important;
  margin: 28px 0 0 !important;
  padding: 0 !important;
}
body.woocommerce-checkout #payment ul.payment_methods {
  background: transparent !important;
  border: 1px solid #E8E1D0 !important;
  border-radius: 10px !important;
  padding: 18px 22px !important;
  margin: 0 0 22px !important;
  list-style: none !important;
}
body.woocommerce-checkout #payment ul.payment_methods li {
  background: transparent !important;
  border-bottom: 1px dashed #ECE5D5 !important;
  padding: 14px 0 !important;
  margin: 0 !important;
  list-style: none !important;
}
body.woocommerce-checkout #payment ul.payment_methods li:last-child {
  border-bottom: none !important;
  padding-bottom: 0 !important;
}
body.woocommerce-checkout #payment ul.payment_methods li input[type="radio"] {
  accent-color: #3D7A5A !important;
  margin-right: 10px !important;
  vertical-align: middle !important;
  width: 16px !important;
  height: 16px !important;
}
body.woocommerce-checkout #payment ul.payment_methods li label {
  font-family: 'Cormorant Garamond', serif !important;
  font-size: 22px !important;
  font-weight: 400 !important;
  color: #1A2A22 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  cursor: pointer !important;
}
body.woocommerce-checkout #payment ul.payment_methods li .payment_box {
  background: rgba(61, 122, 90, 0.06) !important;
  border-radius: 8px !important;
  padding: 18px !important;
  margin: 12px 0 0 !important;
  color: #3A4940 !important;
  font-family: 'Outfit', system-ui, sans-serif !important;
  font-size: 14.5px !important;
  line-height: 1.65 !important;
}
body.woocommerce-checkout #payment ul.payment_methods li .payment_box::before {
  display: none !important;
}

/* ---------- TERMS + Place Order ---------- */
body.woocommerce-checkout .woocommerce-terms-and-conditions-wrapper {
  background: rgba(61, 122, 90, 0.06) !important;
  border: 1px solid rgba(61, 122, 90, 0.18) !important;
  border-radius: 8px !important;
  padding: 14px 18px !important;
  margin: 18px 0 !important;
  font-size: 13.5px !important;
  color: #3A4940 !important;
}

body.woocommerce-checkout #payment .place-order {
  border: none !important;
  background: transparent !important;
  padding: 12px 0 0 !important;
  margin: 0 !important;
}

body.woocommerce-checkout #place_order {
  display: block !important;
  width: 100% !important;
  background: #1A2A22 !important;
  color: #F5F3EE !important;
  border: 1px solid #1A2A22 !important;
  border-radius: 999px !important;
  padding: 20px 28px !important;
  font-family: 'DM Mono', monospace !important;
  font-size: 13px !important;
  letter-spacing: 2.8px !important;
  text-transform: uppercase !important;
  font-weight: 500 !important;
  text-shadow: none !important;
  box-shadow: none !important;
  margin: 8px 0 0 !important;
}
body.woocommerce-checkout #place_order:hover {
  background: #2D4A3E !important;
  border-color: #2D4A3E !important;
  color: #F5F3EE !important;
  transform: translateY(-1px) !important;
}

/* ---------- v61.1: roomier padding for full-shell width ---------- */
body.woocommerce-checkout #customer_details .woocommerce-billing-fields,
body.woocommerce-checkout #customer_details .woocommerce-shipping-fields,
body.woocommerce-checkout form.checkout > .woocommerce-additional-fields {
  padding: 48px 56px !important;
}
body.woocommerce-checkout form.checkout > h3#order_review_heading {
  padding: 48px 56px 12px !important;
}
body.woocommerce-checkout form.checkout > #order_review {
  padding: 0 56px 48px !important;
}

/* Spread the name pair across more of the wider card */
body.woocommerce-checkout .form-row-first,
body.woocommerce-checkout .form-row-last {
  width: calc(50% - 12px) !important;
  margin-right: 24px !important;
}
body.woocommerce-checkout .form-row-last {
  margin-right: 0 !important;
}

/* ---------- Mobile: tighten padding ---------- */
@media (max-width: 720px) {
  body.woocommerce-checkout #customer_details .woocommerce-billing-fields,
  body.woocommerce-checkout #customer_details .woocommerce-shipping-fields,
  body.woocommerce-checkout form.checkout > .woocommerce-additional-fields,
  body.woocommerce-checkout form.checkout > #order_review {
    padding: 24px 22px !important;
  }
  body.woocommerce-checkout form.checkout > h3#order_review_heading {
    padding: 24px 22px 8px !important;
    font-size: 28px !important;
  }
  body.woocommerce-checkout .form-row-first,
  body.woocommerce-checkout .form-row-last {
    width: 100% !important;
    float: none !important;
    margin-right: 0 !important;
  }
  body.woocommerce-checkout #customer_details .woocommerce-billing-fields > h3,
  body.woocommerce-checkout #customer_details .woocommerce-shipping-fields > h3,
  body.woocommerce-checkout form.checkout > .woocommerce-additional-fields > h3 {
    font-size: 28px !important;
  }
}

/* ============================================================
   v62 — Order-received polish + product thumbnail handling
   ============================================================ */

/* "Thank you. Your order has been received." — brand callout, not pill */
body.woocommerce-order-received .woocommerce-thankyou-order-received,
body.woocommerce-checkout .woocommerce-thankyou-order-received,
body.dosis-wc-skin .woocommerce-thankyou-order-received {
  background: rgba(61, 122, 90, 0.06) !important;
  border: 1px solid rgba(61, 122, 90, 0.22) !important;
  border-radius: 14px !important;
  padding: 28px 36px !important;
  font-family: 'Cormorant Garamond', serif !important;
  font-size: 26px !important;
  font-weight: 300 !important;
  font-style: normal !important;
  color: #2D4A3E !important;
  letter-spacing: 0 !important;
  text-align: left !important;
  margin: 0 0 32px !important;
  line-height: 1.3 !important;
  display: flex !important;
  align-items: center !important;
  gap: 18px !important;
}
body.woocommerce-order-received .woocommerce-thankyou-order-received::before,
body.dosis-wc-skin .woocommerce-thankyou-order-received::before {
  content: '' !important;
  display: inline-block !important;
  width: 14px !important;
  height: 14px !important;
  border-radius: 50% !important;
  background: #3D7A5A !important;
  flex-shrink: 0 !important;
}

/* The order-overview row of tiles — even spacing on wide layouts */
body.woocommerce-order-received .woocommerce-order-overview {
  background: #FAF8F2 !important;
  border: 1px solid #E8E1D0 !important;
  border-radius: 14px !important;
  padding: 28px 36px !important;
  margin: 0 0 32px !important;
  list-style: none !important;
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)) !important;
  gap: 28px !important;
}

/* Product thumbnail polish — show real image when set, hide WC placeholder */
body.woocommerce-cart .product-thumbnail img,
body.woocommerce-checkout .product-thumbnail img {
  width: 64px !important;
  height: 64px !important;
  object-fit: cover !important;
  border-radius: 10px !important;
  border: 1px solid #ECE5D5 !important;
  background: #FAF8F2 !important;
}
/* If WC defaults to its grey placeholder, fade it out so it doesn't look broken */
body.woocommerce-cart .product-thumbnail img[src*="woocommerce-placeholder"],
body.woocommerce-checkout .product-thumbnail img[src*="woocommerce-placeholder"] {
  filter: opacity(0) !important;
  width: 0 !important;
  height: 0 !important;
  border: none !important;
}

/* ---------- Mobile cart QC ---------- */
@media (max-width: 720px) {
  /* Cart: stack the cart-table cells vertically on mobile */
  body.woocommerce-cart table.shop_table thead { display: none !important; }
  body.woocommerce-cart table.shop_table tr {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    border-bottom: 1px solid #ECE5D5 !important;
    padding: 14px 8px !important;
  }
  body.woocommerce-cart table.shop_table td {
    border: none !important;
    padding: 4px 6px !important;
    width: auto !important;
  }
  body.woocommerce-cart table.shop_table .product-remove { order: 1; }
  body.woocommerce-cart table.shop_table .product-thumbnail { order: 2; }
  body.woocommerce-cart table.shop_table .product-name {
    order: 3;
    flex: 1 1 100% !important;
    margin-top: 8px !important;
  }
  body.woocommerce-cart table.shop_table .product-name a {
    font-size: 18px !important;
  }
  body.woocommerce-cart table.shop_table .product-price {
    order: 4;
    flex: 0 0 auto !important;
    font-family: 'DM Mono', monospace !important;
    font-size: 12px !important;
    color: #3D7A5A !important;
    margin-top: 6px !important;
  }
  body.woocommerce-cart table.shop_table .product-quantity {
    order: 5;
    margin-left: auto !important;
  }
  body.woocommerce-cart table.shop_table .product-subtotal {
    order: 6;
    flex: 1 1 100% !important;
    text-align: right !important;
    font-family: 'Cormorant Garamond', serif !important;
    font-size: 20px !important;
    color: #1A2A22 !important;
    margin-top: 8px !important;
  }

  /* Tighter cart-totals card on mobile */
  body.woocommerce-cart .cart_totals {
    padding: 22px 18px !important;
  }
  body.woocommerce-cart .cart_totals h2 {
    font-size: 26px !important;
  }
  body.woocommerce-cart .wc-proceed-to-checkout .checkout-button {
    padding: 16px 22px !important;
    font-size:12px !important;
    letter-spacing: 1.8px !important;
  }

  /* Cart hero band — shorter on mobile */
  body.woocommerce-cart .wc-hero {
    padding: 96px 22px 16px !important;
  }
  body.woocommerce-cart .wc-hero h1,
  body.woocommerce-checkout .wc-hero h1,
  body.woocommerce-order-received .wc-hero h1 {
    font-size: clamp(40px, 9vw, 56px) !important;
  }
  body.woocommerce-cart .wc-hero p.lead,
  body.woocommerce-checkout .wc-hero p.lead {
    font-size: 15px !important;
  }

  /* Order received overview — single column on small screens */
  body.woocommerce-order-received .woocommerce-order-overview {
    grid-template-columns: 1fr !important;
    gap: 14px !important;
  }
  body.woocommerce-order-received .woocommerce-thankyou-order-received {
    font-size: 20px !important;
    padding: 20px 22px !important;
  }
}