/*
 * BlogGeek.me — WooCommerce Overrides
 * Loaded AFTER woocommerce-blocktheme.css and select2.css.
 * Uses body.woocommerce-* prefix to beat WC's .woocommerce-page selectors
 * without !important. WC uses specificity ~0-3-2; we use ~0-4-2 or higher.
 */

/* ==========================================================================
   SPACING BEFORE FOOTER
   ========================================================================== */

body.woocommerce-cart .entry-content,
body.woocommerce-checkout .entry-content {
  padding-bottom:40px;
}

/* ==========================================================================
   PAGE TITLES
   ========================================================================== */

body.woocommerce-cart .wp-block-post-title,
body.woocommerce-checkout .wp-block-post-title {
  font-size:28px;
  font-weight:700;
  letter-spacing:-0.01em;
  padding:0 24px;
}

/* ==========================================================================
   CART — TABLE
   ========================================================================== */

body.woocommerce-cart table.shop_table {
  width:100%;
  border-collapse:collapse;
  border:1px solid var(--rule);
  border-radius:var(--r);
  overflow:hidden;
  background:var(--paper);
  box-shadow:var(--shadow-sm);
  margin-bottom:32px;
}
body.woocommerce-cart table.shop_table th {
  background:var(--surface);
  font-size:13px;
  font-weight:600;
  text-transform:uppercase;
  letter-spacing:0.06em;
  color:var(--ink-2);
  padding:14px 16px;
  border-bottom:1px solid var(--rule);
  text-align:left;
}
body.woocommerce-cart table.shop_table td {
  padding:16px;
  border-bottom:1px solid var(--rule-soft);
  vertical-align:middle;
  font-size:15px;
  color:var(--ink);
}
body.woocommerce-cart table.shop_table td.product-remove a {
  color:var(--ink-3);
  font-size:20px;
  text-decoration:none;
}
body.woocommerce-cart table.shop_table td.product-remove a:hover {
  color:var(--terra);
}
body.woocommerce-cart table.shop_table td.product-name a {
  color:var(--teal);
  font-weight:600;
  text-decoration:none;
}
body.woocommerce-cart table.shop_table td.product-name a:hover {
  text-decoration:underline;
}
body.woocommerce-cart table.shop_table td.product-thumbnail img {
  width:72px;
  height:auto;
  border-radius:var(--r-sm);
  box-shadow:var(--shadow-sm);
}
body.woocommerce-cart table.shop_table input.qty {
  width:64px;
  text-align:center;
  padding:8px;
  border:1px solid var(--rule);
  border-radius:var(--r-sm);
  font-size:15px;
  font-family:var(--font);
}

/* ==========================================================================
   CART — COUPON + ACTIONS
   ========================================================================== */

body.woocommerce-cart td.actions {
  padding:16px;
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  align-items:center;
  justify-content:space-between;
}
body.woocommerce-cart .coupon {
  display:flex;
  gap:8px;
  align-items:center;
}
body.woocommerce-cart .coupon .input-text {
  padding:10px 14px;
  border:1px solid var(--rule);
  border-radius:var(--r-sm);
  font-size:14px;
  font-family:var(--font);
  min-width:180px;
}
body.woocommerce-cart .coupon .button,
body.woocommerce-cart td.actions > .button {
  background:var(--teal);
  color:var(--paper);
  border:none;
  padding:10px 20px;
  border-radius:var(--r-sm);
  font-size:14px;
  font-weight:600;
  cursor:pointer;
  font-family:var(--font);
  transition:background .15s;
}
body.woocommerce-cart .coupon .button:hover,
body.woocommerce-cart td.actions > .button:hover {
  background:var(--teal-700);
}

/* ==========================================================================
   CART — TOTALS
   ========================================================================== */

