:root {
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}

html,
body {
  width: 100%;
  max-width: 100%;
  overflow-x: hidden;
  overscroll-behavior-x: none;
  touch-action: pan-x pan-y;
}

@supports (overflow: clip) {
  html,
  body {
    overflow-x: clip;
  }
}

body,
body * {
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  user-select: none;
}

input,
textarea,
select,
[contenteditable="true"] {
  -webkit-user-select: text;
  user-select: text;
}

button,
a,
label,
input,
textarea,
select,
[role="button"],
[tabindex] {
  touch-action: manipulation;
}

[data-showcase-viewport],
[data-product-gallery] .product-gallery__viewport,
.customer-main,
.side-sheet__body,
.admin-content,
.gate-stage {
  touch-action: pan-y;
}

img,
svg,
video,
canvas,
picture {
  max-width: 100%;
  -webkit-user-drag: none;
  user-drag: none;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  user-select: none;
}

body > *,
main,
header,
footer,
nav,
section,
article,
aside,
form,
fieldset,
[role="dialog"] {
  min-width: 0;
  max-width: 100%;
}

[role="dialog"],
.modal-layer,
.sheet-layer,
.customer-layer,
.reauth-layer {
  max-width: 100vw;
  max-width: 100dvw;
}

@supports (-webkit-touch-callout: none) {
  @media (max-width: 899px) {
    input,
    textarea,
    select {
      font-size: 16px !important;
    }
  }
}

@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto !important;
  }
}
