/* ============================================================================
   VoaqStore — Revamp Layer  (voaq-revamp.css)
   Modern skin over UniTheme2. Loaded AFTER the theme bundle so it wins.
   Keeps the layout the founder loves; modernizes type, color, depth, motion.
   Iteration: 1  — foundation (tokens + typography + header + buttons + cards)
   ============================================================================ */

:root{
  --vq-ink:#1d1d1f;
  --vq-ink-soft:#3a3f45;
  --vq-muted:#6b7176;
  --vq-faint:#9aa0a6;
  --vq-line:#e9eaee;
  --vq-line-strong:#dcdee3;
  --vq-surface:#ffffff;
  --vq-bg:#f5f5f7;
  --vq-bg-2:#fafafc;
  --vq-accent:#ff6a00;
  --vq-accent-ink:#e85d00;
  --vq-accent-soft:#fff3ea;
  --vq-blue:#147ba3;
  --vq-blue-ink:#0f6288;
  --vq-radius:14px;
  --vq-radius-sm:10px;
  --vq-radius-lg:20px;
  --vq-radius-pill:999px;
  --vq-shadow-xs:0 1px 2px rgba(16,24,40,.05);
  --vq-shadow-sm:0 1px 2px rgba(16,24,40,.04),0 2px 6px rgba(16,24,40,.06);
  --vq-shadow:0 6px 18px rgba(16,24,40,.09);
  --vq-shadow-lg:0 16px 42px rgba(16,24,40,.16);
  --vq-ring:0 0 0 4px rgba(255,106,0,.18);
  --vq-font:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;
  --vq-ease:cubic-bezier(.2,.7,.2,1);
}

/* ---- Base typography (body inherits; icon fonts keep their own family) ---- */
body{
  font-family:var(--vq-font);
  color:var(--vq-ink);
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  text-rendering:optimizeLegibility;
  letter-spacing:.01em;
}
p,li,td,label,input,select,textarea,button,.ty-btn,a{ font-family:var(--vq-font); }
a{ transition:color .18s var(--vq-ease); }

/* ---- Headings + the UT2 "mainbox" section titles ------------------------- */
h1,h2,h3,h4,h5,h6,
.ty-mainbox-title,.ut2-a__title,.ut2-pn__title,.ty-product-block-title{
  font-family:var(--vq-font)!important;
  color:var(--vq-ink);
  letter-spacing:-.02em;
  font-weight:700;
}
/* Section headers: drop the dated centered line-through + heavy-black look,
   go left-aligned and clean (Amazon / AliExpress rhythm). */
.ty-mainbox-title.ut2-center-title{ text-align:left!important; }
.ty-mainbox-title.ut2-title-line-decoration{ border:0!important; background:none!important; }
.ty-mainbox-title.ut2-title-line-decoration > span,
.ty-mainbox-title.ut2-title-line-decoration bdi{ background:none!important; padding:0!important; }
.ty-mainbox-title{
  font-size:clamp(22px,2vw,30px)!important;
  line-height:1.15!important;
  font-weight:750!important;
  margin:0 0 20px!important;
  text-transform:none!important;
}
.ut2-biggest-size-title{ font-size:clamp(24px,2.2vw,32px)!important; }
.ut2-big-size-title{ font-size:clamp(20px,1.7vw,26px)!important; }
.ut2-title-opacity{ opacity:1!important; color:var(--vq-ink)!important; }
/* The orange accent word (CS-Cart wraps it in <mark>) — clean brand accent */
.ty-mainbox-title mark,.ut2-a__title mark,mark{
  background:none!important;
  color:var(--vq-accent)!important;
  font-weight:800;
  padding:0;
}
/* Product-carousel tab switch under the titles (Most Popular / Bestsellers) */
.ut2-pn__title,.ty-product-tabs__title{ font-weight:650!important; letter-spacing:-.01em; }