body.woocommerce-cart .cart_totals {
  max-width:420px;
  margin-left:auto;
  padding:28px;
  background:var(--surface);
  border:1px solid var(--rule);
  border-radius:var(--r);
  box-shadow:var(--shadow-sm);
}
body.woocommerce-cart .cart_totals h2 {
  font-size:20px;
  font-weight:700;
  margin:0 0 16px;
  color:var(--ink);
}
body.woocommerce-cart .cart_totals table.shop_table {
  border:none;
  box-shadow:none;
  background:transparent;
  margin-bottom:20px;
}
body.woocommerce-cart .cart_totals table.shop_table th {
  background:transparent;
  text-transform:none;
  font-size:15px;
  font-weight:600;
  color:var(--ink);
  letter-spacing:0;
  padding:10px 0;
  border-bottom:1px solid var(--rule-soft);
}
body.woocommerce-cart .cart_totals table.shop_table td {
  text-align:right;
  font-size:15px;
  padding:10px 0;
  border-bottom:1px solid var(--rule-soft);
}
body.woocommerce-cart .cart_totals tr.order-total th,
body.woocommerce-cart .cart_totals tr.order-total td {
  font-size:18px;
  font-weight:700;
  border-bottom:none;
  padding-top:14px;
}
body.woocommerce-cart .wc-proceed-to-checkout a.checkout-button {
  display:block;
  text-align:center;
  background:var(--teal);
  color:var(--paper);
  padding:14px 24px;
  border-radius:var(--r-sm);
  font-size:16px;
  font-weight:600;
  text-decoration:none;
  font-family:var(--font);
  transition:background .15s;
}
body.woocommerce-cart .wc-proceed-to-checkout a.checkout-button:hover {
  background:var(--teal-700);
}

/* ==========================================================================
   CHECKOUT — NOTICES
   ========================================================================== */

body.woocommerce-checkout .woocommerce-info {
  background:var(--teal-soft);
  border:1px solid var(--teal-100);
  border-radius:var(--r-sm);
  padding:14px 20px;
  margin-bottom:16px;
  font-size:15px;
  color:var(--ink);
}
body.woocommerce-checkout .woocommerce-info a {
  color:var(--teal);
  font-weight:600;
}

/* ==========================================================================
   CHECKOUT — TWO-COLUMN GRID
   ========================================================================== */

body.woocommerce-checkout form.checkout {
  display:grid;
  grid-template-columns:1.2fr 1fr;
  grid-template-rows:auto 1fr;
  gap:0 48px;
  align-items:start;
}
body.woocommerce-checkout #customer_details {
  grid-column:1;
  grid-row:1 / 3;
}
body.woocommerce-checkout #order_review_heading {
  grid-column:2;
  grid-row:1;
}
body.woocommerce-checkout #order_review {
  grid-column:2;
  grid-row:2;
  position:sticky;
  top:calc(var(--header-h) + 24px);
}

/* ==========================================================================
   CHECKOUT — COUPON FORM (toggle open/close via WC JS)
   ========================================================================== */

body.woocommerce-checkout .checkout_coupon {
  display:flex;
  gap:10px;
  align-items:flex-end;
  padding:16px 20px;
  margin-bottom:24px;
  border:1px solid var(--rule);
  border-radius:var(--r-sm);
  background:var(--surface);
}
body.woocommerce-checkout .checkout_coupon .form-row-first,
body.woocommerce-checkout .checkout_coupon .form-row-last {
  width:auto;
  display:block;
  margin:0;
  padding:0;
}
body.woocommerce-checkout .checkout_coupon .form-row-first {
  flex:1;
}
body.woocommerce-checkout .checkout_coupon .input-text {
  width:100%;
  padding:10px 14px;
  border:1px solid var(--rule);
  border-radius:var(--r-sm);
  font-size:14px;
  font-family:var(--font);
}
body.woocommerce-checkout .checkout_coupon .button {
  background:var(--teal);
  color:var(--paper);
  border:none;
  padding:10px 20px;
  border-radius:var(--r-sm);
  font-size:14px;
  font-weight:600;
  cursor:pointer;
  font-family:var(--font);
  white-space:nowrap;
  transition:background .15s;
}
body.woocommerce-checkout .checkout_coupon .button:hover {
  background:var(--teal-700);
}
body.woocommerce-checkout .checkout_coupon .clear {
  display:none;
}

