/* =============================================================================
   WooCommerce skin — Cart + Checkout (+ account/order pages), styled to match the
   direct-barcode dark/neon design. Non-structural: skins WC's default classic
   markup via the body.woocommerce-cart / body.woocommerce-checkout classes.
   Loaded at priority 11 so it wins over the base styles.
   ============================================================================= */

/* ---- page frame + hero ---- */
body.woocommerce-cart .container,
body.woocommerce-checkout .container,
body.woocommerce-account .container,
body.woocommerce-order-received .container {
  width: 100%;
  max-width: var(--site-max-width, 1680px);
  margin: 0 auto;
  padding: 0 var(--site-padding-desktop, 48px) 72px;
}

.wc-hero {
  padding: 34px 0 24px;
}
.wc-hero .wc-crumb {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  font-size: 13px;
  color: var(--soft-gray);
  margin-bottom: 12px;
}
.wc-hero .wc-crumb a {
  color: var(--soft-gray);
  text-decoration: none;
}
.wc-hero .wc-crumb a:hover { color: var(--electric-blue); }
.wc-hero h1 {
  margin: 0;
  font-family: "Bebas Neue", Arial, sans-serif;
  font-size: clamp(34px, 4vw, 46px);
  letter-spacing: 0.02em;
  text-transform: uppercase;
  color: #fff;
}
.wc-hero p { margin: 6px 0 0; color: var(--soft-gray); font-size: 15px; }

