/**
 * SuperSquare Storefront — Cart & Checkout Styles
 *
 * Implements 2-column commercial cart UI, sticky totals summary,
 * 2-column modern checkout UI, and native WooCommerce payment method styling.
 *
 * @package SuperSquare_Storefront
 */

.ssq-wc-portal-page {
  padding: 2rem 0 4rem 0;
}

/* ==========================================================================
   Dedicated Cart UI
   ========================================================================== */
.woocommerce-cart .woocommerce {
  display: grid;
  grid-template-columns: 1fr 380px;
  gap: 2.5rem;
  align-items: flex-start;
}

.woocommerce-cart table.shop_table {
  width: 100%;
  border-collapse: collapse;
  background-color: #ffffff;
  border: 1px solid var(--ssq-border, #e2e8f0);
  border-radius: var(--ssq-radius-lg, 12px);
  overflow: hidden;
}

.woocommerce-cart table.shop_table th {
  background-color: var(--ssq-surface-subtle, #f8fafc);
  color: var(--ssq-text-main, #0f172a);
  font-size: 0.75rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  padding: 0.875rem 1rem;
  border-bottom: 1px solid var(--ssq-border, #e2e8f0);
  text-align: left;
}

.woocommerce-cart table.shop_table td {
  padding: 1.25rem 1rem;
  border-bottom: 1px solid var(--ssq-border, #e2e8f0);
  color: var(--ssq-text-main, #0f172a);
  vertical-align: middle;
}

.woocommerce-cart .product-thumbnail img {
  width: 64px;
  height: 64px;
  object-fit: cover;
  border-radius: 6px;
  border: 1px solid var(--ssq-border, #e2e8f0);
}

.woocommerce-cart .product-name a {
  font-size: 0.9375rem;
  font-weight: 600;
  color: var(--ssq-text-main, #0f172a);
}

.woocommerce-cart .product-name a:hover {
  color: var(--ssq-accent, #2563eb);
}

.woocommerce-cart .product-price,
.woocommerce-cart .product-subtotal {
  font-weight: 700;
  font-size: 0.9375rem;
}

.woocommerce-cart .product-remove a.remove {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  border-radius: 9999px;
  color: #ef4444;
  background-color: #fef2f2;
  font-size: 1.125rem;
  text-decoration: none;
  transition: all var(--ssq-transition-fast, 0.15s ease);
}

.woocommerce-cart .product-remove a.remove:hover {
  background-color: #ef4444;
  color: #ffffff;
}

/* Coupon & Update Cart Actions */
.woocommerce-cart td.actions {
  background-color: var(--ssq-surface-subtle, #f8fafc);
  padding: 1rem;
}

.woocommerce-cart .coupon {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  float: left;
}

.woocommerce-cart .coupon input[type="text"] {
  width: 180px;
  height: 40px;
}

.woocommerce-cart button[name="update_cart"],
.woocommerce-cart .coupon button {
  height: 40px;
  padding: 0 1.25rem;
  font-size: 0.8125rem;
  font-weight: 700;
  border-radius: 6px;
  cursor: pointer;
}

/* Cart Collaterals & Totals Card */
.cart-collaterals {
  position: sticky;
  top: 90px;
}

.cart_totals {
  background-color: #ffffff;
  border: 1px solid var(--ssq-border, #e2e8f0);
  border-radius: var(--ssq-radius-lg, 12px);
  padding: 1.5rem;
  box-shadow: 0 4px 12px rgba(15, 23, 42, 0.05);
}

.cart_totals h2 {
  font-size: 1.125rem;
  font-weight: 800;
  color: var(--ssq-text-main, #0f172a);
  margin-bottom: 1rem;
  padding-bottom: 0.75rem;
  border-bottom: 1px solid var(--ssq-border, #e2e8f0);
}

.cart_totals table.shop_table {
  width: 100%;
  border-collapse: collapse;
  margin-bottom: 1.5rem;
  border: none;
}

.cart_totals table.shop_table th {
  font-size: 0.8125rem;
  color: var(--ssq-text-secondary, #475569);
  padding: 0.625rem 0;
  border-bottom: 1px solid var(--ssq-border-subtle, #f1f5f9);
  font-weight: 600;
}

.cart_totals table.shop_table td {
  text-align: right;
  padding: 0.625rem 0;
  border-bottom: 1px solid var(--ssq-border-subtle, #f1f5f9);
  font-weight: 700;
  color: var(--ssq-text-main, #0f172a);
}

.cart_totals .order-total td {
  font-size: 1.25rem;
  color: var(--ssq-accent, #2563eb);
}

.wc-proceed-to-checkout a.checkout-button {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  padding: 0.875rem 1.5rem;
  background-color: var(--ssq-accent, #2563eb);
  color: #ffffff !important;
  font-size: 0.9375rem;
  font-weight: 700;
  border-radius: 8px;
  text-decoration: none;
  transition: all var(--ssq-transition-fast, 0.15s ease);
}

.wc-proceed-to-checkout a.checkout-button:hover {
  background-color: var(--ssq-accent-hover, #1d4ed8);
  transform: translateY(-1px);
}

/* ==========================================================================
   Dedicated Checkout UI
   ========================================================================== */
.woocommerce-checkout form.checkout {
  display: grid;
  grid-template-columns: 1fr 420px;
  gap: 2.5rem;
  align-items: flex-start;
}

.woocommerce-billing-fields,
.woocommerce-shipping-fields,
.woocommerce-additional-fields {
  background-color: #ffffff;
  border: 1px solid var(--ssq-border, #e2e8f0);
  border-radius: var(--ssq-radius-lg, 12px);
  padding: 1.75rem;
  margin-bottom: 1.5rem;
}

.woocommerce-billing-fields h3,
.woocommerce-shipping-fields h3,
.woocommerce-additional-fields h3,
#order_review_heading {
  font-size: 1.125rem;
  font-weight: 800;
  color: var(--ssq-text-main, #0f172a);
  margin-bottom: 1.25rem;
  padding-bottom: 0.5rem;
  border-bottom: 1px solid var(--ssq-border, #e2e8f0);
}

.woocommerce-checkout .form-row {
  margin-bottom: 1rem;
}

.woocommerce-checkout .form-row label {
  display: block;
  font-size: 0.8125rem;
  font-weight: 600;
  color: var(--ssq-text-main, #0f172a);
  margin-bottom: 0.375rem;
}

.woocommerce-checkout input[type="text"],
.woocommerce-checkout input[type="email"],
.woocommerce-checkout input[type="tel"],
.woocommerce-checkout textarea,
.woocommerce-checkout select {
  width: 100%;
}

/* Order Review Card */
#order_review {
  background-color: #ffffff;
  border: 1px solid var(--ssq-border, #e2e8f0);
  border-radius: var(--ssq-radius-lg, 12px);
  padding: 1.75rem;
  box-shadow: 0 4px 16px rgba(15, 23, 42, 0.05);
  position: sticky;
  top: 90px;
}

#order_review table.shop_table {
  width: 100%;
  border-collapse: collapse;
  margin-bottom: 1.5rem;
}

#order_review table.shop_table th {
  font-size: 0.75rem;
  font-weight: 700;
  text-transform: uppercase;
  color: var(--ssq-text-muted, #64748b);
  padding: 0.625rem 0;
  border-bottom: 1px solid var(--ssq-border, #e2e8f0);
}

#order_review table.shop_table td {
  padding: 0.75rem 0;
  border-bottom: 1px solid var(--ssq-border-subtle, #f1f5f9);
  font-size: 0.875rem;
}

#order_review .order-total td {
  font-size: 1.25rem;
  font-weight: 900;
  color: var(--ssq-accent, #2563eb);
}

/* Payment Methods */
#payment {
  background-color: var(--ssq-surface-subtle, #f8fafc);
  border-radius: 8px;
  padding: 1rem;
  margin-bottom: 1.5rem;
}

#payment ul.payment_methods {
  list-style: none;
  margin: 0;
  padding: 0;
}

#payment ul.payment_methods li {
  margin-bottom: 0.75rem;
  font-size: 0.875rem;
}

#payment .payment_box {
  background-color: #ffffff;
  border: 1px solid var(--ssq-border, #e2e8f0);
  border-radius: 6px;
  padding: 0.75rem;
  margin-top: 0.5rem;
  font-size: 0.8125rem;
  color: var(--ssq-text-secondary, #475569);
}

#place_order {
  width: 100%;
  padding: 0.9375rem 1.5rem;
  background-color: #10b981;
  color: #ffffff !important;
  font-size: 1rem;
  font-weight: 800;
  border: none;
  border-radius: 8px;
  cursor: pointer;
  box-shadow: 0 4px 12px rgba(16, 185, 129, 0.25);
  transition: all var(--ssq-transition-fast, 0.15s ease);
}

#place_order:hover {
  background-color: #059669;
  transform: translateY(-1px);
}

/* ==========================================================================
   Responsive Adaptations for Cart & Checkout
   ========================================================================== */
@media (max-width: 991px) {
  .woocommerce-cart .woocommerce,
  .woocommerce-checkout form.checkout {
    grid-template-columns: 1fr;
    gap: 2rem;
  }

  .cart-collaterals,
  #order_review {
    position: static;
  }
}

/* Premium cart and checkout experience */
body.woocommerce-cart,body.woocommerce-checkout { background:#f6f8fc; }
.woocommerce-cart .site-main,.woocommerce-checkout .site-main { padding-block:clamp(1.5rem,4vw,4rem); }
.woocommerce-cart .entry-title,.woocommerce-checkout .entry-title { margin-bottom:clamp(1.25rem,3vw,2rem); color:#0f172a; font-size:clamp(1.7rem,4vw,2.65rem); font-weight:850; letter-spacing:-.045em; }
.woocommerce-cart .woocommerce,.woocommerce-checkout .woocommerce { max-width:1240px; margin-inline:auto; }
.woocommerce-cart .woocommerce { grid-template-columns:minmax(0,1fr) minmax(320px,390px); gap:clamp(1.25rem,3vw,2.5rem); }
.woocommerce-cart table.shop_table { border:0; border-radius:22px; box-shadow:0 18px 55px rgba(15,23,42,.08); }
.woocommerce-cart table.shop_table th { padding:1rem 1.25rem; color:#64748b; background:#f8fafc; border-color:#edf1f6; }
.woocommerce-cart table.shop_table td { padding:1.35rem 1.25rem; border-color:#edf1f6; }
.woocommerce-cart .product-thumbnail { width:104px; }
.woocommerce-cart .product-thumbnail img { width:82px; height:82px; border:0; border-radius:15px; background:#f8fafc; box-shadow:0 5px 16px rgba(15,23,42,.08); }
.woocommerce-cart .product-name a { color:#0f172a; font-size:.95rem; font-weight:750; line-height:1.45; }
.woocommerce-cart .product-name dl.variation { margin:.4rem 0 0; color:#64748b; font-size:.75rem; }
.woocommerce-cart .product-price { color:#64748b; }
.woocommerce-cart .product-subtotal { color:#0f172a; font-size:1rem; }
.woocommerce-cart .product-remove a.remove { width:34px; height:34px; font-size:1.25rem; background:#fff1f2; }
.woocommerce-cart .quantity,.ssq-quantity-control { display:inline-flex; align-items:center; min-height:40px; overflow:hidden; border:1px solid #dbe2ec; border-radius:11px; background:#fff; }
.woocommerce-cart .quantity .qty { width:46px!important; min-height:38px; padding:0; text-align:center; border:0!important; box-shadow:none!important; appearance:textfield; }
.woocommerce-cart .quantity .qty::-webkit-inner-spin-button,.woocommerce-cart .quantity .qty::-webkit-outer-spin-button { margin:0; appearance:none; }
.ssq-qty-button { display:grid; width:38px; height:38px; padding:0; place-items:center; color:#334155; font:700 1.1rem/1 sans-serif; border:0; background:#f8fafc; cursor:pointer; }
.ssq-qty-button:hover { color:#1d4ed8; background:#eff6ff; }
.ssq-qty-button:focus-visible { position:relative; outline:3px solid rgba(37,99,235,.22); outline-offset:-3px; }
.woocommerce-cart td.actions { padding:1.25rem; background:#f8fafc; }
.woocommerce-cart .coupon { padding:.4rem; border:1px dashed #cbd5e1; border-radius:13px; background:#fff; }
.woocommerce-cart .coupon input[type="text"] { min-width:190px; height:42px; padding:0 .8rem; border:0; box-shadow:none; }
.woocommerce-cart button[name="update_cart"],.woocommerce-cart .coupon button { min-height:42px; border:0; border-radius:9px; }
.cart-collaterals { top:104px; }
.cart_totals { padding:clamp(1.25rem,3vw,1.75rem); border:0; border-radius:22px; box-shadow:0 18px 55px rgba(15,23,42,.1); }
.cart_totals h2 { margin:-.1rem 0 1rem; padding-bottom:1rem; font-size:1.2rem; letter-spacing:-.02em; }
.cart_totals table.shop_table { box-shadow:none; }
.cart_totals table.shop_table th,.cart_totals table.shop_table td { padding:.8rem 0; background:transparent; }
.cart_totals .order-total th,.cart_totals .order-total td { padding-top:1.1rem; color:#0f172a; font-size:1.15rem; border-top:1px solid #dfe5ed; }
.wc-proceed-to-checkout a.checkout-button { min-height:54px; margin:0; border-radius:13px; box-shadow:0 10px 24px rgba(37,99,235,.24); }
.wc-proceed-to-checkout a.checkout-button::after { content:"  →"; margin-left:.45rem; }
.woocommerce-shipping-calculator { padding:.85rem; border-radius:12px; background:#f8fafc; }
.woocommerce-cart .cart-empty.woocommerce-info,.woocommerce-cart .wc-empty-cart-message + .return-to-shop { max-width:620px; margin-inline:auto; text-align:center; }
.woocommerce-cart .cart-empty.woocommerce-info { padding:3.5rem 1.5rem 1.25rem; color:#334155; font-size:1.1rem; font-weight:750; border:1px dashed #cbd5e1; border-radius:22px 22px 0 0; background:#fff; }
.woocommerce-cart .return-to-shop { padding:0 1.5rem 3rem; border:1px dashed #cbd5e1; border-top:0; border-radius:0 0 22px 22px; background:#fff; }

.woocommerce-checkout form.checkout { grid-template-columns:minmax(0,1fr) minmax(350px,430px); gap:clamp(1.25rem,3vw,2.5rem); }
.woocommerce-checkout #customer_details { min-width:0; }
.woocommerce-billing-fields,.woocommerce-shipping-fields,.woocommerce-additional-fields { position:relative; padding:clamp(1.25rem,3vw,2rem); border:0; border-radius:22px; box-shadow:0 15px 45px rgba(15,23,42,.075); }
.woocommerce-billing-fields::before,.woocommerce-shipping-fields::before,.woocommerce-additional-fields::before { display:grid; position:absolute; top:1.7rem; right:1.7rem; width:34px; height:34px; place-items:center; color:#1d4ed8; font-weight:850; border-radius:10px; background:#eff6ff; }
.woocommerce-billing-fields::before { content:"1"; }.woocommerce-shipping-fields::before { content:"2"; }.woocommerce-additional-fields::before { content:"3"; }
.woocommerce-billing-fields h3,.woocommerce-shipping-fields h3,.woocommerce-additional-fields h3,#order_review_heading { padding-right:3rem; padding-bottom:1rem; font-size:1.2rem; letter-spacing:-.02em; border-color:#e8edf4; }
.woocommerce-checkout .form-row { margin-bottom:1.05rem; }
.woocommerce-checkout .form-row label { margin-bottom:.45rem; color:#334155; font-size:.76rem; font-weight:750; }
.woocommerce-checkout .form-row .required { color:#dc2626; }
.woocommerce-checkout input[type="text"],.woocommerce-checkout input[type="email"],.woocommerce-checkout input[type="tel"],.woocommerce-checkout input[type="password"],.woocommerce-checkout textarea,.woocommerce-checkout select,.woocommerce-checkout .select2-container .select2-selection--single { min-height:50px; padding:.78rem .9rem; color:#0f172a; border:1px solid #cbd5e1; border-radius:12px; background:#fff; transition:border-color .2s,box-shadow .2s; }
.woocommerce-checkout .select2-container .select2-selection--single { padding:.62rem .9rem; }
.woocommerce-checkout .select2-selection__rendered { line-height:24px!important; padding-left:0!important; }
.woocommerce-checkout .select2-selection__arrow { top:12px!important; right:10px!important; }
.woocommerce-checkout input:focus,.woocommerce-checkout textarea:focus,.woocommerce-checkout select:focus,.woocommerce-checkout .select2-container--focus .select2-selection { outline:0; border-color:#2563eb; box-shadow:0 0 0 4px rgba(37,99,235,.12); }
.woocommerce-checkout .woocommerce-invalid input.input-text,.woocommerce-checkout .woocommerce-invalid .select2-selection { border-color:#dc2626; box-shadow:0 0 0 3px rgba(220,38,38,.1); }
.woocommerce-checkout .woocommerce-validated input.input-text,.woocommerce-checkout .woocommerce-validated .select2-selection { border-color:#10b981; }
#order_review_heading { z-index:1; grid-column:2; grid-row:1; align-self:start; margin:0; padding:1.4rem 1.75rem 0; border:0; border-radius:22px 22px 0 0; background:#fff; box-shadow:0 18px 55px rgba(15,23,42,.09); }
#order_review { grid-column:2; grid-row:1; top:104px; margin:0; padding:4.4rem 1.75rem 1.75rem; border:0; border-radius:22px; box-shadow:0 18px 55px rgba(15,23,42,.09); }
#order_review table.shop_table th,#order_review table.shop_table td { padding:.85rem 0; border-color:#e8edf4; }
#order_review .product-name { padding-right:1rem; color:#334155; }
#order_review .order-total th,#order_review .order-total td { padding-top:1.15rem; color:#0f172a; font-size:1.15rem; border-top:1px solid #dbe2ec; }
#payment { margin:1rem -.5rem 0; padding:1rem; border:1px solid #e6ebf2; border-radius:16px; background:#f8fafc; }
#payment ul.payment_methods li { margin:0; padding:.8rem 0; border-bottom:1px solid #e5eaf1; }
#payment ul.payment_methods li:last-child { border-bottom:0; }
#payment label { color:#0f172a; font-weight:750; }
#payment .payment_box { padding:1rem; border:0; border-radius:12px; box-shadow:0 5px 15px rgba(15,23,42,.06); }
#place_order { min-height:56px; border-radius:13px; box-shadow:0 12px 26px rgba(5,150,105,.25); }
.ssq-checkout-trust { display:grid; grid-template-columns:repeat(3,1fr); gap:.5rem; margin-top:1rem; }
.ssq-checkout-trust span { display:grid; gap:.15rem; padding:.7rem .45rem; color:#64748b; font-size:.62rem; text-align:center; border:1px solid #e5eaf1; border-radius:10px; background:#fff; }
.ssq-checkout-trust strong { color:#334155; font-size:.68rem; }
.woocommerce-error,.woocommerce-message,.woocommerce-info { padding:1rem 1.2rem; border:0; border-left:4px solid #2563eb; border-radius:12px; box-shadow:0 8px 24px rgba(15,23,42,.07); }
.woocommerce-error { border-left-color:#dc2626; background:#fff7f7; }
.ssq-mobile-commerce-bar { display:none; }

@media (max-width:991px) { .woocommerce-cart .woocommerce,.woocommerce-checkout form.checkout { grid-template-columns:1fr; } #order_review_heading,#order_review { grid-column:1; } }
@media (max-width:767px) { body.woocommerce-cart,body.woocommerce-checkout { padding-bottom:88px; } .woocommerce-cart .entry-title,.woocommerce-checkout .entry-title { padding-inline:1rem; } .woocommerce-cart table.shop_table { display:block; background:transparent; box-shadow:none; } .woocommerce-cart table.shop_table thead { display:none; } .woocommerce-cart table.shop_table tbody { display:grid; gap:.85rem; } .woocommerce-cart table.shop_table tr.cart_item { display:grid; position:relative; grid-template-columns:78px minmax(0,1fr) auto; gap:.25rem .85rem; padding:1rem; border:1px solid #e5eaf2; border-radius:18px; background:#fff; box-shadow:0 10px 30px rgba(15,23,42,.07); } .woocommerce-cart table.shop_table td { display:block; padding:0; border:0; } .woocommerce-cart .product-remove { position:absolute; top:.75rem; right:.75rem; } .woocommerce-cart .product-thumbnail { grid-row:1/span 3; width:auto; }.woocommerce-cart .product-thumbnail::before { display:none; }.woocommerce-cart .product-thumbnail img { width:72px; height:72px; }.woocommerce-cart .product-name { grid-column:2/4; padding-right:2.5rem!important; }.woocommerce-cart .product-price { grid-column:2; font-size:.78rem; }.woocommerce-cart .product-quantity { grid-column:2; margin-top:.55rem; }.woocommerce-cart .product-subtotal { grid-column:3; grid-row:3; align-self:end; }.woocommerce-cart td::before { display:none; }.woocommerce-cart table.shop_table tr:not(.cart_item) { display:block; }.woocommerce-cart td.actions { padding:1rem; border-radius:18px; }.woocommerce-cart .coupon { display:grid; float:none; grid-template-columns:1fr auto; width:100%; box-sizing:border-box; }.woocommerce-cart .coupon input[type="text"] { width:100%; min-width:0; }.woocommerce-cart button[name="update_cart"] { width:100%; margin-top:.75rem; }.cart_totals { border-radius:18px; }.ssq-mobile-commerce-bar { display:flex; position:fixed; z-index:999; right:0; bottom:0; left:0; align-items:center; justify-content:space-between; gap:1rem; padding:.75rem max(1rem,env(safe-area-inset-left)) calc(.75rem + env(safe-area-inset-bottom)); border-top:1px solid #dbe2ec; background:rgba(255,255,255,.96); box-shadow:0 -12px 30px rgba(15,23,42,.12); backdrop-filter:blur(14px); }.ssq-mobile-commerce-total { display:grid; color:#64748b; font-size:.68rem; }.ssq-mobile-commerce-total strong { color:#0f172a; font-size:1rem; }.ssq-mobile-commerce-action { min-height:48px; padding:.7rem 1.3rem; color:#fff!important; font-size:.86rem; font-weight:800; border:0; border-radius:12px; background:#2563eb; box-shadow:0 7px 18px rgba(37,99,235,.24); }.woocommerce-checkout form.checkout { display:block; }.woocommerce-billing-fields,.woocommerce-shipping-fields,.woocommerce-additional-fields,#order_review { padding:1.2rem; border-radius:18px; }.woocommerce-billing-fields::before,.woocommerce-shipping-fields::before,.woocommerce-additional-fields::before { top:1rem; right:1rem; }.woocommerce-checkout .form-row-first,.woocommerce-checkout .form-row-last { float:none; width:100%; }.ssq-checkout-trust { grid-template-columns:1fr; }.ssq-checkout-trust span { grid-template-columns:auto 1fr; text-align:left; } }

/* WooCommerce Cart and Checkout Blocks: stable public wrappers only. */
.wp-block-woocommerce-cart,.wp-block-woocommerce-checkout { --wp--preset--color--contrast:#0f172a; color:#0f172a; }
.wp-block-woocommerce-cart .wc-block-components-sidebar,.wp-block-woocommerce-checkout .wc-block-components-sidebar { align-self:start; padding:clamp(1rem,2vw,1.5rem); border:1px solid #e5eaf2; border-radius:20px; background:#fff; box-shadow:0 16px 44px rgba(15,23,42,.08); }
.wp-block-woocommerce-cart .wc-block-cart-items,.wp-block-woocommerce-checkout .wc-block-components-checkout-step { border-color:#e5eaf2; }
.wp-block-woocommerce-cart .wc-block-components-product-name { color:#0f172a; font-weight:750; }
.wp-block-woocommerce-cart .wc-block-components-button,.wp-block-woocommerce-checkout .wc-block-components-button { min-height:52px; border-radius:12px; font-weight:800; }
.wp-block-woocommerce-checkout .wc-block-components-text-input input,.wp-block-woocommerce-checkout .wc-block-components-combobox .wc-block-components-combobox-control input { border-radius:11px; }
@media (max-width:782px) { .wp-block-woocommerce-cart .wc-block-components-sidebar,.wp-block-woocommerce-checkout .wc-block-components-sidebar { padding:1rem; border-radius:16px; box-shadow:0 10px 30px rgba(15,23,42,.07); } }
