/* ========================================================================
   ERG — Cart + Checkout (clean sheet)
   File: 70-cart-checkout.css

   Scope:
   - Loaded only on Cart + Checkout templates (recommended)
   - Uses wrapper classes when present: .erg-cart-wrap / .erg-checkout-wrap
   - Also keys off body classes: .woocommerce-cart / .woocommerce-checkout

   Notes:
   - Fixes header nav "blue link" issue on checkout by overriding CURRENT/ACTIVE states.
   - Fixes prices ($), quantity pill sizing, thumbnail pill padding.
   - Removes Woo white table blocks inside Cart Totals + Order Review.
   ======================================================================== */


/* ------------------------------------------------------------------------
   0) Page tokens (safe defaults for cart/checkout only)
------------------------------------------------------------------------- */
body.woocommerce-cart,
body.woocommerce-checkout {
  --erg-panel: rgba(0, 0, 0, 0.38);
  --erg-text: rgba(242, 243, 245, 0.94);
  --erg-muted: rgba(242, 243, 245, 0.62);
  --erg-link: #55b4cf;
  --erg-link-hover: #7ad0e6;
  --erg-border: rgba(242, 243, 245, 0.12);
  --erg-line: rgba(242, 243, 245, 0.10);

  --erg-radius: 28px;
  --erg-radius-sm: 18px;

  --erg-cta: #3a7f93;
  --erg-cta-2: #2e6f82;
  --erg-cta-3: #255a69;
  --erg-cta-contrast: #eaf7fb;

  --erg-red: #ff5b5b;

  /* If your token file sets these, it will override. These are just fallbacks. */
  --erg-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
}


/* ------------------------------------------------------------------------
   1) Header nav — stop “Shop = blue” on checkout/cart
   (Usually caused by global link rules + current-menu-item styling)
------------------------------------------------------------------------- */
body.woocommerce-cart .elementor-location-header .elementor-nav-menu--main a.elementor-item,
body.woocommerce-checkout .elementor-location-header .elementor-nav-menu--main a.elementor-item {
  color: var(--erg-text) !important;
  text-decoration: none !important;
}

/* Kill "current" / "active" blue states */
body.woocommerce-cart .elementor-location-header .elementor-nav-menu--main a.elementor-item.elementor-item-active,
body.woocommerce-checkout .elementor-location-header .elementor-nav-menu--main a.elementor-item.elementor-item-active,
body.woocommerce-cart .elementor-location-header .elementor-nav-menu--main .current-menu-item > a,
body.woocommerce-checkout .elementor-location-header .elementor-nav-menu--main .current-menu-item > a,
body.woocommerce-cart .elementor-location-header .elementor-nav-menu--main .current_page_item > a,
body.woocommerce-checkout .elementor-location-header .elementor-nav-menu--main .current_page_item > a,
body.woocommerce-cart .elementor-location-header .elementor-nav-menu--main .current-menu-ancestor > a,
body.woocommerce-checkout .elementor-location-header .elementor-nav-menu--main .current-menu-ancestor > a {
  color: var(--erg-text) !important;
}

/* Hover can still pop a little (optional) */
body.woocommerce-cart .elementor-location-header .elementor-nav-menu--main a.elementor-item:hover,
body.woocommerce-checkout .elementor-location-header .elementor-nav-menu--main a.elementor-item:hover,
body.woocommerce-cart .elementor-location-header .elementor-nav-menu--main a.elementor-item:focus,
body.woocommerce-checkout .elementor-location-header .elementor-nav-menu--main a.elementor-item:focus {
  color: var(--erg-link-hover) !important;
}


/* ------------------------------------------------------------------------
   2) Shared: kill default Woo white blocks inside our wrappers
------------------------------------------------------------------------- */
.erg-cart-wrap,
.erg-checkout-wrap {
  color: var(--erg-text);
}

.erg-cart-wrap table,
.erg-cart-wrap th,
.erg-cart-wrap td,
.erg-checkout-wrap table,
.erg-checkout-wrap th,
.erg-checkout-wrap td {
  background: transparent !important;
}


/* ------------------------------------------------------------------------
   3) CART (Elementor Cart widget)
------------------------------------------------------------------------- */
body.woocommerce-cart .elementor-widget-woocommerce-cart,
body.woocommerce-cart .erg-cart-wrap .elementor-widget-woocommerce-cart {
  color: var(--erg-text);
}