/* ==========================================================================
   CHECKOUT — FORM FIELDS
   Beats WC's .woocommerce-page form .form-row input.input-text (0-3-2)
   by using body.woocommerce-checkout (0-4-2+)
   ========================================================================== */

body.woocommerce-checkout .woocommerce-billing-fields h3,
body.woocommerce-checkout .woocommerce-shipping-fields h3,
body.woocommerce-checkout .woocommerce-additional-fields h3 {
  font-size:22px;
  font-weight:700;
  margin:0 0 20px;
  color:var(--ink);
}

body.woocommerce-checkout .woocommerce-billing-fields__field-wrapper,
body.woocommerce-checkout .woocommerce-shipping-fields__field-wrapper {
  display:flex;
  flex-wrap:wrap;
  gap:16px 24px;
}

body.woocommerce-checkout form .form-row {
  margin-bottom:0;
  padding:0;
}

body.woocommerce-checkout form .form-row label {
  display:block;
  font-size:13px;
  font-weight:600;
  text-transform:uppercase;
  letter-spacing:0.04em;
  color:var(--ink-2);
  margin-bottom:6px;
  font-family:var(--font);
}

body.woocommerce-checkout form .form-row input.input-text,
body.woocommerce-checkout form .form-row select,
body.woocommerce-checkout form .form-row textarea {
  width:100%;
  padding:10px 14px;
  border:1px solid var(--rule);
  border-radius:var(--r-sm);
  font-size:15px;
  font-family:var(--font);
  color:var(--ink);
  background:var(--paper);
  box-sizing:border-box;
  transition:border-color .15s;
}

body.woocommerce-checkout form .form-row input.input-text:focus,
body.woocommerce-checkout form .form-row select:focus,
body.woocommerce-checkout form .form-row textarea:focus {
  outline:none;
  border-color:var(--teal);
  box-shadow:0 0 0 3px var(--teal-soft);
}

body.woocommerce-checkout form .form-row-first,
body.woocommerce-checkout form .form-row-last {
  width:calc(50% - 12px);
  flex:0 0 calc(50% - 12px);
}

body.woocommerce-checkout form .form-row-wide {
  width:100%;
  flex:0 0 100%;
}

/* ==========================================================================
   CHECKOUT — SELECT2 (country dropdown)
   Beats select2.css selectors by adding body prefix
   ========================================================================== */

body.woocommerce-checkout .select2-container--default .select2-selection--single {
  height:auto;
  padding:10px 14px;
  border:1px solid var(--rule);
  border-radius:var(--r-sm);
  background:var(--paper);
}

body.woocommerce-checkout .select2-container--default .select2-selection--single .select2-selection__rendered {
  font-family:var(--font);
  font-size:15px;
  color:var(--ink);
  line-height:1.4;
  padding:0;
}

body.woocommerce-checkout .select2-container--default .select2-selection--single .select2-selection__arrow {
  top:50%;
  transform:translateY(-50%);
  right:12px;
  height:auto;
}

body.woocommerce-checkout .select2-container--default.select2-container--focus .select2-selection--single,
body.woocommerce-checkout .select2-container--default.select2-container--open .select2-selection--single {
  border-color:var(--teal);
  box-shadow:0 0 0 3px var(--teal-soft);
  outline:none;
}

/* WC blocktheme uses .woocommerce-page form .form-row .select2-container for rendered padding */
body.woocommerce-checkout form .form-row .select2-container .select2-selection--single .select2-selection__rendered {
  padding:0;
}

/* ==========================================================================
   CHECKOUT — ORDER REVIEW
   ========================================================================== */

body.woocommerce-checkout #order_review_heading {
  font-size:22px;
  font-weight:700;
  margin:0 0 16px;
  color:var(--ink);
}

body.woocommerce-checkout #order_review {
  background:var(--surface);
  border:1px solid var(--rule);
  border-radius:var(--r);
  padding:24px;
  box-shadow:var(--shadow-sm);
}