/* ---- notices ---- */
.woocommerce-cart .woocommerce-message,
.woocommerce-cart .woocommerce-info,
.woocommerce-checkout .woocommerce-info,
.woocommerce-checkout .woocommerce-error,
.woocommerce-cart .woocommerce-error,
.woocommerce-account .woocommerce-error,
.woocommerce-account .woocommerce-message {
  background: var(--panel);
  border: 1px solid var(--line-blue);
  border-left: 3px solid var(--electric-blue);
  color: #dfe8f2;
  border-radius: 8px;
  padding: 14px 16px;
  list-style: none;
  box-shadow: none;
}
.woocommerce-message { border-left-color: var(--bright-green) !important; }
.woocommerce-error { border-left-color: #ff5d6c !important; }
.woocommerce-message::before,
.woocommerce-info::before { color: var(--electric-blue); }
.woocommerce-message::before { color: var(--bright-green); }
/* WC's built-in notice icon (::before/::after) renders as an empty "tofu" box on
   this dark custom theme (its icon font/SVG doesn't draw). Remove it — the colored
   left border already signals the notice type. Also drop the icon's reserved gap. */
.woocommerce-cart .woocommerce-info::before,
.woocommerce-cart .cart-empty::before,
.woocommerce-cart .woocommerce-message::before,
.woocommerce-cart .woocommerce-message::after,
.woocommerce-cart .woocommerce-error::before,
.woocommerce-checkout .woocommerce-info::before,
.woocommerce-checkout .woocommerce-message::before,
.woocommerce-checkout .woocommerce-message::after,
.woocommerce-checkout .woocommerce-error::before,
.woocommerce-account .woocommerce-info::before,
.woocommerce-account .woocommerce-message::before,
.woocommerce-account .woocommerce-message::after,
.woocommerce-account .woocommerce-error::before {
  content: none !important;
  display: none !important;
}
.woocommerce-cart .woocommerce-info,
.woocommerce-cart .cart-empty,
.woocommerce-checkout .woocommerce-info,
.woocommerce-checkout .woocommerce-message,
.woocommerce-cart .woocommerce-message { padding-left: 16px; }

/* ---- inputs / selects / labels ---- */
.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea,
.woocommerce form .form-row select,
.woocommerce .quantity input.qty,
.woocommerce #order_review input.input-text,
.woocommerce input[type="text"],
.woocommerce input[type="email"],
.woocommerce input[type="tel"],
.woocommerce input[type="password"],
.woocommerce input[type="number"],
.woocommerce textarea,
.woocommerce select {
  background: rgba(2, 12, 23, 0.72);
  border: 1px solid var(--line-blue);
  color: #eaf1f8;
  border-radius: 6px;
  padding: 11px 12px;
  font-size: 14px;
  min-height: 44px;
  box-shadow: none;
}
.woocommerce .quantity input.qty { width: 78px; text-align: center; padding: 11px 8px; }
.woocommerce input:focus,
.woocommerce textarea:focus,
.woocommerce select:focus {
  outline: none;
  border-color: var(--electric-blue);
  box-shadow: 0 0 0 3px rgba(0, 158, 234, 0.18);
}
.woocommerce ::placeholder { color: #7f92a6; }
.woocommerce form .form-row label,
.woocommerce-checkout label,
.woocommerce .quantity + label { color: #c7d3e0; font-size: 13px; margin-bottom: 4px; }
.woocommerce .required { color: var(--bright-green); }
.woocommerce-input-wrapper { display: block; }

/* ---- buttons (primary = green gradient, matches the site's Add-To-Cart) ---- */
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #place_order,
.woocommerce .wc-proceed-to-checkout a.checkout-button,
.woocommerce .return-to-shop .button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-family: "Bebas Neue", Arial, sans-serif;
  text-transform: uppercase;
  letter-spacing: 0.035em;
  font-size: 18px;
  font-weight: 400;
  border-radius: 5px;
  padding: 0 24px;
  min-height: 46px;
  border: 1px solid rgba(107, 209, 47, 0.74);
  color: #06110a;
  background: linear-gradient(135deg, #7de13b, #57c91d);
  cursor: pointer;
  transition: filter 0.15s ease, box-shadow 0.15s ease;
  text-decoration: none;
}
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover,
.woocommerce #place_order:hover,
.woocommerce .wc-proceed-to-checkout a.checkout-button:hover,
.woocommerce .return-to-shop .button:hover {
  filter: brightness(1.06);
  box-shadow: 0 0 22px rgba(107, 209, 47, 0.4);
  color: #06110a;
}
/* secondary buttons (blue outline): Apply coupon, Update cart, Calculate shipping submit */
.woocommerce button[name="apply_coupon"],
.woocommerce button[name="update_cart"],
.woocommerce .shipping-calculator-form button {
  background: transparent;
  color: var(--electric-blue);
  border: 1px solid var(--line-blue);
}
.woocommerce button[name="apply_coupon"]:hover,
.woocommerce button[name="update_cart"]:hover,
.woocommerce .shipping-calculator-form button:hover {
  background: rgba(0, 158, 234, 0.12);
  color: #eaf3fb;
  box-shadow: none;
}
.woocommerce button[name="update_cart"][disabled] { opacity: 0.5; }

/* ---- tables (cart + order review + totals) ---- */
.woocommerce table.shop_table {
  background: var(--panel);
  border: 1px solid var(--line-blue);
  border-radius: 12px;
  border-collapse: separate;
  border-spacing: 0;
  overflow: hidden;
  width: 100%;
  margin: 0 0 22px;
}
.woocommerce table.shop_table thead th,
.woocommerce table.shop_table th {
  color: #9fb2c4;
  text-transform: uppercase;
  font-size: 12px;
  letter-spacing: 0.04em;
  padding: 15px 16px;
  border: 0;
  border-bottom: 1px solid var(--line-blue);
  background: rgba(0, 158, 234, 0.06);
}
.woocommerce table.shop_table td {
  padding: 15px 16px;
  border: 0;
  border-top: 1px solid rgba(255, 255, 255, 0.06);
  color: #e7eef6;
  vertical-align: middle;
}
.woocommerce table.shop_table tbody tr:first-child td { border-top: 0; }
.woocommerce table.cart img,
.woocommerce .cart_item img {
  width: 64px;
  height: 64px;
  object-fit: contain;
  border-radius: 8px;
  background: #02070d;
  border: 1px solid rgba(255, 255, 255, 0.06);
}
.woocommerce td.product-name a { color: #eef4fb; text-decoration: none; font-weight: 600; }
.woocommerce td.product-name a:hover { color: var(--electric-blue); }
.woocommerce .product-price bdi,
.woocommerce .product-subtotal bdi,
.woocommerce .amount { color: #eaf1f8; }
.woocommerce .product-remove a {
  color: #ff5d6c !important;
  font-size: 22px;
  line-height: 1;
  text-decoration: none;
  border: 0;
  background: none;
}
.woocommerce .product-remove a:hover { color: #ff8894 !important; }
.woocommerce .cart .actions { padding: 16px; background: rgba(2, 12, 23, 0.35); }
.woocommerce .cart .actions .coupon { display: flex; gap: 10px; align-items: center; }
.woocommerce .cart .actions .coupon input { max-width: 220px; margin: 0; }

/* ---- cart totals panel ---- */
.woocommerce .cart-collaterals { display: block; }
.woocommerce .cart-collaterals .cart_totals {
  float: right;
  width: 42%;
  min-width: 320px;
  background: var(--panel);
  border: 1px solid var(--line-blue);
  border-radius: 12px;
  padding: 6px 20px 20px;
}
.woocommerce .cart_totals h2,
.woocommerce #order_review_heading,
.woocommerce-checkout #customer_details h3,
.woocommerce .cross-sells h2 {
  font-family: "Bebas Neue", Arial, sans-serif;
  text-transform: uppercase;
  letter-spacing: 0.02em;
  font-size: 24px;
  color: #fff;
  margin: 16px 0 12px;
}
.woocommerce .cart_totals table.shop_table { border: 0; background: transparent; }
.woocommerce .cart_totals table.shop_table th { background: transparent; border-bottom: 1px solid rgba(255,255,255,0.08); color: #b7c3d1; text-transform: none; font-size: 14px; }
.woocommerce .cart_totals table.shop_table td { background: transparent; }
.woocommerce .cart_totals .order-total .amount { color: var(--bright-green); font-size: 20px; }
.woocommerce .wc-proceed-to-checkout { padding: 14px 0 0; }
.woocommerce .wc-proceed-to-checkout a.checkout-button { display: flex; width: 100%; }

/* ---- checkout layout ---- */
.woocommerce-checkout #customer_details {
  background: var(--panel);
  border: 1px solid var(--line-blue);
  border-radius: 12px;
  padding: 8px 24px 24px;
}
.woocommerce-checkout .col2-set .col-1,
.woocommerce-checkout .col2-set .col-2 { float: none; width: 100%; }
.woocommerce-checkout #order_review,
.woocommerce-checkout #order_review_heading { width: 100%; }
.woocommerce-checkout #order_review {
  background: var(--panel);
  border: 1px solid var(--line-blue);
  border-radius: 12px;
  padding: 6px 22px 22px;
  margin-top: 20px;
}
.woocommerce-checkout #order_review table.shop_table { border: 0; background: transparent; }
.woocommerce-checkout #order_review table.shop_table th,
.woocommerce-checkout #order_review table.shop_table td { background: transparent; border-top-color: rgba(255,255,255,0.06); }
.woocommerce-checkout #order_review .order-total .amount { color: var(--bright-green); font-size: 20px; }

/* payment box */
.woocommerce-checkout #payment {
  background: rgba(2, 12, 23, 0.5);
  border-radius: 10px;
  border: 1px solid rgba(255, 255, 255, 0.06);
}
.woocommerce-checkout #payment ul.payment_methods { border-bottom: 1px solid rgba(255,255,255,0.08); }
.woocommerce-checkout #payment div.payment_box {
  background: rgba(0, 158, 234, 0.08);
  color: #cdd8e4;
}
.woocommerce-checkout #payment div.payment_box::before { border-bottom-color: rgba(0,158,234,0.08); }
.woocommerce-checkout #payment .place-order { padding: 16px 0 0; }
.woocommerce-checkout #place_order { width: 100%; }
.woocommerce-checkout .woocommerce-terms-and-conditions-wrapper { color: #b7c3d1; }

/* ---- select2 (country / state dropdowns) ---- */
.select2-container--default .select2-selection--single {
  background: rgba(2, 12, 23, 0.72);
  border: 1px solid var(--line-blue);
  height: 44px;
  border-radius: 6px;
}
.select2-container--default .select2-selection--single .select2-selection__rendered { color: #eaf1f8; line-height: 42px; }
.select2-container--default .select2-selection--single .select2-selection__arrow { height: 42px; }
.select2-dropdown { background: #0a1523; border: 1px solid var(--line-blue); color: #eaf1f8; }
.select2-search--dropdown .select2-search__field { background: rgba(2,12,23,0.72); border: 1px solid var(--line-blue); color: #eaf1f8; }
.select2-container--default .select2-results__option--highlighted[aria-selected] { background: rgba(0, 158, 234, 0.28); color: #fff; }

/* ---- empty cart ---- */
.woocommerce .cart-empty,
.woocommerce .wc-empty-cart-message { font-size: 18px; color: #cdd8e4; text-align: left; }
.woocommerce .return-to-shop { margin-top: 16px; }

/* ---- links + misc ---- */
/* Scope link recolour to the cart/checkout CONTENT (inside .container) only — NOT
   the global header nav / footer, which live outside .container and keep their own
   colours. */
body.woocommerce-cart .container a:not(.button),
body.woocommerce-checkout .container a:not(.button) { color: var(--electric-blue); }
.woocommerce-checkout .woocommerce-form-login-toggle,
.woocommerce-checkout .woocommerce-form-coupon-toggle { margin-bottom: 18px; }

/* ---- checkout coupon, relocated under the order total (JS-moved from top of checkout) ---- */
/* Sits in the order-review column just above the payment box, so the customer sees items,
   prices and total first, then applies a code right where the discount line appears. */
.dbx-checkout-coupon { margin: 18px 0 6px; padding-top: 16px; border-top: 1px solid rgba(255,255,255,.10); }
.dbx-checkout-coupon .woocommerce-form-coupon-toggle { margin-bottom: 0; }
.dbx-checkout-coupon .woocommerce-form-coupon-toggle .woocommerce-info {
  margin: 0; padding: 12px 14px; font-size: 14px; text-align: left; line-height: 1.4;
}
.dbx-checkout-coupon form.checkout_coupon {
  margin: 12px 0 0; padding: 16px; border: 1px solid rgba(255,255,255,.12);
  border-radius: 12px; background: rgba(255,255,255,.03);
}
.dbx-checkout-coupon form.checkout_coupon > p:first-of-type { margin-top: 0; }
.dbx-checkout-coupon form.checkout_coupon .form-row {
  width: 100%; float: none; margin: 0 0 12px; padding: 0;
}
.dbx-checkout-coupon form.checkout_coupon .form-row:last-child { margin-bottom: 0; }
.dbx-checkout-coupon form.checkout_coupon .input-text { width: 100%; }
.dbx-checkout-coupon form.checkout_coupon .button { width: 100%; }

/* ---- responsive ---- */
@media (max-width: 900px) {
  body.woocommerce-cart .container,
  body.woocommerce-checkout .container { padding-left: 20px; padding-right: 20px; }
  .woocommerce .cart-collaterals .cart_totals { float: none; width: 100%; min-width: 0; }
}