/*
Theme Name: Empire Tools
Theme URI: https://example.com/empire-tools
Author: WebYoungstown
Author URI: https://webyoungstown.com
Description: Light, mobile-first WooCommerce theme for Empire Tools — white page, black type, Empire red accents — deep-discount tools and home goods. Sticky header, slide-out menu, app-style bottom tab bar, sale badges, pickup-first messaging. Fully compatible with Elementor and Elementor page templates.
Version: 1.1.0
Requires at least: 6.2
Tested up to: 7.1
Requires PHP: 7.4
License: Factorize License (proprietary — see LICENSE.txt)
License URI: https://factorize.webyoungstown.com/license/
Text Domain: empire-tools
Tags: e-commerce, light, one-column, custom-menu, sticky-post, translation-ready
*/

/* =============================================================
   1. DESIGN TOKENS — edit these five colors to retheme the site
   ============================================================= */
:root {
  /* LIGHT THEME.
     White page, black type, Empire red as the one accent — the palette the
     logo already is. Every text-on-background pair below was checked against
     WCAG AA (4.5:1 for body copy, 3:1 for large text); the measured ratio is
     noted where it is the reason a value is not the obvious one. The colours
     that read as "wrong" out of context — gold at #8a5a00, deal green at
     #146c2e — are dark on purpose: their dark-theme values were chosen to
     glow on black and sit at roughly 2:1 on white, which is unreadable.

     Anything white here is white because it sits ON the red accent, where
     white is correct in both themes. */
  --et-bg: #ffffff;            /* page background            */
  --et-surface: #ffffff;       /* content surface            */
  --et-card: #f6f6f8;          /* cards / tiles — needs --et-border to read  */
  --et-card-2: #f0f0f3;        /* drawer / deep panels       */
  --et-border: #e0e0e6;
  --et-border-2: #c7c7d0;
  --et-text: #14141a;          /* 18.3:1 on white, 17.1:1 on cards */
  --et-muted: #5c5c66;         /* 6.6:1 on white — the lightest grey that still passes */
  --et-accent: #c81a1a;        /* Empire red, nudged darker: 5.8:1 on white,
                                  and still 5.8:1 for white text ON it       */
  --et-accent-dark: #9e1414;   /* pressed / hover — 8.2:1 with white text     */
  --et-gold: #8a5a00;          /* link / disclaimer — 5.9:1 (was a light gold) */
  --et-gold-light: #6b4600;    /* link hover: on light, hover DARKENS         */
  --et-gold-on-dark: #f0c274;  /* gold ON the dark Buy Now button — 8.9:1 there.
                                  --et-gold is tuned for white and would vanish. */
  --et-cream: #f2f2f4;         /* search input fill — paired with a border below */
  --et-deal: #146c2e;          /* prices / savings / countdown — 6.5:1        */
  --et-text-2: #3d3d46;        /* secondary text: footer nav, hours, logo tail — 10.8:1 */
  --et-text-3: #14141a;        /* text inside checkout / block form fields    */
  --et-panel: #f4f4f7;         /* payment box, product tile backing.
                                  NOTE: this token used to read
                                  `--et-panel: var(--et-panel)`, a
                                  self-reference that is invalid at
                                  computed-value time, so all four of its
                                  consumers silently fell back to transparent. */
  --et-panel-2: #eeeef2;       /* checkout blocks, notices                    */
  --et-panel-3: #f7f7f9;       /* block form fields                           */
  --et-alert: #b31212;         /* active tab, remove links — 7.0:1            */
  --et-accent-hi: #e02525;     /* hero gradient — bright end (hero stays red) */
  --et-accent-lo: #8c1010;     /* hero gradient — deep end                    */
  --et-accent-rgb: 200,26,26;  /* rgb triplets for translucent tints          */
  --et-accent-lo-rgb: 140,16,16;
  --et-gold-rgb: 138,90,0;
  --et-scrim-rgb: 255,255,255; /* image scrims: WHITE on a light theme, so the
                                  dark type laid over a photo stays readable  */
  --et-bar: #ffffff;           /* mobile bottom tab bar                       */
  --et-bar-border: #e0e0e6;
  --et-bar-text: #5c5c66;
  --et-panel-4: #fafafb;       /* dashed empty-state / notice panel           */
  --et-text-4: #3d3d46;        /* section / hero descriptions                 */
  --et-text-5: #4a4a54;        /* checkout terms                              */
  --et-text-6: #4a4a54;        /* totals descriptions                         */
  --et-deal-2: #146c2e;        /* bright savings label                        */
  --et-ok: #146c2e;            /* "returns accepted" green                    */
  --et-warn: #8a4b00;          /* "no returns" orange — 6.3:1                 */
  --et-required: #b31212;      /* required-field asterisk                     */
  --et-alert-2: #b31212;       /* reserve-not-met red                         */
  --et-radius: 8px;
  --et-font-display: 'Oswald', 'Arial Narrow', 'DejaVu Sans Condensed', sans-serif;
  --et-font-body: 'Barlow', 'Helvetica Neue', 'DejaVu Sans', Arial, sans-serif;
  --et-header-h: 118px;
  --et-bottombar-h: 62px;
}

/* =============================================================
   2. BASE
   ============================================================= */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
body {
  margin: 0;
  background: var(--et-bg);
  color: var(--et-text);
  font-family: var(--et-font-body);
  font-size: 16px;
  line-height: 1.55;
}
img { max-width: 100%; height: auto; display: block; }
/* On the dark theme every link was gold, which read as warm highlight on
   black. On white the same role wants the brand red: gold is now a dark
   brown (it has to be, to pass contrast on white) and brown links look like
   a mistake rather than a choice. Gold keeps its narrower jobs — the Buy Now
   line and the disclaimer strip — where it still reads as a deliberate
   second accent. */
