/* Add custom CSS styles below */ 

/* Voxel product bar hotfix (October 2026). Works together with voxel-hotfix.js, which adds the "vxh" class.
   It turns itself off when the fixed theme version is live (then "vxh" is never added). Safe to delete after that. */

/* 1. The add-to-cart bar never stays hidden after typing; it only steps aside while the keyboard is open */
html.vxh body.vx-typing .vx-product .main-content .vx-buy-card section.sticky-product-bar { transform: none !important; }
html.vxh body.vxh-kb .vx-product .main-content .vx-buy-card section.sticky-product-bar { transform: translateY(120%) !important; }

/* 2. The hotfix draws its own total, old total, color dots and summary line; the theme's broken ones are hidden */
html.vxh .vx-product .sticky-product-bar .vx-atc-price,
html.vxh .vx-product .sticky-product-bar .vx-atc-old,
html.vxh .vx-product .vx-bar-sum .vx-bar-sum__dots,
html.vxh .vx-product .vx-bar-sum .vx-bar-sum__text { display: none !important; }

html.vxh .vxh-price { font-weight: 900; white-space: nowrap; margin: 0 8px; }
html.vxh .vxh-old { font-size: 12px; font-weight: 700; opacity: .75; white-space: nowrap; }
html.vxh .vxh-old[hidden], html.vxh .vxh-dots[hidden], html.vxh .vxh-dots i[hidden] { display: none !important; }
html.vxh .vxh-price i, html.vxh .vxh-old i { font-size: .9em; vertical-align: middle; }

html.vxh .vxh-dots { flex: none; display: flex; align-items: center; height: 20px; }
html.vxh .vxh-dots i { flex: none; width: 20px; height: 20px; border-radius: 50%; box-shadow: 0 0 0 2px #fff, inset 0 0 0 1px rgba(11, 79, 75, .15); }
html.vxh .vxh-dots i + i { margin-right: -6px; }
html.vxh .vxh-text { flex: 1; min-width: 0; font-size: 12px; font-weight: 800; color: #0B4F4B; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
@media (max-width: 640px) {
  html.vxh .vxh-dots { height: 16px; }
  html.vxh .vxh-dots i { width: 16px; height: 16px; }
}

/* 3. Announcement bar pinned above the header while scrolling (voxel-hotfix.js adds "vxh-ann" on every page except the product page) */
html.vxh-ann .vx-ann { position: sticky; top: 0; z-index: 61; }
html.vxh-ann .vx-ann ~ .vx-header { top: var(--vxh-ann-h, 38px); }
html.vxh-ann .vx-ann__ship i, .vx-ann__ship i.sicon-sar { font-size: .95em; vertical-align: middle; }