/* Table container */
body.woocommerce-cart .elementor-widget-woocommerce-cart .woocommerce-cart-form,
body.woocommerce-cart .erg-cart-wrap .woocommerce-cart-form {
  max-width: 1200px;
  margin: 0 auto;
}

/* Shop table */
body.woocommerce-cart .elementor-widget-woocommerce-cart table.shop_table,
body.woocommerce-cart .erg-cart-wrap table.shop_table {
  border-collapse: separate;
  border-spacing: 0;
  background: transparent !important;
  border: 1px solid var(--erg-border);
  border-radius: var(--erg-radius);
  overflow: hidden;
}

/* Header row */
body.woocommerce-cart .elementor-widget-woocommerce-cart table.shop_table thead th,
body.woocommerce-cart .erg-cart-wrap table.shop_table thead th {
  color: var(--erg-link);
  font-family: var(--erg-mono);
  text-transform: uppercase;
  letter-spacing: 0.28em;
  font-weight: 700;
  font-size: 14px;
  padding: 18px 18px;
  border-bottom: 1px solid var(--erg-line);
}

/* Body cells */
body.woocommerce-cart .elementor-widget-woocommerce-cart table.shop_table tbody td,
body.woocommerce-cart .erg-cart-wrap table.shop_table tbody td {
  padding: 22px 18px;
  border-bottom: 1px solid var(--erg-line);
  vertical-align: middle;
}

/* Remove button */
body.woocommerce-cart .elementor-widget-woocommerce-cart a.remove,
body.woocommerce-cart .erg-cart-wrap a.remove {
  color: var(--erg-text) !important;
  opacity: 0.85;
  font-size: 22px;
  line-height: 1;
}
body.woocommerce-cart .elementor-widget-woocommerce-cart a.remove:hover,
body.woocommerce-cart .erg-cart-wrap a.remove:hover {
  opacity: 1;
}

/* Product name */
body.woocommerce-cart .elementor-widget-woocommerce-cart td.product-name a,
body.woocommerce-cart .erg-cart-wrap td.product-name a {
  color: var(--erg-text) !important;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  text-decoration: none;
}

/* Price + Subtotal (fix “lost $ color”) */
body.woocommerce-cart .elementor-widget-woocommerce-cart td.product-price,
body.woocommerce-cart .elementor-widget-woocommerce-cart td.product-subtotal,
body.woocommerce-cart .elementor-widget-woocommerce-cart td.product-price .woocommerce-Price-amount,
body.woocommerce-cart .elementor-widget-woocommerce-cart td.product-subtotal .woocommerce-Price-amount,
body.woocommerce-cart .elementor-widget-woocommerce-cart td.product-price .woocommerce-Price-currencySymbol,
body.woocommerce-cart .elementor-widget-woocommerce-cart td.product-subtotal .woocommerce-Price-currencySymbol,
body.woocommerce-cart .erg-cart-wrap td.product-price,
body.woocommerce-cart .erg-cart-wrap td.product-subtotal,
body.woocommerce-cart .erg-cart-wrap td.product-price .woocommerce-Price-amount,
body.woocommerce-cart .erg-cart-wrap td.product-subtotal .woocommerce-Price-amount,
body.woocommerce-cart .erg-cart-wrap td.product-price .woocommerce-Price-currencySymbol,
body.woocommerce-cart .erg-cart-wrap td.product-subtotal .woocommerce-Price-currencySymbol {
  color: var(--erg-text) !important;
}

/* Thumbnail pill (tighten top/bottom) */
body.woocommerce-cart .elementor-widget-woocommerce-cart td.product-thumbnail a,
body.woocommerce-cart .erg-cart-wrap td.product-thumbnail a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 98px;
  height: 74px;
  padding: 6px 10px;      /* was too tall */
  border-radius: var(--erg-radius-sm);
  background: rgba(255, 255, 255, 0.05);
  border: 1px solid var(--erg-border);
  box-shadow: 0 18px 40px rgba(0, 0, 0, 0.35);
}

body.woocommerce-cart .elementor-widget-woocommerce-cart td.product-thumbnail img,
body.woocommerce-cart .erg-cart-wrap td.product-thumbnail img {
  width: auto !important;
  height: auto !important;
  max-width: 84px;
  max-height: 54px;
  object-fit: contain;
  display: block;
}