a { color: var(--et-accent); text-decoration: none; }
a:hover { color: var(--et-accent-dark); }
h1, h2, h3, h4, h5, h6 {
  font-family: var(--et-font-display);
  font-weight: 600;
  line-height: 1.15;
  letter-spacing: .5px;
  color: var(--et-text);
  margin: 0 0 .5em;
  text-transform: uppercase;
}
h1 { font-size: 28px; } h2 { font-size: 22px; } h3 { font-size: 18px; }
p { margin: 0 0 1em; }
::selection { background: var(--et-accent); color: #fff; }
.screen-reader-text {
  border: 0; clip: rect(1px,1px,1px,1px); clip-path: inset(50%);
  height: 1px; width: 1px; margin: -1px; overflow: hidden;
  padding: 0; position: absolute !important; word-wrap: normal !important;
}
.container { width: 100%; max-width: 1100px; margin: 0 auto; padding: 0 16px; }
.site-main { background: var(--et-surface); min-height: 60vh; padding-bottom: calc(var(--et-bottombar-h) + env(safe-area-inset-bottom, 0px) + 24px); }
body.elementor-page .site-main > .container { max-width: none; padding: 0; }

/* =============================================================
   3. BUTTONS  (theme, WooCommerce, Gutenberg and Elementor)
   ============================================================= */
.et-btn,
.button, button, input[type=submit],
.woocommerce a.button, .woocommerce button.button,
.woocommerce input.button, .woocommerce #respond input#submit,
.woocommerce a.button.alt, .woocommerce button.button.alt,
.wp-block-button__link,
.elementor-button {
  display: inline-block;
  background: var(--et-accent);
  color: #fff !important;
  border: none;
  border-radius: var(--et-radius);
  padding: 13px 22px;
  font-family: var(--et-font-body);
  font-size: 15px;
  font-weight: 600;
  letter-spacing: .3px;
  line-height: 1.2;
  cursor: pointer;
  text-align: center;
  transition: background .15s ease;
}
.et-btn:hover, .button:hover, button:hover, input[type=submit]:hover,
.woocommerce a.button:hover, .woocommerce button.button:hover,
.woocommerce a.button.alt:hover, .woocommerce button.button.alt:hover,
.wp-block-button__link:hover, .elementor-button:hover {
  background: var(--et-accent-dark); color: #fff !important;
}
.et-btn--ghost,
.woocommerce a.button.et-btn--ghost {
  background: transparent;
  border: 1px solid var(--et-border-2);
  color: var(--et-text) !important;
}
.et-btn--ghost:hover { background: var(--et-card); border-color: var(--et-accent); }
.et-btn--block { display: block; width: 100%; }
.woocommerce .button.disabled, .woocommerce .button:disabled {
  background: var(--et-border) !important; color: var(--et-muted) !important;
}

/* =============================================================
   4. STICKY HEADER
   ============================================================= */
.site-header {
  position: sticky; top: 0; z-index: 50;
  background: var(--et-bg);
  border-bottom: 1px solid var(--et-border);
}
body.admin-bar .site-header { top: 32px; }
@media (max-width: 782px) { body.admin-bar .site-header { top: 46px; } }
.site-header__row {
  display: flex; align-items: center; gap: 12px;
  padding: 12px 16px; max-width: 1100px; margin: 0 auto;
}
.et-burger {
  background: none; border: none; padding: 8px; margin: -8px;
  display: flex; flex-direction: column; gap: 5px; cursor: pointer;
}
.et-burger span { display: block; width: 22px; height: 2px; background: var(--et-text); transition: transform .2s; }
.et-burger span:last-child { width: 14px; background: var(--et-accent); }
.site-logo {
  flex: 1; text-align: center;
  font-family: var(--et-font-display); line-height: 1;
  white-space: nowrap; overflow: hidden;
}
.site-logo a { display: inline-block; }
.site-logo .site-logo__a { font-size: 22px; font-weight: 700; letter-spacing: 2px; color: var(--et-accent); }
.site-logo .site-logo__b { font-size: 22px; font-weight: 400; letter-spacing: 6px; color: var(--et-text-2); margin-left: 6px; }
.site-logo img.custom-logo { margin: 0 auto; max-height: 42px; width: auto; }
.et-cart-link { position: relative; padding: 6px; display: inline-flex; color: var(--et-text); }
.et-cart-link svg { stroke: var(--et-text); }
.et-cart-count {
  position: absolute; top: -2px; right: -2px;
  background: var(--et-accent); color: #fff;
  font-size: 10px; font-weight: 700;
  min-width: 16px; height: 16px; border-radius: 8px;
  display: flex; align-items: center; justify-content: center; padding: 0 3px;
}
.et-cart-count:empty, .et-cart-count[data-count="0"] { display: none; }
.site-header__search { display: flex; padding: 2px 16px 12px; max-width: 1100px; margin: 0 auto; }
.site-header__search .search-field {
  flex: 1; min-width: 0; background: var(--et-cream); border: none;
  border-radius: var(--et-radius) 0 0 var(--et-radius);
  padding: 13px 16px; color: #1a1a1a; font-family: var(--et-font-body);
  font-size: 16px; outline: none; min-height: 48px;
}
.site-header__search .search-submit {
  background: var(--et-accent); border: none;
  border-radius: 0 var(--et-radius) var(--et-radius) 0;
  padding: 0 18px; min-height: 48px; display: flex; align-items: center;
}
.site-header__search .search-submit svg { stroke: #fff; }

/* =============================================================
   5. SLIDE-OUT DRAWER MENU
   ============================================================= */
.et-overlay {
  position: fixed; inset: 0; background: rgba(0,0,0,.6);
  z-index: 60; opacity: 0; pointer-events: none; transition: opacity .2s;
}
.et-drawer {
  position: fixed; top: 0; left: 0; transform: translateX(-105%);
  width: 280px; max-width: 82vw; height: 100vh; height: 100dvh;
  background: var(--et-card-2); z-index: 61;
  padding: 24px 0; box-shadow: 8px 0 30px rgba(0,0,0,.5);
  overflow-y: auto; transition: transform .22s ease;
}
body.et-menu-open { overflow: hidden; }
body.et-menu-open .et-overlay { opacity: 1; pointer-events: auto; }
body.et-menu-open .et-drawer { transform: translateX(0); }
.et-drawer__brand { padding: 0 22px 18px; border-bottom: 1px solid var(--et-border); margin-bottom: 8px; }
.et-drawer nav ul { list-style: none; margin: 0; padding: 0; }
.et-drawer nav li a {
  display: block; padding: 14px 22px; color: var(--et-text);
  font-family: var(--et-font-display); font-size: 15px;
  letter-spacing: 1.5px; text-transform: uppercase;
  border-left: 3px solid transparent;
}
.et-drawer nav li a:hover,
.et-drawer nav li.current-menu-item > a { color: var(--et-text); border-left-color: var(--et-accent); background: rgba(var(--et-accent-rgb),.08); }
.et-drawer nav .sub-menu li a { padding-left: 38px; font-size: 13px; color: var(--et-muted); }

/* =============================================================
   6. BOTTOM TAB BAR (mobile app-style)
   ============================================================= */
.et-bottombar {
  position: fixed; bottom: 0; left: 0; right: 0; z-index: 55;
  background: var(--et-bar); border-top: 1px solid var(--et-bar-border);
  display: flex;
  padding-bottom: env(safe-area-inset-bottom, 0px);
}
.et-bottombar a {
  flex: 1; display: flex; flex-direction: column; align-items: center; gap: 3px;
  padding: 9px 4px 8px; color: var(--et-bar-text);
  font-family: var(--et-font-display); font-size: 10.5px;
  letter-spacing: 1px; text-transform: uppercase; position: relative;
}
.et-bottombar a svg { stroke: currentColor; }
.et-bottombar a.is-active { color: var(--et-alert); } /* brand red is 3.66:1 at this size; this reads ~6.9:1 */
.et-bottombar .et-cart-count { top: 2px; right: calc(50% - 20px); }
@media (min-width: 900px) {
  .et-bottombar { display: none; }
  .site-main { padding-bottom: 40px; }
}

/* =============================================================
   7. HOME SECTIONS (built-in front page + matching Elementor CSS)
   ============================================================= */
/* Compact hero card — fits in the first screen under the header,
   styled like a promo banner. Works for the built-in front page AND for
   any Elementor column/section given the class "et-hero-card". */
.et-hero-compact { padding: 12px 0 4px; }
.et-hero-card {
  position: relative; overflow: hidden;
  background: linear-gradient(135deg, var(--et-accent-hi) 0%, var(--et-accent) 34%, var(--et-accent-lo) 100%);
  border-radius: 18px;
  padding: 22px 20px;
  box-shadow: 0 12px 28px rgba(var(--et-accent-rgb),.18);
}
.et-hero-card::before {
  content: ""; position: absolute; inset: 0; z-index: 0; pointer-events: none;
  background: radial-gradient(120% 90% at 100% 0%, rgba(255,255,255,.16), transparent 55%);
}
.et-hero-card::after {
  content: ""; position: absolute; z-index: 0; pointer-events: none;
  right: -16px; bottom: -22px; width: 150px; height: 150px;
  transform: rotate(12deg); opacity: .16;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23ffffff' d='M13 2 3 14h9l-1 8 10-12h-9z'/%3E%3C/svg%3E") no-repeat center / contain;
}
.et-hero-card > * { position: relative; z-index: 1; }
.et-hero-card h1, .et-hero-card h2 {
  margin: 0 0 8px; font-size: 24px; line-height: 1.15; color: #fff; letter-spacing: .2px;
}
.et-hero-card p { margin: 0 0 14px; font-size: 14px; line-height: 1.5; color: rgba(255,255,255,.88); max-width: 36ch; }
.et-hero-card .et-btn--light,
.et-hero-card .et-btn--light:hover { background: #fff; color: var(--et-accent-dark) !important; border-color: #fff; }
.et-hero-card .elementor-button { background: #fff; color: var(--et-accent-dark) !important; }
.et-hero-card .elementor-button:hover { background: #ffe9e9; color: var(--et-accent-dark) !important; }
/* Same compact rhythm when the card is an Elementor column */
.et-hero-card > .elementor-widget-wrap { padding: 0; }
.et-hero-card .elementor-widget:not(:last-child) { margin-bottom: 4px; }
.et-hero-card .elementor-widget-button { margin-top: 6px; }
.et-disclaimer {
  text-align: center; padding: 14px 16px;
  border-top: 1px solid var(--et-border); border-bottom: 1px solid var(--et-border);
  background: var(--et-bg);
}
.et-disclaimer p { margin: 0; font-style: italic; color: var(--et-gold); font-size: 13.5px; }
.et-disclaimer .et-disclaimer__note { color: var(--et-accent); font-weight: 600; font-style: normal; margin-top: 4px; }
.et-section { padding: 30px 0 8px; }
.et-section--featured { padding-top: 18px; }
.et-section__head { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; margin-bottom: 16px; }
.et-section__head h2 { margin: 0; padding-left: 12px; border-left: 4px solid var(--et-accent); }
.et-section__head a { font-size: 13px; letter-spacing: .5px; }
.et-storecard {
  background: var(--et-card); border: 1px solid var(--et-border);
  border-radius: var(--et-radius); padding: 22px; text-align: center;
}
.et-storecard h2 { margin-bottom: 6px; }
.et-storecard p { color: var(--et-muted); font-size: 14px; }
.et-storecard__map {
  background: var(--et-panel-4); border: 1px dashed var(--et-border-2); border-radius: var(--et-radius);
  color: var(--et-muted); font-size: 13px; padding: 34px 12px; margin: 14px 0;
}
.et-storecard__actions { display: flex; gap: 10px; justify-content: center; flex-wrap: wrap; }

/* =============================================================
   8. WOOCOMMERCE — GRID / LOOP
   ============================================================= */
.woocommerce-notices-wrapper { padding-top: 12px; }
.woocommerce .woocommerce-message, .woocommerce .woocommerce-info, .woocommerce .woocommerce-error {
  background: var(--et-card); color: var(--et-text);
  border-top-color: var(--et-accent); border-radius: var(--et-radius);
}
.woocommerce .woocommerce-message a.button { margin-left: 8px; }
.woocommerce-result-count { color: var(--et-muted); font-size: 13px; }
.woocommerce .woocommerce-ordering select, select, textarea,
input[type=text], input[type=email], input[type=tel], input[type=password], input[type=number], input[type=search] {
  background: var(--et-card); color: var(--et-text);
  border: 1px solid var(--et-border-2); border-radius: var(--et-radius);
  padding: 10px 12px; font-family: var(--et-font-body); font-size: 15px;
}
ul.products {
  display: grid !important;
  grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
  gap: 14px; margin: 0 0 30px !important; padding: 0; list-style: none;
}
/* WooCommerce core adds clearfix ::before/::after to ul.products; in a grid
   container those become anonymous grid items and steal the first cell,
   pushing card #1 into the right column. Remove them. */
.woocommerce ul.products::before, .woocommerce ul.products::after,
.woocommerce-page ul.products::before, .woocommerce-page ul.products::after,
ul.products::before, ul.products::after { content: none !important; display: none !important; }
@media (min-width: 700px)  { ul.products { grid-template-columns: repeat(3, 1fr); } }
@media (min-width: 1000px) { ul.products { grid-template-columns: repeat(4, 1fr); } }
@media (max-width: 699px) {
  .woocommerce ul.products, ul.products { gap: 10px; }
  .woocommerce .woocommerce-result-count,
  .woocommerce .woocommerce-ordering { float: none; clear: both; margin: 0 0 10px; }
  .woocommerce .woocommerce-ordering { text-align: right; }
}
.woocommerce ul.products li.product, ul.products li.product {
  width: auto !important; margin: 0 !important; float: none !important;
  background: var(--et-card); border: 1px solid var(--et-border);
  border-radius: var(--et-radius); padding: 10px; position: relative;
  display: flex; flex-direction: column;
}
@media (max-width: 699px) {
  .woocommerce ul.products li.product, ul.products li.product { padding: 6px; }
}
ul.products li.product a img, .et-photo {
  aspect-ratio: 1 / 1; object-fit: contain; width: 100%;
  border-radius: 6px; background: var(--et-panel); margin-bottom: 10px;
}
/* Product photos sit on a white plate, as they do on every major retailer.
   Two reasons: a minority of the catalogue PNGs (~3% of the alpha-capable
   ones) are true cut-outs that vanish against a dark card, and every image
   below the fold is lazy-loaded, so until it arrives the browser paints this
   background -- white reads as "loading", near-black reads as "broken".
   object-fit is `contain`, not `cover`: these are product shots and cropping
   a square out of a tall tool cuts the head or the handle off.
   Scoped with :not(.product-category) -- WooCommerce gives brand tiles BOTH
   classes (<li class="product-category product">), and those carry
   full-bleed banner art that must not sit on a white plate.
   (.et-photo is the "no photo" placeholder tile and stays dark on purpose.) */
ul.products li.product:not(.product-category) a img { background: #fff; }

/* Brand tiles: banner art edge-to-edge on the page background, no white. */
ul.products li.product-category,
ul.products li.product-category a { background: var(--et-bg); }
ul.products li.product-category a img {
  background: var(--et-bg) !important;
  object-fit: cover; /* banners are wide art -- fill the tile, no letterboxing */
}
.et-photo { display: flex; align-items: center; justify-content: center;
  color: #555; font-family: var(--et-font-display); letter-spacing: 3px; font-size: 13px; }
ul.products li.product .woocommerce-loop-product__title,
ul.products li.product h2 {
  font-family: var(--et-font-body); font-size: 13.5px; font-weight: 500;
  text-transform: none; letter-spacing: 0; line-height: 18px;
  color: var(--et-text); padding: 0; margin: 0 0 8px; min-height: 36px;
  display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden;
}
.woocommerce ul.products li.product .price, .price {
  color: var(--et-text); font-weight: 700; font-size: 16px;
}
.woocommerce ul.products li.product .price del, .price del {
  color: var(--et-muted); font-weight: 400; font-size: 13px; opacity: 1; margin-right: 6px;
}
.woocommerce ul.products li.product .price ins, .price ins { text-decoration: none; }
.woocommerce ul.products li.product .button { margin-top: auto; width: 100%; font-size: 14px; padding: 11px 10px; }
.woocommerce span.onsale, .et-flash {
  position: absolute; top: 16px; left: 16px; z-index: 5;
  background: var(--et-accent); color: #fff;
  min-height: 0; min-width: 0; line-height: 1; border-radius: 6px;
  padding: 5px 8px; font-size: 12px; font-weight: 700; margin: 0;
}
.et-oos-badge {
  position: absolute; top: 46px; left: 16px; z-index: 5;
  background: rgba(var(--et-scrim-rgb),.85); border: 1px solid var(--et-border-2);
  color: var(--et-text-2); border-radius: 6px; padding: 5px 8px;
  font-size: 10.5px; font-weight: 700; letter-spacing: 1px;
}
li.product.outofstock img { opacity: .55; }
.woocommerce nav.woocommerce-pagination ul { border: none; }
.woocommerce nav.woocommerce-pagination ul li { border: none; }
.woocommerce nav.woocommerce-pagination ul li a,
.woocommerce nav.woocommerce-pagination ul li span {
  background: var(--et-card); color: var(--et-text); border-radius: 6px; margin: 0 3px;
}
.woocommerce nav.woocommerce-pagination ul li span.current { background: var(--et-accent); color: #fff; }

/* Category tiles ("Shop by Brand") */
ul.products li.product-category { padding: 0; overflow: hidden; border-color: var(--et-border-2); }

/* Little brand cards — add the class "et-brands" to the section wrapping
   [product_categories] (theme front page and the Elementor home both do).
   Compact 3-across name cards with the real category thumbnail banner shown
   (every category now carries a banner image). */
.et-brands ul.products { grid-template-columns: repeat(3, 1fr) !important; gap: 10px; margin-bottom: 20px !important; }
.et-brands ul.products li.product-category { border-radius: 12px; }
.et-brands ul.products li.product-category a { display: flex; flex-direction: column; align-items: center; justify-content: center; min-height: 0; padding: 8px 4px; }
.et-brands ul.products li.product-category img { display: block !important; width: 100%; height: auto; aspect-ratio: 5 / 2; object-fit: cover; border-radius: 8px 8px 0 0; background: var(--et-card); }
.et-brands ul.products li.product-category h2.woocommerce-loop-category__title {
  border: 0; padding: 8px 4px; margin: 0; width: 100%; font-size: 11px; letter-spacing: .3px;
  line-height: 1.3; text-align: center; overflow-wrap: break-word;
}
.et-brands ul.products li.product-category h2.woocommerce-loop-category__title::after {
  content: ""; display: block; width: 26px; height: 3px; border-radius: 2px;
  background: var(--et-accent); margin: 4px auto 0;
}
@media (min-width: 700px) { .et-brands ul.products { grid-template-columns: repeat(6, 1fr) !important; } }
ul.products li.product-category a { display: block; }
ul.products li.product-category img { aspect-ratio: 5 / 2; margin: 0; border-radius: 0; object-fit: contain; background: var(--et-card); padding: 6px 10px; }
ul.products li.product-category h2.woocommerce-loop-category__title {
  font-family: var(--et-font-display); font-size: 16px; font-weight: 600;
  text-transform: uppercase; letter-spacing: 2px; text-align: center;
  color: var(--et-text); padding: 18px 8px; margin: 0; min-height: 0;
  border-top: 3px solid var(--et-accent); -webkit-line-clamp: unset; display: block;
}
ul.products li.product-category h2 .count { display: none; }
ul.products li.product-category:hover h2 { color: var(--et-gold); }

/* Brand category tiles with mini product grids (front-page.php replacement for
   [product_categories]). Each tile shows the brand logo + 4 mini product cards
   with Buy Now buttons. */
.brand-category-tile {
  border: 1px solid var(--et-border-2);
  border-radius: 12px;
  overflow: hidden;
  background: var(--et-card);
  margin-bottom: 16px;
}
.brand-tile-link {
  display: block;
  padding: 12px 14px;
  text-decoration: none;
}
.brand-tile-title {
  font-family: var(--et-font-display);
  font-size: 14px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 1.5px;
  color: var(--et-text);
  margin: 6px 0 2px;
}
.brand-tile-count {
  font-size: 12px;
  color: var(--et-muted);
  margin: 0;
}
.brand-tile-products {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 8px;
  padding: 10px 12px 14px;
}
.mini-product-tile {
  border: 1px solid var(--et-border-2);
  border-radius: 8px;
  overflow: hidden;
  background: var(--et-card-2);
}
.mini-product-tile-image {
  display: block;
  width: 100%;
  aspect-ratio: 1 / 1;
  overflow: hidden;
}
.mini-product-tile-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.mini-product-tile-info {
  padding: 6px 8px;
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.mini-product-tile-title {
  font-size: 11px;
  font-weight: 600;
  color: var(--et-text);
  text-decoration: none;
  line-height: 1.3;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.mini-product-tile-price {
  font-size: 12px;
  font-weight: 700;
  color: var(--et-deal);
}
.mini-et-card-buynow {
  display: block;
  font-family: var(--et-font-display);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .03em;
  text-transform: uppercase;
  color: var(--et-accent);
  text-align: center;
  margin-top: 4px;
  text-decoration: none;
}
.mini-et-card-buynow.is-auction {
  background: var(--et-accent);
  color: #fff !important;
  padding: 6px 0;
  border-radius: 6px;
  border: 1.5px solid var(--et-accent);
  width: 100%;
  text-decoration: none;
  transition: background .15s, color .15s;
  cursor: pointer;
}
.mini-et-card-buynow.is-auction:hover {
  background: #fff;
  color: var(--et-accent) !important;
}

/* =============================================================
   9. WOOCOMMERCE — SINGLE PRODUCT
   ============================================================= */
.woocommerce .woocommerce-breadcrumb { color: var(--et-muted); font-size: 12.5px; padding-top: 14px; }
.woocommerce .woocommerce-breadcrumb a { color: var(--et-muted); }
.woocommerce div.product { color: var(--et-text); }
.woocommerce div.product .product_title { font-size: 22px; text-transform: none; letter-spacing: .3px; }
.woocommerce div.product div.images { margin-bottom: 18px; position: relative; }
.woocommerce div.product div.images img { border-radius: var(--et-radius); background: #fff; }
.woocommerce div.product p.price { color: var(--et-text); font-size: 24px; font-weight: 700; }
.woocommerce div.product p.price del { color: var(--et-muted); font-size: 16px; }
.woocommerce div.product p.price ins { text-decoration: none; }
.et-save-badge {
  display: inline-block; background: rgba(var(--et-gold-rgb),.14); color: var(--et-gold);
  border: 1px solid rgba(var(--et-gold-rgb),.4); border-radius: 6px;
  padding: 4px 9px; font-size: 13px; font-weight: 700; margin: 2px 0 10px;
}
.et-condition-note {
  border-left: 3px solid var(--et-gold); background: var(--et-card);
  border-radius: 0 var(--et-radius) var(--et-radius) 0;
  padding: 10px 12px; margin: 14px 0; font-size: 13px; font-style: italic; color: var(--et-gold);
}
.et-pickup-note { display: flex; align-items: center; gap: 8px; color: var(--et-text); font-size: 14px; font-weight: 600; margin: 10px 0 4px; }
.et-pickup-note svg { stroke: var(--et-accent); flex: none; }
.et-pickup-note small { color: var(--et-muted); font-weight: 400; }
.woocommerce div.product form.cart { margin: 16px 0; display: flex; gap: 10px; flex-wrap: wrap; }
.woocommerce div.product form.cart div.quantity { margin: 0; }
.woocommerce .quantity .qty {
  width: 74px; min-height: 46px; text-align: center;
  background: var(--et-card); border: 1px solid var(--et-border-2);
  color: var(--et-text); border-radius: var(--et-radius);
}
.woocommerce div.product form.cart .single_add_to_cart_button { flex: 1; min-height: 46px; }
.woocommerce div.product .product_meta { color: var(--et-muted); font-size: 13px; border-top: 1px solid var(--et-border); padding-top: 12px; }
.woocommerce div.product .product_meta a { color: var(--et-gold); }
.woocommerce div.product .woocommerce-tabs ul.tabs { padding: 0; margin: 0 0 -1px; }
.woocommerce div.product .woocommerce-tabs ul.tabs::before { border-color: var(--et-border); }
.woocommerce div.product .woocommerce-tabs ul.tabs li {
  background: var(--et-card); border-color: var(--et-border); border-radius: 8px 8px 0 0;
}
.woocommerce div.product .woocommerce-tabs ul.tabs li a { color: var(--et-muted); }
.woocommerce div.product .woocommerce-tabs ul.tabs li.active { background: var(--et-surface); }
.woocommerce div.product .woocommerce-tabs ul.tabs li.active a { color: var(--et-text); }
.woocommerce div.product .woocommerce-tabs .panel { border: 1px solid var(--et-border); border-radius: 0 8px 8px 8px; padding: 16px; }
.related.products > h2, .upsells.products > h2 { padding-left: 12px; border-left: 4px solid var(--et-accent); }
.woocommerce div.product p.stock.out-of-stock { color: var(--et-accent); font-weight: 700; }

/* =============================================================
   10. CART / CHECKOUT / ACCOUNT
   ============================================================= */
.woocommerce table.shop_table { border: 1px solid var(--et-border); border-radius: var(--et-radius); }
.woocommerce table.shop_table th, .woocommerce table.shop_table td { border-color: var(--et-border) !important; color: var(--et-text); }
.woocommerce table.shop_table tbody th, .woocommerce table.shop_table tfoot td, .woocommerce table.shop_table tfoot th { border-color: var(--et-border); }
.woocommerce-cart table.cart img { border-radius: 6px; }
.woocommerce .cart_totals, .woocommerce .woocommerce-checkout-review-order,
#add_payment_method #payment, .woocommerce-cart #payment, .woocommerce-checkout #payment {
  background: var(--et-card); border-radius: var(--et-radius);
}
.woocommerce-checkout #payment div.payment_box { background: var(--et-panel); color: var(--et-text); }
.woocommerce-checkout #payment div.payment_box::before { border-bottom-color: var(--et-panel); }
.woocommerce form .form-row label { color: var(--et-muted); font-size: 13px; }
.select2-container--default .select2-selection--single { background: var(--et-card); border: 1px solid var(--et-border-2); height: 42px; }
.select2-container--default .select2-selection--single .select2-selection__rendered { color: var(--et-text); line-height: 42px; }
.woocommerce-account .woocommerce-MyAccount-navigation ul { list-style: none; padding: 0; }
.woocommerce-account .woocommerce-MyAccount-navigation li a {
  display: block; padding: 10px 14px; background: var(--et-card);
  border-radius: 6px; margin-bottom: 6px; color: var(--et-text);
}
.woocommerce-account .woocommerce-MyAccount-navigation li.is-active a { border-left: 3px solid var(--et-accent); }

/* =============================================================
   11. PAGES / POSTS / FOOTER
   ============================================================= */
.et-page-head { padding: 28px 0 6px; }
.et-page-head h1 { padding-left: 12px; border-left: 4px solid var(--et-accent); }
.entry-content { padding-bottom: 30px; }
.entry-content a { text-decoration: underline; text-underline-offset: 2px; }

/* Reference pages written in blocks (the /wix-guide page is the first).
   Everything is scoped to a Group block with the class `et-doc`, so the
   WooCommerce tables that cart, checkout and My Account render inside
   .entry-content are never touched. */
.et-doc { max-width: 880px; font-size: 16px; line-height: 1.6; color: var(--et-text); }
.et-doc > * + * { margin-top: 16px; }
.et-doc h2 { margin-top: 44px; padding-top: 18px; border-top: 1px solid var(--et-border); }
.et-doc h3 { margin-top: 28px; }
.et-doc p, .et-doc li { max-width: 72ch; }
.et-doc li + li { margin-top: 6px; }
.et-doc ol ul, .et-doc ul ul { margin-top: 6px; }
.et-doc code { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: .88em; background: var(--et-panel); border: 1px solid var(--et-border); border-radius: 4px; padding: 1px 5px; overflow-wrap: anywhere; }
.et-doc .wp-block-code { background: var(--et-panel); border: 1px solid var(--et-border); border-radius: var(--et-radius, 8px); padding: 14px 16px; overflow-x: auto; font-size: 13px; line-height: 1.55; }
.et-doc .wp-block-code code { background: none; border: 0; padding: 0; white-space: pre; overflow-wrap: normal; font-size: inherit; }
.et-doc .wp-block-table { overflow-x: auto; margin: 18px 0 8px; }
.et-doc .wp-block-table table { width: 100%; min-width: 640px; border-collapse: collapse; font-size: 14.5px; line-height: 1.45; }
.et-doc .wp-block-table th, .et-doc .wp-block-table td { border: 1px solid var(--et-border); padding: 9px 12px; text-align: left; vertical-align: top; }
.et-doc .wp-block-table thead { border-bottom: 2px solid var(--et-border-2); }
.et-doc .wp-block-table thead th { background: var(--et-panel); font-weight: 600; }
.et-doc .wp-block-image { margin: 22px 0 26px; }
.et-doc .wp-block-image img { height: auto; border: 1px solid var(--et-border); border-radius: var(--et-radius, 8px); }
.et-doc .wp-block-image.is-narrow img { max-width: min(100%, 430px); }
.et-doc .wp-block-image figcaption { color: var(--et-muted); font-size: 13.5px; margin-top: 8px; text-align: left; }
.et-doc .et-note { background: var(--et-panel-4); border: 1px dashed var(--et-border-2); border-radius: var(--et-radius, 8px); padding: 12px 16px; color: var(--et-text-2); font-size: 14.5px; }
.et-doc .et-toc { columns: 2 240px; column-gap: 32px; padding-left: 18px; }
.et-doc .et-toc li { break-inside: avoid; }
.et-doc .et-checklist { list-style: none; padding-left: 0; }
.et-doc .et-checklist li::before { content: "\2610"; margin-right: 10px; color: var(--et-muted); }
.site-footer { background: var(--et-bg); border-top: 1px solid var(--et-border); padding: 30px 0 26px; }
.site-footer .site-logo { text-align: left; margin-bottom: 14px; }
.site-footer nav ul { list-style: none; margin: 0 0 16px; padding: 0; display: flex; flex-wrap: wrap; gap: 6px 18px; }
.site-footer nav a { color: var(--et-text-2); font-size: 13px; letter-spacing: 1px; text-transform: uppercase; font-family: var(--et-font-display); }
.site-footer nav a:hover { color: var(--et-gold); }
.site-footer .et-footnote { color: var(--et-muted); font-size: 12.5px; margin: 0; }
.et-404 { text-align: center; padding: 70px 0; }
.et-404 h1 { font-size: 64px; color: var(--et-accent); }

/* =============================================================
   12. ELEMENTOR COMPATIBILITY
   ============================================================= */
.elementor-heading-title { font-family: var(--et-font-display); text-transform: uppercase; letter-spacing: .5px; }
.elementor-widget-text-editor { color: var(--et-text); }
.elementor a.elementor-button { color: #fff; }
.elementor-widget-shortcode .et-section { padding: 0; }
.elementor-kit- .elementor-section { background-color: transparent; }

/* =============================================================
   Shop by Brand — full-bleed banner pills.
   Banner image fills the ENTIRE pill; no frame, padding or border.
   ============================================================= */
/* Brand tiles: labeled cards, not anonymous pills. The old pills fixed the
   tile at 3:1 with overflow:hidden (clipping the name clean off), stretched
   the art with object-fit:fill (distorting every non-matching banner) and
   hid the title outright. Now: the banner letterboxes onto the card colour
   (contain — never cropped, never stretched) and the category name is the
   label under it. */
.et-brands ul.products li.product-category {
  padding: 0 !important;
  margin: 0 !important;
  border: 1px solid var(--et-border) !important;
  border-radius: 12px;
  overflow: hidden;
  background: var(--et-surface);
  display: block;
}
.et-brands ul.products li.product-category a {
  display: block;
  width: 100%;
  padding: 0 !important; margin: 0 !important;
  min-height: 0;
}
.et-brands ul.products li.product-category a img,
.et-brands ul.products li.product-category img {
  display: block !important;
  width: 100% !important;
  height: auto !important;
  aspect-ratio: 5 / 2 !important;
  object-fit: contain !important;
  padding: 6px !important;
  margin: 0 !important;
  box-sizing: border-box;
  border-radius: 12px 12px 0 0;
  background: var(--et-card);
}

/* Shop by Brand — 2 banners wide (bigger). Overrides the 3/6-col grid. */
.et-brands ul.products { grid-template-columns: repeat(2, 1fr) !important; gap: 14px !important; }
@media (min-width: 700px) { .et-brands ul.products { grid-template-columns: repeat(2, 1fr) !important; } }

/* --- "x sold this week" social proof ------------------------------------ */
/* Only rendered when a product actually moved >=1 unit in the last 7 days,
   so it never shows a dead "0 sold". Green reads as momentum without
   competing with the red sale badge. */
.et-sold {
  display: inline-block; margin: 0 0 6px;
  font-family: var(--et-font-body); font-size: 11.5px; font-weight: 600;
  letter-spacing: .02em; color: var(--et-deal-2);
}
.woocommerce div.product .et-sold { font-size: 13px; margin-bottom: 10px; }

/* --- storefront band (replaces the old Hot Deals grid) ------------------- */
.et-storefront {
  position: relative; overflow: hidden;
  border-radius: var(--et-radius);
  border: 1px solid var(--et-border);
  aspect-ratio: 1 / 1;              /* mobile: square */
  display: flex; align-items: flex-end;
}
@media (min-width: 700px) {
  /* desktop: two tiles wide, matching the brand grid beside it */
  .et-storefront { aspect-ratio: 2 / 1; }
}
.et-storefront__img {
  position: absolute; inset: 0; width: 100%; height: 100%;
  object-fit: cover; display: block; border-radius: 0;
}
.et-storefront__copy {
  position: relative; z-index: 2; width: 100%;
  padding: 22px 20px 20px;
  background: linear-gradient(to top, rgba(var(--et-scrim-rgb),.95) 0%, rgba(var(--et-scrim-rgb),.82) 55%, rgba(var(--et-scrim-rgb),.25) 100%);
}
.et-storefront__tagline {
  margin: 0 0 6px; font-size: 24px; line-height: 1.1; color: var(--et-text);
}
.et-storefront__sub {
  margin: 0; font-size: 14px; line-height: 1.45; color: var(--et-text-4); max-width: 52ch;
}
@media (min-width: 700px) {
  .et-storefront__copy { padding: 34px 32px 28px; }
  .et-storefront__tagline { font-size: 34px; }
  .et-storefront__sub { font-size: 15.5px; }
}

/* Product-page analytics line (views / adds to cart). Muted so it reads as
   supporting detail next to the price, not another badge competing for
   attention. Only rendered when a metric is actually non-zero. */
.et-stats {
  margin: 0 0 12px; font-size: 13px; color: var(--et-muted);
  letter-spacing: .01em;
}

/* =============================================================
   BACK IN STOCK NOTIFIER — themed to match
   ============================================================= */
/* The plugin ships a Bootstrap "panel panel-primary" in default blue, which
   reads as a third-party widget bolted onto a dark store. Restyled here to
   look like the rest of the product summary: dark card, Empire red action. */
.cwginstock-panel-primary,
.cwginstock-subscribe-form .panel {
  background: var(--et-card) !important;
  border: 1px solid var(--et-border) !important;
  border-radius: var(--et-radius) !important;
  box-shadow: none !important;
  overflow: hidden;
}
.cwginstock-panel-heading,
.cwginstock-subscribe-form .panel-heading {
  background: var(--et-accent) !important;
  border: 0 !important; color: #fff !important;
  font-family: var(--et-font-display); letter-spacing: .5px;
  text-transform: uppercase; font-size: 15px; padding: 12px 16px !important;
}
.cwginstock-panel-body { background: transparent !important; padding: 16px !important; }
.cwginstock-subscribe-form input[type="text"],
.cwginstock-subscribe-form input[type="email"],
input.cwgstock_name, input.cwgstock_email {
  background: var(--et-card-2) !important;
  border: 1px solid var(--et-border-2) !important;
  border-radius: 6px !important;
  color: var(--et-text) !important;
  min-height: 44px !important; padding: 0 12px !important;
  font-family: var(--et-font-body) !important; font-size: 15px !important;
  width: 100% !important; margin-bottom: 10px !important;
}
.cwginstock-subscribe-form input::placeholder { color: var(--et-muted) !important; opacity: 1; }
button.cwgstock_button, .cwgstock_button {
  background: var(--et-accent) !important; color: #fff !important;
  border: 0 !important; border-radius: var(--et-radius) !important;
  width: 100% !important; min-height: 46px !important;
  font-family: var(--et-font-body) !important; font-weight: 600 !important;
  font-size: 15px !important; cursor: pointer;
}
button.cwgstock_button:hover, .cwgstock_button:hover { background: var(--et-accent-dark) !important; }
.cwgstock_output { color: var(--et-text) !important; font-size: 14px; }

/* =============================================================
   WOOCOMMERCE BLOCKS (cart + checkout) — match the theme
   ============================================================= */
/* The blocks UI ships its own component styles, so the theme's button rules
   never reach it — "Place Order" rendered grey. Scope to the two primary
   submit buttons only: quantity steppers are also .wc-block components and
   must NOT turn red. */
.wc-block-components-checkout-place-order-button,
.wc-block-cart__submit-button {
  background: var(--et-accent) !important; color: #fff !important;
  border: 0 !important; border-radius: var(--et-radius) !important;
  font-family: var(--et-font-body) !important; font-weight: 600 !important;
  font-size: 16px !important; min-height: 50px !important;
}
.wc-block-components-checkout-place-order-button:hover,
.wc-block-cart__submit-button:hover { background: var(--et-accent-dark) !important; }
/* Totals emphasis: the number people check before committing. */
.wc-block-components-totals-footer-item .wc-block-components-totals-item__value { font-size: 22px; font-weight: 700; }

/* =============================================================
   UX PASS — price-first hierarchy, 44px tap targets, mobile focus
   (implements the 2026-09-01 page-by-page audit)
   ============================================================= */

/* --- product cards: the PRICE is the product on a discount store ---------- */
.woocommerce ul.products li.product .price ins,
.woocommerce ul.products li.product .price ins .amount,
.woocommerce ul.products li.product .price > .amount {
  font-size: 20px; font-weight: 800; letter-spacing: .01em;
}
.woocommerce ul.products li.product .price del,
.woocommerce ul.products li.product .price del .amount { font-size: 13px; font-weight: 400; }
/* Anchor price+button to the card bottom so rows align even when titles wrap
   to three lines (the old fixed min-height let prices float at odd heights). */
.woocommerce ul.products li.product .price { margin-top: auto; padding-top: 6px; }
.woocommerce ul.products li.product .button {
  margin-top: 8px; min-height: 44px; font-size: 15px; font-weight: 700; padding: 12px 10px;
}
/* Discount badge earns more presence next to the bigger price. */
.woocommerce span.onsale, .et-flash { font-size: 14px; padding: 5px 9px; }

/* --- pagination: 59 pages of catalog deserve thumb-sized controls --------- */
.woocommerce nav.woocommerce-pagination ul li a,
.woocommerce nav.woocommerce-pagination ul li span {
  display: inline-flex; align-items: center; justify-content: center;
  min-width: 44px; min-height: 44px;
}

/* --- brand chip row on shop + search -------------------------------------- */
.et-brand-chips {
  display: flex; gap: 8px; overflow-x: auto; -webkit-overflow-scrolling: touch;
  padding: 2px 2px 10px; margin: 0 0 6px; scrollbar-width: none;
}
.et-brand-chips::-webkit-scrollbar { display: none; }
.et-chip {
  flex: 0 0 auto; display: inline-flex; align-items: center;
  min-height: 40px; padding: 8px 16px;
  background: var(--et-card); border: 1px solid var(--et-border-2);
  border-radius: 999px; color: var(--et-text);
  font-size: 14px; font-weight: 600; white-space: nowrap;
}
.et-chip:hover { border-color: var(--et-accent); color: #fff; }

/* --- single product: price dominates, CTA unmistakable -------------------- */
.woocommerce div.product p.price {
  font-size: 34px; font-weight: 800; color: var(--et-text); line-height: 1.1;
}
.woocommerce div.product p.price ins { font-size: 34px; font-weight: 800; text-decoration: none; }
.woocommerce div.product p.price del { font-size: 15px; font-weight: 400; opacity: .8; }
.woocommerce div.product form.cart .single_add_to_cart_button {
  min-height: 52px; font-size: 17px; font-weight: 700;
}
.woocommerce div.product form.cart .quantity .qty { min-height: 52px; }
.woocommerce div.product p.stock.in-stock {
  color: var(--et-deal); font-weight: 700; font-size: 14.5px;
}
.woocommerce div.product p.stock.in-stock::before { content: "\2713\00a0"; }
.woocommerce div.product p.stock.out-of-stock {
  display: inline-block; font-size: 14px; font-weight: 700;
  text-transform: uppercase; letter-spacing: .5px;
  border: 1px solid var(--et-accent); border-radius: 6px;
  padding: 5px 12px; color: var(--et-alert);
}
/* Description tab: hide the doubled heading + the empty spacer paragraphs
   the Wix export left behind. */
.woocommerce-Tabs-panel--description > h2:first-child { display: none; }
.woocommerce-Tabs-panel p:empty { display: none; }

/* --- out-of-stock notify panel: one red action only ----------------------- */
/* The panel HEADING was styled exactly like the primary button (solid red,
   full width) — two "buttons" where only Subscribe is tappable. Demote the
   heading to a label so the single real action keeps the red. */
.cwginstock-panel-heading,
.cwginstock-subscribe-form .panel-heading {
  background: var(--et-card-2) !important;
  color: var(--et-text) !important;
  border-left: 4px solid var(--et-accent) !important;
  font-size: 14px !important;
}

/* --- blocks cart/checkout: hierarchy + tap targets ------------------------ */
/* The sticky proceed bar sits exactly where the theme's fixed bottom tab bar
   lives; lift it above so neither control is buried. */
.wc-block-cart__submit-container--sticky {
  bottom: calc(var(--et-bottombar-h) + env(safe-area-inset-bottom, 0px)) !important;
  background: var(--et-surface); border-top: 1px solid var(--et-border);
}
.wc-block-cart .wc-block-cart__submit-button { text-decoration: none !important; }
.wc-block-cart-items .wc-block-components-product-price__value.is-discounted {
  font-size: 18px; font-weight: 700; color: var(--et-text);
}
.wc-block-components-sale-badge {
  background: var(--et-accent) !important; color: #fff !important; border-color: var(--et-accent) !important;
}
.wc-block-components-quantity-selector__button { min-width: 44px; min-height: 44px; }
.wc-block-cart-item__remove-link { display: inline-block; padding: 12px 8px; }
/* The short description merely echoes the title on every imported product. */
.wc-block-cart-items .wc-block-components-product-metadata__description { display: none; }
.wc-block-components-order-summary .wc-block-components-product-metadata__description { display: none; }
/* Checkout small controls under 44px */
.wc-block-components-address-form__address_2-toggle,
.wc-block-checkout__add-note .wc-block-components-checkbox__label,
.wc-block-components-checkout-return-to-cart-button {
  min-height: 44px; display: inline-flex; align-items: center;
}


/* --- my account ----------------------------------------------------------- */
.et-login-note { color: var(--et-muted); font-size: 14.5px; margin: 0 0 16px; }
.woocommerce-form-login .woocommerce-form-login__submit { min-height: 48px; font-size: 16px; }
@media (max-width: 700px) {
  .woocommerce-form-login .woocommerce-form-login__submit { display: block; width: 100%; }
}
.woocommerce-form__input-checkbox { width: 22px; height: 22px; accent-color: var(--et-accent); }
.woocommerce-form-login__rememberme { display: inline-flex; align-items: center; gap: 10px; min-height: 44px; }

/* --- 404: one big obvious way back to the deals --------------------------- */
.error404 .site-main { display: flex; align-items: center; justify-content: center; }
.error404 .site-main .container { width: 100%; }
.et-404 { padding: 40px 0; }
.et-404 .et-btn { font-size: 17px; font-weight: 700; padding: 16px 32px; min-height: 48px; margin: 4px 6px 0 0; }

/* --- hero CTA: biggest tappable element in the card ----------------------- */
.et-hero-card .elementor-button { font-size: 16px; font-weight: 700; padding: 14px 28px; }

/* --- footer: real tap targets without changing the look ------------------- */
.site-footer nav a { display: inline-block; padding: 12px 10px; }
.site-footer nav ul { gap: 0 8px; margin-left: -10px; /* offset link tap-padding so rows align with the logo */ }

/* --- contact page action buttons ------------------------------------------ */
.et-call-btn { font-size: 18px; min-height: 50px; display: inline-flex; align-items: center; }
.et-directions-btn { margin-top: 8px; display: inline-flex; align-items: center; min-height: 46px; }

/* Pickup-only: a single shipping option is not a choice — hide the lone radio
   in cart totals so it reads as a fact, not a decision. (Checkout keeps its
   Pickup row, which the customer does confirm.) */
.wc-block-cart .wc-block-components-totals-shipping .wc-block-components-shipping-rates-control { display: none; }

/* =============================================================
   UX PASS v2 — price truly dominant, badge consistency, polish
   (from the before/after verification round)
   ============================================================= */

/* PRICE must be unmistakably the biggest thing on a card. The v1 bump to 20px
   still tied the bold 3-line title; go to 24px/900 and lighten the title so
   price wins at a glance. */
.woocommerce ul.products li.product .price,
.woocommerce ul.products li.product .price ins,
.woocommerce ul.products li.product .price ins .amount,
.woocommerce ul.products li.product .price > .amount {
  font-size: 24px; font-weight: 900; line-height: 1.05;
}
.woocommerce ul.products li.product .price del,
.woocommerce ul.products li.product .price del .amount { font-size: 13px; font-weight: 400; }
.woocommerce ul.products li.product .woocommerce-loop-product__title,
.woocommerce ul.products li.product h2.woocommerce-loop-product__title {
  font-weight: 400; font-size: 13px;
}

/* Single product: price dominates the buy box outright. */
.woocommerce div.product p.price,
.woocommerce div.product p.price ins,
.woocommerce div.product p.price ins .amount { font-size: 38px; font-weight: 900; }
.woocommerce div.product .product_title.entry-title { font-size: 20px; font-weight: 700; }

/* One savings-badge treatment everywhere: solid red, matching the -% badge
   (was a gold outline on the product page, red fill in the cart). */
.et-save-badge {
  background: var(--et-accent); color: #fff; border: 0;
  font-size: 13px; font-weight: 800; letter-spacing: .02em; padding: 5px 10px;
}

/* Footer links: keep them in the warm palette, never the browser blue that a
   :visited state can leak in. */
.site-footer nav a,
.site-footer nav a:link,
.site-footer nav a:visited { color: var(--et-text-2); }
.site-footer nav a:hover { color: var(--et-gold); }

/* Mobile: cap the product hero so price + Add to cart are reachable without a
   long scroll (the gallery was eating the whole first viewport). */
@media (max-width: 700px) {
  .woocommerce div.product .woocommerce-product-gallery { width: 100%; max-width: 100%; margin: 0 auto; }
  .woocommerce div.product .woocommerce-product-gallery__image img { max-height: 60vh; object-fit: contain; }
}

/* Brand-chip row: a soft right-edge fade signals it scrolls rather than
   looking like the last chip is clipped. */
.et-brand-chips { position: relative; -webkit-mask-image: linear-gradient(to right, #000 92%, transparent 100%); mask-image: linear-gradient(to right, #000 92%, transparent 100%); }

/* =============================================================
   FIBOSEARCH — one small block; colors come from the plugin's
   own settings (see elementor-templates/store-config.php)
   ============================================================= */
.site-header__search .dgwt-wcas-search-wrapp {
  flex: 1; min-width: 0; max-width: none;
  background: transparent !important; padding: 0 !important; box-shadow: none !important;
}
.site-header__search .dgwt-wcas-search-input[type="search"],
.site-header__search .dgwt-wcas-search-input[type="search"]:focus,
.site-header__search .dgwt-wcas-search-wrapp.dgwt-wcas-active .dgwt-wcas-search-input[type="search"],
.site-header__search .dgwt-wcas-search-wrapp.dgwt-wcas-search-focused .dgwt-wcas-search-input[type="search"],
.site-header__search .dgwt-wcas-search-wrapp.dgwt-wcas-search-filled .dgwt-wcas-search-input[type="search"] {
  min-height: 46px !important; height: 46px !important;
  font-family: var(--et-font-body) !important; font-size: 16px !important;
  /* all four corners: the field runs full-width UNDER the absolutely-
     positioned button, and square right corners peeked out past the button's
     rounded ones as cream notches. The right pair hides behind the button. */
  border-radius: var(--et-radius) !important;
  /* On the dark theme a borderless cream field was its own edge. On white it
     is very nearly the header colour, so the field needs a real border to
     exist at all — and a border is what makes it identifiable as an input
     under WCAG 1.4.11 non-text contrast. */
  border: 1px solid var(--et-border-2) !important; box-shadow: none !important;
  /* pirx hands the field's background to its wrapper on focus; the wrappers
     are transparent here (halo fix), so the INPUT must own the cream in every
     state or typed text lands on the dark header again. */
  background: var(--et-cream) !important;
  background-color: var(--et-cream) !important;
  color: #1a1a1a !important;
  -webkit-text-fill-color: #1a1a1a !important;
  opacity: 1 !important;
}
.site-header__search .dgwt-wcas-search-input::placeholder { color: #6b6b6b !important; opacity: 1; }
.site-header__search .dgwt-wcas-sf-wrapp { position: relative !important; }
.site-header__search .dgwt-wcas-search-submit {
  min-height: 46px !important; height: 46px !important; width: 52px !important;
  border-radius: 0 var(--et-radius) var(--et-radius) 0 !important;
  border: 0 !important; margin: 0 !important;
  /* pirx absolutely-positions the submit on the LEFT below its mobile
     breakpoint, covering the placeholder — pin it to the right in all
     viewports instead. */
  position: absolute !important; left: auto !important; right: 0 !important; top: 0 !important;
  /* FiboSearch ships the submit with pointer-events:none (decorative in some
     skins) — clicks fell through to the input, so the button did nothing. */
  pointer-events: auto !important; z-index: 3; cursor: pointer;
  /* the plugin only regenerates its color CSS from its own settings screen,
     so paint the submit here as well */
  background: var(--et-accent) !important;
}
/* pirx pads the input on the left for that (relocated) button — rebalance. */
.site-header__search .dgwt-wcas-search-input[type="search"] {
  padding-left: 16px !important; padding-right: 60px !important;
}
.site-header__search .dgwt-wcas-search-submit:hover { background: var(--et-accent-dark) !important; }
.site-header__search .dgwt-wcas-search-submit svg,
.site-header__search .dgwt-wcas-search-submit path { fill: #fff !important; }
.dgwt-wcas-suggestions-wrapp { border-radius: 10px; overflow: hidden; z-index: 1000; }

/* =============================================================
   CARD UNIFORMITY — identical rows regardless of title length
   ============================================================= */
/* The title reserves EXACTLY three lines (its clamp maximum) whether the name
   fills one line or three, so image, title-block, price and button all start
   at the same y in every card of a row. Price+button are already pinned to
   the card bottom via .price { margin-top: auto }. */
ul.products li.product .woocommerce-loop-product__title,
ul.products li.product h2.woocommerce-loop-product__title {
  min-height: 54px;
  margin-bottom: 0;
}
/* A grid of red titles would be a wall of shouting. The title is content;
   the red belongs to the action underneath it. */
ul.products li.product .woocommerce-loop-product__title,
ul.products li.product .woocommerce-loop-product__title a,
ul.products li.product h2.woocommerce-loop-product__title a { color: var(--et-text); }
ul.products li.product a:hover .woocommerce-loop-product__title,
ul.products li.product .woocommerce-loop-product__title a:hover { color: var(--et-accent); }
/* Weekly-sold line (when present) must not shift the price row: give it a
   fixed slot inside the flexible gap instead of extra height. */
ul.products li.product .et-sold { margin: 4px 0 0; }

/* =============================================================
   RESTORED: hero storefront photo (regression — the round-5 CSS
   cleanup excised this block along with the stale search CSS)
   ============================================================= */
/* Extra BACKGROUND LAYERS, not a pseudo-element: .et-hero-card already uses
   ::before (corner glow) and ::after (bolt watermark). Layers top-first:
   red veil (opaque left -> clear right), the photo anchored right, then the
   original red gradient. --et-hero-photo is injected by inc/storefront.php
   and defaults to none so the card renders before any photo is set. */
:root { --et-hero-photo: none; }
.et-hero-card {
  background-image:
    linear-gradient(to right, rgba(0,0,0,0) 90%, rgba(var(--et-scrim-rgb),.85) 100%),
    linear-gradient(to left, rgba(var(--et-accent-lo-rgb),0) 0%, rgba(var(--et-accent-lo-rgb),.55) 34%, rgba(var(--et-accent-rgb),.93) 62%, rgba(var(--et-accent-rgb),1) 80%),
    var(--et-hero-photo),
    linear-gradient(135deg, var(--et-accent-hi) 0%, var(--et-accent) 34%, var(--et-accent-lo) 100%);
  background-size: cover, cover, cover, cover;
  background-position: center, center, right center, center;
  background-repeat: no-repeat, no-repeat, no-repeat;
}
@media (max-width: 700px) {
  .et-hero-card {
    background-image:
      linear-gradient(to left, rgba(var(--et-accent-lo-rgb),.25) 0%, rgba(var(--et-accent-lo-rgb),.86) 42%, rgba(var(--et-accent-rgb),1) 72%),
      var(--et-hero-photo),
      linear-gradient(135deg, var(--et-accent-hi) 0%, var(--et-accent) 34%, var(--et-accent-lo) 100%);
  }
}

/* =============================================================
   SEARCH BAR — kill pirx's white inner wrapper (the "halo")
   ============================================================= */
/* pirx paints .dgwt-wcas-sf-wrapp white, which showed as a white pill around
   the cream field on the dark header. The bar should read as ONE control:
   cream input + red button, flush on the dark background — the original look. */
.site-header__search .dgwt-wcas-sf-wrapp,
.site-header__search .dgwt-wcas-search-form,
.site-header__search .dgwt-wcas-search-wrapp {
  background: transparent !important;
  border: 0 !important; box-shadow: none !important; padding: 0 !important;
}

/* =============================================================
   VISIT THE STORE — dark map block
   ============================================================= */
.et-visit { text-align: center; max-width: 720px; margin: 0 auto; }
.et-visit__map {
  border-radius: var(--et-radius); overflow: hidden;
  border: 1px solid var(--et-border-2); background: var(--et-card);
  aspect-ratio: 16 / 9;
}
.et-visit__map iframe {
  width: 100%; height: 100%; border: 0; display: block;
  /* Google's keyless embed is light-only, which is exactly what this theme
     wants now. The old rule inverted it to match the dark theme; on white
     that inversion produced a black map in a white card. */
}
.et-visit__addr { margin: 14px 0 2px; font-size: 16px; color: var(--et-text); }
.et-visit__hours { margin: 0 0 12px; color: var(--et-text-2); font-size: 14px; }
.et-visit__actions { display: flex; gap: 10px; flex-wrap: wrap; justify-content: center; margin: 0 0 6px; }
.et-visit__actions .et-btn { min-height: 48px; display: inline-flex; align-items: center; }
.et-visit__note { color: var(--et-muted); font-size: 12.5px; margin: 0; }

/* =============================================================
   CHECKOUT / CART CONTRAST — no glare, no black-on-black
   ============================================================= */
/* The blocks checkout rendered pure-white input slabs on the near-black page —
   maximum-contrast stripes that are hard on the eyes. Fields go dark-grey with
   light text (clear 9:1-ish contrast, far softer than white-on-black), and
   panels sit on the card grey so nothing is a raw #000/#fff boundary. */
.wc-block-components-text-input input,
.wc-block-components-text-input input[type="text"],
.wc-block-components-text-input input[type="email"],
.wc-block-components-text-input input[type="tel"],
.wc-block-components-text-input input[type="number"],
.wc-block-components-combobox .wc-block-components-combobox-control input,
.wc-block-components-form .wc-block-components-select .components-custom-select-control__button,
.wc-block-components-country-input input,
.wc-block-components-state-input input,
.wc-block-components-totals-coupon__input input {
  background: var(--et-panel-3) !important;
  color: var(--et-text-3) !important;
  border: 1px solid var(--et-border-2) !important;
  border-radius: 6px !important;
}
.wc-block-components-text-input input:focus,
.wc-block-components-totals-coupon__input input:focus {
  border-color: var(--et-accent) !important;
  box-shadow: 0 0 0 1px var(--et-accent) !important;
}
/* Floating labels + helper copy: muted, never pure white or invisible. */
.wc-block-components-text-input label,
.wc-block-components-combobox label,
.wc-block-components-country-input label,
.wc-block-components-state-input label { color: var(--et-muted) !important; }
.wc-block-components-checkout-step__description,
.wc-block-checkout__terms { color: var(--et-text-5) !important; }
/* Select dropdown panels (country/state) — dark, readable options. */
.components-custom-select-control__menu,
.wc-block-components-combobox-control__suggestions {
  background: var(--et-panel-2) !important; color: var(--et-text-3) !important;
  border: 1px solid var(--et-border-2) !important;
}
/* Panels: order summary, shipping/payment option groups on card grey. */
.wc-block-components-radio-control-accordion-option,
.wc-block-components-shipping-rates-control__package,
.wc-block-checkout__sidebar .wc-block-components-panel,
.wc-block-components-order-summary {
  background: var(--et-card) !important;
  border-color: var(--et-border-2) !important;
}
.wc-block-components-checkout-order-summary__title,
.wc-block-components-panel__button { color: var(--et-text) !important; }
/* Radios / checkboxes in brand red instead of default blue. */
.wc-block-checkout input[type="radio"],
.wc-block-checkout input[type="checkbox"],
.wc-block-cart input[type="checkbox"] { accent-color: var(--et-accent); }
/* Soften remaining hard-white headings inside the funnel only. */
.wc-block-checkout h2, .wc-block-checkout .wc-block-components-title,
.wc-block-cart h2 { color: var(--et-text-3); }

/* Price block: identical two-line shape on every card. The struck original
   price gets its own small line above the big price — when both sat inline,
   longer amounts ($249.00 $120.00) wrapped and pushed that card's button a
   line below its neighbours'. min-height keeps the rare not-on-sale card the
   same shape too. */
.woocommerce ul.products li.product .price {
  display: flex; flex-direction: column; align-items: flex-start;
  min-height: 44px; justify-content: flex-end;
}
.woocommerce ul.products li.product .price del { line-height: 1.3; }
.woocommerce ul.products li.product .price ins { line-height: 1.05; }

/* =============================================================
   AUCTIONS — theme the Ultimate Auction UI
   ============================================================= */
/* Countdown: the plugin ships a pale mint box that glows on the dark page.
   Dark card + green digits keeps the urgency without the glare. */
.uwa-main-auction-product.uwa_auction_product_countdown,
.uwa_auction_product_countdown .countdown_row,
.uwa_auction_product_countdown { background: var(--et-card) !important; border: 1px solid var(--et-border-2) !important; border-radius: var(--et-radius); color: var(--et-text) !important; overflow: hidden; }
.uwa_auction_product_countdown .countdown_amount,
.uwa_auction_product_countdown .countdown_section { color: var(--et-deal) !important; background: transparent !important; }
/* the plugin leaves a 6px-wide empty .countdown_row span that paints a white
   sliver at the card's right edge */
.uwa_auction_product_countdown span.countdown_row {
  background: transparent !important; background-image: none !important;
  border: 0 !important; box-shadow: none !important;
}
.uwa_auction_product_countdown .countdown_section { border-color: var(--et-border-2) !important; }
/* Timezone line is developer noise for shoppers. */
.uwa_auction_product_timezone { display: none !important; }
/* Reserve status: keep it readable but not alarming-red-on-black harsh. */
.uwa_auction_reserve_not_met { color: var(--et-alert-2) !important; font-weight: 600; }
/* Bid box: match the theme controls. */
.uwa_auction_form input[name="uwa_bid_value"] {
  background: var(--et-card-2) !important; color: var(--et-text) !important;
  border: 1px solid var(--et-border-2) !important; border-radius: 6px !important;
  min-height: 48px !important; padding: 0 12px !important; font-size: 16px !important;
}
.uwa_auction_form .uwa_place_bid_button, .uwa_auction_form button {
  min-height: 48px; font-weight: 700;
}
.uwa_inc_price_hint { color: var(--et-muted); font-size: 13px; }
/* The blue circular hammer badge the plugin stamps on grid cards clashes
   with the brand; the "Starting bid" line + Bid now button already say
   "auction", so drop the sticker. */
ul.products li.product .uwa_auction_bage_icon,
.uwa_auction_bage_icon,
ul.products li.product .auction-bage,
ul.products li.product img[src*="auction"],
ul.products li.product [class*="uwa"] img[src*="hammer"] { display: none !important; }
/* Watchlist link + condition line, themed. */
.uwa-watchlist-button a { color: var(--et-gold); }
.uwa_auction_condition { color: var(--et-muted); }
/* Grid "Starting bid / Current bid" line gets the price treatment. */
ul.products li.product .woo-ua-auction-price {
  font-size: 20px; font-weight: 800; color: var(--et-text);
}
/* Pre-bid verification nudge on the product page. */
.et-bid-verify {
  border-left: 3px solid var(--et-accent); background: var(--et-card);
  border-radius: 0 var(--et-radius) var(--et-radius) 0;
  padding: 10px 12px; margin: 10px 0; font-size: 13.5px;
}

/* Buy Now on auction pages: the "skip the bidding" escape hatch. */
.et-buy-now { margin: 14px 0 6px; }
.et-buy-now form { margin: 0; }
.et-buy-now__btn { width: 100%; min-height: 50px; font-size: 16px; font-weight: 700; }
.et-buy-now__btn:disabled {
  background: var(--et-border) !important; color: var(--et-muted) !important; cursor: not-allowed;
}
.et-buy-now small { display: block; margin-top: 6px; color: var(--et-muted); font-size: 12.5px; }

/* =============================================================
   MEMBERSHIP / RETURNS / RETAIL / INFINITE SCROLL
   ============================================================= */
.et-retail-line { color: var(--et-muted); font-size: 14px; margin: 2px 0 8px; }
.et-retail-line del { color: var(--et-muted); }
.et-retail-line strong { color: var(--et-deal); }
.et-returns { font-size: 13.5px; margin: 8px 0; }
.et-returns--no { color: var(--et-warn); }
.et-returns--yes { color: var(--et-ok); }
.et-inventory-note {
  color: var(--et-muted); font-size: 12.5px; margin: 4px 0 10px;
  border-left: 3px solid var(--et-border-2); padding-left: 10px;
}
.et-member-nudge {
  background: var(--et-card); border: 1px dashed var(--et-border-2);
  border-radius: var(--et-radius); padding: 10px 12px;
  font-size: 13px; color: var(--et-text-2); margin: 10px 0;
}
.et-member-nudge a { font-weight: 700; }
.et-field-hint { display: block; color: var(--et-muted); font-size: 12px; margin-top: 4px; }
/* registration panel matches login styling */
.woocommerce-form-register .woocommerce-form-register__submit { min-height: 48px; font-size: 16px; }
@media (max-width: 700px) { .woocommerce-form-register .woocommerce-form-register__submit { display: block; width: 100%; } }

/* infinite scroll chrome */
.et-scroll-sentinel { display: flex; align-items: center; justify-content: center; gap: 10px; padding: 22px 0; color: var(--et-muted); }
.et-scroll-spinner {
  width: 18px; height: 18px; border-radius: 50%;
  border: 2px solid var(--et-border-2); border-top-color: var(--et-accent);
  animation: et-spin .8s linear infinite;
}
@keyframes et-spin { to { transform: rotate(360deg); } }
.et-scroll-end { text-align: center; color: var(--et-muted); padding: 18px 0 6px; font-size: 13.5px; }

/* early-access lock panel */
.et-early-lock {
  background: var(--et-card); border: 1px solid var(--et-border-2);
  border-left: 4px solid var(--et-gold); border-radius: var(--et-radius);
  padding: 14px 16px; margin: 12px 0; font-size: 14.5px; color: var(--et-text);
}

/* =============================================================
   STYLE FIXES — auction info pileup + blocks empty-cart upsell
   ============================================================= */
/* The plugin's own "Item condition" line duplicates the theme's styled
   condition note — one of them goes. */
.uwa_auction_condition, .uwa_auction_current_condition { display: none !important; }

/* Blocks empty-cart "New in store" grid ignored the theme entirely:
   gold underlined titles, no card surfaces, ghost badges. Bring it in line
   with the product cards everywhere else. */
.wc-block-grid__products { gap: 12px; }
.wc-block-grid__product {
  background: var(--et-card); border: 1px solid var(--et-border) !important;
  border-radius: var(--et-radius); padding: 10px;
}
.wc-block-grid__product-link { text-decoration: none !important; }
.wc-block-grid__product-title {
  color: var(--et-text) !important; font-family: var(--et-font-body);
  font-size: 13px !important; font-weight: 400; text-decoration: none !important;
  line-height: 1.35; margin: 6px 0 4px !important;
}
.wc-block-grid__product-price {
  color: var(--et-text) !important; font-size: 20px; font-weight: 800;
}
.wc-block-grid__product-price del { font-size: 13px; font-weight: 400; color: var(--et-muted); }
.wc-block-grid__product-price ins { text-decoration: none; }
.wc-block-grid__product-onsale {
  background: var(--et-accent) !important; color: #fff !important;
  border: 0 !important; border-radius: 6px; font-size: 12px; font-weight: 700;
  text-transform: uppercase; padding: 4px 8px;
}
.wc-block-grid__product .wp-block-button__link { width: 100%; min-height: 44px; }
.wc-block-grid__product-image img { background: #fff; border-radius: 6px; }
/* Empty-cart face icon: tone it into the theme instead of hospital-gray. */
.wc-block-cart__empty-cart__title { color: var(--et-text); }

/* blocks grid buttons: solid brand red, never the washed outline variant */
.wc-block-grid__product .wp-block-button__link {
  background: var(--et-accent) !important; color: #fff !important;
  border: 0 !important; border-radius: var(--et-radius) !important; font-weight: 600;
  text-decoration: none !important;
}
.wc-block-grid__product .wp-block-button__link:hover { background: var(--et-accent-dark) !important; }

/* one-tap bid */
.et-quick-bid { margin: 12px 0 4px; }
.et-quick-bid__btn {
  width: 100%; min-height: 52px; font-size: 17px; font-weight: 800;
  letter-spacing: .02em;
}
.et-quick-bid__btn.is-armed {
  /* Gold is a DARK brown on the light theme, so the near-black label this
     carried on the dark theme fell to about 1.7:1. White reads on both. */
  background: var(--et-gold) !important; color: #fff !important;
  animation: et-arm-pulse 1s ease-in-out infinite alternate;
}
@keyframes et-arm-pulse { from { filter: brightness(1); } to { filter: brightness(1.12); } }
.et-quick-bid__hint { display: block; margin-top: 6px; color: var(--et-muted); font-size: 12.5px; }

/* =============================================================
   SS-RETEST FIXES (2026-09-02 screenshot review round)
   ============================================================= */
/* 1. Title clamp could shear a 4th line mid-glyph when clamp support
   hiccups: cap the box at exactly three lines everywhere. */
.woocommerce ul.products li.product .woocommerce-loop-product__title,
ul.products li.product .woocommerce-loop-product__title,
ul.products li.product h2.woocommerce-loop-product__title {
  overflow: hidden;
}

/* 2. Auction cards price ("Starting bid/Current bid") gets the same
   bottom-anchored two-line block as sale prices, so mixed rows align. */
ul.products li.product .woo-ua-auction-price {
  display: flex; flex-direction: column; justify-content: flex-end;
  min-height: 44px; margin-top: auto; padding-top: 6px;
}

/* 3. WooCommerce tabs: kill the light corner-curl pseudo elements that left
   white specks on the dark theme, and let the row wrap cleanly (the plugin
   adds a 4th "Private message" tab that overflows 390px). */
.woocommerce div.product .woocommerce-tabs ul.tabs li::before,
.woocommerce div.product .woocommerce-tabs ul.tabs li::after,
.woocommerce div.product .woocommerce-tabs ul.tabs::before,
.woocommerce div.product .woocommerce-tabs ul.tabs::after { display: none !important; }
.woocommerce div.product .woocommerce-tabs ul.tabs {
  display: flex; flex-wrap: wrap; gap: 6px; padding: 0 0 8px; margin: 0 0 10px;
  border-bottom: 1px solid var(--et-border-2);
}
.woocommerce div.product .woocommerce-tabs ul.tabs li {
  margin: 0; border-radius: 6px;
}

/* 4. Checkout country/state selects were the last bright-white fields. */
.wc-blocks-components-select .wc-blocks-components-select__select,
.wc-block-components-form select,
.wc-block-checkout select {
  background: var(--et-panel-3) !important; color: var(--et-text-3) !important;
  border: 1px solid var(--et-border-2) !important; border-radius: 6px !important;
}
.wc-blocks-components-select .wc-blocks-components-select__label { color: var(--et-muted) !important; }
.wc-blocks-components-select .wc-blocks-components-select__container { background: transparent !important; border: 0 !important; }
.wc-blocks-components-select svg { fill: var(--et-muted) !important; }

/* 5. Order summary printed the unit price twice for qty 1. */
.wc-block-components-order-summary-item__individual-prices { display: none !important; }

/* 6. Anchor-based buttons inherited the content-link underline. */
a.et-btn, a.et-btn:link, a.et-btn:visited, .et-btn { text-decoration: none !important; }

/* 7. Map box: never a blank void — address placeholder sits behind the
   iframe while tiles load (or if they never do). */
.et-visit__map { position: relative; }
.et-visit__map::before {
  content: "Loading map…"; position: absolute; inset: 0;
  display: flex; align-items: center; justify-content: center;
  color: var(--et-muted); font-size: 14px; text-align: center; padding: 0 16px;
}
.et-visit__map iframe { position: relative; z-index: 1; }

/* 8. Stray horizontal overflow showed a scrollbar sliver beside the hero.
   Elementor base-mobile/base-desktop CSS sometimes sets width:100vw on
   containers, which forces a horizontal scrollbar on mobile. Clamp both
   html and body so a sliver can never appear. */
html,
body { overflow-x: clip; }

/* Safety net: any Elementor container or column that tries to force
   width:100vw (which creates a horizontal scrollbar on mobile) is
   clamped back to the page width. */
.e-con,
.e-con-inner,
.elementor-column,
.elementor-widget-wrap,
.elementor-widget {
  max-width: 100% !important;
  overflow-x: hidden;
}

/* =============================================================
   CORNER POLISH — no square/white corners on any card or thumb
   ============================================================= */
/* Product gallery: WooCommerce wraps the main image in .flex-viewport, which
   clips SQUARE and defeats the img's own radius — round and clip the
   wrappers themselves so the photo can never show a square (white) corner. */
.woocommerce div.product .woocommerce-product-gallery,
.woocommerce div.product .woocommerce-product-gallery .flex-viewport,
.woocommerce div.product .woocommerce-product-gallery__wrapper,
.woocommerce div.product .woocommerce-product-gallery__image,
.woocommerce div.product .woocommerce-product-gallery__image a {
  border-radius: var(--et-radius);
  overflow: hidden;
}
/* Gallery thumbnail strip. */
.woocommerce div.product .flex-control-thumbs li img,
.woocommerce div.product .woocommerce-product-gallery ol img {
  border-radius: 6px;
}
/* Blocks cart / checkout / order-summary thumbnails were square-cornered —
   glaring when the photo has a white background. */
.wc-block-cart-item__image img,
.wc-block-components-order-summary-item__image img,
.wc-block-components-product-image img,
.woocommerce-table--order-details img,
.woocommerce-order-overview + * img {
  border-radius: 6px;
}
/* Search suggestion thumbnails (white panel, but keep the language uniform). */
.dgwt-wcas-si img, .dgwt-wcas-suggestion img { border-radius: 4px; }

/* The blocks order-summary quantity badge is a WHITE circle pinned on the
   thumbnail corner — the "white corner" artifact on the dark checkout.
   Match the header cart badge instead. */
.wc-block-components-order-summary-item__quantity {
  background: var(--et-accent) !important;
  color: #fff !important;
  border: 2px solid var(--et-surface) !important;
  box-shadow: none !important;
}

/* =============================================================
   CARD VOICES — bid price / Buy Now / retail / urgency each speak
   in their own color + face
   ============================================================= */
/* The plugin drops a raw ": " text node between the label and the amount —
   with a flex column it became its own line. font-size:0 on the container
   swallows the stray colon; children get explicit sizes back. */
ul.products li.product .woo-ua-auction-price {
  font-size: 0 !important; display: block !important; min-height: 44px;
  margin-top: auto; padding-top: 6px;
}
ul.products li.product .woo-ua-auction-price .woo-ua-current {
  display: block; font-size: 11px; font-weight: 600;
  text-transform: uppercase; letter-spacing: .08em; color: var(--et-muted);
  margin-bottom: 2px;
}
ul.products li.product .woo-ua-auction-price .amount {
  font-size: 24px; font-weight: 900; color: var(--et-deal); line-height: 1.05;
}
/* Auction countdown (single product): spaced digit groups, muted units. */
.fzb-countdown { display: flex; gap: 10px; align-items: baseline; margin: 2px 0 8px; }
.fzb-countdown-part { display: inline-flex; align-items: baseline; gap: 1px; }
.fzb-countdown-value {
	font-family: var(--et-font-display); font-size: 22px; font-weight: 800;
	color: var(--et-text); line-height: 1;
}
.fzb-countdown-label { font-size: 12px; font-weight: 600; color: var(--et-muted); }

/* Card extras stack under the price: Buy-now price line, then two actions.
   The bid amount is the card's main (green) price; the gold line tells the
   other number. Buttons carry no prices — Bid is the filled primary, Buy Now
   the outlined secondary, side by side, both ≥44px tap targets. */
ul.products li.product .et-card-extras { display: block; margin: 4px 0 2px; }
.fzb-price__label {
	display: block; font-size: 11px; font-weight: 600;
	text-transform: uppercase; letter-spacing: .08em; color: var(--et-muted);
	margin-bottom: 2px;
}
ul.products li.product .et-card-buynow-price {
	display: block; font-size: 12.5px; font-weight: 600; color: var(--et-gold);
	margin: 0 0 6px; letter-spacing: .02em;
}
ul.products li.product .et-card-buynow-price b { font-weight: 800; }
ul.products li.product .et-card-actions { display: flex; gap: 6px; }
ul.products li.product .et-card-bid,
ul.products li.product .et-card-buynow {
	flex: 1 1 0; min-width: 0;
	display: inline-flex; align-items: center; justify-content: center;
	min-height: 44px; padding: 8px 4px; border-radius: 10px;
	box-sizing: border-box; font-family: var(--et-font-display);
	font-size: 15px; font-weight: 700; letter-spacing: .05em;
	text-transform: uppercase; text-decoration: none; text-align: center;
	line-height: 1.1; white-space: nowrap; cursor: pointer;
	transition: background .15s, color .15s, border-color .15s;
}
ul.products li.product .et-card-bid {
	background: var(--et-accent); color: #fff !important;
	border: 2px solid var(--et-accent);
}
ul.products li.product .et-card-bid:hover {
	background: var(--et-accent-dark); border-color: var(--et-accent-dark);
}
ul.products li.product .et-card-buynow.is-auction {
	background: var(--et-surface); color: var(--et-accent) !important;
	border: 2px solid var(--et-accent);
}
ul.products li.product .et-card-buynow.is-auction:hover {
	background: var(--et-accent); color: #fff !important;
}
/* Two-wide phone cards: the pair still fits — tighten type, never clip. */
@media (max-width: 480px) {
	ul.products li.product .et-card-bid,
	ul.products li.product .et-card-buynow { font-size: 13px; letter-spacing: .03em; }
}
/* Was-price + discount, sitting directly under the card's price: the old
   price struck through and the saving beside it, both in the page's near-black
   so the green bid price stays the one coloured number on the card. Wraps to
   its own line when the pair will not fit a 2-up phone column. */
ul.products li.product .et-card-retail {
  display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 6px;
  font-size: 12.5px; font-weight: 600; color: var(--et-text);
  margin: 0 0 6px; line-height: 1.25;
}
ul.products li.product .et-card-retail__was {
  text-decoration: line-through; text-decoration-thickness: 1.5px;
  opacity: .62; font-weight: 600;
}
ul.products li.product .et-card-retail__pct { font-weight: 800; letter-spacing: .01em; }
ul.products li.product .et-ends-soon {
  position: absolute; top: 16px; right: 16px; z-index: 5;
  display: inline-block; margin: 0; font-size: 12px; font-weight: 800;
  color: #fff; background: var(--et-accent); border-radius: 5px; padding: 2px 8px;
  animation: et-arm-pulse 1.2s ease-in-out infinite alternate;
}

/* Quick bid, compact: sits beside Place Bid as an outlined red action. */
.uwa_auction_form .et-quick-bid { display: inline-block; margin: 0 0 0 8px; vertical-align: middle; }
.uwa_auction_form .et-quick-bid .et-quick-bid__btn {
  width: auto; min-height: 48px; padding: 0 16px;
  /* An outlined button's label must carry the outline's colour, not the
     page's fill. This was --et-cream, which on the dark theme happened to be
     near-white body text and on a white page is invisible. */
  background: transparent !important; color: var(--et-accent) !important;
  border: 2px solid var(--et-accent) !important;
  font-size: 15px; font-weight: 800; white-space: nowrap;
}
.uwa_auction_form .et-quick-bid .et-quick-bid__btn:hover { background: rgba(var(--et-accent-rgb),.10) !important; }
.uwa_auction_form .et-quick-bid .et-quick-bid__btn.is-armed {
  background: var(--et-gold) !important; color: #fff !important; border-color: var(--et-gold) !important;
}

/* Header account icon */
.et-account-link { position: relative; padding: 6px; display: inline-flex; color: var(--et-text); margin-right: 2px; }
.et-account-link svg { stroke: var(--et-text); }
.et-account-dot {
  position: absolute; top: 2px; right: 2px; width: 8px; height: 8px;
  border-radius: 50%; background: var(--et-deal); border: 1.5px solid var(--et-bg);
}
.et-drawer__account {
  display: flex; align-items: center; gap: 10px;
  margin: 4px 16px 10px; padding: 12px 14px;
  background: var(--et-card); border: 1px solid var(--et-border-2);
  border-radius: var(--et-radius); color: var(--et-text) !important;
  font-family: var(--et-font-display); font-size: 14px; letter-spacing: .5px;
  text-transform: uppercase;
}
.et-drawer__account svg { stroke: var(--et-accent); }

/* One-portal sign in */
body.et-portal .et-portal__register-hidden { display: none !important; }
body.et-portal .et-portal__hide-head { display: none !important; }
body.et-portal .u-columns .u-column1, body.et-portal .col2-set .col-1 {
  width: 100% !important; max-width: 460px; margin: 14px auto 34px; float: none;
  background: var(--et-card); border: 1px solid var(--et-border-2);
  border-radius: 12px; padding: 26px 22px 22px;
}
/* Woo draws its own thin border+padding on the login form - the panel above
   replaces it. */
body.et-portal form.woocommerce-form-login {
  border: 0 !important; padding: 0 !important; margin: 0 !important;
}
body.et-portal form.woocommerce-form-login label { color: var(--et-text); font-size: 14px; }
body.et-portal .woocommerce-form-login__submit,
body.et-portal form.woocommerce-form-login button[name="login"] {
  display: block; width: 100%; margin-top: 6px;
}
.et-portal__offer {
  background: var(--et-card); border: 1px solid var(--et-border-2);
  border-left: 4px solid var(--et-gold); border-radius: var(--et-radius);
  padding: 12px 14px; margin: 0 0 14px;
}
.et-portal__offer-text { margin: 0 0 10px; font-size: 14px; color: var(--et-text); }
.et-portal__phone-label { display: block; font-size: 13px; color: var(--et-muted); }
.et-portal__phone {
  display: block; width: 100%; margin-top: 4px;
  background: var(--et-card-2) !important; color: var(--et-text) !important;
  border: 1px solid var(--et-border-2) !important; border-radius: 6px !important;
  min-height: 42px; padding: 0 10px;
}

/* =============================================================
   ROUND 12 - CONTRAST COMFORT + ALIGNMENT
   Page-by-page audit: soften near-white-on-near-black text to the
   cream scale, raise the few below-AA spots, theme the classic
   WooCommerce forms, and square up the leftover alignment drift.
   ============================================================= */
/* Classic Woo forms (login portal, addresses, account details) rendered
   default WHITE inputs - a glaring block on the dark theme. Match the
   dark field style used by the blocks checkout. */
.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea,
.woocommerce form .form-row select {
  background: var(--et-panel-2); color: var(--et-text);
  border: 1px solid var(--et-border-2); border-radius: 6px;
  padding: 12px 14px; width: 100%;
}
.woocommerce form .form-row input.input-text:focus,
.woocommerce form .form-row textarea:focus,
.woocommerce form .form-row select:focus {
  border-color: var(--et-gold); outline: none;
  box-shadow: 0 0 0 2px rgba(var(--et-gold-rgb),.18);
}
/* WooCommerce's default #a00 required-asterisk is 2.5:1 on this theme. */
.woocommerce form .form-row .required { color: var(--et-required); }
/* Secondary/utility text was rendering at full text brightness. */
.wc-block-cart .wc-block-cart-item__remove-link { color: var(--et-muted) !important; }
.wc-block-cart .wc-block-cart-item__remove-link:hover { color: var(--et-alert) !important; }
#wc-guest-checkout-notice,
.wc-block-components-totals-shipping__via { color: var(--et-muted); }
/* Cards without the auction extras block (rare non-auction items) keep
   their button on the shared baseline. */
ul.products li.product:not(:has(.et-card-extras)) .price { margin-bottom: 45px; }
/* Logged-out account page: the sign-in panel is centered, so center its
   heading too (inline-block keeps the red bar hugging the text). */
body.et-portal .et-page-head { text-align: center; }
body.et-portal .et-page-head h1 { display: inline-block; }
body.et-portal .et-login-note { text-align: center; }
/* My Account: square the notice card up with the nav column's top. */
.woocommerce-MyAccount-content > .woocommerce-info:first-of-type,
.woocommerce-MyAccount-content > .woocommerce-message:first-of-type { margin-top: 8px; }
.woocommerce-info::before, .woocommerce-message::before { display: none !important; }
.woocommerce-info, .woocommerce-message { padding-left: 20px !important; }
/* Mobile: a right-floated button inside the empty-state notice left a
   ragged hole - stack it full-width instead. */
@media (max-width: 480px) {
  .woocommerce-MyAccount-content .woocommerce-info .button,
  .woocommerce-MyAccount-content .woocommerce-message .button {
    float: none; display: block; width: 100%; margin: 12px 0 0; text-align: center;
  }
}

/* Title clamp, with force: WooCommerce's higher-specificity title rule was
   overriding display back to flow-root and re-adding .5em vertical padding,
   which ate 13px of the 54px box and sheared the third line mid-glyph.
   -webkit-box + line-clamp ends line 3 with a clean ellipsis instead. */
.woocommerce ul.products li.product .woocommerce-loop-product__title,
.woocommerce ul.products li.product h2,
ul.products li.product .woocommerce-loop-product__title,
ul.products li.product h2.woocommerce-loop-product__title {
  display: -webkit-box !important;
  -webkit-line-clamp: 3 !important;
  -webkit-box-orient: vertical !important;
  overflow: hidden !important;
  padding: 0 !important;
  font-size: 13.5px !important;
  line-height: 18px !important;
  line-clamp: 3;
  min-height: 54px;
}
/* "via Flat rate" helper inherits a Blocks opacity - the plain muted grey
   landed under 4.5:1 at 12px. Warmer, brighter tone compensates. */
.wc-block-components-totals-shipping__via,
.wc-block-components-totals-item__description { color: var(--et-text-6); }
/* My Account notices, mobile: drop the icon gutter so the stacked
   full-width button sits symmetrically in the card. */
@media (max-width: 480px) {
  .woocommerce-MyAccount-content .woocommerce-info,
  .woocommerce-MyAccount-content .woocommerce-message {
    padding-left: 16px !important; padding-right: 16px !important;
  }
  .woocommerce-MyAccount-content .woocommerce-info::before,
  .woocommerce-MyAccount-content .woocommerce-message::before { display: none !important; }
}

/* =============================================================
   ROUND 13 — BUG + LAYOUT SWEEP
   Findings from the interaction-state design review: search dim,
   drawer close, desktop nav, dead-end states, the auction "money
   spot", account polish, checkout mobile cleanup.
   ============================================================= */

/* --- live search: theme-owned page dim while suggestions are open -------- */
body.et-search-open::after {
  content: ""; position: fixed; inset: 0; background: rgba(0, 0, 0, .55);
  z-index: 54; pointer-events: none;
}
body.et-search-open .site-header { position: relative; z-index: 56; }
/* suggestion panel: never taller than the screen, escape hatch stays pinned */
.dgwt-wcas-suggestions-wrapp { max-height: calc(100dvh - 130px); overflow-y: auto; }
.dgwt-wcas-suggestions-wrapp .dgwt-wcas-suggestion-more { position: sticky; bottom: 0; background: #fff; }
.dgwt-wcas-suggestions-wrapp ins, .dgwt-wcas-details-wrapp ins { text-decoration: none; font-weight: 700; }
.dgwt-wcas-details-wrapp { max-width: 340px; }

/* --- drawer: visible close control; roomier at desktop widths ------------- */
.et-drawer__brand { position: relative; }
.et-drawer__close {
  position: absolute; top: 50%; right: 10px; transform: translateY(-50%);
  width: 44px; height: 44px; display: flex; align-items: center; justify-content: center;
  background: transparent; border: 0; color: var(--et-text); cursor: pointer;
}
.et-drawer__close svg { stroke: currentColor; }
@media (min-width: 1024px) {
  .et-drawer { width: 340px; }
  .et-drawer nav li a { font-size: 16px; padding: 15px 26px; }
}

/* --- desktop nav row (drawer stays for mobile) ---------------------------- */
.et-nav-desktop { display: none; }
@media (min-width: 1000px) {
  .et-nav-desktop { display: block; border-top: 1px solid var(--et-border); }
  .et-nav-desktop ul {
    display: flex; flex-wrap: wrap; justify-content: center; gap: 0 4px;
    list-style: none; margin: 0 auto; padding: 0 16px; max-width: 1200px;
  }
  .et-nav-desktop li { margin: 0; }
  .et-nav-desktop a {
    display: block; padding: 10px 14px; color: var(--et-text);
    font-family: var(--et-font-display); font-size: 13.5px;
    letter-spacing: 1.2px; text-transform: uppercase;
    border-bottom: 2px solid transparent;
  }
  .et-nav-desktop a:hover { color: var(--et-gold); }
  .et-nav-desktop li.current-menu-item > a { color: var(--et-text); border-bottom-color: var(--et-accent); }
  .et-nav-desktop .sub-menu { display: none; }
}

/* --- zero-results search: guided dead end --------------------------------- */
.et-no-results { padding: 8px 0 24px; }
.et-no-results__msg { font-size: 15.5px; color: var(--et-text); max-width: 52ch; }
.et-no-results__actions { display: flex; gap: 10px; flex-wrap: wrap; margin-top: 14px; }
.et-no-results__actions .et-btn { min-height: 48px; display: inline-flex; align-items: center; }

/* --- empty cart: even grid on desktop (no orphan card) -------------------- */
@media (min-width: 992px) {
  .wc-block-cart__empty-cart .wc-block-grid__products,
  .wp-block-woocommerce-empty-cart-block .wc-block-grid__products {
    display: flex; flex-wrap: wrap;
  }
  .wc-block-cart__empty-cart .wc-block-grid__product,
  .wp-block-woocommerce-empty-cart-block .wc-block-grid__product {
    flex: 1 1 22%; max-width: 25%;
  }
}

/* --- auction money spot: one grouped bid unit ----------------------------- */
.uwa_auction_form {
  display: flex; flex-wrap: wrap; gap: 8px; align-items: stretch;
  background: var(--et-card); border: 1px solid var(--et-border-2);
  border-radius: var(--et-radius); padding: 14px;
}
.uwa_auction_form input[name="uwa_bid_value"] {
  flex: 1 1 140px; width: auto !important; min-width: 0;
  background: var(--et-panel-2) !important; color: var(--et-text) !important;
  border: 1px solid var(--et-border-2) !important; border-radius: 6px !important;
  padding: 10px 12px; font-size: 16px;
}
.uwa_auction_form .uwa_currency { align-self: center; font-weight: 700; color: var(--et-muted); }
.uwa_auction_form .et-quick-bid { margin: 0; display: flex; }
.uwa_auction_form .et-quick-bid .et-quick-bid__btn { height: 100%; }
/* the plugin's "(Enter more than or equal to : $X )" hint duplicates the
   quick-bid label right above it */
.uwa_auction_form small.uwa_inc_price,
.uwa_auction_form .uwa_inc_price_hint,
.uwa_inc_price_hint { display: none !important; }
@media (max-width: 480px) {
  .uwa_auction_form .quantity { flex: 1 1 100%; }
  .uwa_auction_form .bid_button { flex: 1 1 0; min-width: 0; }
  .uwa_auction_form .et-quick-bid { flex: 1 1 0; min-width: 0; }
  .uwa_auction_form .et-quick-bid .et-quick-bid__btn { width: 100%; padding: 0 8px; }
}
.et-bid-or {
  text-align: center; color: var(--et-muted); font-size: 12px;
  font-family: var(--et-font-display); letter-spacing: .14em; text-transform: uppercase;
  margin: 12px 0 8px; display: flex; align-items: center; gap: 12px;
}
.et-bid-or::before, .et-bid-or::after {
  content: ""; flex: 1; border-top: 1px solid var(--et-border-2);
}

/* --- description tab: kill leftover spacer paragraphs --------------------- */
.woocommerce-Tabs-panel p:has(> br:only-child) { display: none; }
.woocommerce-Tabs-panel--description p { margin: 0 0 10px; }

/* --- back-in-stock panel: theme alignment + readable success -------------- */
.cwginstock-panel-heading, .cwginstock-subscribe-form .panel-heading { text-align: left !important; }
.cwginstock-subscribe-form input[type="text"],
.cwginstock-subscribe-form input[type="email"] { text-align: left !important; }
.cwginstocksuccess { color: var(--et-deal) !important; font-weight: 600; }

/* --- account: horizontal nav chips on mobile ------------------------------ */
@media (max-width: 768px) {
  .woocommerce-account .woocommerce-MyAccount-navigation ul {
    display: flex; overflow-x: auto; gap: 8px; padding: 0 0 8px;
    -webkit-overflow-scrolling: touch; scrollbar-width: none;
  }
  .woocommerce-account .woocommerce-MyAccount-navigation ul::-webkit-scrollbar { display: none; }
  .woocommerce-account .woocommerce-MyAccount-navigation li { flex: 0 0 auto; margin: 0; }
  .woocommerce-account .woocommerce-MyAccount-navigation li a {
    white-space: nowrap; margin-bottom: 0; padding: 10px 14px;
  }
  .woocommerce-account .woocommerce-MyAccount-navigation li.is-active a {
    border-left: 0; border-bottom: 3px solid var(--et-accent);
  }
}

/* --- native controls follow the dark scheme ------------------------------- */
input[type="checkbox"], input[type="radio"] { color-scheme: dark; }

/* --- account details: fieldset, buttons, name row, address card ----------- */
.woocommerce-EditAccountForm fieldset {
  border: 1px solid var(--et-border-2); border-radius: var(--et-radius);
  padding: 4px 16px 16px; margin: 22px 0 18px;
}
.woocommerce-EditAccountForm legend {
  font-family: var(--et-font-display); text-transform: uppercase;
  letter-spacing: 1px; font-size: 14px; color: var(--et-gold); padding: 0 8px;
}
@media (max-width: 700px) {
  .woocommerce-EditAccountForm .woocommerce-Button,
  .woocommerce-EditAccountForm button[name="save_account_details"],
  .woocommerce-address-fields .button { display: block; width: 100%; }
}
@media (max-width: 480px) {
  .woocommerce form .form-row-first, .woocommerce form .form-row-last { float: none; width: 100%; }
}
.woocommerce-MyAccount-content address {
  font-style: normal; background: var(--et-card); border: 1px solid var(--et-border-2);
  border-radius: var(--et-radius); padding: 14px 16px; line-height: 1.6; max-width: 420px;
}
.woocommerce-EditAccountForm em, .woocommerce-MyAccount-content em {
  font-style: normal; color: var(--et-muted); font-size: 13px;
}

/* --- checkout: one order summary on mobile, anchored action row ----------- */
@media (max-width: 899px) {
  .wc-block-checkout .wc-block-components-sidebar { display: none; }
}
.wc-block-checkout__actions_row {
  display: flex; justify-content: space-between; align-items: center; gap: 14px;
}
.wc-block-checkout__actions_row .wc-block-components-checkout-return-to-cart-button { margin: 0; }
.wc-block-checkout .wp-block-woocommerce-checkout-order-note-block { margin-bottom: 18px; }

/* =============================================================
   ROUND 15 — MOBILE FIXES + PRICE POP + FINE-PRINT FOLD
   ============================================================= */

/* Prices pop in deal-green — distinct from cream text, and red stays
   reserved for CTAs (owner picked green over red, Sept 3). */
.woocommerce ul.products li.product .price,
.woocommerce ul.products li.product .price ins,
ul.products li.product .woo-ua-auction-price .amount,
.woocommerce div.product p.price,
.woocommerce div.product span.price,
.woocommerce div.product .summary > .woocommerce-Price-amount,
.woocommerce div.product .summary .woo-ua-auction-price .amount,
.woocommerce div.product .summary .uwa-auction-price,
.woo_ua_current_bid .woocommerce-Price-amount { color: var(--et-deal) !important; }
/* ...but never inside buttons (white on red) or struck-through old prices. */
.summary .button .woocommerce-Price-amount, .summary button .woocommerce-Price-amount,
ul.products li.product .button .woocommerce-Price-amount { color: inherit !important; }
.woocommerce ul.products li.product .price del,
.woocommerce ul.products li.product .price del .amount,
.woocommerce div.product .summary del .woocommerce-Price-amount { color: var(--et-muted) !important; }

/* Bid input: the flex child is the .quantity WRAPPER, not the input —
   without this it collapsed to 78px on mobile. */
.uwa_auction_form .quantity {
  flex: 1 1 160px; display: flex; align-items: stretch;
  margin: 0 !important; min-width: 0;
}
.uwa_auction_form .quantity input[name="uwa_bid_value"] {
  width: 100% !important; flex: 1 1 auto; min-width: 0;
}

/* Fine print folded into one quiet row on product pages. */
.et-fineprint {
  margin: 10px 0 4px; border: 1px solid var(--et-border);
  border-radius: var(--et-radius); background: transparent;
}
.et-fineprint summary {
  cursor: pointer; padding: 10px 14px; color: var(--et-muted);
  font-size: 13px; font-family: var(--et-font-display);
  letter-spacing: .08em; text-transform: uppercase; list-style: none;
}
.et-fineprint summary::-webkit-details-marker { display: none; }
.et-fineprint summary::after { content: " +"; color: var(--et-gold); }
.et-fineprint[open] summary::after { content: " –"; }
.et-fineprint__body { padding: 0 14px 10px; }
.et-fineprint__body > * { margin: 0 0 8px; }

/* Same fine print, stated at checkout where it matters. */
.et-checkout-fineprint {
  max-width: 1024px; margin: 18px auto 8px; padding: 12px 16px;
  background: var(--et-card); border: 1px solid var(--et-border-2);
  border-radius: var(--et-radius); color: var(--et-muted);
  font-size: 13px; line-height: 1.55;
}
.et-checkout-fineprint strong { color: var(--et-text); }

/* Mobile: the fixed bottom bar was covering page ends (cart's checkout
   button, footer fine print) — clear it at the true end of every page. */
@media (max-width: 899px) {
  .site-footer {
    padding-bottom: calc(var(--et-bottombar-h) + env(safe-area-inset-bottom, 0px) + 14px);
  }
  .wc-block-cart .wc-block-cart__submit-container {
    margin-bottom: 8px;
  }
}

/* Small screens: amount field on its own line, the two bid actions share
   the row below it. (Declared last so it wins the cascade over the
   desktop flex-basis above.) */
@media (max-width: 480px) {
  .uwa_auction_form .quantity { flex: 1 1 100%; }
  .uwa_auction_form .bid_button { flex: 1 1 0; min-width: 0; }
  .uwa_auction_form .et-quick-bid { flex: 1 1 0; min-width: 0; }
  .uwa_auction_form .et-quick-bid .et-quick-bid__btn { width: 100%; padding: 0 8px; }
}

/* Native number-input spinners render as a light box on the dark theme
   (the bid amount field's "weird outline"). Numbers here are always short
   - typing beats 1-cent spinner clicks - so hide them everywhere. */
input[type="number"] { -moz-appearance: textfield; appearance: textfield; }
input[type="number"]::-webkit-outer-spin-button,
input[type="number"]::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }

/* "source" verification link on the % -below-retail claims: quiet, but there
   for anyone who wants to check the number is real. */
.et-retail-source {
  color: var(--et-muted); font-size: 11px; text-decoration: underline;
  text-underline-offset: 2px; margin-left: 4px; white-space: nowrap;
}
.et-retail-source:hover { color: var(--et-gold); }
ul.products li.product .et-card-retail .et-retail-source { font-size: 10.5px; }

/* =============================================================
   AUTOMATIC BIDDING (factorize-auctions: set your maximum)
   ============================================================= */
.et-proxy-bid {
  margin: 12px 0 4px;
  border: 1px solid var(--et-border);
  border-radius: var(--et-radius);
  background: var(--et-card);
  overflow: hidden;
}
.et-proxy-bid__top {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 10px 12px;
  background: var(--et-panel);
  border-bottom: 1px solid var(--et-border);
}
.et-proxy-bid__check {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  cursor: default;
  font-family: var(--et-font-body);
  font-size: 14.5px;
  font-weight: 600;
  color: var(--et-text);
  user-select: none;
}
.et-proxy-bid__check input[type="checkbox"] {
  width: 18px;
  height: 18px;
  accent-color: var(--et-accent);
  cursor: default;
}
.et-proxy-bid__amount {
  color: var(--et-accent);
  font-weight: 700;
}
.et-proxy-bid__info {
  background: none;
  border: 0;
  padding: 2px;
  cursor: pointer;
  color: var(--et-muted);
  font-size: 13px;
  border-radius: 4px;
  line-height: 1;
}
.et-proxy-bid__info:hover,
.et-proxy-bid__info[aria-expanded="true"] {
  color: var(--et-text);
  background: var(--et-panel-2);
}
.et-proxy-bid__info-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 16px;
  height: 16px;
  border-radius: 50%;
  background: var(--et-panel-3);
  color: var(--et-muted);
  font-style: italic;
  font-size: 11px;
  font-weight: 700;
}
.et-proxy-bid__info[aria-expanded="true"] .et-proxy-bid__info-icon {
  background: var(--et-accent);
  color: #fff;
}
.et-proxy-bid__info-group {
  margin: 0;
  padding: 10px 12px;
  color: var(--et-muted);
  font-size: 13px;
  line-height: 1.5;
  border-top: 1px solid var(--et-border);
}
.et-proxy-bid__info-group p {
  margin: 0;
}
.et-proxy-bid__body {
  padding: 10px 12px;
}
.et-proxy-bid__standing {
  margin: 0 0 10px;
  padding: 8px 10px;
  border-radius: 6px;
  background: var(--et-panel);
  color: var(--et-text);
  font-size: 13.5px;
}
.et-proxy-bid__form {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
}
.et-proxy-bid__form input[type="number"] {
  flex: 1 1 120px;
  min-width: 0;
  min-height: 46px;
  padding: 0 12px;
  border: 1px solid var(--et-border-2);
  border-radius: var(--et-radius);
  background: var(--et-panel-3);
  color: var(--et-text);
  font-family: var(--et-font-body);
  font-size: 16px;
}
.et-proxy-bid__btn { min-height: 46px; }
.et-proxy-bid__clear {
  background: none;
  border: 0;
  padding: 0 6px;
  cursor: pointer;
  color: var(--et-muted);
  font-size: 13px;
  text-decoration: underline;
}
.et-proxy-bid__clear:hover { color: var(--et-alert); }
.et-proxy-bid__min {
  flex: 1 0 100%;
  color: var(--et-muted);
  font-size: 12.5px;
}
.et-proxy-bid-note { margin: 10px 0; font-size: 14px; }

/* within the bid form row */
.uwa_auction_form .et-proxy-bid__btn { min-height: 48px; }

/* =============================================================
   AUTOMATIC BIDDING TOGGLE — checkbox below the bid form
   ============================================================= */
/* Toggle checkbox row — below the form, enables/disables auto-bidding */
.et-proxy-bid__toggle {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 10px 12px;
  margin-top: 10px;
  border-top: 1px solid var(--et-border);
  background: var(--et-panel);
  border-radius: 0 0 var(--et-radius) var(--et-radius);
}

.et-proxy-bid__toggle .et-proxy-bid__check {
  cursor: pointer;
  user-select: none;
}

.et-proxy-bid__toggle .et-proxy-bid__check input[type="checkbox"] {
  cursor: pointer;
}

/* Info panel content (shown when info button clicked) */
.et-proxy-bid__info {
  margin: 0;
  padding: 10px 12px;
  color: var(--et-muted);
  font-size: 13px;
  line-height: 1.5;
  border-top: 1px solid var(--et-border);
  background: var(--et-card);
}

.et-proxy-bid__info p {
  margin: 0;
}

/* =============================================================
   SINGLE AUCTION PAGE — the buy box
   -------------------------------------------------------------
   The summary column had grown into one undifferentiated stack:
   every action was a full-width red button, the bid form sat in the
   middle of the fine print, and the Buy Now price was buried in a
   sentence. This orders the column by CSS (the DOM order comes from a
   dozen hook priorities across two plugins — ordering here is far
   safer than renumbering those) and gives each action its own voice:

     Bid      solid red    — the primary, expected action
     Buy Now  near-black + gold price — deliberate, different, and the
                             amount reads at a glance
     Save     a bookmark icon, not a third red button

   Bid and Buy Now share one row because they are the two ways to take
   the item; everything else spans the full width.

   NOTE ON SPECIFICITY: the base rule below is
   `.woocommerce div.product .summary.entry-summary > *` (four classes
   + an element). Every per-child rule therefore carries the same
   prefix — a bare `.summary > .et-buy-now` loses to it and silently
   does nothing, which is exactly what happened on the first pass.
   ============================================================= */
.woocommerce div.product .summary.entry-summary {
  display: flex; flex-wrap: wrap; align-items: flex-start;
  gap: 10px; position: relative;
}
.woocommerce div.product .summary.entry-summary > * { flex: 1 1 100%; margin-top: 0; margin-bottom: 0; }

/* Reading order: identity -> what it costs -> how to act -> small print. */
.woocommerce div.product .summary.entry-summary > .product_title  { order: 1; padding-right: 52px; }
.woocommerce div.product .summary.entry-summary > .fzb-countdown  { order: 2; }
.woocommerce div.product .summary.entry-summary > .price          { order: 3; margin-bottom: 2px; }
.woocommerce div.product .summary.entry-summary > .et-retail-line { order: 4; margin-top: -4px; }
.woocommerce div.product .summary.entry-summary > .et-stats       { order: 5; }
.woocommerce div.product .summary.entry-summary > .fzb-reserve,
.woocommerce div.product .summary.entry-summary > .et-bid-verify  { order: 6; }
.woocommerce div.product .summary.entry-summary > .fzb-bid-form   { order: 20; }
/* The auto-bid row now lives INSIDE the bid form (order 20), so the only
   thing left to place here is the legacy sign-in note. */
.woocommerce div.product .summary.entry-summary > .et-maxbid-note { order: 21; }
.woocommerce div.product .summary.entry-summary > .et-quick-bid   { order: 30; flex: 1 1 calc(50% - 5px); min-width: 0; }
.woocommerce div.product .summary.entry-summary > .et-buy-now     { order: 31; flex: 1 1 calc(50% - 5px); min-width: 0; }
.woocommerce div.product .summary.entry-summary > .fzb-login      { order: 40; }
.woocommerce div.product .summary.entry-summary > .et-fineprint   { order: 50; margin-top: 2px; }
.woocommerce div.product .summary.entry-summary > .et-member-nudge{ order: 60; }
.woocommerce div.product .summary.entry-summary > .product_meta   { order: 70; }
.woocommerce div.product .summary.entry-summary > .et-bid-or      { display: none; }

/* --- custom-amount row: secondary to the one-tap Bid button ------------ */
.woocommerce div.product .summary .fzb-bid-form {
  background: var(--et-card); border: 1px solid var(--et-border);
  border-radius: var(--et-radius); padding: 12px 12px 10px;
}
.woocommerce div.product .summary .fzb-input-row { display: flex; gap: 8px; align-items: stretch; }
.woocommerce div.product .summary .fzb-bid-input { flex: 1 1 auto; min-width: 0; }
.woocommerce div.product .summary .fzb-input-row .fzb-bid-btn {
  flex: 0 0 auto; background: transparent; color: var(--et-accent) !important;
  border: 1px solid var(--et-border-2); font-size: 14px; padding: 10px 14px;
  min-height: 0; width: auto;
}
.woocommerce div.product .summary .fzb-input-row .fzb-bid-btn:hover {
  background: var(--et-surface); border-color: var(--et-accent);
}
.woocommerce div.product .summary .fzb-hint { margin: 8px 0 0; font-size: 13px; color: var(--et-muted); }

/* --- primary actions: same size, deliberately different voices --------- */
.woocommerce div.product .summary .et-quick-bid { margin: 0; }
.woocommerce div.product .summary .et-buy-now { margin: 0; }
.woocommerce div.product .summary .et-quick-bid__btn,
.woocommerce div.product .summary a.et-buy-now__btn,
.woocommerce div.product .summary .et-buy-now__btn {
  width: 100%; min-height: 62px; box-sizing: border-box;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: 2px; border-radius: var(--et-radius); text-decoration: none;
  font-family: var(--et-font-display); letter-spacing: .03em; line-height: 1.1;
  padding: 10px 8px; cursor: pointer;
}
.woocommerce div.product .summary .et-quick-bid__btn {
  background: var(--et-accent); color: #fff !important;
  border: 2px solid var(--et-accent); font-size: 17px; font-weight: 700;
}
.woocommerce div.product .summary .et-quick-bid__btn:hover:not(:disabled) {
  background: var(--et-accent-dark); border-color: var(--et-accent-dark);
}
.woocommerce div.product .summary .et-quick-bid__btn.is-armed {
  background: var(--et-accent-dark); border-color: var(--et-text);
}
.woocommerce div.product .summary a.et-buy-now__btn {
  background: var(--et-text); color: #fff !important; border: 2px solid var(--et-text);
}
.woocommerce div.product .summary a.et-buy-now__btn:hover {
  background: var(--et-surface); color: var(--et-text) !important;
}
.woocommerce div.product .summary .et-buy-now__label {
  font-size: 11px; font-weight: 600; letter-spacing: .1em;
  text-transform: uppercase; opacity: .8;
}
.woocommerce div.product .summary .et-buy-now__price {
  font-size: 20px; font-weight: 800; color: var(--et-gold-on-dark);
}
.woocommerce div.product .summary a.et-buy-now__btn:hover .et-buy-now__price { color: var(--et-gold); }
.woocommerce div.product .summary .et-buy-now small {
  display: block; margin-top: 5px; font-size: 12px;
  color: var(--et-muted); text-align: center;
}
/* Sold-out / bidding-passed state keeps the shape but drops the colour. */
.woocommerce div.product .summary .et-buy-now__btn:disabled,
.woocommerce div.product .summary button.et-buy-now__btn[disabled] {
  background: var(--et-border) !important; color: var(--et-muted) !important;
  border-color: var(--et-border-2);
}

/* --- save for later: an icon, not a competing button ------------------- */
.woocommerce div.product .summary .fzb-watch {
  position: absolute; top: 0; right: 0; margin: 0; flex: 0 0 auto; width: auto;
}
.woocommerce div.product .summary .fzb-watch-btn {
  display: inline-flex; align-items: center; justify-content: center;
  width: 44px; height: 44px; min-height: 0; padding: 0; cursor: pointer;
  background: transparent; border: 1px solid var(--et-border-2);
  border-radius: 50%;
  /* The theme sets `button { color: #fff !important }` for its filled
     buttons. The icon strokes with currentColor, so without this override
     the bookmark drew white-on-white and looked like an empty ring. */
  color: var(--et-muted) !important;
}
.woocommerce div.product .summary .fzb-watch-btn:hover {
  border-color: var(--et-accent); color: var(--et-accent) !important; background: var(--et-card);
}
.fzb-watch-icon { fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linejoin: round; }
.woocommerce div.product .summary .fzb-watch-btn.fzb-watching {
  color: var(--et-accent) !important; border-color: var(--et-accent);
}
.woocommerce div.product .summary .fzb-watch-btn.fzb-watching .fzb-watch-icon { fill: currentColor; }

/* --- quieten the supporting rows -------------------------------------- */
.woocommerce div.product .summary .et-member-nudge,
.woocommerce div.product .summary .fzb-login { font-size: 13.5px; }

/* Only genuinely tiny screens stack: at 390px the pair still gets ~185px
   each, which fits "Bid $117.50" and the stacked Buy Now comfortably.
   Side-by-side is the point of the layout, so the breakpoint is low. */
@media (max-width: 330px) {
  .woocommerce div.product .summary.entry-summary > .et-quick-bid,
  .woocommerce div.product .summary.entry-summary > .et-buy-now { flex: 1 1 100%; }
}

/* Auto-bid panel: a supporting control, not a third primary. Only the Bid
   button stays solid red, so the eye still lands on the main action first. */
.woocommerce div.product .summary .et-proxy-bid {
  background: var(--et-card); border: 1px solid var(--et-border);
  border-radius: var(--et-radius); padding: 12px;
}
.woocommerce div.product .summary .et-proxy-bid .et-proxy-bid__btn {
  background: transparent; color: var(--et-accent) !important;
  border: 1px solid var(--et-border-2); font-size: 14px;
  padding: 10px 14px; min-height: 0; width: auto;
}
.woocommerce div.product .summary .et-proxy-bid .et-proxy-bid__btn:hover {
  background: var(--et-surface); border-color: var(--et-accent);
}
.woocommerce div.product .summary .et-proxy-bid__form { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.woocommerce div.product .summary .et-proxy-bid__form input[type="number"] { flex: 1 1 120px; min-width: 0; }
.woocommerce div.product .summary .et-proxy-bid__min { flex: 1 1 100%; margin: 0; font-size: 12.5px; color: var(--et-muted); }
.woocommerce div.product .summary .et-proxy-bid__toggle { margin-top: 10px; padding-top: 10px; border-top: 1px solid var(--et-border); }


/* =============================================================
   AUTOMATIC BIDDING — one row inside the Place-bid box
   -------------------------------------------------------------
   Previously a whole second panel with its own form, heading and
   submit. It is a qualifier on the bid being placed, not a separate
   transaction, so it is now a checkbox, an amount and an (i) sitting
   under the minimum/reserve line.
   ============================================================= */
.woocommerce div.product .summary .fzb-autobid {
  display: flex; flex-wrap: wrap; align-items: center; gap: 6px 8px;
  margin: 10px 0 0; padding: 10px 0 0;
  border-top: 1px solid var(--et-border);
  font-size: 13.5px; color: var(--et-text);
}
.woocommerce div.product .summary .fzb-autobid__check {
  display: inline-flex; align-items: center; gap: 7px; cursor: pointer; margin: 0;
}
.woocommerce div.product .summary .fzb-autobid__check input[type="checkbox"] {
  width: 17px; height: 17px; margin: 0; accent-color: var(--et-accent); cursor: pointer;
}
.woocommerce div.product .summary .fzb-autobid__amount {
  width: 104px; flex: 0 0 auto; padding: 7px 9px; font-size: 14px;
  border: 1px solid var(--et-border-2); border-radius: 6px;
  background: var(--et-surface); color: var(--et-text);
}
.woocommerce div.product .summary .fzb-autobid__amount:disabled {
  background: var(--et-card-2); color: var(--et-muted); cursor: not-allowed;
}
/* The (i) has to be visible on its own, not a grey dot lost in the row. */
.woocommerce div.product .summary .fzb-autobid__info {
  flex: 0 0 auto; width: 24px; height: 24px; padding: 0; cursor: pointer;
  display: inline-flex; align-items: center; justify-content: center;
  border: 1.5px solid var(--et-accent); border-radius: 50%;
  background: transparent; color: var(--et-accent) !important;
  font-family: var(--et-font-display); font-size: 13px; font-weight: 800; line-height: 1;
  min-height: 0;
}
.woocommerce div.product .summary .fzb-autobid__info:hover {
  background: var(--et-accent); color: #fff !important;
}
.woocommerce div.product .summary .fzb-autobid__signin { font-weight: 600; }
.woocommerce div.product .summary .fzb-autobid__standing {
  flex: 1 1 100%; margin: 2px 0 0; font-size: 12.5px; color: var(--et-muted);
}
.woocommerce div.product .summary .fzb-autobid__help {
  flex: 1 1 100%; margin: 6px 0 0; padding: 9px 11px;
  background: var(--et-card-2); border: 1px solid var(--et-border);
  border-radius: 6px; font-size: 12.5px; color: var(--et-text-2);
}
.woocommerce div.product .summary .fzb-autobid__help p { margin: 0 0 6px; }
.woocommerce div.product .summary .fzb-autobid__help p:last-child { margin: 0; }
.woocommerce div.product .summary .fzb-autobid--guest .fzb-autobid__check { cursor: default; color: var(--et-muted); }

/* =============================================================
   ONE PRICE TREATMENT — ordinary products in the auction shape
   (markup: factorize-essentials/inc/prices.php)
   -------------------------------------------------------------
   The buy-box ordering above names only auction parts. Everything it
   does not name kept `order: 0` and floated ABOVE the product title —
   the stock line, Add to cart, the SAVE bar, the back-in-stock panel —
   and after the 28 Sep 2026 re-import (every product ordinary, no
   auctions) that was every product page. Unnamed children now default
   to the middle, which keeps their natural hook order, and the ordinary
   buy box gets named slots beside the auction ones:

     1 title · 2 rating · 3 price · 4 comparison · 5 stats/sold
     10 anything unnamed · 25 stock · 30 Add to cart · 31 notify-me
     50 fine print · 70 meta
   ============================================================= */
.woocommerce div.product .summary.entry-summary > * { order: 10; }
.woocommerce div.product .summary.entry-summary > .woocommerce-product-rating { order: 2; }
.woocommerce div.product .summary.entry-summary > .et-compare-line { order: 4; margin-top: -4px; }
.woocommerce div.product .summary.entry-summary > .et-save-badge   { order: 4; flex: 0 0 auto; }
.woocommerce div.product .summary.entry-summary > .et-sold         { order: 5; }
.woocommerce div.product .summary.entry-summary > .stock           { order: 25; }
.woocommerce div.product .summary.entry-summary > form.cart        { order: 30; }
.woocommerce div.product .summary.entry-summary > .cwginstock-subscribe-form { order: 31; }
/* The title's right padding makes room for the auction bookmark; an
   ordinary product has none, so its title may use the full width. */
.woocommerce div.product .summary.entry-summary:not(:has(.fzb-watch)) > .product_title { padding-right: 0; }

/* Comparison line under the buy-box price — the same voice as the auction
   retail line: muted, the old price struck, the saving in deal green. */
.et-compare-line { color: var(--et-muted); font-size: 14px; line-height: 1.45; }
.et-compare-line del,
.et-compare-line del .woocommerce-Price-amount { color: var(--et-muted) !important; }
.et-compare-line strong,
.et-compare-line strong .woocommerce-Price-amount { color: var(--et-deal) !important; font-weight: 700; }

/* Cards: the comparison line keeps its row even when a product has nothing
   to compare, so a row's prices and buttons always line up. */
ul.products li.product .et-card-extras--buy { min-height: 22px; margin: 2px 0 2px; }
ul.products li.product .et-card-extras--buy .et-card-retail { margin: 0; }

/* Cards: the ordinary Add to cart speaks like the auction Bid button —
   display face, uppercase, 44px — instead of a generic body-font pill. */
.woocommerce ul.products li.product a.button,
ul.products li.product a.button {
  display: flex; align-items: center; justify-content: center;
  width: 100%; min-height: 44px; margin-top: 6px; padding: 8px 4px;
  box-sizing: border-box; border-radius: 10px;
  font-family: var(--et-font-display); font-size: 15px; font-weight: 700;
  letter-spacing: .05em; text-transform: uppercase; line-height: 1.1;
  border: 2px solid var(--et-accent);
}
.woocommerce ul.products li.product a.button:hover,
ul.products li.product a.button:hover { border-color: var(--et-accent-dark); }
/* Out of stock: "View details" is not a purchase, so it takes the outlined
   secondary voice (the auction Buy Now outline), not the solid primary. */
.woocommerce ul.products li.product.outofstock a.button,
ul.products li.product.outofstock a.button {
  background: var(--et-surface); color: var(--et-accent) !important;
}
.woocommerce ul.products li.product.outofstock a.button:hover,
ul.products li.product.outofstock a.button:hover {
  background: var(--et-accent); color: #fff !important;
}
@media (max-width: 480px) {
  .woocommerce ul.products li.product a.button,
  ul.products li.product a.button { font-size: 13px; letter-spacing: .03em; }
}
/* WooCommerce's "View cart" link after an AJAX add had no styling at all. */
ul.products li.product a.added_to_cart {
  display: block; text-align: center; margin-top: 6px;
  font-size: 13px; font-weight: 600; color: var(--et-accent);
}

/* Back-in-stock panel: the plugin colours its <h4> white directly, so the
   earlier heading fix (which recoloured the wrapper) left white text on a
   light grey panel — invisible. */
.cwginstock-panel-heading h4,
.cwginstock-subscribe-form .panel-heading h4 {
  color: var(--et-text) !important; margin: 0; font: inherit; letter-spacing: inherit;
}

/* Buy box, ordinary product — the auction buy box's voice.
   WooCommerce's clearfix ::before on form.cart is a flex item here, so it
   took a 10px gap and pushed the quantity box off the column edge (the same
   bug the product grid had with ul.products). The Add to cart action gets
   the auction Bid button's shape: 62px, display face, uppercase. */
.woocommerce div.product form.cart::before,
.woocommerce div.product form.cart::after { content: none; display: none; }
.woocommerce div.product .summary form.cart { align-items: stretch; }
.woocommerce div.product .summary form.cart .quantity .qty {
  min-height: 62px; height: 100%; font-size: 17px; font-weight: 700;
}
.woocommerce div.product .summary form.cart .single_add_to_cart_button {
  min-height: 62px; border: 2px solid var(--et-accent); border-radius: var(--et-radius);
  font-family: var(--et-font-display); font-size: 17px; font-weight: 700;
  letter-spacing: .05em; text-transform: uppercase; line-height: 1.1;
}
.woocommerce div.product .summary form.cart .single_add_to_cart_button:hover {
  border-color: var(--et-accent-dark);
}