/* ==========================================
   ERS — CART, CHECKOUT & ACCOUNT PAGES
   Covers: cart table, totals, checkout form,
   Select2 dropdowns, payment section, order
   confirmation, account pages, mini-cart.
   ========================================== */


/* ============================================================
   CART PAGE — body.woocommerce-cart
   ============================================================ */

/* Kill Elementor's white .e-cart-section wrapper backgrounds */
.elementor-widget-woocommerce-cart .e-cart-section {
  background: transparent !important;
  padding: 0 !important;
  border-radius: 0 !important;
}

/* Cart table frame */
.woocommerce-cart .shop_table {
  background: var(--ers-panel-2);
  border: 1px solid var(--ers-border);
  border-radius: var(--ers-radius);
  border-collapse: separate;
  border-spacing: 0;
  overflow: hidden;
  color: var(--ers-text);
}
.woocommerce-cart .shop_table thead th {
  background: var(--ers-panel);
  color: var(--ers-cta);
  font-family: var(--ers-head);
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  border-color: var(--ers-border);
  padding: 14px 16px;
}
.woocommerce-cart .shop_table tbody tr {
  border-color: var(--ers-border);
  transition: background .15s ease;
}
.woocommerce-cart .shop_table tbody tr:hover {
  background: rgba(255,255,255,0.02);
}
.woocommerce-cart .shop_table tbody td {
  border-color: var(--ers-border);
  padding: 16px;
  vertical-align: middle;
  color: var(--ers-text);
}

/* Product image */
.woocommerce-cart .shop_table .product-thumbnail img {
  width: 80px;
  height: 80px;
  object-fit: contain;
  background: var(--ers-panel);
  border-radius: var(--ers-radius-sm);
  border: 1px solid var(--ers-border);
  display: block;
}

/* Product name / price */
.woocommerce-cart .shop_table .product-name a {
  color: var(--ers-text) !important;
  font-weight: 600;
  font-size: 15px;
}
.woocommerce-cart .shop_table .product-name a:hover {
  color: var(--ers-cta) !important;
}
.woocommerce-cart .shop_table .product-price .amount,
.woocommerce-cart .shop_table .product-subtotal .amount {
  color: var(--ers-cta) !important;
  font-weight: 600;
}

/* Remove (×) button */
.woocommerce-cart .shop_table a.remove {
  color: var(--ers-text-dim) !important;
  background: transparent;
  font-size: 20px;
  line-height: 1;
  width: 30px;
  height: 30px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  transition: color .2s ease, background .2s ease;
}
.woocommerce-cart .shop_table a.remove:hover {
  color: var(--ers-red) !important;
  background: rgba(226,59,59,.12);
}

/* Coupon row */
.woocommerce-cart .coupon {
  display: flex;
  gap: 8px;
  align-items: center;
  flex-wrap: wrap;
}
.woocommerce-cart .coupon input.input-text {
  background: var(--ers-panel) !important;
  color: var(--ers-text) !important;
  border: 1px solid var(--ers-border) !important;
  border-radius: var(--ers-radius-sm) !important;
  padding: 10px 14px;
  font-family: var(--ers-body);
}
.woocommerce-cart .coupon input.input-text::placeholder {
  color: var(--ers-text-dim);
}
.woocommerce-cart .coupon .button {
  background: transparent !important;
  color: var(--ers-cta) !important;
  border: 1px solid var(--ers-cta) !important;
  border-radius: var(--ers-radius-sm) !important;
  font-size: 13px;
  padding: 10px 18px;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}
.woocommerce-cart .coupon .button:hover {
  background: var(--ers-cta) !important;
  color: var(--ers-cta-contrast) !important;
}

/* Update cart */
.woocommerce-cart .cart .button[name="update_cart"] {
  background: transparent !important;
  color: var(--ers-text-dim) !important;
  border: 1px solid var(--ers-border) !important;
  border-radius: var(--ers-radius-sm) !important;
  font-size: 13px;
  padding: 10px 16px;
}
.woocommerce-cart .cart .button[name="update_cart"]:not([disabled]):hover {
  color: var(--ers-text) !important;
  border-color: rgba(255,255,255,.3) !important;
}
.woocommerce-cart .cart .button[name="update_cart"]:disabled {
  opacity: 0.35;
  cursor: not-allowed;
}

/* Cart totals box */
.woocommerce-cart .cart_totals {
  background: var(--ers-panel-2);
  border: 1px solid var(--ers-border);
  border-radius: var(--ers-radius);
  padding: 24px;
}
.woocommerce-cart .cart_totals > h2 {
  color: var(--ers-text) !important;
  font-family: var(--ers-head);
  font-size: 18px;
  font-weight: 600;
  margin-bottom: 16px;
  padding-bottom: 12px;
  border-bottom: 1px solid var(--ers-border);
}
.woocommerce-cart .cart_totals table {
  background: transparent;
  border: none;
  width: 100%;
}
.woocommerce-cart .cart_totals table th {
  color: var(--ers-text-dim);
  font-size: 13px;
  font-weight: 500;
  width: 40%;
  border-color: var(--ers-border);
  padding: 10px 0;
  background: transparent;
}
.woocommerce-cart .cart_totals table td {
  border-color: var(--ers-border);
  padding: 10px 0;
  color: var(--ers-text);
  background: transparent;
}
.woocommerce-cart .cart_totals .order-total th,
.woocommerce-cart .cart_totals .order-total td {
  color: var(--ers-cta) !important;
  font-weight: 700;
  font-size: 18px;
  font-family: var(--ers-head);
  border-top: 2px solid rgba(255,255,255,.15) !important;
  padding-top: 14px !important;
}
.woocommerce-cart .cart_totals .order-total .amount {
  color: var(--ers-cta) !important;
}
.woocommerce-cart .cart_totals .shipping-calculator-button {
  color: var(--ers-link);
  font-size: 13px;
}
.woocommerce-cart .cart_totals .shipping-calculator-button:hover {
  color: var(--ers-cta);
}
.woocommerce-cart .cart_totals .woocommerce-shipping-calculator input,
.woocommerce-cart .cart_totals .woocommerce-shipping-calculator select {
  background: var(--ers-panel) !important;
  color: var(--ers-text) !important;
  border-color: var(--ers-border) !important;
}