/* ---- Header + search ------------------------------------------------------ */
.ut2-search{ border-radius:var(--vq-radius-pill)!important; overflow:hidden; }
.ty-search-block{
  border-radius:var(--vq-radius-pill)!important;
  border:1.5px solid var(--vq-line-strong)!important;
  background:var(--vq-surface)!important;
  transition:border-color .18s var(--vq-ease),box-shadow .18s var(--vq-ease);
  overflow:hidden;
}
.ty-search-block:focus-within{
  border-color:var(--vq-accent)!important;
  box-shadow:var(--vq-ring)!important;
}
.ty-search-block__input,input.ty-search-block__input{
  border:0!important; box-shadow:none!important; background:transparent!important;
  font-size:15px!important; color:var(--vq-ink)!important;
}
.ut2-btn-search,.ty-search-magnifier{
  border-radius:var(--vq-radius-pill)!important;
  transition:transform .15s var(--vq-ease),background .18s var(--vq-ease);
}
.ut2-btn-search:hover{ transform:scale(1.05); }
/* Category dropdown inside search */
.ty-search-block select,.cm-combination select{ border:0!important; background:transparent!important; }

/* ---- Utility icons in header (compare / wishlist / account / cart) -------- */
.ut2-header a .ty-icon,.ut2-account-info .ty-icon{ transition:color .18s var(--vq-ease); }
.ut2-header a:hover .ty-icon{ color:var(--vq-accent); }

/* ---- Buttons -------------------------------------------------------------- */
.ty-btn,.ty-btn__primary,.ty-btn__secondary,.ty-btn__big{
  border-radius:var(--vq-radius-pill)!important;
  font-weight:600!important;
  letter-spacing:.01em;
  border:0!important;
  transition:transform .15s var(--vq-ease),box-shadow .18s var(--vq-ease),background .18s var(--vq-ease),filter .18s var(--vq-ease);
}
.ty-btn__primary,.ty-btn.ty-btn__primary{
  background:var(--vq-accent)!important; color:#fff!important;
  box-shadow:0 4px 12px rgba(255,106,0,.28);
}
.ty-btn__primary:hover{ background:var(--vq-accent-ink)!important; transform:translateY(-1px); box-shadow:0 8px 20px rgba(255,106,0,.34); }
.ty-btn__secondary{ background:var(--vq-blue)!important; color:#fff!important; }
.ty-btn__secondary:hover{ background:var(--vq-blue-ink)!important; transform:translateY(-1px); }
.ty-btn:active{ transform:translateY(0) scale(.99); }
.ty-btn-go{ border-radius:var(--vq-radius-pill)!important; }

/* ---- Cards: category tiles, product cards, promo banners ------------------ */
.ty-grid-list__item,.ut2-gp,.ut2-gp__wrap,.ty-product-thumb{
  border-radius:var(--vq-radius)!important;
  transition:transform .22s var(--vq-ease),box-shadow .22s var(--vq-ease);
}
.ty-grid-list__item{
  background:var(--vq-surface);
  box-shadow:var(--vq-shadow-sm);
  overflow:hidden;
}
.ty-grid-list__item:hover,.ut2-gp:hover{
  transform:translateY(-4px);
  box-shadow:var(--vq-shadow-lg)!important;
}
img{ border-radius:inherit; }
/* Promo / motivation banners get soft rounding + hover lift */
.ut2-banner,.ab-banner,.ut2-image-holder,.ty-banner__image-wrapper{
  border-radius:var(--vq-radius)!important; overflow:hidden;
  transition:transform .22s var(--vq-ease),box-shadow .22s var(--vq-ease);
}
.ut2-banner:hover,.ab-banner:hover{ transform:translateY(-3px); box-shadow:var(--vq-shadow); }

/* ---- Links, focus, top utility bar, motion -------------------------------- */
a{ color:var(--vq-blue); }
a:hover{ color:var(--vq-accent); }
a.ty-mainbox-title,.ty-mainbox-title a{ color:var(--vq-ink); }
:focus-visible{ outline:none; box-shadow:var(--vq-ring); border-radius:6px; }
/* Top utility strip (Boston / Promotions / Brands / currency / lang) */
.ut2-top-panel,.ty-top-panel{ font-size:12.5px; letter-spacing:.01em; }
.ut2-top-panel a,.ty-top-panel a{ color:var(--vq-muted); }
.ut2-top-panel a:hover{ color:var(--vq-ink); }
/* Respect reduced-motion */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{ transition:none!important; animation:none!important; }
}
/* Rounded, modern quantity + form controls sitewide */
input[type=text],input[type=email],input[type=password],input[type=search],textarea,select{
  border-radius:var(--vq-radius-sm)!important;
}
input:focus,textarea:focus,select:focus{ box-shadow:var(--vq-ring)!important; }
/* Deal-of-day / countdown chips a touch softer */
.ab-dod__timer,.ut2-countdown,.ty-sale-price{ letter-spacing:-.01em; }

