/* Hide Express Checkout block on checkout page */
.wc-block-components-express-payment,
.wc-block-components-express-payment--checkout,
.wp-block-woocommerce-checkout-express-payment-block {
    display: none !important;
}

/* === Checkout page: hide redundant Blocks checkout below classic checkout === */
body.page-id-192 .wp-block-woocommerce-checkout.wc-block-checkout.wc-block-checkout,
body.woocommerce-checkout .wp-block-woocommerce-checkout.wc-block-checkout.wc-block-checkout {
    display: none !important;
}


/* Widen the WooCommerce wrapper so checkout can use full page width */
body.page-id-192 .woocommerce,
body.page-id-192.is-layout-constrained .woocommerce,
body.page-id-192 .is-layout-constrained > .woocommerce {
    max-width: 1100px !important;
    width: 100% !important;
    margin-left: auto;
    margin-right: auto;
}

/* Also make the form itself and customer details use full width */
body.page-id-192 form.checkout.woocommerce-checkout,
body.page-id-192 #customer_details {
    max-width: 1100px !important;
    width: 100% !important;
}

/* === Checkout page: two-column layout for Billing + Shipping, full width Order Review === */

/* Reusable white-box styling */
.woocommerce-checkout #customer_details .col-1,
.woocommerce-checkout #customer_details .col-2,
.woocommerce-checkout #order_review {
    background: #ffffff;
    border-radius: 8px;
    padding: 28px;
    box-sizing: border-box;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06);
    border: 1px solid rgba(0, 0, 0, 0.06);
    margin: 0;
}

/* Two-column row for Billing Details + Shipping */
.woocommerce-checkout #customer_details {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
    margin-bottom: 20px;
    width: 100%;
    max-width: none;
}

.woocommerce-checkout #customer_details .col-1 {
    width: auto !important;
    float: none !important;
    min-width: 0;
    grid-column: 1 !important;
    grid-row: 1 !important;
}
.woocommerce-checkout #customer_details .col-2 {
    width: auto !important;
    float: none !important;
    min-width: 0;
    grid-column: 2 !important;
    grid-row: 1 !important;
}

/* Full-width Order Review (contains order table + payment + place order button) */
.woocommerce-checkout #order_review_heading {
    margin-top: 10px;
    margin-bottom: 10px;
}

.woocommerce-checkout #order_review {
    width: 100%;
    max-width: none;
    float: none;
}

/* Payment section inside order review — no extra box styling (avoids box-in-box) */
.woocommerce-checkout #order_review #payment {
    background: transparent;
    border: none;
    box-shadow: none;
    padding: 0;
    margin-top: 16px;
}

/* Stack to single column on narrow screens */
@media (max-width: 768px) {
    .woocommerce-checkout #customer_details {
        grid-template-columns: 1fr;
    }
  /* Stack billing + order notes on mobile (override hard-coded grid-column on children) */
  .woocommerce-checkout #customer_details .col-1,
  .woocommerce-checkout #customer_details .col-2 {
    grid-column: 1 / -1 !important;
    grid-area: auto !important;
    grid-row: auto !important;
  }
}


/* Fix: Hide the entire shipping address block (including the stray State/County field) when the 'Ship to a different address?' checkbox is NOT checked. The Themehigh plugin hides individual shipping fields but leaves the shipping_address container and state dropdown visible. Using :has() to react to the checkbox state. */
body.page-id-192 form.checkout:has(#ship-to-different-address-checkbox:not(:checked)) div.shipping_address { display: none !important; }


/* === Cart page fixes (page-id-191 / .woocommerce-cart) === */

body.woocommerce-cart .woocommerce { max-width: 1100px !important; width: 100% !important; margin-left: auto; margin-right: auto; }

/* 1. Align Apply Coupon and Update Cart on the same row.
   Need higher specificity than the theme rule which sets display:flex on .actions.
   Setting back to table-cell so the colspan=6 full-width works; then layout children with floats. */
body.woocommerce-cart .woocommerce-cart-form td.actions {
  display: table-cell !important;
  background: transparent !important;
  padding: 16px 20px !important;
  text-align: left !important;
  border-top: 1px solid rgba(0,0,0,0.06) !important;
}
body.woocommerce-cart .woocommerce-cart-form td.actions::after {
  content: " ";
  display: table;
  clear: both;
}
body.woocommerce-cart .woocommerce-cart-form td.actions .coupon {
  display: inline-block !important;
  float: left !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  vertical-align: middle;
}
body.woocommerce-cart .woocommerce-cart-form td.actions .coupon #coupon_code { margin: 0 8px 0 0 !important; vertical-align: middle; }
body.woocommerce-cart .woocommerce-cart-form td.actions .coupon button[name="apply_coupon"] { vertical-align: middle; }
body.woocommerce-cart .woocommerce-cart-form td.actions button[name="update_cart"] {
  float: right !important;
  margin: 0 !important;
  vertical-align: middle;
}

/* 2. Proceed to Checkout button: shrink to sensible size */
body.woocommerce-cart .wc-proceed-to-checkout { padding: 0 !important; }
body.woocommerce-cart .wc-proceed-to-checkout a.checkout-button {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
  padding: 12px 28px !important;
  font-size: 16px !important;
  line-height: 1.2 !important;
  font-weight: 600 !important;
  border-radius: var(--ehrx-radius-pill) !important;
  text-align: center !important;
  margin: 0 0 12px 0 !important;
}

/* 3. Amazon Pay separator + button: match container */
body.woocommerce-cart .wc-proceed-to-checkout .wc-apa-button-separator {
  text-align: center !important;
  margin: 12px 0 !important;
  color: #777 !important;
  font-size: 14px !important;
}
body.woocommerce-cart .wc-proceed-to-checkout [class*="amazonpay-merchant-shadow-root"] {
  display: block !important;
  margin: 0 auto !important;
  max-width: 100% !important;
  width: 100% !important;
  box-sizing: border-box !important;
}

/* Cart Totals white-box styling */
body.woocommerce-cart .cart_totals {
  background: #ffffff;
  border-radius: 8px;
  padding: 28px;
  box-shadow: 0 1px 3px rgba(0,0,0,0.06);
  border: 1px solid rgba(0,0,0,0.06);
}