body.woocommerce-checkout #order_review table.shop_table {
  width:100%;
  border-collapse:collapse;
  margin-bottom:16px;
}

body.woocommerce-checkout #order_review table.shop_table th {
  font-size:13px;
  font-weight:600;
  text-transform:uppercase;
  letter-spacing:0.04em;
  color:var(--ink-2);
  padding:10px 0;
  border-bottom:1px solid var(--rule);
  text-align:left;
}

body.woocommerce-checkout #order_review table.shop_table td {
  padding:10px 0;
  border-bottom:1px solid var(--rule-soft);
  font-size:15px;
  color:var(--ink);
}

body.woocommerce-checkout #order_review table.shop_table .order-total th,
body.woocommerce-checkout #order_review table.shop_table .order-total td {
  font-size:18px;
  font-weight:700;
  border-bottom:none;
  padding-top:14px;
}

/* ==========================================================================
   CHECKOUT — PAYMENT
   ========================================================================== */

body.woocommerce-checkout #payment {
  background:transparent;
  border:none;
  border-radius:0;
}

body.woocommerce-checkout #payment ul.payment_methods {
  list-style:none;
  padding:0;
  margin:0 0 20px;
}

body.woocommerce-checkout #payment ul.payment_methods li {
  padding:16px;
  border:1px solid var(--rule);
  border-radius:var(--r-sm);
  margin-bottom:8px;
  background:var(--paper);
}

body.woocommerce-checkout #payment ul.payment_methods li label {
  font-size:15px;
  font-weight:600;
  cursor:pointer;
  text-transform:none;
  letter-spacing:0;
}

body.woocommerce-checkout #payment ul.payment_methods li img {
  max-height:28px;
  width:auto;
  vertical-align:middle;
  margin-left:8px;
}

body.woocommerce-checkout #payment .payment_box {
  padding:12px 0 0;
  font-size:14px;
  color:var(--ink-2);
  line-height:1.5;
}

/* ==========================================================================
   CHECKOUT — PLACE ORDER BUTTON + TERMS
   ========================================================================== */

body.woocommerce-checkout #place_order {
  display:block;
  width:100%;
  background:var(--teal);
  color:var(--paper);
  border:none;
  padding:16px 24px;
  border-radius:var(--r-sm);
  font-size:16px;
  font-weight:700;
  cursor:pointer;
  font-family:var(--font);
  transition:background .15s;
  margin-top:16px;
}

body.woocommerce-checkout #place_order:hover {
  background:var(--teal-700);
}

body.woocommerce-checkout .woocommerce-terms-and-conditions-wrapper {
  font-size:14px;
  color:var(--ink-2);
  margin-top:12px;
}

body.woocommerce-checkout .woocommerce-terms-and-conditions-wrapper a {
  color:var(--teal);
  text-decoration:underline;
}

/* ==========================================================================
   RESPONSIVE
   ========================================================================== */

@media (max-width:768px) {
  body.woocommerce-cart table.shop_table th.product-remove,
  body.woocommerce-cart table.shop_table td.product-remove,
  body.woocommerce-cart table.shop_table th.product-thumbnail,
  body.woocommerce-cart table.shop_table td.product-thumbnail {
    display:none;
  }
  body.woocommerce-cart .cart_totals {
    max-width:none;
  }
  body.woocommerce-cart td.actions {
    flex-direction:column;
  }
  body.woocommerce-cart .coupon {
    width:100%;
  }
  body.woocommerce-cart .coupon .input-text {
    flex:1;
    min-width:0;
  }

  body.woocommerce-checkout form.checkout {
    grid-template-columns:1fr;
    grid-template-rows:auto;
    gap:32px;
  }
  body.woocommerce-checkout #customer_details,
  body.woocommerce-checkout #order_review_heading,
  body.woocommerce-checkout #order_review {
    grid-column:1;
    grid-row:auto;
    position:static;
  }
  body.woocommerce-checkout form .form-row-first,
  body.woocommerce-checkout form .form-row-last {
    width:100%;
    flex:0 0 100%;
  }
}