/* Proceed to Checkout */
.woocommerce-cart .wc-proceed-to-checkout a.checkout-button {
  background: var(--ers-cta) !important;
  color: var(--ers-cta-contrast) !important;
  display: block;
  text-align: center;
  font-family: var(--ers-body);
  font-weight: 700;
  font-size: 15px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  border-radius: var(--ers-radius-sm) !important;
  padding: 15px 24px !important;
  margin-top: 16px;
  transition: all .25s ease;
}
.woocommerce-cart .wc-proceed-to-checkout a.checkout-button:hover {
  background: var(--ers-cta-hover) !important;
  box-shadow: 0 6px 20px rgba(200,168,75,.3);
  transform: translateY(-1px);
}

/* Cross-sells */
.woocommerce-cart .cross-sells h2 {
  color: var(--ers-text) !important;
  font-family: var(--ers-head);
  margin-bottom: 16px;
}

/* Empty cart */
.woocommerce-cart .cart-empty.woocommerce-info {
  color: var(--ers-text-dim) !important;
  background: var(--ers-panel-2) !important;
  border-top-color: var(--ers-teal) !important;
  border-radius: 0 var(--ers-radius-sm) var(--ers-radius-sm) 0;
}


/* ============================================================
   CHECKOUT PAGE — body.woocommerce-checkout
   ============================================================ */

/* Wrap billing/shipping columns in dark panels */
.woocommerce-checkout .col2-set .col-1,
.woocommerce-checkout .col2-set .col-2 {
  background: var(--ers-panel-2);
  border: 1px solid var(--ers-border);
  border-radius: var(--ers-radius);
  padding: 28px 28px 24px;
}

/* Section headings */
.woocommerce-checkout h3,
.woocommerce-checkout #order_review_heading {
  color: var(--ers-text) !important;
  font-family: var(--ers-head);
  font-size: 18px;
  font-weight: 600;
  padding-bottom: 10px;
  border-bottom: 1px solid var(--ers-border);
  margin-bottom: 20px;
  letter-spacing: 0.03em;
}

/* "Ship to different address?" toggle */
.woocommerce-checkout .ship-to-different-address label {
  color: var(--ers-text) !important;
  font-weight: 600;
  cursor: pointer;
}

/* ---- Select2 country/state dropdowns ---- */
.select2-container--default .select2-selection--single {
  background: var(--ers-panel-2) !important;
  border: 1px solid var(--ers-border) !important;
  border-radius: var(--ers-radius-sm) !important;
  height: 46px !important;
}
.select2-container--default .select2-selection--single .select2-selection__rendered {
  color: var(--ers-text) !important;
  line-height: 46px !important;
  padding-left: 14px !important;
  font-family: var(--ers-body);
  font-size: 14px;
}
.select2-container--default .select2-selection--single .select2-selection__placeholder {
  color: var(--ers-text-dim) !important;
}
.select2-container--default .select2-selection--single .select2-selection__arrow {
  height: 46px !important;
  right: 10px;
}
.select2-container--default .select2-selection--single .select2-selection__arrow b {
  border-color: var(--ers-text-dim) transparent transparent transparent !important;
}
.select2-container--default.select2-container--open .select2-selection--single {
  border-color: rgba(200,168,75,.4) !important;
  border-radius: var(--ers-radius-sm) var(--ers-radius-sm) 0 0 !important;
}
.select2-container--default.select2-container--open .select2-selection--single .select2-selection__arrow b {
  border-color: transparent transparent var(--ers-cta) transparent !important;
}
.select2-dropdown {
  background: var(--ers-panel-2) !important;
  border: 1px solid var(--ers-border) !important;
  border-top: none !important;
  border-radius: 0 0 var(--ers-radius-sm) var(--ers-radius-sm) !important;
  box-shadow: 0 10px 30px rgba(0,0,0,.5);
}
.select2-container--default .select2-search--dropdown .select2-search__field {
  background: var(--ers-panel) !important;
  border: 1px solid var(--ers-border) !important;
  color: var(--ers-text) !important;
  border-radius: 8px;
  padding: 8px 12px;
  margin: 4px 6px;
  width: calc(100% - 12px);
}
.select2-container--default .select2-results__option {
  color: var(--ers-text-dim) !important;
  padding: 9px 14px;
  font-family: var(--ers-body);
  font-size: 14px;
  transition: background .1s ease;
}
.select2-container--default .select2-results__option--highlighted,
.select2-container--default .select2-results__option--highlighted[aria-selected] {
  background: var(--ers-panel) !important;
  color: var(--ers-text) !important;
}
.select2-container--default .select2-results__option[aria-selected=true] {
  background: rgba(200,168,75,.12) !important;
  color: var(--ers-cta) !important;
}

/* ---- Order review (right column) ---- */
.woocommerce-checkout-review-order-table {
  background: var(--ers-panel-2) !important;
  border: 1px solid var(--ers-border) !important;
  border-radius: var(--ers-radius);
  overflow: hidden;
  border-collapse: separate !important;
  border-spacing: 0;
}
.woocommerce-checkout-review-order-table thead th {
  background: var(--ers-panel);
  color: var(--ers-cta);
  font-family: var(--ers-head);
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  padding: 12px 18px;
  border-color: var(--ers-border);
}
.woocommerce-checkout-review-order-table tbody td,
.woocommerce-checkout-review-order-table tfoot th,
.woocommerce-checkout-review-order-table tfoot td {
  border-color: var(--ers-border);
  padding: 12px 18px;
  color: var(--ers-text-dim);
  background: transparent;
}
.woocommerce-checkout-review-order-table .product-name {
  color: var(--ers-text);
  font-weight: 500;
}
.woocommerce-checkout-review-order-table .product-name .product-quantity {
  color: var(--ers-text-dim);
  font-size: 13px;
  font-weight: 400;
}
.woocommerce-checkout-review-order-table tfoot .order-total th,
.woocommerce-checkout-review-order-table tfoot .order-total td {
  color: var(--ers-cta) !important;
  font-weight: 700;
  font-size: 17px;
  font-family: var(--ers-head);
  border-top: 2px solid rgba(255,255,255,.15) !important;
}
.woocommerce-checkout-review-order-table .amount {
  color: var(--ers-cta) !important;
}