/* Quantity pill (wider left/right + no goofy arrows overlay) */
body.woocommerce-cart .elementor-widget-woocommerce-cart td.product-quantity .quantity,
body.woocommerce-cart .erg-cart-wrap td.product-quantity .quantity {
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

body.woocommerce-cart .elementor-widget-woocommerce-cart input.qty,
body.woocommerce-cart .erg-cart-wrap input.qty {
  width: 104px !important;
  min-width: 104px !important;
  padding: 10px 16px !important;
  border-radius: 999px !important;
  background: rgba(0, 0, 0, 0.35) !important;
  border: 1px solid var(--erg-border) !important;
  color: var(--erg-text) !important;
  text-align: center !important;
  font-weight: 700;
}

/* hide webkit spinners (prevents the tiny up/down box) */
body.woocommerce-cart input.qty::-webkit-outer-spin-button,
body.woocommerce-cart input.qty::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
body.woocommerce-cart input.qty[type="number"] {
  -moz-appearance: textfield;
}

/* Buttons (Update cart, Apply coupon, Proceed) */
body.woocommerce-cart .elementor-widget-woocommerce-cart button,
body.woocommerce-cart .elementor-widget-woocommerce-cart a.button,
body.woocommerce-cart .erg-cart-wrap button,
body.woocommerce-cart .erg-cart-wrap a.button {
  border-radius: 999px !important;
}

/* Cart totals panel (kills lingering white table blocks) */
body.woocommerce-cart .elementor-widget-woocommerce-cart .cart_totals,
body.woocommerce-cart .erg-cart-wrap .cart_totals {
  background: var(--erg-panel) !important;
  border: 1px solid var(--erg-border) !important;
  border-radius: var(--erg-radius) !important;
  padding: 22px 22px 28px;
  max-width: 1200px;
  margin: 26px auto 0;
}

body.woocommerce-cart .elementor-widget-woocommerce-cart .cart_totals table,
body.woocommerce-cart .elementor-widget-woocommerce-cart .cart_totals th,
body.woocommerce-cart .elementor-widget-woocommerce-cart .cart_totals td,
body.woocommerce-cart .erg-cart-wrap .cart_totals table,
body.woocommerce-cart .erg-cart-wrap .cart_totals th,
body.woocommerce-cart .erg-cart-wrap .cart_totals td {
  background: transparent !important;
  border-color: var(--erg-line) !important;
  color: var(--erg-muted) !important;
}

/* Cart totals label + amounts */
body.woocommerce-cart .elementor-widget-woocommerce-cart .cart_totals th,
body.woocommerce-cart .erg-cart-wrap .cart_totals th {
  color: var(--erg-muted) !important;
  font-weight: 700;
}
body.woocommerce-cart .elementor-widget-woocommerce-cart .cart_totals td,
body.woocommerce-cart .erg-cart-wrap .cart_totals td {
  color: var(--erg-text) !important;
}
body.woocommerce-cart .elementor-widget-woocommerce-cart .cart_totals .order-total td,
body.woocommerce-cart .erg-cart-wrap .cart_totals .order-total td {
  color: var(--erg-text) !important;
  font-weight: 900;
}

/* Primary checkout CTA */
body.woocommerce-cart .woocommerce a.checkout-button,
body.woocommerce-cart .erg-cart-wrap .woocommerce a.checkout-button {
  background: linear-gradient(180deg, var(--erg-cta), var(--erg-cta-2)) !important;
  color: var(--erg-cta-contrast) !important;
  border: 1px solid rgba(255, 255, 255, 0.18) !important;
  padding: 18px 22px !important;
  font-family: var(--erg-mono);
  text-transform: uppercase;
  letter-spacing: 0.22em;
}


/* ------------------------------------------------------------------------
   3.5) Cart notices (remove white bars)
------------------------------------------------------------------------- */
body.woocommerce-cart .woocommerce-error,
body.woocommerce-cart .woocommerce-info,
body.woocommerce-cart .woocommerce-message {
  background: rgba(0, 0, 0, 0.30) !important;
  color: var(--erg-text) !important;
  border: 1px solid var(--erg-border) !important;
  border-left: 4px solid var(--erg-link) !important;
  border-radius: 18px !important;
  box-shadow: 0 18px 40px rgba(0, 0, 0, 0.35);
}

body.woocommerce-cart .woocommerce-error a,
body.woocommerce-cart .woocommerce-info a,
body.woocommerce-cart .woocommerce-message a {
  color: var(--erg-link-hover) !important;
}


/* ------------------------------------------------------------------------
   4) CHECKOUT (shortcode output)
------------------------------------------------------------------------- */
body.woocommerce-checkout .erg-checkout-wrap,
body.woocommerce-checkout .erg-checkout-wrap .woocommerce,
body.woocommerce-checkout .woocommerce-checkout {
  color: var(--erg-text);
}

/* Form fields */
body.woocommerce-checkout .woocommerce form .form-row label {
  color: var(--erg-muted);
  font-weight: 700;
}

body.woocommerce-checkout .woocommerce form .form-row input.input-text,
body.woocommerce-checkout .woocommerce form .form-row textarea,
body.woocommerce-checkout .woocommerce form .form-row select,
body.woocommerce-checkout .select2-container--default .select2-selection--single {
  background: rgba(0, 0, 0, 0.35) !important;
  border: 1px solid var(--erg-border) !important;
  color: var(--erg-text) !important;
  border-radius: 999px !important;
  padding: 12px 16px !important;
  min-height: 46px;
}

body.woocommerce-checkout .woocommerce form .form-row textarea {
  border-radius: 18px !important;
  padding-top: 14px !important;
  padding-bottom: 14px !important;
}

/* Required star */
body.woocommerce-checkout .woocommerce form .form-row .required {
  color: var(--erg-red) !important;
}

/* Panels: order review + payment */
body.woocommerce-checkout #order_review,
body.woocommerce-checkout .woocommerce-checkout-review-order {
  background: var(--erg-panel) !important;
  border: 1px solid var(--erg-border) !important;
  border-radius: var(--erg-radius) !important;
  padding: 22px;
}

body.woocommerce-checkout #order_review table,
body.woocommerce-checkout #order_review th,
body.woocommerce-checkout #order_review td {
  background: transparent !important;
  border-color: var(--erg-line) !important;
}

