/**
 * Asma tenant — branded scrollbars (page shell + all scroll panels).
 * Scoped via html[data-storefront-template='asma-shop'].
 */
html[data-storefront-template='asma-shop'] {
  --asma-scrollbar-track: #eef5f1;
  --asma-scrollbar-thumb: #3bb77e;
  --asma-scrollbar-thumb-mid: #2da86a;
  --asma-scrollbar-thumb-hover: #239e5f;
  --asma-scrollbar-thumb-light: #5fd49a;
}

/* Firefox */
html[data-storefront-template='asma-shop'],
html[data-storefront-template='asma-shop'] body,
html[data-storefront-template='asma-shop'] * {
  scrollbar-width: thin;
  scrollbar-color: var(--asma-scrollbar-thumb) var(--asma-scrollbar-track);
}

/* WebKit — page + every scrollable panel */
html[data-storefront-template='asma-shop']::-webkit-scrollbar,
html[data-storefront-template='asma-shop'] body::-webkit-scrollbar,
html[data-storefront-template='asma-shop'] *::-webkit-scrollbar {
  width: 12px;
  height: 12px;
}

html[data-storefront-template='asma-shop']::-webkit-scrollbar-button,
html[data-storefront-template='asma-shop'] body::-webkit-scrollbar-button,
html[data-storefront-template='asma-shop'] *::-webkit-scrollbar-button {
  display: none;
  width: 0;
  height: 0;
}

html[data-storefront-template='asma-shop']::-webkit-scrollbar-track,
html[data-storefront-template='asma-shop'] body::-webkit-scrollbar-track,
html[data-storefront-template='asma-shop'] *::-webkit-scrollbar-track {
  background: var(--asma-scrollbar-track);
  border-radius: 999px;
}

html[data-storefront-template='asma-shop']::-webkit-scrollbar-thumb,
html[data-storefront-template='asma-shop'] body::-webkit-scrollbar-thumb,
html[data-storefront-template='asma-shop'] *::-webkit-scrollbar-thumb {
  background: linear-gradient(
    180deg,
    var(--asma-scrollbar-thumb-light) 0%,
    var(--asma-scrollbar-thumb) 48%,
    var(--asma-scrollbar-thumb-mid) 100%
  );
  border: 2px solid var(--asma-scrollbar-track);
  border-radius: 999px;
  background-clip: padding-box;
}

html[data-storefront-template='asma-shop']::-webkit-scrollbar-thumb:hover,
html[data-storefront-template='asma-shop'] body::-webkit-scrollbar-thumb:hover,
html[data-storefront-template='asma-shop'] *::-webkit-scrollbar-thumb:hover {
  background: linear-gradient(
    180deg,
    var(--asma-scrollbar-thumb) 0%,
    var(--asma-scrollbar-thumb-hover) 100%
  );
  border: 2px solid var(--asma-scrollbar-track);
}

html[data-storefront-template='asma-shop']::-webkit-scrollbar-corner,
html[data-storefront-template='asma-shop'] body::-webkit-scrollbar-corner,
html[data-storefront-template='asma-shop'] *::-webkit-scrollbar-corner {
  background: var(--asma-scrollbar-track);
}

/* Slim horizontal rails (deals carousel, product strips) */
html[data-storefront-template='asma-shop'] .asma-deals-row::-webkit-scrollbar,
html[data-storefront-template='asma-shop'] .asma-featured-row::-webkit-scrollbar {
  height: 6px;
}

html[data-storefront-template='asma-shop'] .asma-deals-row::-webkit-scrollbar-thumb,
html[data-storefront-template='asma-shop'] .asma-featured-row::-webkit-scrollbar-thumb {
  border-width: 1px;
}

/* Panels that intentionally hide native scrollbars */
html[data-storefront-template='asma-shop'] .sara-popular-cat-scroll {
  scrollbar-width: none;
}

html[data-storefront-template='asma-shop'] .sara-popular-cat-scroll::-webkit-scrollbar {
  display: none;
  width: 0;
  height: 0;
}