/* ---- Payment section ---- */
#payment {
  background: var(--ers-panel-2) !important;
  border: 1px solid var(--ers-border) !important;
  border-radius: var(--ers-radius) !important;
  overflow: hidden;
}
#payment .payment_methods {
  border-color: var(--ers-border) !important;
  background: transparent;
  padding: 0 !important;
  margin: 0;
}
#payment .payment_methods li {
  border-color: var(--ers-border) !important;
  background: transparent;
  padding: 16px 20px !important;
  transition: background .15s ease;
  list-style: none;
}
#payment .payment_methods li:hover {
  background: rgba(255,255,255,.02);
}
#payment .payment_methods li label {
  color: var(--ers-text) !important;
  font-weight: 500;
  cursor: pointer;
  font-size: 14px;
  display: inline-flex;
  align-items: center;
  gap: 8px;
}
#payment .payment_methods li label img {
  vertical-align: middle;
  max-height: 24px;
  opacity: 0.85;
}
#payment .payment_methods li .payment_box {
  background: var(--ers-panel) !important;
  border-radius: 10px;
  padding: 14px 16px;
  margin-top: 12px;
  border: 1px solid rgba(255,255,255,.06);
}
#payment .payment_methods li .payment_box p,
#payment .payment_methods li .payment_box label {
  color: var(--ers-text-dim) !important;
  margin: 0 0 6px;
  font-size: 14px;
}
#payment .payment_methods li .payment_box::before {
  border-bottom-color: var(--ers-panel) !important;
}
#payment .place-order {
  padding: 20px;
  background: transparent;
  border-top: 1px solid var(--ers-border);
}
#payment #place_order {
  width: 100%;
  font-size: 16px !important;
  padding: 16px 24px !important;
  letter-spacing: 0.06em;
  border-radius: var(--ers-radius-sm) !important;
}

/* Terms + privacy */
.woocommerce-checkout .woocommerce-terms-and-conditions-wrapper p,
.woocommerce-checkout .woocommerce-terms-and-conditions-wrapper label {
  color: var(--ers-text-dim) !important;
  font-size: 13px;
}
.woocommerce-checkout .woocommerce-terms-and-conditions-wrapper a {
  color: var(--ers-link);
}
.woocommerce-checkout .woocommerce-privacy-policy-text p {
  color: var(--ers-text-dim) !important;
  font-size: 12px;
}


/* ============================================================
   ACCOUNT PAGES — body.woocommerce-account
   ============================================================ */

/* Sidebar nav */
.woocommerce-account .woocommerce-MyAccount-navigation {
  background: var(--ers-panel-2);
  border: 1px solid var(--ers-border);
  border-radius: var(--ers-radius);
  overflow: hidden;
}
.woocommerce-account .woocommerce-MyAccount-navigation ul {
  list-style: none;
  margin: 0;
  padding: 0;
}
.woocommerce-account .woocommerce-MyAccount-navigation ul li {
  border-bottom: 1px solid var(--ers-line);
}
.woocommerce-account .woocommerce-MyAccount-navigation ul li:last-child {
  border-bottom: none;
}
.woocommerce-account .woocommerce-MyAccount-navigation ul li a {
  display: block;
  padding: 13px 20px;
  color: var(--ers-text-dim) !important;
  font-family: var(--ers-body);
  font-size: 14px;
  font-weight: 500;
  transition: all .2s ease;
  border-left: 3px solid transparent;
}
.woocommerce-account .woocommerce-MyAccount-navigation ul li a:hover {
  color: var(--ers-text) !important;
  background: rgba(255,255,255,.03);
  border-left-color: rgba(200,168,75,.5);
  padding-left: 24px;
}
.woocommerce-account .woocommerce-MyAccount-navigation ul li.is-active a {
  color: var(--ers-cta) !important;
  background: rgba(200,168,75,.08);
  border-left-color: var(--ers-cta);
  padding-left: 24px;
}

/* Content panel */
.woocommerce-account .woocommerce-MyAccount-content {
  background: var(--ers-panel-2);
  border: 1px solid var(--ers-border);
  border-radius: var(--ers-radius);
  padding: 28px 32px;
}
.woocommerce-account .woocommerce-MyAccount-content p {
  color: var(--ers-text-dim) !important;
}
.woocommerce-account .woocommerce-MyAccount-content h2,
.woocommerce-account .woocommerce-MyAccount-content h3 {
  color: var(--ers-text) !important;
  font-family: var(--ers-head);
  margin-bottom: 16px;
  padding-bottom: 10px;
  border-bottom: 1px solid var(--ers-border);
}