/* ============================ Iteration 2 ================================= */
/* Sticky / floating header: clean bg + subtle elevation */
.tygh-top-panel{ border-bottom:1px solid var(--vq-line); }
.tygh-header.floating-header,.cm-fixed-header,.ut2-header.__fixed{
  box-shadow:0 2px 16px rgba(16,24,40,.07);
}
/* Tabs: Most Popular / Bestsellers / On Sale -> modern pills */
.ty-tabs{ border:0!important; gap:6px; }
.ty-tabs__item{ border:0!important; background:transparent!important; margin:0 2px!important; }
.ty-tabs__span{
  border:0!important; background:transparent!important;
  color:var(--vq-muted)!important; font-weight:600!important;
  padding:9px 18px!important; border-radius:var(--vq-radius-pill)!important;
  transition:color .18s var(--vq-ease),background .18s var(--vq-ease);
}
.ty-tabs__item:hover .ty-tabs__span{ color:var(--vq-ink)!important; background:var(--vq-bg)!important; }
.ty-tabs__item.active .ty-tabs__span{ color:var(--vq-accent)!important; background:var(--vq-accent-soft)!important; }

/* Hero slider: contain the peeking next slide, round the frame */
.banners.owl-carousel{ border-radius:var(--vq-radius-lg)!important; overflow:hidden!important; box-shadow:var(--vq-shadow-sm); }
.banners.owl-carousel .owl-stage-outer{ border-radius:inherit; overflow:hidden!important; }

/* WYSIWYG promo / category tiles: soften images */
.ty-wysiwyg-content img{ border-radius:var(--vq-radius); }

/* Trim empty-catalog voids */
.ty-product-block:empty,.ty-tabs__content:empty,.ut2-pn:empty{ display:none!important; }

/* Footer polish */
.ty-footer-grid{ background:var(--vq-bg)!important; }
.ty-footer-menu__title,.ty-footer-general__header{ font-weight:700!important; letter-spacing:-.01em; color:var(--vq-ink)!important; }
.ty-footer a{ color:var(--vq-muted); }
.ty-footer a:hover{ color:var(--vq-accent); }
.ty-footer-form-block__input{ border-radius:var(--vq-radius-pill)!important; }

/* ============================ Iteration 3 — Auth ========================= */
/* Center + cap the auth split so it stops stretching the full page width.
   .main-content-grid / .auth-information-grid are auth-page-only hooks, so
   nothing here touches the header/checkout/popup login. */
.row-fluid:has(> .main-content-grid){ max-width:940px; margin:10px auto 52px!important; float:none!important; }

/* Left: the login form becomes an elevated white card */
.main-content-grid .ty-mainbox-container{
  background:var(--vq-surface); border:1px solid var(--vq-line);
  border-radius:var(--vq-radius-lg); box-shadow:var(--vq-shadow);
  padding:34px 34px 30px; min-height:430px; box-sizing:border-box;
}
.main-content-grid .ty-mainbox-title{ text-align:left!important; font-size:26px!important; margin:0 0 22px!important; }
.ty-login .ty-control-group{ margin-bottom:18px; }
.ty-login__filed-label,.ty-login .ty-control-group__label{
  display:block; font-weight:600; font-size:13px; color:var(--vq-ink-soft); margin-bottom:7px;
}
.ty-login__input,input.ty-login__input{
  width:100%!important; box-sizing:border-box; height:48px; padding:0 15px!important;
  border:1.5px solid var(--vq-line-strong)!important; border-radius:var(--vq-radius-sm)!important;
  font-size:15px!important; background:var(--vq-bg-2)!important;
  transition:border-color .18s var(--vq-ease),box-shadow .18s var(--vq-ease),background .18s var(--vq-ease);
}
.ty-login__input:focus{ border-color:var(--vq-accent)!important; background:var(--vq-surface)!important; box-shadow:var(--vq-ring)!important; }
.ty-password-forgot{ position:relative; }
.ty-password-forgot__a{ position:absolute; right:0; top:1px; font-size:12.5px; font-weight:500; }
/* Social provider (Google) -> clean bordered pill instead of a bare icon */
.ty-hybrid-auth__icon{
  display:inline-flex; align-items:center; justify-content:center; width:46px; height:46px;
  border:1.5px solid var(--vq-line-strong); border-radius:var(--vq-radius-pill);
  transition:border-color .18s var(--vq-ease),box-shadow .18s var(--vq-ease); cursor:pointer;
}
.ty-hybrid-auth__icon:hover{ border-color:var(--vq-accent); box-shadow:var(--vq-shadow-xs); }
.ty-hybrid-auth__icon img{ width:22px!important; height:22px!important; }
/* Buttons row: remember-me left, prominent orange Sign in right */
.ty-login .buttons-container{
  display:flex; align-items:center; justify-content:space-between; gap:16px;
  margin-top:24px; background:none!important; padding:0!important; border:0!important;
}
.ty-login__remember-me-label{ font-size:13.5px; color:var(--vq-muted); }
.ty-btn__login,.ty-login .ty-btn__login{
  background:var(--vq-accent)!important; color:#fff!important; border-radius:var(--vq-radius-pill)!important;
  padding:0 34px!important; height:48px; font-weight:700!important; font-size:15px!important;
  box-shadow:0 6px 16px rgba(255,106,0,.30);
}
.ty-btn__login:hover{ background:var(--vq-accent-ink)!important; transform:translateY(-1px); box-shadow:0 9px 22px rgba(255,106,0,.36); }

