/*
 * ALP Store preview compatibility layer.
 * Keep this file intentionally small to avoid conflicting with alp-store-overrides.css.
 */

body.alp-store-template {
  --alp-preview-ring: color-mix(in srgb, var(--alp-secondary) 38%, transparent);
}

body.alp-store-template .alp-store-card:focus-within,
body.alp-store-template .alp-store-card a:focus-visible,
body.alp-store-template .aa-store-dd-btn:focus-visible,
body.alp-store-template .aa-store-cart-btn:focus-visible,
body.alp-store-template .aa-store-theme-toggle:focus-visible,
body.alp-store-template .alp-btn:focus-visible,
body.alp-store-template .aa-store-btn:focus-visible,
body.alp-store-template input:focus-visible,
body.alp-store-template select:focus-visible,
body.alp-store-template textarea:focus-visible,
body.alp-store-template button:focus-visible {
  outline: 2px solid var(--alp-preview-ring);
  outline-offset: 2px;
}

body.alp-store-template .alp-market-carousel-track::-webkit-scrollbar,
body.alp-store-template .aa-store-cart-body::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}

body.alp-store-template .alp-market-carousel-track::-webkit-scrollbar-thumb,
body.alp-store-template .aa-store-cart-body::-webkit-scrollbar-thumb {
  background: color-mix(in srgb, var(--alp-divider) 74%, transparent);
  border-radius: 999px;
}

body.alp-store-template .alp-market-carousel-track::-webkit-scrollbar-track,
body.alp-store-template .aa-store-cart-body::-webkit-scrollbar-track {
  background: transparent;
}