/* Orders table */
.woocommerce-account .woocommerce-orders-table {
  background: transparent;
  border-collapse: separate;
  border-spacing: 0;
  border: 1px solid var(--ers-border);
  border-radius: var(--ers-radius-sm);
  overflow: hidden;
  width: 100%;
}
.woocommerce-account .woocommerce-orders-table thead th {
  background: var(--ers-panel);
  color: var(--ers-cta);
  font-family: var(--ers-head);
  font-size: 11px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  padding: 12px 16px;
  border-color: var(--ers-border);
}
.woocommerce-account .woocommerce-orders-table tbody td {
  border-color: var(--ers-border);
  padding: 13px 16px;
  color: var(--ers-text-dim);
  vertical-align: middle;
  font-size: 14px;
}
.woocommerce-account .woocommerce-orders-table tbody tr:hover td {
  background: rgba(255,255,255,.02);
}
.woocommerce-account .woocommerce-orders-table .woocommerce-orders-table__cell-order-number a {
  color: var(--ers-cta) !important;
  font-weight: 600;
}
.woocommerce-account .woocommerce-orders-table mark.order-status {
  background: transparent;
  font-weight: 600;
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
.woocommerce-account .woocommerce-orders-table mark.order-status.status-completed,
.woocommerce-account .woocommerce-orders-table mark.order-status.status-processing {
  color: var(--ers-green);
}
.woocommerce-account .woocommerce-orders-table mark.order-status.status-cancelled,
.woocommerce-account .woocommerce-orders-table mark.order-status.status-failed {
  color: var(--ers-red);
}
.woocommerce-account .woocommerce-orders-table mark.order-status.status-on-hold,
.woocommerce-account .woocommerce-orders-table mark.order-status.status-pending {
  color: var(--ers-teal-light);
}

/* Address boxes */
.woocommerce-account .woocommerce-Address {
  background: var(--ers-panel);
  border: 1px solid var(--ers-border);
  border-radius: var(--ers-radius);
  padding: 22px;
}
.woocommerce-account .woocommerce-Address h3.woocommerce-column__title {
  color: var(--ers-text) !important;
  font-family: var(--ers-head);
  font-size: 15px;
  margin-bottom: 12px;
  padding-bottom: 10px;
  border-bottom: 1px solid var(--ers-line);
}
.woocommerce-account address {
  color: var(--ers-text-dim) !important;
  font-size: 14px;
  line-height: 1.8;
}

/* Login / Register columns */
.woocommerce-account .u-column1,
.woocommerce-account .u-column2 {
  background: var(--ers-panel-2);
  border: 1px solid var(--ers-border);
  border-radius: var(--ers-radius);
  padding: 28px 32px !important;
}
.woocommerce-account .woocommerce-form__label {
  color: var(--ers-text) !important;
  font-weight: 500;
}
.woocommerce-account .woocommerce-form__input,
.woocommerce-account .woocommerce-Input {
  background: var(--ers-panel) !important;
  color: var(--ers-text) !important;
  border: 1px solid var(--ers-border) !important;
  border-radius: var(--ers-radius-sm) !important;
  padding: 10px 14px !important;
}
.woocommerce-account .woocommerce-LostPassword a {
  color: var(--ers-link);
  font-size: 13px;
}
.woocommerce-account .woocommerce-LostPassword a:hover {
  color: var(--ers-cta);
}
.woocommerce-account .woocommerce-privacy-policy-text,
.woocommerce-account .woocommerce-privacy-policy-text p {
  color: var(--ers-text-dim) !important;
  font-size: 12px;
}

/* Edit account — password fieldset */
.woocommerce-account .woocommerce-EditAccountForm fieldset {
  border: 1px solid var(--ers-border);
  border-radius: var(--ers-radius-sm);
  padding: 18px 22px;
  margin-bottom: 20px;
}
.woocommerce-account .woocommerce-EditAccountForm legend {
  color: var(--ers-cta);
  font-family: var(--ers-head);
  font-size: 12px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  padding: 0 8px;
}


/* ============================================================
   ORDER CONFIRMATION — body.woocommerce-order-received
   ============================================================ */

.woocommerce-order .woocommerce-thankyou-order-received {
  font-size: 22px;
  font-family: var(--ers-head);
  color: var(--ers-text) !important;
  margin-bottom: 24px;
}
.woocommerce-order .woocommerce-order-overview {
  background: var(--ers-panel-2);
  border: 1px solid var(--ers-border);
  border-radius: var(--ers-radius);
  padding: 20px 28px;
  list-style: none;
  margin: 0 0 32px;
  display: flex;
  flex-wrap: wrap;
  gap: 0;
}
.woocommerce-order .woocommerce-order-overview li {
  color: var(--ers-text-dim);
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  padding: 6px 28px 6px 0;
  margin: 0 28px 0 0;
  border-right: 1px solid var(--ers-border);
}
.woocommerce-order .woocommerce-order-overview li:last-child {
  border-right: none;
  margin-right: 0;
  padding-right: 0;
}
.woocommerce-order .woocommerce-order-overview li strong {
  display: block;
  color: var(--ers-text);
  font-size: 16px;
  font-weight: 600;
  font-family: var(--ers-head);
  text-transform: none;
  letter-spacing: 0;
  margin-top: 4px;
}
.woocommerce-order .woocommerce-order-details h2,
.woocommerce-order .woocommerce-customer-details h2 {
  color: var(--ers-text) !important;
  font-family: var(--ers-head);
}
.woocommerce-order .woocommerce-table--order-details {
  background: var(--ers-panel-2);
  border: 1px solid var(--ers-border);
  border-radius: var(--ers-radius);
  overflow: hidden;
  border-collapse: separate !important;
  border-spacing: 0;
}
.woocommerce-order .woocommerce-table--order-details thead th {
  background: var(--ers-panel);
  color: var(--ers-cta);
  font-family: var(--ers-head);
  font-size: 12px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  border-color: var(--ers-border);
  padding: 13px 18px;
}
.woocommerce-order .woocommerce-table--order-details tbody td,
.woocommerce-order .woocommerce-table--order-details tfoot th,
.woocommerce-order .woocommerce-table--order-details tfoot td {
  border-color: var(--ers-border);
  padding: 12px 18px;
  color: var(--ers-text-dim);
  background: transparent;
}
.woocommerce-order .woocommerce-table--order-details .product-name a {
  color: var(--ers-text) !important;
  font-weight: 500;
}
.woocommerce-order .woocommerce-table--order-details tfoot .order-total th,
.woocommerce-order .woocommerce-table--order-details tfoot .order-total td {
  color: var(--ers-cta) !important;
  font-weight: 700;
  font-family: var(--ers-head);
  font-size: 17px;
  border-top: 2px solid rgba(255,255,255,.15) !important;
}
.woocommerce-order .woocommerce-customer-details address {
  color: var(--ers-text-dim) !important;
  font-size: 14px;
  line-height: 1.8;
  background: var(--ers-panel-2);
  border: 1px solid var(--ers-border);
  border-radius: var(--ers-radius);
  padding: 20px 24px;
}


/* ============================================================
   ELEMENTOR CHECKOUT WIDGET FIXES
   Elementor Pro WC Checkout widget uses .e-checkout__* classes
   with its own white default backgrounds that need overriding.
   ============================================================ */

/* Order review right column — Elementor sets white bg + gray border */
.e-checkout__order_review {
  background: var(--ers-panel-2) !important;
  border: 1px solid var(--ers-border) !important;
  border-radius: var(--ers-radius) !important;
  overflow: hidden;
  padding: 0 !important;
}
.e-checkout__order_review h3#order_review_heading {
  color: var(--ers-text) !important;
  font-family: var(--ers-head) !important;
  font-size: 16px !important;
  font-weight: 600 !important;
  letter-spacing: 0.04em !important;
  text-transform: uppercase !important;
  padding: 18px 20px 14px !important;
  margin: 0 !important;
  border-bottom: 1px solid var(--ers-border) !important;
}

