*,
*::before,
*::after {
  box-sizing: border-box;
}
@media (max-width: 959px) {
  * {
    -webkit-tap-highlight-color: transparent;
  }
}
:root {
  --body-scrollbar-width: 17px;
  --focus-ring-color: #1178ff;
  --focus-ring-width: 3px;
  --focus-ring-offset: 2px;
}
@supports (-webkit-appearance: none) {
  :root {
    --body-scrollbar-width: 15px;
  }
}
body {
  --body-container-width: calc(100vw - var(--body-scrollbar-width));

  width: 100%;
  margin: 0;
}
body,
html {
  color: rgba(var(--color-text));
  background-color: rgb(var(--color-page-background));
}

/* ============================================================
   Torida - product price colour fix (fail-safe, site-wide)
   Bug: "--color-sale" resolves to 0,0,0 (black). Every colour
   scheme uses a dark background with white text, so sale /
   regular prices rendered black and were invisible, while the
   grey compare-at price stayed visible. These overrides keep
   prices legible on every dark scheme.
   ============================================================ */
body {
  /* keep sale colour in sync with the scheme text colour */
  --color-sale: 255, 255, 255;
}

/* Current / sale / regular price -> pure white */
.product-price__sale,
.product-price__item.product-price__sale,
[class*="product-price__sale"],
.price-item--sale,
.price__sale,
.price--sale,
.price--highlight,
.product-card__price .price,
.product-card__price .price-item {
  color: #ffffff !important;
}

/* Compare-at / original (strikethrough) price -> medium grey */
.product-price__origin,
[class*="product-price__origin"],
.price__sale .price-item--regular,
.price__compare,
.compare-at-price {
  color: rgba(255, 255, 255, 0.6) !important;
}