body.woocommerce-checkout #order_review thead th {
  color: var(--erg-link);
  font-family: var(--erg-mono);
  text-transform: uppercase;
  letter-spacing: 0.28em;
  font-weight: 700;
}

body.woocommerce-checkout #payment,
body.woocommerce-checkout #payment .payment_box {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

body.woocommerce-checkout #payment ul.payment_methods {
  border-top: 1px solid var(--erg-line) !important;
  border-bottom: 1px solid var(--erg-line) !important;
}

body.woocommerce-checkout #payment ul.payment_methods li label {
  color: var(--erg-text) !important;
  font-weight: 800;
}

/* Place order button */
body.woocommerce-checkout #place_order,
body.woocommerce-checkout .woocommerce button.button.alt {
  background: linear-gradient(180deg, var(--erg-cta), var(--erg-cta-2)) !important;
  color: var(--erg-cta-contrast) !important;
  border: 1px solid rgba(255, 255, 255, 0.18) !important;
  border-radius: 999px !important;
  padding: 18px 22px !important;
  font-family: var(--erg-mono);
  text-transform: uppercase;
  letter-spacing: 0.22em;
}

/* Checkout notices (tone them down + remove white) */
body.woocommerce-checkout .woocommerce-error,
body.woocommerce-checkout .woocommerce-info,
body.woocommerce-checkout .woocommerce-message {
  background: rgba(0, 0, 0, 0.30) !important;
  color: var(--erg-text) !important;
  border: 1px solid var(--erg-border) !important;
  border-left: 4px solid var(--erg-link) !important;
  border-radius: 18px !important;
  box-shadow: 0 18px 40px rgba(0, 0, 0, 0.35);
}

body.woocommerce-checkout .woocommerce-error a,
body.woocommerce-checkout .woocommerce-info a,
body.woocommerce-checkout .woocommerce-message a {
  color: var(--erg-link-hover) !important;
}


/* ------------------------------------------------------------------------
   5) Responsive tweaks
------------------------------------------------------------------------- */
@media (max-width: 780px) {
  body.woocommerce-cart .elementor-widget-woocommerce-cart td.product-thumbnail a,
  body.woocommerce-cart .erg-cart-wrap td.product-thumbnail a {
    width: 84px;
    height: 64px;
  }

  body.woocommerce-cart .elementor-widget-woocommerce-cart input.qty,
  body.woocommerce-cart .erg-cart-wrap input.qty {
    width: 92px !important;
    min-width: 92px !important;
  }

  body.woocommerce-cart .elementor-widget-woocommerce-cart table.shop_table thead th,
  body.woocommerce-cart .erg-cart-wrap table.shop_table thead th {
    letter-spacing: 0.18em;
    font-size: 13px;
  }
}