/* Expand form to full container width + two-column grid */
form.woocommerce-checkout,
.e-checkout__container {
  width: 100% !important;
  max-width: 100% !important;
}
@media (min-width: 768px) {
  .e-checkout__container {
    display: grid !important;
    grid-template-columns: 1fr 400px !important;
    gap: 32px !important;
    align-items: start !important;
  }
  .e-checkout__column {
    width: auto !important;
    min-width: 0 !important;
  }
}

/* Form field focus — gold glow on active */
.woocommerce-checkout form .form-row input.input-text:focus,
.woocommerce-checkout form .form-row textarea:focus,
.woocommerce-page form .form-row input.input-text:focus {
  border-color: rgba(200,168,75,.5) !important;
  outline: none !important;
  box-shadow: 0 0 0 3px rgba(200,168,75,.08) !important;
}

/* Required asterisk — gold */
.woocommerce-checkout .required,
.woocommerce form .required {
  color: var(--ers-cta) !important;
}

/* Checkout notice (cart item added) */
.woocommerce-checkout .woocommerce-message,
.woocommerce-checkout .woocommerce-info {
  background: var(--ers-panel-2) !important;
  border: 1px solid var(--ers-border) !important;
  border-left: 3px solid var(--ers-teal) !important;
  border-radius: 0 var(--ers-radius-sm) var(--ers-radius-sm) 0 !important;
  color: var(--ers-text) !important;
  padding: 14px 18px !important;
  font-size: 14px !important;
  margin-bottom: 24px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}
.woocommerce-checkout .woocommerce-message::before,
.woocommerce-checkout .woocommerce-info::before {
  color: var(--ers-teal-light) !important;
}

/* Payment box input fields (Authorize.net etc.) */
#payment .payment_box input[type="text"],
#payment .payment_box input[type="tel"],
#payment .payment_box input[type="number"],
#payment .payment_box select {
  background: var(--ers-panel-2) !important;
  color: var(--ers-text) !important;
  border: 1px solid var(--ers-border) !important;
  border-radius: var(--ers-radius-sm) !important;
  padding: 10px 14px !important;
  font-family: var(--ers-body) !important;
  width: 100%;
}
#payment .payment_box input:focus {
  border-color: rgba(200,168,75,.5) !important;
  box-shadow: 0 0 0 3px rgba(200,168,75,.08) !important;
  outline: none !important;
}


/* ============================================================
   READABILITY FIXES — 2026-09-08

   Everything below was found by measuring computed contrast on the live cart
   and checkout, not by eye. Ratios quoted are WCAG contrast against the actual
   composited background.
   ============================================================ */

/* ---- The body class the rest of this file assumed is NOT there ----
   Checkout renders through Elementor's widget on an ordinary page, so the
   body carries `page page-id-13` and NOT `woocommerce-checkout`. Every rule
   in this file scoped to `.woocommerce-checkout <something>` was matching the
   FORM (which does carry that class) only by luck, and the column rules were
   not applying at all — the billing and shipping panels had no background.
   Re-assert them against selectors that actually exist on the page. */
.woocommerce .col2-set .col-1,
.woocommerce .col2-set .col-2,
form.woocommerce-checkout .col2-set .col-1,
form.woocommerce-checkout .col2-set .col-2{
  background: var(--ers-panel-2);
  border: 1px solid var(--ers-border);
  border-radius: var(--ers-radius);
  padding: 28px 28px 24px;
}

/* ---- WooCommerce hardcodes white here ----
   `.shipping_address` ships `background:#fff` from WooCommerce core. Our labels
   are near-white, so the moment a shopper ticks "Ship to a different address?"
   the entire shipping form rendered white-on-white: measured 1.10:1. It was
   invisible, not merely ugly. Same for Elementor's `.e-coupon-box`. */
.shipping_address,
.e-coupon-box{
  background: var(--ers-panel) !important;
  border: 1px solid var(--ers-border) !important;
  border-radius: var(--ers-radius-sm) !important;
  padding: 18px 20px !important;
  color: var(--ers-text) !important;
}
.shipping_address label,
.e-coupon-box label{ color: var(--ers-text) !important; }

/* ---- The currency symbol was pure black ----
   WooCommerce wraps it in its own span, which was picking up `color:#000` and
   rendering at 1.24:1 on the dark panel. Every price read as " 51.00" with a
   hole where the dollar sign should be. It must simply inherit the amount. */
.woocommerce-Price-currencySymbol{ color: inherit !important; }

/* ---- Notice buttons: blue link text on a gold button, 1.01:1 ----
   "Continue shopping" in the added-to-cart notice was, measurably, invisible.
   The theme's link color won because nothing here claimed the button. */
.woocommerce-message a.button,
.woocommerce-info a.button,
.woocommerce-error a.button{
  background: var(--ers-cta) !important;
  color: var(--ers-cta-contrast) !important;
  border: none !important;
  border-radius: var(--ers-radius-sm) !important;
  font-family: var(--ers-body);
  font-weight: 700;
  font-size: 13px;
  letter-spacing: .06em;
  text-transform: uppercase;
  padding: 11px 20px !important;
  text-decoration: none !important;
}
.woocommerce-message a.button:hover,
.woocommerce-info a.button:hover,
.woocommerce-error a.button:hover{
  background: var(--ers-cta-hover) !important;
  color: var(--ers-cta-contrast) !important;
}

/* ---- Near-black text on the dark panel ----
   "Shipping to CO." measured 1.08:1. */
.woocommerce-shipping-destination,
.woocommerce-shipping-destination strong{
  color: var(--ers-muted) !important;
  font-size: 13px;
}

