/* Appearance controls use the storefront's semantic theme tokens. */
:root {
  color-scheme: light;
  --header-height: 96px;
}
:root[data-theme="dark"] {
  color-scheme: dark;
}
.appearance {display:inline-flex;flex:none;width:88px;height:48px;line-height:1;}
@media(max-width:360px) {
  .header-inner {gap:8px;}
  .header-actions {gap:4px;}
  .basket-button {padding-inline:8px;}
}
html {
  scroll-padding-top: calc(var(--header-height) + 24px);
  scrollbar-gutter: stable;
}
input,
select,
textarea {
  color-scheme: inherit;
}
main,
section,
article,
form,
fieldset {
  min-width: 0;
}
img {
  overflow-wrap: normal;
}
dialog {
  max-height: calc(100vh - 24px);
  max-height: calc(100dvh - 24px);
  overscroll-behavior: contain;
}
dialog::backdrop {
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
}
.header {
  padding-inline: env(safe-area-inset-right) env(safe-area-inset-left);
}
body {
  padding-bottom: env(safe-area-inset-bottom);
}
button,
input,
select,
textarea {
  max-width: 100%;
}
@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }
  *,
  *::before,
  *::after {
    animation: none !important;
    transition: none !important;
  }
}