/* Right: register CTA becomes a warm welcome panel */
.auth-information-grid .ty-login-info{
  background:linear-gradient(160deg,var(--vq-accent-soft),#fff8f2);
  border:1px solid #ffe2cc; border-radius:var(--vq-radius-lg); box-shadow:var(--vq-shadow-sm);
  padding:40px 36px; min-height:430px; box-sizing:border-box;
  display:flex; flex-direction:column; justify-content:center;
}
.ty-login-info__txt h4{ font-size:23px; font-weight:750; color:var(--vq-ink); margin:0 0 10px; letter-spacing:-.02em; }
.ty-login-info__txt p{ color:var(--vq-muted); font-size:14.5px; line-height:1.5; margin:0 0 24px; }
.ty-login-info__txt a{
  display:inline-block; background:var(--vq-surface); border:1.5px solid var(--vq-accent);
  color:var(--vq-accent-ink)!important; font-weight:700; padding:12px 28px;
  border-radius:var(--vq-radius-pill); transition:transform .18s var(--vq-ease),background .18s var(--vq-ease),color .18s var(--vq-ease),box-shadow .18s var(--vq-ease);
}
.ty-login-info__txt a:hover{ background:var(--vq-accent); color:#fff!important; transform:translateY(-1px); box-shadow:0 8px 20px rgba(255,106,0,.28); }

/* ============================ Iteration 4 — Registration ================= */
/* profiles.add reuses .main-content-grid, so it already gets the white card.
   Polish its labels, inputs, section subheaders + the benefits side panel. */
.ty-account .ty-control-group__title,.ty-account .cm-profile-field{
  font-weight:600!important; font-size:13px!important; color:var(--vq-ink-soft)!important;
}
.ty-account .ty-input-text,.ty-account input[type=text],.ty-account input[type=email],
.ty-account input[type=password],.ty-account input[type=tel]{
  width:100%!important; box-sizing:border-box; height:46px; padding:0 15px!important;
  border:1.5px solid var(--vq-line-strong)!important; border-radius:var(--vq-radius-sm)!important;
  font-size:15px!important; background:var(--vq-bg-2)!important;
  transition:border-color .18s var(--vq-ease),box-shadow .18s var(--vq-ease),background .18s var(--vq-ease);
}
.ty-account .ty-input-text:focus,.ty-account input:focus{
  border-color:var(--vq-accent)!important; background:var(--vq-surface)!important; box-shadow:var(--vq-ring)!important;
}
.ty-account .ty-subheader,.ty-account .ty-subheader__title{
  font-weight:700!important; color:var(--vq-ink)!important; letter-spacing:-.01em;
  border:0!important; background:none!important; padding:0!important; margin:22px 0 14px!important; font-size:16px!important;
}
.ty-profile-field__buttons.buttons-container{ background:none!important; border:0!important; padding:16px 0 0!important; }
.ty-profile-field__buttons .ty-btn{ min-width:180px; }
/* The register submit renders as secondary (teal) — promote it to brand orange */
.main-content-grid .ty-profile-field__buttons .ty-btn__secondary,
.main-content-grid .ty-profile-field__buttons button[type=submit]{
  background:var(--vq-accent)!important; color:#fff!important;
  box-shadow:0 6px 16px rgba(255,106,0,.30);
}
.main-content-grid .ty-profile-field__buttons .ty-btn__secondary:hover,
.main-content-grid .ty-profile-field__buttons button[type=submit]:hover{ background:var(--vq-accent-ink)!important; transform:translateY(-1px); }

/* Right: benefits -> warm welcome panel that mirrors the login CTA */
.profile-information-grid .ty-account-benefits{
  background:linear-gradient(160deg,var(--vq-accent-soft),#fff8f2);
  border:1px solid #ffe2cc; border-radius:var(--vq-radius-lg); box-shadow:var(--vq-shadow-sm); padding:34px 32px;
}
.ty-account-benefits h4{ font-size:19px; font-weight:750; color:var(--vq-ink); margin:0 0 16px; letter-spacing:-.02em; }
.ty-account-benefits ul{ list-style:none; margin:0; padding:0; }
.ty-account-benefits li{ position:relative; padding:0 0 13px 30px; color:var(--vq-ink-soft); font-size:14.5px; line-height:1.45; }
.ty-account-benefits li::before{
  content:"\2713"; position:absolute; left:0; top:1px; width:20px; height:20px; border-radius:50%;
  background:var(--vq-accent); color:#fff; font-size:12px; font-weight:700;
  display:flex; align-items:center; justify-content:center; line-height:1;
}

/* ============================ Iteration 5 — Product page (PDP) ============ */
/* Column rhythm + product title */
.ut2-pb__wrapper{ gap:36px; }
.ut2-pb__title{
  font-size:clamp(24px,2.1vw,32px)!important; line-height:1.2!important;
  letter-spacing:-.02em; margin:2px 0 12px!important; font-weight:750!important;
}
/* Gallery: clean framed stage so image (or empty state) looks intentional */
.ut2-pb__img-wrapper{
  background:var(--vq-bg-2); border:1px solid var(--vq-line);
  border-radius:var(--vq-radius-lg)!important; overflow:hidden; padding:16px; box-sizing:border-box;
}
.ut2-pb__img-wrapper img{ border-radius:var(--vq-radius); }
/* Discount label -> modern pill */
.ty-product-labels__item--discount{ font-weight:700!important; }
.ty-product-labels__item--discount .ty-product-labels__image,
.ty-product-labels__item--discount span,
.ty-product-labels__item--discount bdi{ border-radius:var(--vq-radius-pill)!important; }
/* Right column -> elevated buy box (Amazon-style), sticky on desktop */
.ut2-pb__right{
  background:var(--vq-surface); border:1px solid var(--vq-line);
  border-radius:var(--vq-radius-lg); box-shadow:var(--vq-shadow-sm);
  padding:22px 22px 20px; box-sizing:border-box;
}
.ut2-pb__right-second{ margin-top:14px; }
@media (min-width:1024px){ .ut2-pb__right-wrap{ position:sticky; top:18px; align-self:flex-start; } }
/* Price block: big bold current, muted struck old, accent-soft save chip */
.ut2-pb__price-wrap{ margin:6px 0 4px; }
.ut2-pb__price-actual .ty-price,.ut2-pb__price-actual .ty-price-num{
  font-size:32px!important; font-weight:800!important; color:var(--vq-ink)!important; letter-spacing:-.02em;
}
.ut2-pb__price-old{ color:var(--vq-faint)!important; }
.ut2-pb__price-old .ty-list-price{ text-decoration:line-through; font-weight:600; }
.ty-list-price.ty-save-price,.ty-save-price{
  display:inline-block; background:var(--vq-accent-soft); color:var(--vq-accent-ink)!important;
  border-radius:var(--vq-radius-pill); padding:3px 11px!important; font-weight:700; font-size:12.5px; text-decoration:none!important;
}
/* In-stock -> green status pill with dot */
.ty-qty-in-stock{
  display:inline-flex!important; align-items:center; gap:7px; width:auto!important;
  background:#eafaf1; color:#177245!important; border-radius:var(--vq-radius-pill);
  padding:5px 12px; font-weight:600; font-size:13px;
}
.ty-qty-in-stock::before{ content:""; width:8px; height:8px; border-radius:50%; background:#22a95a; }
/* Quantity stepper -> rounded control */
.ty-qty.changer,.ty-value-changer{
  border-radius:var(--vq-radius-pill)!important; overflow:hidden;
  border:1.5px solid var(--vq-line-strong)!important; background:var(--vq-surface);
}
.ty-value-changer__input,input.ty-value-changer__input{ border:0!important; box-shadow:none!important; background:transparent!important; font-weight:600; text-align:center; }
.ty-value-changer__increase,.ty-value-changer__decrease{ background:var(--vq-bg-2)!important; border:0!important; color:var(--vq-ink-soft)!important; transition:background .15s var(--vq-ease),color .15s var(--vq-ease); }
.ty-value-changer__increase:hover,.ty-value-changer__decrease:hover{ background:var(--vq-accent-soft)!important; color:var(--vq-accent-ink)!important; }
/* Add to cart -> full width, prominent */
.ut2-pb__button .ty-btn__add-to-cart,.ty-btn__add-to-cart{ width:100%!important; min-height:52px; font-size:16px!important; }
/* Wishlist / compare -> subtle ghost links */
.ut2-pb__advanced-option .ty-wishlist__a,.ut2-pb__advanced-option .ty-compare__a{ color:var(--vq-muted)!important; font-weight:500; transition:color .15s var(--vq-ease); }
.ut2-pb__advanced-option .ty-wishlist__a:hover,.ut2-pb__advanced-option .ty-compare__a:hover{ color:var(--vq-accent)!important; }
.ut2-pb__share{ border-radius:var(--vq-radius-pill)!important; }
/* Content tabs (Description / Reviews) -> clean underline, accent active */
.ty-tabs__a{ color:var(--vq-muted)!important; font-weight:600!important; padding:10px 4px!important; transition:color .15s var(--vq-ease); }
.ty-tabs__item:hover .ty-tabs__a{ color:var(--vq-ink)!important; }
.ty-tabs__item.active .ty-tabs__a{ color:var(--vq-ink)!important; border-bottom:2px solid var(--vq-accent); }

/* ============================ Iteration 6 — 3D & AR viewer ================= */
/* The gallery wrapper becomes the positioning context for the overlaid stage. */
.ut2-pb__img-wrapper{ position:relative; }
.vq-ar{ position:static; }
/* Segmented Photo / 3D toggle, floated top-left over the gallery. */
.vq-ar__switch{
  position:absolute; top:14px; left:14px; z-index:6;
  display:inline-flex; gap:2px; padding:3px;
  background:rgba(255,255,255,.86); backdrop-filter:blur(8px);
  border:1px solid var(--vq-line); border-radius:var(--vq-radius-pill);
  box-shadow:var(--vq-shadow-sm);
}
.vq-ar__tab{
  appearance:none; border:0; cursor:pointer;
  padding:6px 14px; border-radius:var(--vq-radius-pill);
  font-size:12.5px; font-weight:650; line-height:1; letter-spacing:.01em;
  color:var(--vq-muted); background:transparent;
  transition:background .15s var(--vq-ease),color .15s var(--vq-ease);
}
.vq-ar__tab:hover{ color:var(--vq-ink); }
.vq-ar__tab.is-active{ background:var(--vq-accent); color:#fff; box-shadow:0 3px 10px rgba(255,106,0,.30); }
/* The 3D stage overlays the still image inside the same square. */
.vq-ar__stage{
  position:absolute; inset:0; z-index:5;
  background:var(--vq-bg-2); border-radius:var(--vq-radius);
  overflow:hidden;
}
.vq-ar__stage[hidden]{ display:none; }
.vq-ar__viewer{
  width:100%; height:100%; display:block;
  --poster-color:transparent; background:var(--vq-bg-2);
}
/* AR launch button, centered along the bottom of the stage. */
.vq-ar__cta{
  position:absolute; left:50%; bottom:16px; transform:translateX(-50%);
  display:inline-flex; align-items:center; gap:2px; white-space:nowrap;
  padding:11px 20px; border:0; cursor:pointer;
  background:var(--vq-accent); color:#fff;
  border-radius:var(--vq-radius-pill); font-size:14px; font-weight:700;
  box-shadow:0 8px 22px rgba(255,106,0,.34);
  transition:background .15s var(--vq-ease),transform .15s var(--vq-ease);
}
.vq-ar__cta:hover{ background:var(--vq-accent-ink); transform:translateX(-50%) translateY(-1px); }
.vq-ar__cta:active{ transform:translateX(-50%) translateY(0); }
/* Only show the AR button where AR is actually available. */
.vq-ar__viewer:not([ar-status="not-presenting"]) .vq-ar__cta{ display:none; }
.vq-ar__note{
  position:absolute; left:0; right:0; bottom:0; z-index:6;
  padding:8px 12px calc(16px + 46px);
  text-align:center; font-size:11.5px; line-height:1.35; color:var(--vq-faint);
  background:linear-gradient(to top,rgba(250,250,252,.96),rgba(250,250,252,0));
  pointer-events:none;
}
.vq-ar__note b{ color:var(--vq-muted); font-weight:700; }
@media (max-width:640px){
  .vq-ar__switch{ top:10px; left:10px; }
  .vq-ar__note{ padding-bottom:calc(14px + 44px); }
}

/* ============================================================
   Iteration 7 — Auction / bidding panel (storefront PDP)
   Renders in products:prices_block, directly under the price.
   ============================================================ */
.vq-auction{
  margin:16px 0 4px; padding:16px 18px;
  border:1px solid var(--vq-line-strong); border-radius:var(--vq-radius-lg);
  background:linear-gradient(180deg,#fff, var(--vq-bg-2));
  box-shadow:var(--vq-shadow-sm);
}
.vq-auction.is-live{ border-color:rgba(255,106,0,.32); box-shadow:0 8px 26px rgba(255,106,0,.10); }
.vq-auction.is-ended{ opacity:.92; }
.vq-auction__head{ display:flex; align-items:center; justify-content:space-between; margin-bottom:12px; }
.vq-auction__label{ font-size:12px; font-weight:800; letter-spacing:.14em; text-transform:uppercase; color:var(--vq-muted); }
.vq-auction__pill{
  display:inline-flex; align-items:center; gap:6px;
  padding:4px 11px; border-radius:var(--vq-radius-pill);
  font-size:12px; font-weight:700; color:var(--vq-muted);
  background:var(--vq-bg); border:1px solid var(--vq-line-strong);
}
.vq-auction__pill--live{ color:#fff; background:var(--vq-accent); border-color:transparent; }
.vq-auction__pill--ended{ color:var(--vq-faint); }
.vq-auction__dot{ width:7px; height:7px; border-radius:50%; background:#fff; box-shadow:0 0 0 0 rgba(255,255,255,.7); animation:vqPulse 1.6s var(--vq-ease) infinite; }
@keyframes vqPulse{ 0%{box-shadow:0 0 0 0 rgba(255,255,255,.6);} 70%{box-shadow:0 0 0 6px rgba(255,255,255,0);} 100%{box-shadow:0 0 0 0 rgba(255,255,255,0);} }
.vq-auction__bidrow{ display:flex; align-items:flex-end; justify-content:space-between; gap:16px; }
.vq-auction__amount{ display:flex; flex-direction:column; gap:2px; }
.vq-auction__amount-label{ font-size:12.5px; color:var(--vq-muted); font-weight:600; }
.vq-auction__amount-val{ font-size:30px; line-height:1.05; font-weight:800; color:var(--vq-ink); letter-spacing:-.02em; }
.vq-auction__amount-val .ty-price,.vq-auction__amount-val bdi{ font-size:inherit; font-weight:inherit; color:inherit; }
.vq-auction__meta{ display:flex; flex-direction:column; align-items:flex-end; gap:5px; }
.vq-auction__count{ font-size:13px; color:var(--vq-ink-soft); font-weight:600; }
.vq-auction__reserve{ font-size:11.5px; font-weight:700; padding:2px 9px; border-radius:var(--vq-radius-pill); }
.vq-auction__reserve.is-met{ color:#0a7a3d; background:#e7f7ee; }
.vq-auction__reserve.is-unmet{ color:var(--vq-muted); background:var(--vq-bg); }

.vq-auction__timer{ display:flex; align-items:baseline; gap:8px; margin:13px 0 2px; padding-top:12px; border-top:1px dashed var(--vq-line-strong); }
.vq-auction__timer-label{ font-size:12.5px; color:var(--vq-muted); font-weight:600; }
.vq-auction__clock{ font-size:16px; font-weight:800; color:var(--vq-accent-ink); font-variant-numeric:tabular-nums; letter-spacing:.01em; }
.vq-auction__timer--ended .vq-auction__timer-label{ color:var(--vq-faint); }
.vq-auction__form{ margin-top:14px; }
.vq-auction__controls{ display:flex; gap:10px; }
.vq-auction__input{
  flex:1 1 auto; min-width:0; height:48px; padding:0 14px;
  border:1px solid var(--vq-line-strong); border-radius:var(--vq-radius-md);
  background:#fff; font-size:16px; font-weight:700; color:var(--vq-ink);
  transition:border-color .15s var(--vq-ease),box-shadow .15s var(--vq-ease);
}
.vq-auction__input:focus{ outline:none; border-color:var(--vq-accent); box-shadow:var(--vq-ring); }
.vq-auction__btn{
  flex:0 0 auto; height:48px; padding:0 26px; border:0; cursor:pointer;
  border-radius:var(--vq-radius-pill); background:var(--vq-accent); color:#fff;
  font-size:15px; font-weight:800; letter-spacing:.01em;
  box-shadow:0 8px 22px rgba(255,106,0,.28);
  transition:background .15s var(--vq-ease),transform .12s var(--vq-ease);
}
.vq-auction__btn:hover{ background:var(--vq-accent-ink); transform:translateY(-1px); }
.vq-auction__btn:active{ transform:translateY(0); }
.vq-auction__btn--signin{ display:inline-flex; align-items:center; justify-content:center; width:100%; margin-top:12px; text-decoration:none; }
.vq-auction__hint{ margin:9px 2px 0; font-size:12.5px; color:var(--vq-muted); }
.vq-auction__hint .ty-price,.vq-auction__hint bdi{ font-weight:700; color:var(--vq-ink-soft); }
.vq-auction__won{ margin-top:13px; padding:11px 14px; border-radius:var(--vq-radius-md); background:var(--vq-accent-soft); color:var(--vq-accent-ink); font-weight:700; font-size:13.5px; }
.vq-auction__note{ margin-top:13px; padding:11px 14px; border-radius:var(--vq-radius-md); background:var(--vq-bg); color:var(--vq-muted); font-size:13.5px; }
@media (max-width:640px){
  .vq-auction__amount-val{ font-size:26px; }
  .vq-auction__controls{ flex-direction:column; }
  .vq-auction__btn{ width:100%; }
}

/* While a live auction is showing, CS-Cart's own add-to-cart controls in the
   main buy column are suppressed — buying-by-cart is disabled server-side for
   the duration (bidding is the only path). Keyed off the `vq-live-auction`
   class the panel sets on <html>, so it holds through CS-Cart buy-box
   re-renders and regardless of where the button parses relative to the panel.
   Scoped to `.ut2-pb__right` (the detailed-PDP buy column) so related-product
   and grid buy buttons elsewhere on the page are untouched. */
html.vq-live-auction .ut2-pb__right .ut2-pb__button,
html.vq-live-auction .ut2-pb__right .ut2-pb__buttons-container,
html.vq-live-auction .ut2-pb__right .ty-product-block__button{ display:none !important; }

/* ============================================================
   Iteration 8 — Auth polish (login + registration consistency)
   Confirmed live via the two-column layout; these even out the
   two CTAs, calm the desktop height imbalance on register, and
   give the forms one shared rhythm. CSS-only, page-scoped.
   ============================================================ */
/* Register submit CTA: match the 48px pill the login page uses. */
.main-content-grid .ty-profile-field__buttons .ty-btn__secondary,
.main-content-grid .ty-profile-field__buttons button[type=submit]{
  height:48px!important; padding:0 34px!important;
  font-size:15px!important; font-weight:700!important;
  border-radius:var(--vq-radius-pill)!important;
  display:inline-flex; align-items:center; justify-content:center;
}
/* On desktop, let the welcome / benefits column ride alongside the
   (much taller) form instead of stranding it at the top. */
@media (min-width:768px){
  .auth-information-grid,.profile-information-grid{ align-self:flex-start; }
  .auth-information-grid .ty-login-info,
  .profile-information-grid .ty-account-benefits{ position:sticky; top:18px; }
}
/* Consistent field label rhythm across both forms. */
.ty-account .ty-control-group{ margin-bottom:16px; }
/* The register form's inline "required" asterisks in brand accent. */
.ty-account .ty-control-group__title .cm-required-note,
.ty-login .cm-required::after{ color:var(--vq-accent); }
/* Password-forgot link: never collide with a long localized label. */
.ty-password-forgot__label{ padding-right:130px; }
/* Both CTAs get a confident full-press feedback. */
.ty-btn__login:active,
.main-content-grid .ty-profile-field__buttons button[type=submit]:active{ transform:translateY(0) scale(.99); }