/* ---- Body text that sat just under 4.5:1 ----
   The shipment rows and the shipping toggle were 3.47 and 3.76. `--ers-muted`
   clears 4.5 on both panel shades; `--ers-text-dim` does not, so it is for
   large or decorative text only. */
.cart_totals .woocommerce-shipping-methods label,
.cart_totals .cart-subtotal td,
.cart_totals .cart-subtotal th,
.cart_totals .shipping td,
.cart_totals .shipping th,
.woocommerce-checkout-review-order-table .shipping td,
.woocommerce-checkout-review-order-table .shipping th,
.ship-to-different-address label,
.ship-to-different-address span{
  color: var(--ers-muted) !important;
}
.cart_totals .cart-subtotal .amount,
.cart_totals .shipping .amount,
.woocommerce-checkout-review-order-table .cart-subtotal .amount,
.woocommerce-checkout-review-order-table .shipping .amount{
  color: var(--ers-text) !important;
}

/* ---- Checkboxes were 13px on a phone ----
   The terms checkbox is a REQUIRED field standing between a shopper and the
   order button, and it rendered as a 13px target. Anything under ~24px is a
   miss-tap waiting to happen. The label is clickable too, but the box itself
   should be hittable. */
form.woocommerce-checkout input[type="checkbox"],
.woocommerce-cart input[type="checkbox"],
.woocommerce-account input[type="checkbox"]{
  width: 20px;
  height: 20px;
  min-width: 20px;
  accent-color: var(--ers-cta);
  vertical-align: middle;
  margin-right: 8px;
  cursor: pointer;
}
/* Give the whole row a 44px tappable band without moving anything visually. */
form.woocommerce-checkout .woocommerce-form__label-for-checkbox,
form.woocommerce-checkout .ship-to-different-address label,
form.woocommerce-checkout .woocommerce-terms-and-conditions-checkbox-text{
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  cursor: pointer;
}

/* ---- Elementor's default gray leaking into checkout copy ----
   These measured 3.47-3.76:1 in `rgb(105,114,125)` — which is #69727d,
   Elementor's stock text gray, NOT one of our tokens (`--ers-text-dim` is
   #a9afb9 and clears 7.6:1 fine). It was landing on the shipping toggle, the
   coupon nudge and — worst — the terms-and-conditions consent label, which a
   shopper is legally required to read before ticking it. */
.ship-to-different-address,
.ship-to-different-address label,
.ship-to-different-address span,
.e-woocommerce-coupon-nudge,
.e-woocommerce-coupon-nudge a,
.woocommerce-terms-and-conditions-checkbox-text,
.woocommerce-form__label-for-checkbox,
.woocommerce-form__label-for-checkbox span,
form.woocommerce-checkout .form-row label{
  color: var(--ers-text) !important;
}
form.woocommerce-checkout .woocommerce-privacy-policy-text p,
form.woocommerce-checkout .woocommerce-terms-and-conditions-wrapper p{
  color: var(--ers-text-dim) !important;
}

/* ---- Mini-cart footer buttons ----
   Two problems stacked here.

   1. Elementor nests the label in `.elementor-button-text` carrying 70% white,
      so setting a color on the anchor alone left the label at 1.69:1 on gold.

   2. Elementor Custom Code snippet 101828 ("ERS Dark Theme — Global Body &
      White Box Kill") paints BOTH footer buttons gold with
      `.elementor-menu-cart__footer-buttons .elementor-button` — (0,2,0) and
      `!important`. It renders INLINE, so at equal specificity it wins on
      document order and the secondary button came out gold too. Adding `a.`
      makes these (0,2,1) and they win properly.

   The snippet duplicates a lot of this file. Consolidating those snippets into
   the mu-plugin CSS is on the backlog; until then, out-specify rather than
   fight over `!important`. */
.elementor-menu-cart__footer-buttons a.elementor-button--checkout,
.elementor-menu-cart__footer-buttons a.elementor-button--checkout .elementor-button-text{
  background-color: var(--ers-cta) !important;
  color: var(--ers-cta-contrast) !important;
}
.elementor-menu-cart__footer-buttons a.elementor-button--view-cart{
  background-color: transparent !important;
  border: 1px solid var(--ers-border) !important;
}
.elementor-menu-cart__footer-buttons a.elementor-button--view-cart,
.elementor-menu-cart__footer-buttons a.elementor-button--view-cart .elementor-button-text{
  color: var(--ers-text) !important;
}
.elementor-menu-cart__footer-buttons a.elementor-button--view-cart:hover{
  border-color: rgba(255,255,255,.35) !important;
  background-color: rgba(255,255,255,.04) !important;
}

/* ---- Secondary cart buttons: Apply Coupon + Update Cart ----
   Both were teal while every other CTA on the site is gold, so the cart had
   three competing button colors and no hierarchy. They are now gold OUTLINE:
   solid gold = primary (Proceed to Checkout), gold outline = secondary.

   The `a.button` / `button.button` element qualifiers are load-bearing. Elementor
   Custom Code snippet 101822 ("ERS Dark Theme — Cart, Checkout & WooCommerce
   Global") paints these teal with `.woocommerce .coupon .button` — (0,3,0) and
   `!important`, rendered INLINE so it wins any tie on document order. Adding the
   element makes these (0,3,1). See the snippet-consolidation note in
   _marketing/. */
.woocommerce-cart .coupon a.button,
.woocommerce-cart .coupon button.button,
.woocommerce-cart .coupon input.button,
.woocommerce .coupon button.button,
.woocommerce button.button[name="update_cart"],
.woocommerce-cart .cart button.button[name="update_cart"]{
  background: transparent !important;
  background-color: transparent !important;
  color: var(--ers-cta) !important;
  border: 1px solid var(--ers-cta) !important;
  border-radius: var(--ers-radius-sm) !important;
  font-weight: 700;
  letter-spacing: .05em;
  text-transform: uppercase;
}
.woocommerce-cart .coupon a.button:hover,
.woocommerce-cart .coupon button.button:hover,
.woocommerce .coupon button.button:hover,
.woocommerce button.button[name="update_cart"]:not(:disabled):hover{
  background: var(--ers-cta) !important;
  background-color: var(--ers-cta) !important;
  color: var(--ers-cta-contrast) !important;
}
/* A genuinely disabled Update Cart should still read as disabled. */
.woocommerce button.button[name="update_cart"]:disabled{
  opacity: .4;
  cursor: not-allowed;
}

/* ============================================================
   MINI CART WIDGET — Elementor Side-Cart Drawer
   Uses .elementor-menu-cart--cart-type-side-cart
   ============================================================ */

/* Overlay (dimmed background) */
.elementor-menu-cart__container {
  background: rgba(0,0,0,.55) !important;
  border: none !important;
  box-shadow: none !important;
}

/* The actual white panel — KEY FIX: Elementor sets this to #fff */
.elementor-menu-cart__main {
  background: var(--ers-panel-2) !important;
  border-left: 1px solid var(--ers-border) !important;
  box-shadow: -12px 0 48px rgba(0,0,0,.6) !important;
  display: flex;
  flex-direction: column;
}

/* Close button */
.elementor-menu-cart__close-button {
  color: var(--ers-text-dim) !important;
  background: transparent !important;
  border: none !important;
  padding: 16px 20px 8px !important;
  align-self: flex-end;
}
.elementor-menu-cart__close-button:hover {
  color: var(--ers-text) !important;
}
.elementor-menu-cart__close-button i,
.elementor-menu-cart__close-button svg {
  fill: currentColor !important;
  color: inherit !important;
}

/* Products scroll area */
.widget_shopping_cart_content {
  flex: 1;
  overflow-y: auto;
  background: transparent !important;
}
.elementor-menu-cart__products {
  background: transparent !important;
  padding: 0 !important;
}

/* Each product row */
.elementor-menu-cart__product {
  border-color: var(--ers-line) !important;
  padding: 14px 20px !important;
  background: transparent !important;
}

/* Product image */
.elementor-menu-cart__product-image img {
  width: 60px !important;
  height: 60px !important;
  object-fit: contain;
  background: var(--ers-panel);
  border-radius: 8px;
  border: 1px solid var(--ers-border);
}

/* Product name — Elementor applies 40px Oswald; force readable size */
.elementor-menu-cart__product-name,
.elementor-menu-cart__product-name a {
  font-size: 13px !important;
  font-family: var(--ers-body) !important;
  font-weight: 600 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  line-height: 1.4 !important;
  color: var(--ers-text) !important;
}
.elementor-menu-cart__product-name a:hover {
  color: var(--ers-cta) !important;
}

/* Quantity (e.g. "1 ×") */
.elementor-menu-cart__product-quantity {
  font-size: 12px !important;
  font-family: var(--ers-body) !important;
  font-weight: 400 !important;
  color: var(--ers-text-dim) !important;
  letter-spacing: 0 !important;
  display: block;
  margin-top: 4px;
}

/* Product price — also gets 40px Oswald; force it */
.elementor-menu-cart__product-price,
.elementor-menu-cart__product-price .woocommerce-Price-amount,
.elementor-menu-cart__product-price .amount {
  font-size: 13px !important;
  font-family: var(--ers-body) !important;
  font-weight: 700 !important;
  letter-spacing: 0 !important;
  color: var(--ers-cta) !important;
}

/* Remove (×) button */
.elementor-menu-cart__product-remove a {
  color: var(--ers-text-dim) !important;
  font-size: 14px !important;
  width: 22px;
  height: 22px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  transition: all .2s ease;
}
.elementor-menu-cart__product-remove a:hover {
  color: var(--ers-red) !important;
  background: rgba(226,59,59,.12);
}

/* Subtotal bar */
.elementor-menu-cart__subtotal {
  background: var(--ers-panel) !important;
  border-top: 1px solid var(--ers-border) !important;
  border-bottom: 1px solid var(--ers-border) !important;
  color: var(--ers-text) !important;
  padding: 14px 20px !important;
  font-size: 14px !important;
  font-family: var(--ers-body) !important;
  font-weight: 600 !important;
  letter-spacing: 0 !important;
}
.elementor-menu-cart__subtotal .woocommerce-Price-amount,
.elementor-menu-cart__subtotal .amount {
  color: var(--ers-cta) !important;
  font-size: 16px !important;
  font-weight: 700 !important;
  font-family: var(--ers-body) !important;
}

/* Footer buttons */
.elementor-menu-cart__footer-buttons {
  padding: 16px 20px !important;
  background: var(--ers-panel-2) !important;
  border-top: 1px solid var(--ers-border) !important;
  display: flex !important;
  gap: 10px !important;
}
.elementor-menu-cart__footer-buttons .elementor-button {
  flex: 1;
  border-radius: var(--ers-radius-sm) !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  letter-spacing: 0.06em !important;
  text-transform: uppercase !important;
  padding: 12px 16px !important;
  text-align: center;
  font-family: var(--ers-body) !important;
}
.elementor-menu-cart__footer-buttons .elementor-button--view-cart {
  background: transparent !important;
  color: var(--ers-text-dim) !important;
  border: 1px solid var(--ers-border) !important;
}
.elementor-menu-cart__footer-buttons .elementor-button--view-cart:hover {
  color: var(--ers-text) !important;
  border-color: rgba(255,255,255,.35) !important;
}
.elementor-menu-cart__footer-buttons .elementor-button--checkout {
  background: var(--ers-cta) !important;
  color: var(--ers-cta-contrast) !important;
  border: none !important;
}
.elementor-menu-cart__footer-buttons .elementor-button--checkout:hover {
  background: var(--ers-cta-hover) !important;
  box-shadow: 0 4px 14px rgba(200,168,75,.35) !important;
}

/* Empty cart message in side cart */
.elementor-menu-cart__empty-message,
.elementor-menu-cart__container .woocommerce-mini-cart__empty-message {
  color: var(--ers-text-dim) !important;
  font-family: var(--ers-body) !important;
  font-size: 14px !important;
  text-align: center;
  padding: 40px 20px !important;
}

/* ============================================================
   WOOCOMMERCE NOTICES — 2026-09-08

   The My Account "No order has been made yet." panel came out with a teal
   top rule, a blue glyph and a gold button carrying TEAL label text. Three
   separate leaks of WooCommerce's stock palette, none of them ours.

   These are scoped to `.woocommerce` rather than to the account pages,
   because the same notice markup renders on cart, checkout and the shop and
   was wrong in all of them for the same reason.
   ============================================================ */

.woocommerce .woocommerce-info,
.woocommerce .woocommerce-message{
  background: var(--ers-panel-2);
  border-top-color: var(--ers-cta);
  color: var(--ers-text);
  border-radius: var(--ers-radius-sm);
}
.woocommerce .woocommerce-error{
  background: var(--ers-panel-2);
  border-top-color: var(--ers-red);
  color: var(--ers-text);
  border-radius: var(--ers-radius-sm);
}

/* Woo hard-codes the glyph color per notice type (#1e85be for info). */
.woocommerce .woocommerce-info::before,
.woocommerce .woocommerce-message::before{ color: var(--ers-cta); }
.woocommerce .woocommerce-error::before{ color: var(--ers-red); }

/* ---- The button inside a notice ----
   Gold plate, teal label — 1.9:1 and unreadable. The background was already
   being set by a snippet; only the label was losing. Element qualifiers for
   the same reason as the coupon buttons above: the inline snippets carry
   `!important` at equal specificity and win on document order. The nested
   span is listed explicitly — see the bare-`span` note in 10-base.css. */
.woocommerce .woocommerce-info a.button,
.woocommerce .woocommerce-message a.button,
.woocommerce .woocommerce-info a.button span,
.woocommerce .woocommerce-message a.button span{
  background-color: var(--ers-cta) !important;
  color: var(--ers-cta-contrast) !important;
  border-radius: var(--ers-radius-sm) !important;
  font-weight: 700;
  letter-spacing: .05em;
}
.woocommerce .woocommerce-info a.button:hover,
.woocommerce .woocommerce-message a.button:hover{
  background-color: var(--ers-cta-hover) !important;
}

/* ---- Account nav links were underlined ----
   The theme underlines every in-content anchor. On a vertical nav that reads
   as five broken links stacked in a box, not as navigation. The active item
   is already marked by the gold left border and gold text. */
.woocommerce-account .woocommerce-MyAccount-navigation ul li a,
.woocommerce-account .woocommerce-MyAccount-navigation ul li a:hover,
.woocommerce-account .woocommerce-MyAccount-navigation ul li.is-active a{
  text-decoration: none !important;
}

/* Links inside the account content keep their underline — those are real
   in-sentence links and the underline is doing its job there. */

/* ============================================================
   CART & CHECKOUT WIDTH / RESPONSIVE — 2026-09-09

   Measured before touching anything, at 1440 / 768 / 375:

   checkout      container   customer col   name fields
   1440          850 (cap)   338            132
   768           733         221            159
   375           355         282            220

   Two separate faults, both making the form "skinny":

   1. The checkout container carried `--content-width: 850px` from an
      Elementor setting, while cart uses 1140. Fixed on the element itself,
      not here — see container c9064ff on page 13.

   2. `.e-checkout__container` is a CSS grid of `1fr 400px`. The 400px order
      summary NEVER yields, so every pixel lost comes out of the form. At 768
      that left 221px for billing and 159px for the name fields. Elementor
      only stacks the grid at its mobile breakpoint, which is far too late.
   ============================================================ */

/* ---- One column, at every width ----
   Eric's call 2026-09-09. Elementor's widget lays the checkout out as a grid of
   `1fr 400px` and only stacks it at its own mobile breakpoint. The whole thing
   is now a single column: fill in your details, then review the order, then
   pay. One decision at a time, and the form gets the full measure on every
   device instead of fighting a fixed 400px sidebar.

   Unconditional on purpose. Do not wrap this in a media query again — the
   two-column layout is what produced 132px name fields at 1440 and 159px at
   768. */
.e-checkout__container{
  display: block !important;
}
.e-checkout__container > *{ width: 100% !important; max-width: 100% !important; }
.woocommerce .woocommerce-checkout-review-order,
.woocommerce #order_review{
  width: 100% !important;
  margin-top: var(--ers-space-4);
}

/* A single column can run very wide on a big monitor, which makes a form hard
   to track across. Cap the readable width and centre it, while the order
   summary stays full width because it is a table. */
@media (min-width: 1025px){
  .woocommerce #customer_details{
    max-width: 760px;
    margin-left: auto;
    margin-right: auto;
  }
  .woocommerce #order_review,
  .woocommerce #order_review_heading{
    max-width: 760px;
    margin-left: auto;
    margin-right: auto;
  }
}

/* Billing and shipping sit one above the other in a single column, so they need
   air between them rather than sitting flush. */
.woocommerce #customer_details .col-2{ margin-top: var(--ers-space-4); }

/* The 40px gutter on `.woocommerce` is right on a desktop and wasteful on a
   phone — at 375 it was eating 80 of 375 before the form's own padding took
   another 60, leaving 220px of usable field. */
@media (max-width: 767px){
  .woocommerce{ padding-left: 16px !important; padding-right: 16px !important; }
  .woocommerce #customer_details .col-1,
  .woocommerce #customer_details .col-2,
  .woocommerce .cart_totals,
  .woocommerce #order_review{
    padding-left: 16px !important;
    padding-right: 16px !important;
  }
}

/* Between phone and laptop the gutter can come down too, without going flush. */
@media (min-width: 768px) and (max-width: 1024px){
  .woocommerce{ padding-left: 24px !important; padding-right: 24px !important; }
}

/* WooCommerce's small-screen stylesheet hides the product thumbnail in the
   stacked cart rows. On a gear store the picture is how someone confirms they
   grabbed the right model, so it stays — sized down to suit the row. */
@media (max-width: 768px){
  .woocommerce-cart table.cart td.product-thumbnail{
    display: block !important;
    text-align: left !important;
    padding-bottom: 0 !important;
  }
  .woocommerce-cart table.cart td.product-thumbnail::before{ content: none !important; }
  .woocommerce-cart table.cart td.product-thumbnail img{
    width: 72px;
    height: 72px;
    object-fit: contain;
    background: #fff;
    border-radius: var(--ers-radius-sm);
  }
}