/** Shopify CDN: Minification failed

Line 22593:2 Expected "}" to go with "{"

**/
:root {
  --focused-base-outline: 0.2rem solid rgb(var(--color-foreground-rgb) / var(--opacity-50));
  --focused-base-outline-offset: 0.3rem;
  --focused-base-box-shadow: 0 0 0 0.3rem var(--color-foreground),
    0 0 0.5rem 0.4rem rgb(var(--color-foreground-rgb) / var(--opacity-30));
  --duration-extra-short: 10ms;
  --duration-short: 100ms;
  --duration-default: 200ms;
  --duration-announcement-bar: 250ms;
  --duration-medium: 300ms;
  --duration-long: 500ms;
  --duration-extra-long: 600ms;
  --duration-extra-longer: 750ms;
  --duration-extended: 3s;
  --ease-out-slow: cubic-bezier(0, 0, 0.3, 1);
  --animation-slide-in: slideIn var(--duration-extra-long) var(--ease-out-slow) forwards;
  --animation-fade-in: fadeIn var(--duration-extra-long) var(--ease-out-slow);
  --cubic-fast: cubic-bezier(0.34, 1.56, 0.64, 1);
  --cubic-smooth: cubic-bezier(0.7, 0, 0.3, 1);
  --tst-smooth: 0.6s cubic-bezier(0.7, 0, 0.3, 1);
}

a:empty:not([class]),
ul:empty:not([class]),
dl:empty:not([class]),
div:empty:not([class]),
section:empty:not([class]),
article:empty:not([class]),
p:empty:not([class]),
h1:empty:not([class]),
h2:empty:not([class]),
h3:empty:not([class]),
h4:empty:not([class]),
h5:empty:not([class]),
h6:empty:not([class]) {
  display: none;

}

.product-card-wrapper .card {
  --border-radius: var(--product-card-corner-radius);
  --border-width: var(--product-card-border-width);
  --shadow-horizontal-offset: var(--product-card-shadow-horizontal-offset);
  --shadow-vertical-offset: var(--product-card-shadow-vertical-offset);
  --shadow-blur-radius: var(--product-card-shadow-blur-radius);
  --image-padding: var(--product-card-image-padding);
}

.shopify-design-mode .shopify-section-group-popup-group {
  position: fixed;
}

.shopify-design-mode .shopify-section-group-popup-group:not(.section-multitasking-bar),
.shopify-design-mode body:not(.overflow-hidden) .shopify-section-group-popup-group.section-multitasking-bar {
  z-index: 99;
}

*,
*::before,
*::after {
  box-sizing: border-box;
}

html {
  overflow-y: scroll;
  touch-action: manipulation;
  -moz-osx-font-smoothing: grayscale;
  -webkit-font-smoothing: antialiased;
  -webkit-text-size-adjust: 100%;
  font-feature-settings: normal;
}

.no-js:not(html) {
  display: none !important;
}

html.no-js .no-js:not(html) {
  display: block !important;
}

html.no-js .no-js-hidden,
html.js noscript {
  display: none !important;
}

html[scroll-lock] {
  overflow: hidden;
}

html,
body {
  overflow-x: clip;
}

body.overflow-hidden-mobile {
  overflow: clip;
  padding-right: var(--scrollbar-width, 0);
}

html:not(.overflow-hidden-mobile):has(body.overflow-hidden-mobile)  {
  overflow: clip;
}

@supports (text-wrap: balance) {
  h1,
  h2,
  h3,
  h4,
  h5 {
    text-wrap: balance;
  }
}

@supports (text-wrap: pretty) {
  p,
  .inline-richtext,
  .rte {
    text-wrap: pretty;
  }
}

/* Reset html */
:is(p, h1, h2, h3, h4, h5, h6):first-child,
:empty:first-child + :where(p, h1, h2, h3, h4, h5, h6) {
  margin-block-start: 0;
}

:is(p, h1, h2, h3, h4, h5, h6):last-child,
:where(p, h1, h2, h3, h4, h5, h6) + :has(+ :empty:last-child) {
  margin-block-end: 0;
}

body.overflow-hidden {
  padding-right: var(--scrollbar-width, 0);
  overflow: clip;
}

.page-width {
  width: 100%;
  margin: 0 auto;
  padding: 0 var(--page-margin);
  max-width: var(--page-width);
}

.page-width--default {
  max-width: calc(var(--page-width) + 3rem);
}

.page-width--full {
  max-width: 100%;
  padding: 0;
}

.section + .section {
  margin-top: var(--spacing-sections-mobile);
}

@media screen and (min-width: 750px) {
  .section + .section {
    margin-top: var(--spacing-sections-desktop);
  }
}

.element-margin-top {
  margin-top: 5rem;
}

.background-secondary {
  background-color: rgb(var(--color-foreground-rgb) / var(--opacity-4));
}

.grid-auto-flow {
  display: grid;
  grid-auto-flow: column;
}

.page-margin {
  margin: 7rem auto;
}

.shopify-challenge__container {
  margin: 7rem auto !important;
}

.rte-width {
  max-width: 82rem;
  margin: 0 auto 2rem;
}

.list-unstyled {
  margin: 0;
  padding: 0;
  list-style: none;
}

.list-disc {
  list-style-position: inside;
}

.visually-hidden {
  position: absolute !important;
  overflow: hidden;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  border: 0;
  clip: rect(0 0 0 0);
  word-wrap: normal !important;
}

.visually-hidden--inline {
  margin: 0;
  height: 1em;
}

.skip-to-content-link:focus {
  z-index: 9999;
  position: inherit;
  overflow: auto;
  width: auto;
  height: auto;
  clip: auto;
}

.full-width-link {
  position: absolute;
  inset: 0;
  z-index: 2;
}

::selection {
  background-color: rgb(var(--color-foreground-rgb) / var(--opacity-20));
}

/* Typography presets */

.text-body {
  font-size: var(--font-body--size);
  letter-spacing: 0.06rem;
  line-height: var(--font-body--line-height);
  font-family: var(--font-body--family);
  font-style: var(--font-body--style);
  font-weight: var(--font-body--weight);
  color: var(--color-foreground);
}

h1,
h2,
h3,
h4,
h5,
.h1,
.h2,
.h3,
.h4,
.h5 {
  overflow-wrap: break-word;
}

h1,
.h1,
.text-block.h1 > * {
  font-family: var(--font-h1--family);
  font-style: var(--font-h1--style);
  font-weight: var(--font-h1--weight);
  font-size: var(--font-size--h1);
  letter-spacing: var(--font-h1--letter-spacing);
  text-transform: var(--font-h1--case);
  line-height: var(--font-h1--line-height);
 
}

@media screen and (max-width: 1024px) {
  input.h1,
  textarea.h1,
  select.h1 {
    font-size: max(1rem, var(--font-h1--size));
  }
}

h2,
.h2,
.text-block.h2 > * {
  font-family: var(--font-h2--family);
  font-style: var(--font-h2--style);
  font-weight: var(--font-h2--weight);
  font-size: var(--font-size--h2);
  letter-spacing: var(--font-h2--letter-spacing);
  text-transform: var(--font-h2--case);
  line-height: var(--font-h2--line-height);
}

@media screen and (max-width: 1024px) {
  input.h2,
  textarea.h2,
  select.h2 {
    font-size: max(1rem, var(--font-h2--size));
  }
}

h3,
.h3,
.text-block.h3 > * {
  font-family: var(--font-h3--family);
  font-style: var(--font-h3--style);
  font-weight: var(--font-h3--weight);
  font-size: var(--font-size--h3);
  letter-spacing: var(--font-h3--letter-spacing);
  text-transform: var(--font-h3--case);
  line-height: var(--font-h3--line-height);
}

@media screen and (max-width: 1024px) {
  input.h3,
  textarea.h3,
  select.h3 {
    font-size: max(1rem, var(--font-h3--size));
  }
}

h4,
.h4,
.text-block.h4 > * {
  font-family: var(--font-h4--family);
  font-style: var(--font-h4--style);
  font-weight: var(--font-h4--weight);
  font-size: var(--font-size--h4);
  letter-spacing: var(--font-h4--letter-spacing);
  text-transform: var(--font-h4--case);
  line-height: var(--font-h4--line-height);
}

@media screen and (max-width: 1024px) {
  input.h4,
  textarea.h4,
  select.h4 {
    font-size: max(1rem, var(--font-h4--size));
  }
}

h5,
.h5,
.text-block.h5 > * {
  font-family: var(--font-h5--family);
  font-style: var(--font-h5--style);
  font-weight: var(--font-h5--weight);
  font-size: var(--font-size--h5);
  letter-spacing: var(--font-h5--letter-spacing);
  text-transform: var(--font-h5--case);
  line-height: var(--font-h5--line-height);
}

@media screen and (max-width: 1024px) {
  input.h5,
  textarea.h5,
  select.h5 {
    font-size: max(1rem, var(--font-h5--size));
  }
}

h6,
.h6,
.text-block.h6 > * {
  font-family: var(--font-h6--family);
  font-style: var(--font-h6--style);
  font-weight: var(--font-h6--weight);
  font-size: var(--font-size--h6);
  letter-spacing: var(--font-h6--letter-spacing);
  text-transform: var(--font-h6--case);
  line-height: var(--font-h6--line-height);
}

@media screen and (max-width: 1024px) {
  input.h6,
  textarea.h6,
  select.h6 {
    font-size: max(1rem, var(--font-h6--size));
  }
}

blockquote {
  font-style: italic;
  color: rgb(var(--color-foreground-rgb) / var(--opacity-75));
  border-left: 0.2rem solid rgb(var(--color-foreground-rgb) / var(--opacity-20));
  padding-left: 1rem;
}

@media screen and (min-width: 750px) {
  blockquote {
    padding-left: 1.5rem;
  }
}

.caption {
  font-size: var(--font-size--3xs);
  letter-spacing: 0.07rem;
}

@media screen and (min-width: 750px) {
  .caption {
    font-size: var(--font-size--2xs);
  }
}

.caption-with-letter-spacing {
  font-size: var(--font-size--3xs);
  letter-spacing: 0.05rem;
  text-transform: uppercase;
}

.caption-with-letter-spacing--medium {
  font-size: var(--font-size--2xs);
  letter-spacing: 0.05rem;
}

.caption-with-letter-spacing--large {
  font-size: var(--font-size--sm);
  letter-spacing: 0.1rem;
}

.caption-large,
.customer .field input,
.customer select,
.field__input,
.form__label,
.select__select {
  font-size: var(--font-size--sm);
  letter-spacing: 0.04rem;
}

.color-foreground {
  color: var(--color-foreground);
}

table:not([class]) {
  table-layout: fixed;
  border-collapse: collapse;
  font-size: var(--font-size--sm);
  border-style: hidden;
  box-shadow: 0 0 0 0.1rem rgb(var(--color-foreground-rgb) / var(--opacity-20));
}

table:not([class]) td,
table:not([class]) th {
  padding: 1em;
  border: 0.1rem solid rgb(var(--color-foreground-rgb) / var(--opacity-20));
}

@media screen and (max-width: 749px) {
  .small-hide {
    display: none !important;
  }
}

@media screen and (min-width: 750px) and (max-width: 1024px) {
  .medium-hide {
    display: none !important;
  }
}

@media screen and (min-width: 1025px) {
  .large-up-hide {
    display: none !important;
  }
}

img, picture, video, canvas, svg {
    display: block;
    max-width: 100%;
}

:not(.svg-wrapper) > svg {
  min-width: var(--icon-size-md);
  min-height: var(--icon-size-md);
}

img {
  width: 100%;
  height: auto;
}

.left {
  text-align: left;
}

.center {
  text-align: center;
}

.right {
  text-align: right;
}

.normal-case {
  text-transform: none;
}

.lowercase {
  text-transform: lowercase;
}

.capitalize {
  text-transform: capitalize;
}

.uppercase {
  text-transform: uppercase;
}

.underline {
  text-decoration: underline;
}

.decoration-none {
  text-decoration: none;
}

.text-base {
  font-size: var(--font-size--paragraph);
}

.text-md {
  font-size: var(--font-size--paragraph-md);
}

.text-sm {
  font-size: var(--font-size--paragraph-sm);
}

.leading-none {
  line-height: var(--line-height--display-tight); /* 1 */
}

.font-light {
  font-weight: 300;
}

.font-normal {
  font-weight: normal;
}

.font-medium {
  font-weight: 500;
}

.font-semibold {
  font-weight: 600;
}

.font-bold {
  font-weight: 700;
}

.font-heading-weight {
  font-weight: var(--font-heading--weight);
}

.opacity-0  {
  opacity: var(--opacity-0);
}

.opacity-70  {
  opacity: var(--opacity-70);
}

.hidden {
  display: none !important;
}

.none {
  display: none;
}

.block {
  display: block;
}

.inline {
  display: inline;
}

.inline-block {
  display: inline-block;
}

.flex {
  display: flex;
}

.inline-flex{
  display: inline-flex;
}

.flex-i {
  display: flex !important;
}

.grid {
  display: grid;
}

.grid-cols {
  grid-template-columns: var(--columns-vertical-int, repeat(2, minmax(0,1fr)));
}

@media screen and (max-width: 749px) {
  .grid-cols\:sm {
    grid-template-columns: var(--columns-vertical-int-sm, repeat(1, minmax(0,1fr)));
  }
}

@media screen and (min-width: 750px) and (max-width: 1024px) {
  .grid-cols\:md {
    grid-template-columns: var(--columns-vertical-int-md, repeat(2, minmax(0,1fr)));
  }
}

.flex-center {
  display: flex;
  justify-content: center;
  align-items: center;
}

.relative {
  position: relative;
}

.fixed {
  position: fixed;
}

.static {
  position: static;
}

.sticky {
  position: sticky;
}

.absolute-c-c,
.absolute-c-y,
.absolute-c-x,
.absolute {
  position: absolute;
}

.absolute-c-c,
.absolute-c-x {
  left: 50%;
  transform: translateX(-50%);
}

.absolute-c-c,
.absolute-c-y {
  top: 50%;
  transform: translateY(-50%);
}

.absolute-c-c {
  transform: translate(-50%, -50%);
}

.top-0 {
  inset-block-start: 0;
}

.top-50 {
  inset-block-start: 50%;
}

.top-full {
  inset-block-start: 100%;
}

.right-0 {
  inset-inline-end: 0;
}

.right-50 {
  inset-inline-end: 50%;
}

.right-full {
  inset-inline-end: 100%;
}

.bottom-0 {
  inset-block-end: 0;
}

.bottom-50 {
  inset-block-end: 50%;
}

.bottom-full {
  inset-block-end: 100%;
}

.left-0 {
  inset-inline-start: 0;
}

.left-50 {
  inset-inline-start: 50%;
}

.left-full {
  inset-inline-start: 100%;
}

.left-0_5 {
  left: 0.5rem;
}

.inset-0 {
  inset: 0;
}

.transform-y-50 {
  transform: translateY(-50%);
}

.transform-x-50 {
  transform: translateX(-50%);
}

.bor-none {
  border: none;
}

.rounded-full {
  border-radius: var(--style-border-radius-50);
}

.z--1 {
  z-index: -1;
}

.z-0 {
  z-index: 0;
}

.z-1 {
  z-index: 1;
}

.z-2 {
  z-index: 2;
}

.z-3 {
  z-index: 3;
}

.z-4 {
  z-index: 4;
}

.z-5 {
  z-index: 5;
}

.z-9 {
  z-index: 9;
}

.z-10 {
  z-index: 10;
}

.z-100 {
  z-index: 100;
}

.t-button {
  -webkit-appearance: none;
  appearance: none;
  background-color: unset;
  border: none;
  padding: 0;
}

.bg-transparent {
  background-color: transparent;
}

.bg-background {
  background-color: var(--color-background);
}

.border-top {
  border-top: 0.1rem solid var(--color-border);
}

.border-bottom {
  border-bottom: 0.1rem solid var(--color-border);
}

.border-left {
  border-left: 0.1rem solid var(--color-border);
}

.border-right {
  border-right: 0.1rem solid var(--color-border);
}

.justify-center {
  justify-content: center;
}

.justify-between {
  justify-content: space-between;
}

.justify-around {
  justify-content: space-around;
}

.justify-start {
  justify-content: flex-start;
}

.justify-end {
  justify-content: flex-end;
}

.items-center {
  align-items: center;
}

.items-start {
  align-items: flex-start;
}

.items-end {
  align-items: flex-end;
}

.items-stretch {
  align-items: stretch;
}

.items-baseline {
  align-items: baseline;
}

.flex-wrap {
  flex-wrap: wrap;
}

.flex-nowrap {
  flex-wrap: nowrap;
}

.flex-column {
  flex-direction: column;
}

.flex-row {
  flex-direction: row;
}

.flex-row-reverse {
  flex-direction: row-reverse;
}

.whitespace-nowrap {
  white-space: nowrap;
}

.cursor-pointer {
  cursor: pointer;
}

.pointer-events-auto {
  pointer-events: auto;
}

.pointer-events-none {
  pointer-events: none;
}

.overflow-hidden {
  overflow: hidden;
}

.overflow-auto {
  overflow: auto;
}

.overflow-x-a {
  overflow-x: auto;
}

.overflow-y-a {
  overflow-y: auto;
}

.overflow-x-h {
  overflow-x: hidden;
}

.overflow-y-h {
  overflow-y: hidden;
}

.v-a-middle {
  vertical-align: middle;
}

.v-a-top {
  vertical-align: top;
}

.w-auto {
  width: auto;
}

.size-full,
.w-full {
  width: 100%;
}

.w-1\/2 {
  width: 50%;
}

.w-fit {
  width: fit-content;
}

.w-screen {
  width: 100vw;
}

.h-auto {
  height: auto;
}

.size-full,
.h-full {
  height: 100%;
}

.max-w-full {
  max-width: 100%;
}

.min-w-full {
  min-width: 100%;
}

.max-h-full {
  max-height: 100%;
}

.flex-1 {
  flex: 1;
}

.flex-grow {
  flex-grow: 1;
}

.shrink-0 {
  flex-shrink: 0;
}

.m-auto {
  margin: 0 auto;
}

.m-0 {
  margin: 0;
}

.m-x-auto,
.m-l-auto {
  margin-inline-start: auto;
}

.m-x-auto,
.m-r-auto {
  margin-inline-end: auto;
}

.p-0 {
  padding: 0;
}

.break {
  word-break: break-word;
}

.object-cover {
  object-fit: cover;
}

.object-contain {
  object-fit: contain;
}

.duration-slide-in {
  transition: var(--animation-slide-in);
}

.text-currentColor {
  color: currentColor;
}

.text-stroke {
  -webkit-text-fill-color: transparent;
  -webkit-text-stroke-width: 1px;
  -webkit-text-stroke-color: var(--color-foreground);
}

.after-none::after,
.before-none::before {
  content: none;
}

[style*="--corner-radius"] {
  border-radius: var(--corner-radius);
}

[style*="--w:"] {
  width: var(--w);
}

[style*="--h:"] {
  height: var(--h);
}

[style*="--min-w:"] {
  min-width: var(--min-w);
}

[style*="--max-w:"] {
  max-width: min(100%, var(--max-w));
}

[style*="--max-h:"] {
  max-height: min(100%, var(--max-h));
}

[style*="--mt:"] {
  margin-top: var(--mt);
}

[style*="--mb:"] {
  margin-bottom: var(--mb);
}

[style*="--p:"] {
  padding: var(--p);
}

[style*="--pt:"] {
  padding-top: calc(var(--pt) * 0.5);
}

[style*="--pb:"] {
  padding-bottom: calc(var(--pb) * 0.5);
}

[style*="--pl:"] {
  padding-left: calc(var(--pl) * 0.5);
}

[style*="--pr:"] {
  padding-right: calc(var(--pr) * 0.5);
}

[style*="--m:"] {
  margin: var(--m);
}

[style*="--mb:"] {
  margin-bottom: var(--mb);
}

[style*="--gap:"] {
  gap: var(--gap, 0);
}

[style*="--gap-x:"] {
  column-gap: var(--gap-x, 0);
}

[style*="--gap-y:"] {
  row-gap: var(--gap-y, 0);
}

[style*="--bg-color:"] {
  background: var(--bg-color);
}

[style*="--fg-color:"] {
  color: var(--fg-color);
}

[style*="--top:"] {
  top: var(--top);
}

[style*="--bottom:"] {
  bottom: var(--bottom);
}

[style*="--left:"] {
  left: var(--left);
}

[style*="--right:"] {
  right: var(--right);
}

[style*="--b-width:"] {
  border-width: var(--b-width);
}

[style*="--b-color:"] {
  border-color: var(--b-color);
}

.group-block {
  max-width: var(--globalGroupWidth, 100%);
}

@media (max-width: 1024px) {
  .max-md\:hidden {
    display: none !important;
  }

  .max-md\:w-full {
    width: 100%;
  }

  .max-md\:relative {
    position: relative;
  }

  .max-md\:overflow-x-a {
    overflow-x: auto;
  }

  .max-md\:none {
    display: none !important;
  }

  .max-md\:flex {
    display: flex;
  }

  .max-md\:grid {
    display: grid;
  }

  .max-md\:flex-column {
    flex-direction: column;
  }

  .max-md\:justify-between {
    justify-content: space-between;
  }

  .max-md\:items-center {
    align-items: center;
  }

  .max-md\:flex-row {
    flex-direction: row;
  }

  .max-md\:flex-wrap {
    flex-wrap: wrap;
  }

  .max-md\:flex-nowrap {
    flex-wrap: nowrap;
  }

  [style*="--mt:"] {
    margin-top: calc(var(--mt) * 0.75);
  }

  [style*="--mb:"] {
    margin-bottom: calc(var(--mb) * 0.75);
  }

  .page-width[style*="--pr:"] {
    padding-right: 1rem;
  }

  .page-width[style*="--pl:"] {
    padding-left: 1rem;
  }

  [style*="--gap-x"] {
    column-gap: calc(var(--gap-x) * 0.75);
  }

  [style*="--gap-y"] {
    row-gap: calc(var(--gap-y) * 0.75);
  }

  .group-align-mb-left>* {
    text-align: left;
  }

  .group-align-mb-center>* {
    text-align: center;
  }

  .group-align-mb-right>* {
    text-align: right;
  }
}

@media screen and (max-width: 749px) {
  .max-sm\:w-full {
    width: 100%;
  }

  .max-sm\:hidden {
    display: none !important;
  }

  .max-sm\:block {
    display: block;
  }

  .max-sm\:flex {
    display: flex;
  }

  .max-sm\:flex-column {
    flex-direction: column;
  }

  .max-sm\:flex-row {
    flex-direction: row;
  }

  .max-sm\:flex-wrap {
    flex-wrap: wrap;
  }

  .max-sm\:flex-nowrap {
    flex-wrap: nowrap;
  }

  .max-sm\:justify-start {
    justify-content: flex-start;
  }

  .max-sm\:justify-center {
    justify-content: center;
  }

  .max-sm\:justify-end {
    justify-content: flex-end;
  }

  .max-sm\:justify-between {
    justify-content: space-between;
  }

  .max-sm\:items-center {
    align-items: center;
  }

  [style*="--min-w-sm:"] {
    min-width: var(--min-w-sm);
  }

  [style*="--max-sm-max-w:"] {
    max-width: min(100%, var(--max-w));
  }

  [style*="--max-sm-p:"] {
    padding: var(--max-sm-p);
  }

  [style*="--mt:"] {
    margin-top: calc(var(--mt) * 0.5);
  }

  [style*="--mb:"] {
    margin-bottom: calc(var(--mb) * 0.5);
  }

  [style*="--max-sm-p:"] {
    padding: var(--max-sm-p);
  }

  [style*="--max-sm-pt:"] {
    padding-top: var(--max-sm-pt);
  }

  [style*="--max-sm-pb:"] {
    padding-bottom: var(--max-sm-pb);
  }

  [style*="--max-sm-pl:"] {
    padding-left: var(--max-sm-pl);
  }

  [style*="--max-sm-pr:"] {
    padding-right: var(--max-sm-pr);
  }

  .page-width[style*="--pr:"] {
    padding-right: 0.5rem;
  }

  .page-width[style*="--pl:"] {
    padding-left: 0.5rem;
  }

  [style*="--gap-x:"] {
    column-gap: calc(var(--gap-x) * 0.5);
  }

  [style*="--gap-y:"] {
    row-gap: calc(var(--gap-y) * 0.5);
  }

  .max-sm\:absolute {
    position: absolute;
  }

  .body-default-font-size {
    font-size: calc(var(--font-body--size) - 0.6rem);
  }

  .body-3xl-font-size {
    font-size: calc(var(--body-3xl-font-size) - 0.6rem);
  }

  .body-2xl-font-size {
    font-size: calc(var(--body-2xl-font-size) - 0.4rem);
  }

  .body-xl-font-size {
    font-size: calc(var(--body-xl-font-size) - 0.2rem);
  }

  .body-l-font-size {
    font-size: calc(var(--body-l-font-size) - 0.2rem);
  }

  .body-m-font-size {
    font-size: calc(var(--body-m-font-size) - 0.2rem);
  }

  .body-s-font-size {
    font-size: calc(var(--body-s-font-size) - 0.2rem);
  }

  .body-xs-font-size {
    font-size: calc(var(--body-xs-font-size) - 0.2rem);
  }

  .body-xxs-font-size {
    font-size: var(--body-xxs-font-size);
  }
}

@media (min-width: 750px) and (max-width: 1024px) {
  .body-default-font-size {
    font-size: calc(var(--font-body--size) - 0.2rem);
  }

  .body-3xl-font-size {
    font-size: calc(var(--body-3xl-font-size) - 0.2rem);
  }

  .body-2xl-font-size {
    font-size: calc(var(--body-2xl-font-size) - 0.2rem);
  }

  .body-xl-font-size {
    font-size: var(--body-xl-font-size);
  }

  .body-l-font-size {
    font-size: var(--body-l-font-size);
  }

  .body-m-font-size {
    font-size: var(--body-m-font-size);
  }

  .body-s-font-size {
    font-size: var(--body-s-font-size);
  }

  .body-xs-font-size {
    font-size: var(--body-xs-font-size);
  }

  .body-xxs-font-size {
    font-size: var(--body-xxs-font-size);
  }
}

@media screen and (min-width: 750px) {
  .md\:hidden {
    display: none !important;
  }

  .md\:block {
    display: block;
  }

  .md\:flex {
    display: flex;
  }

  .md\:grid {
    display: grid;
  }

  .md\:items-center {
    align-items: center;
  }

  .md\:items-start {
    align-items: flex-start;
  }

  .md\:items-end {
    align-items: flex-end;
  }

  .md\:justify-start {
    justify-content: flex-start;
  }

  .md\:justify-center {
    justify-content: center;
  }

  .md\:justify-end {
    justify-content: flex-end;
  }

  .md\:justify-between {
    justify-content: space-between;
  }

  .md\:justify-around {
    justify-content: space-around;
  }

  .md\:w-full {
    width: 100%;
  }

  .md\:h-auto {
    height: auto;
  }

  [style*="--min-w-md:"] {
    min-width: var(--min-w-md);
  }

  [style*="--pt:"] {
    padding-top: calc(var(--pt) * 0.75);
  }

  [style*="--pb:"] {
    padding-bottom: calc(var(--pb) * 0.75);
  }

  [style*="--pl:"] {
    padding-left: calc(var(--pl) * 0.75);
  }

  [style*="--pr:"] {
    padding-right: calc(var(--pr) * 0.75);
  }

  [style*="--md-w:"] {
    width: var(--md-w);
  }

  [style*="--md-h:"] {
    height: var(--md-h);
  }

  [style*="--md-max-w:"] {
    max-width: min(100%, var(--md-max-w));
  }

  [style*="--md-p:"] {
    padding: var(--md-p);
  }

  [style*="--md-pt:"] {
    padding-top: var(--md-pt);
  }

  [style*="--md-pr:"] {
    padding-right: var(--md-pr);
  }

  [style*="--md-pb:"] {
    padding-bottom: var(--md-pb);
  }

  [style*="--md-pl:"] {
    padding-left: var(--md-pl);
  }

  [style*="--md-mb:"] {
    margin-bottom: var(--md-mb);
  }

  [style*="--md-gap-x:"] {
    column-gap: var(--md-gap-x, 0);
  }

  [style*="--md-gap-y:"] {
    row-gap: var(--md-gap-y, 0);
  }

  [style*="--md-gap:"] {
    gap: var(--md-gap, 0);
  }

  .md\:absolute {
    position: absolute;
  }
}

@media screen and (min-width: 1025px) {
  [style*="--lg-h:"] {
    height: var(--lg-h);
  }

  [style*="--lg-w:"] {
    width: var(--lg-w);
  }

  [style*="--lg-p:"] {
    padding: var(--lg-p);
  }

  [style*="--lg-pt:"] {
    padding-top: var(--lg-pt);
  }

  [style*="--lg-pr:"] {
    padding-right: var(--lg-pr);
  }

  [style*="--lg-pb:"] {
    padding-bottom: var(--lg-pb);
  }

  [style*="--lg-pl:"] {
    padding-left: var(--lg-pl);
  }

  [style*="--lg-m:"] {
    margin: var(--lg-m);
  }

  [style*="--lg-gap:"] {
    gap: var(--lg-gap, 0);
  }

  [style*="--pt:"] {
    padding-top: var(--pt);
  }

  [style*="--pb:"] {
    padding-bottom: var(--pb);
  }

  [style*="--pl:"] {
    padding-left: var(--pl);
  }

  [style*="--pr:"] {
    padding-right: var(--pr);
  }

  .lg\:absolute {
    position: absolute;
  }

  .lg\:block {
    display: block;
  }

  .lg\:none {
    display: none !important;
  }

  .lg\:flex {
    display: flex;
  }

  .lg\:flex-wrap {
    flex-wrap: wrap;
  }

  .lg\:w-full {
    width: 100%;
  }

  .lg\:w-1\/2 {
    width: 50%;
  }

  .body-default-font-size {
    font-size: var(--font-body--size);
  }

  .body-3xl-font-size {
    font-size: var(--body-3xl-font-size);
  }

  .body-2xl-font-size {
    font-size: var(--body-2xl-font-size);
  }

  .body-xl-font-size {
    font-size: var(--body-xl-font-size);
  }

  .body-l-font-size {
    font-size: var(--body-l-font-size);
  }

  .body-m-font-size {
    font-size: var(--body-m-font-size);
  }

  .body-s-font-size {
    font-size: var(--body-s-font-size);
  }

  .body-xs-font-size {
    font-size: var(--body-xs-font-size);
  }

  .body-xxs-font-size {
    font-size: ar(--body-xxs-font-size);
  }

  .group-align-left>* {
    --text-align: left;
    text-align: left;
  }

  .group-align-center>* {
    --text-align: center;
    text-align: center;
  }

  .group-align-right>* {
    --text-align: right;
    text-align: right;
  }
}

@media (min-width: 1280px) {
  .xl\:hidden {
    display: none;
  }

  .xl\:justify-start {
    justify-content: flex-start;
  }

  .xl\:justify-end {
    justify-content: flex-end;
  }

  .xl\:justify-center {
    justify-content: center;
  }

  .xl\:flex-nowrap {
    flex-wrap: nowrap;
  }

  [style*="--xl-gap:"] {
    gap: var(--xl-gap, 0);
  }
}

.link-with-icon {
  display: inline-flex;
  font-size: var(--font-size--sm);
  font-weight: 600;
  letter-spacing: 0.1rem;
  text-decoration: none;
  margin-bottom: 4.5rem;
  white-space: nowrap;
  .icon {
    width: 1.5rem;
    margin-left: 1rem;
  }
}

a:not([href]) {
  cursor: not-allowed;
}

.circle-divider::after {
  content: "\2022";
  margin: 0 1.3rem 0 1.5rem;
}

.circle-divider:last-of-type::after {
  display: none;
}

.line-divider::after {
  content: "\2503";
  margin: 0 1.3rem 0 1.5rem;
}

.line-divider:last-of-type::after {
  display: none;
}

hr {
  border: none;
  height: 0.1rem;
  background-color: rgb(var(--color-foreground-rgb) / var(--opacity-20));
  display: block;
  margin: 5rem 0;
}

@media screen and (min-width: 750px) {
  hr {
    margin: 7rem 0;
  }
}

.full-unstyled-link {
  text-decoration: none;
  color: currentColor;
  display: block;
}

.placeholder {
  background-color: rgb(var(--color-foreground-rgb) / var(--opacity-4));
  color: rgb(var(--color-foreground-rgb) / var(--opacity-55));
  fill: rgb(var(--color-foreground-rgb) / var(--opacity-55));
}

.card-placeholder {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%,-50%);
  height: 4px;
  background-color: rgba(var(--color-foreground-rgb) / var(--opacity-10));
  width: min(50%, 10rem);
  overflow: hidden;
  &::before {
    content: '';
    display: block;
    width: 100%;
    height: 100%;
    background-color: rgb(var(--color-foreground-rgb) / var(--opacity-80));
    animation: indeterminateAnimation 1s infinite linear;
    transform-origin: 0% 50%;
  }
}

@keyframes indeterminateAnimation {
  0% {
    transform:  translateX(0) scaleX(0);
  }
  40% {
    transform:  translateX(0) scaleX(0.4);
  }
  100% {
    transform:  translateX(100%) scaleX(0.5);
  }
}

details>* {
  box-sizing: border-box;
}

/* duplicate break-word class => REMOVE THIS */
/* .break {
  word-break: break-word;
} */

.visibility-hidden {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

@media (prefers-reduced-motion) {
  .motion-reduce {
    transition: none !important;
    animation: none !important;
  }
}

.underlined-link,
.inline-richtext a {
  text-underline-offset: 0.3rem;
  text-decoration-thickness: 0.1rem;
  transition: text-decoration-thickness ease 100ms;
}

.underlined-link,
.customer a:not(.button) {
  color: rgb(var(--color-primary-rgb) / var(--opacity-85));
}

.inline-richtext a,
.rte.inline-richtext a {
  color: currentColor;
}

@media screen and (min-width: 1025px) {
  .underlined-link:hover,
  .customer a:not(.button):hover,
  .inline-richtext a:hover {
    color: var(--color-primary);
    text-decoration-thickness: 0.2rem;
  }
}

.icon-arrow {
  width: 1.5rem;
}

h3 .icon-arrow,
.h3 .icon-arrow {
  width: 1.5rem;
}

/* arrow animation */
.animate-arrow .icon-arrow path {
  transform: translateX(-0.25rem);
  transition: transform var(--duration-short) ease;
}

@media (hover: hover) {
  .animate-arrow:hover .icon-arrow path {
    transform: translateX(-0.05rem);
  }
}

.svg-wrapper {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  width: var(--icon-size-md);
  height: var(--icon-size-md);
}

.svg-wrapper>svg {
  height: 100%;
  width: 100%;
}

/* base-details-summary */
summary {
  cursor: pointer;
  list-style: none;
  user-select: none;
  position: relative;

  .svg-wrapper {
    margin-inline-start: auto;
    height: var(--icon-size-xs);
    width: var(--icon-size-xs);
    transition: transform var(--animation-speed) var(--animation-easing);
  }
}

.icon-caret-wrapper svg {
  transition: transform var(--animation-speed) var(--animation-easing);
}

summary::-webkit-details-marker {
  display: none;
}

details {
  width: 100%;
}

summary {
  display: flex;
  align-items: center;
  gap: var(--gap-lg);
  position: relative;
  padding-block: 1.5rem;
  padding-inline: 0;
  cursor: pointer;
  list-style: none;
}

details[open='true']>summary .icon-caret {
  transform: rotate(180deg);
}
/* Start delete code */
/* details[open] > summary .icon-caret-wrapper {
  transform: rotate(180deg);
} */
/* End delete code */
summary .icon-plus-wrapper :is(.horizontal, .vertical) {
  transition: transform var(--animation-speed) var(--animation-easing);
  transform: rotate(0deg);
  transform-origin: 50% 50%;
  opacity: 1;
}

details[open] > summary .icon-plus-wrapper {
  .horizontal {
    transform: rotate(90deg);
  }

  .vertical {
    transform: rotate(90deg);
    opacity: 0;
  }
}

@media screen and (max-width: 749px) {
  .disclosure-has-popup[open]>summary::before {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 2;
    display: block;
    cursor: default;
    content: " ";
    background: transparent;
  }

  .disclosure-has-popup>summary::before {
    display: none;
  }

  .disclosure-has-popup[open]>summary+* {
    z-index: 100;
  }
}

@media screen and (min-width: 750px) {
  .facets__disclosure-drawer.disclosure-has-popup[open]>summary::before {
    content: " ";
    position: fixed;
    inset: 0;
    z-index: 2;
    display: block;
    cursor: default;
    background: transparent;
  }

  .facets__disclosure-drawer.disclosure-has-popup>summary::before {
    display: none;
  }

  .disclosure-has-popup[open]>summary+* {
    z-index: 4;
  }

  .facets .disclosure-has-popup[open]>summary+* {
    z-index: 2;
  }

  .facets__disclosure-drawer .details__summary {
    margin-bottom: 0;
  }
}

.placeholder-svg {
  height: 100%;
  width: 100%;

  [clip-path] {
    clip-path: inset(0 0 0 0);
  }
}

.placeholder-svg--bg {
  background-color: #f5f5f5;
}

/* details--dropdown */
.details__summary .icon-caret {
  height: var(--icon-size-xs);
  width: var(--icon-size-xs);
  min-height: var(--icon-size-xs);
  min-width: var(--icon-size-xs);
  color: rgb(var(--color-foreground-rgb) / var(--icon-opacity));
  margin-block: var(--margin-2xs);
  transition: color var(--animation-speed) var(--animation-easing), transform var(--animation-speed) var(--animation-easing);
}

.details--dropdown .details__list:not(.list-menu--wrapper) {
  opacity: var(--opacity-0);
  visibility: hidden;
  overflow: hidden;
}

.details--dropdown[open]:not([open='true'],[open='false']) > .details__list:not(.list-menu--wrapper) {
  opacity: var(--opacity-100);
  visibility: visible;
  overflow: visible;
}

.no-js .details--dropdown[open] .details__list,
.details--dropdown .details__list.active {
  opacity: var(--opacity-100);
  visibility: visible;
  transform: translateY(0);
}

/* base-focus */
/* Focus ring - default (with offset) */
*:focus {
  outline: 0;
  box-shadow: none;
}

*:focus-visible {
  outline: var(--focused-base-outline);
  outline-offset: var(--focused-base-outline-offset);
  box-shadow: var(--focused-base-box-shadow);
}

.focused {
  outline: var(--focused-base-outline);
  outline-offset: var(--focused-base-outline-offset);
  box-shadow: var(--focused-base-box-shadow);
  &.focus-inset {
    outline: 0.2rem solid rgb(var(--color-foreground-rgb) / var(--opacity-50));
    outline-offset: -0.2rem;
    box-shadow: 0 0 0.2rem 0 rgb(var(--color-foreground-rgb) / var(--opacity-30));
  }
}

/* Focus ring - inset */
.focus-inset:focus-visible {
  outline: 0.2rem solid rgb(var(--color-foreground-rgb) / var(--opacity-50));
  outline-offset: -0.2rem;
  box-shadow: 0 0 0.2rem 0 rgb(var(--color-foreground-rgb) / var(--opacity-30));
}

/* Focus ring - none */
.focus-none {
  box-shadow: none !important;
  outline: 0 !important;
}

.focus-offset:focus-visible {
  border-radius: 0.1rem;
  outline: 0.2rem solid rgb(var(--color-foreground-rgb) / var(--opacity-50));
  outline-offset: 0.1rem;
  box-shadow: 0 0 0 0.1rem var(--color-foreground),
    0 0 0.5rem 0.1rem rgb(var(--color-foreground-rgb) / var(--opacity-30));
}

.focus-offset.focused {
  outline: 0.2rem solid rgb(var(--color-foreground-rgb) / var(--opacity-50));
  outline-offset: 0.1rem;
  box-shadow: 0 0 0 0.1rem var(--color-foreground),
    0 0 0.5rem 0.1rem rgb(var(--color-foreground-rgb) / var(--opacity-30));
}

/* Multiple properties */
.separator-top {
  border-top: solid 0.1rem rgb(var(--color-foreground-rgb) / var(--opacity-8));
}

.card__shadow:after {
  content: "";
  position: absolute;
  height: 15vh;
  width: 100%;
  z-index: 0;
}

.card__shadow.sd-bottom:after {
  bottom: 0;
  background: linear-gradient(to bottom,
      transparent,
      rgb(var(--color-foreground-rgb) / var(--opacity-40)));
}

.cus-scrollbar::-webkit-scrollbar {
  width: 0.3rem;
  height: 0.3rem;
  background: #f1f1f1;
}

.cus-scrollbar::-webkit-scrollbar-thumb {
  background: rgb(0 0 0 / var(--opacity-30));
}

.cus-scrollbar::-webkit-scrollbar-track {
  background: #f1f1f1;
}

/* Spacing */
.spacing {
  padding-block: calc(var(--p-spacing-t, 0) * 0.5) calc(var(--p-spacing-b, 0) * 0.5);
}

@media screen and (min-width: 750px) {
  .spacing {
    padding-block: calc(var(--p-spacing-t, 0) * 0.75) calc(var(--p-spacing-b, 0) * 0.75);
  }
}

@media screen and (min-width: 1400px) {
  .spacing {
    padding-block: var(--p-spacing-t) var(--p-spacing-b);
  }
}

.m-spacing {
  margin-block: calc(var(--m-spacing-t, 0) * 0.5) calc(var(--m-spacing-b, 0) * 0.5);
}

@media screen and (min-width: 750px) {
  .m-spacing {
    margin-block: calc(var(--m-spacing-t, 0) * 0.75) calc(var(--m-spacing-b, 0) * 0.75);
  }
}

@media screen and (min-width: 1400px) {
  .m-spacing {
    margin-block: var(--m-spacing-t) var(--m-spacing-b);
  }
}

@media screen and (max-width: 749px) {
  .spacing-xs {
    padding-block: var(--p-spacing-t-xs, 0) var(--p-spacing-b-xs, 0);
  }

  .m-spacing-xs {
    margin-block: var(--m-spacing-t-xs, 0) var(--m-spacing-b-xs, 0);
  }
}

/* component-title */
.title,
.title-wrapper-with-link {
  margin: 3rem 0 2rem;
}

@media screen and (min-width: 1025px) {
  .title,
  .title-wrapper-with-link {
    margin: 5rem 0 3rem;
  }
}

.title-wrapper-with-link .title {
  margin: 0;
}

@media screen and (min-width: 1025px) {
  .title-wrapper-with-link .title {
    margin-bottom: 0;
  }
}

.title .link {
  font-size: inherit;
}

.title-wrapper {
  margin-bottom: 3rem;
}

.title-wrapper-with-link {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  gap: 1rem;
  margin-bottom: 3rem;
  flex-wrap: wrap;
}

@media screen and (min-width: 1025px) {
  .title-wrapper-with-link {
    align-items: center;
  }
}

.title--primary {
  margin: 4rem 0;
}

@media screen and (min-width: 1025px) {
  .title--primary {
    margin: 2rem 0;
  }
}

.title-wrapper--self-padded-tablet-down,
.title-wrapper--self-padded-mobile {
  padding-inline: 1.5rem;
}

@media screen and (min-width: 750px) {
  .title-wrapper--self-padded-mobile {
    padding-inline: 0;
  }
}

@media screen and (min-width: 1025px) {
  .title-wrapper--self-padded-tablet-down {
    padding-inline: 0;
  }
}

.title-wrapper-with-link .link-with-icon {
  margin: 0;
  flex-shrink: 0;
  display: flex;
  align-items: center;

  .svg-wrapper {
    width: 1.5rem;
  }
}

.title-wrapper-with-link a {
  margin-top: 0;
  flex-shrink: 0;
}

.title-wrapper--no-top-margin {
  margin-top: 0;

  > .title {
    margin-top: 0;
  }
}

.subtitle {
  font-size: var(--font-size--lg);
  letter-spacing: 0.06rem;
  color: rgb(var(--color-foreground-rgb) / var(--opacity-70));
}

.subtitle--small {
  font-size: var(--font-size--sm);
  letter-spacing: 0.1rem;
}

.subtitle--medium {
  font-size: var(--font-size--md);
  letter-spacing: 0.08rem;
}

/* component grid */
.swiper:not(.swiper-initialized) .grid-layout-no-js:not(.grid-mobile-layout-no-js) {
  --card-grid-gap: var(--card-grid-per-row-gap, var(--grid-mobile-horizontal-spacing));
  display: flex;

  > * {
    width: calc(100% / var(--card-grid-per-row) - var(--card-grid-gap) * calc(var(--card-grid-per-row) - 1) / var(--card-grid-per-row));
    margin-right: var(--card-grid-gap);
  }
}

.swiper.swiper-initialized .grid-layout {
  --card-grid-gap: 0;
}

.grid-layout {
  --card-grid-per-row: 2;
  --card-grid-template: auto-flow dense/repeat(var(--card-grid-per-row), minmax(0, 1fr));
  --card-grid-gap: var(--grid-mobile-vertical-spacing) var(--grid-mobile-horizontal-spacing);
  display: grid;
  grid: var(--card-grid-template);
  gap: var(--card-grid-gap);
}

@media screen and (min-width: 750px) {
  .grid-layout {
    --card-grid-gap: var(--grid-desktop-vertical-spacing) var(--grid-desktop-horizontal-spacing);
  }
}

@media screen and (max-width: 749px) {
  .swiper:not(.swiper-initialized) .grid-mobile-layout-no-js {
    --card-grid-gap: var(--card-grid-per-row-gap, var(--grid-mobile-horizontal-spacing));
    display: flex;
  
    > * {
      width: calc(100% / var(--card-grid-per-row) - var(--card-grid-gap) * calc(var(--card-grid-per-row) - 1) / var(--card-grid-per-row));
      margin-right: var(--card-grid-gap);
    }
  }
}

.grid-layout--5 {
  --card-grid-per-row: 5;
}

.grid-layout--4 {
  --card-grid-per-row: 4;
}

.grid-layout--3 {
  --card-grid-per-row: 3;
}

.grid-layout--2 {
  --card-grid-per-row: 2;
}

.grid-layout--1 {
  --card-grid-per-row: 1;
}

@media screen and (max-width: 749px) {
  .max-sm\:grid-layout--3 {
    --card-grid-per-row: 3;
  }

  .max-sm\:grid-layout--2 {
    --card-grid-per-row: 2;
  }

  .max-sm\:grid-layout--1 {
    --card-grid-per-row: 1;
  }
}

@media screen and (min-width: 750px) {
  .md\:grid-layout--4 {
    --card-grid-per-row: 4;
  }

  .md\:grid-layout--3 {
    --card-grid-per-row: 3;
  }

  .md\:grid-layout--2 {
    --card-grid-per-row: 2;
  }

  .md\:grid-layout--1 {
    --card-grid-per-row: 1;
  }
}

@media screen and (min-width: 1025px) {
  .lg\:grid-layout--6 {
    --card-grid-per-row: 6;
  }

  .lg\:grid-layout--5 {
    --card-grid-per-row: 5;
  }

  .lg\:grid-layout--4 {
    --card-grid-per-row: 4;
  }

  .lg\:grid-layout--3 {
    --card-grid-per-row: 3;
  }

  .lg\:grid-layout--2 {
    --card-grid-per-row: 2;
  }

  .lg\:grid-layout--1 {
    --card-grid-per-row: 1;
  }
}

/* component-media */
.media {
  display: block;
  position: relative;
  overflow: hidden;
  width: 100%;

  > img {
    backface-visibility: hidden;
    object-fit: var(--media-image-fit, cover);
    object-position: center center;
  }

  &.media--hover-effect>img+img {
    opacity: var(--resource-card-secondary-image-opacity);
  }
}

.media--transparent {
  background-color: transparent;
}

.media .product-media *,
.media model-viewer {
  display: block;
  max-width: 100%;
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
}

.media--adapt {
  aspect-ratio: var(--media-adapt-ratio, 1/1);
}

.media--circle,
.media--square {
  aspect-ratio: 1/1;
}

.media--portrait {
  aspect-ratio: 4/5;
}

.media--landscape {
  aspect-ratio: 16/9;
}

.media--cropped {
  padding-bottom: 56%;
}

.media--circle {
  border-radius: var(--style-border-radius-50);
}

.link-wrap {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
}

@media screen and (min-width: 990px) {
  .media--cropped {
    padding-bottom: 63%;
  }
}

deferred-media {
  display: block;
}

/* component-button */
.button--tertiary {
  --color-primary-button-background: var(--color-secondary-button-background);
  --color-primary-button-text: var(--color-secondary-button-text);
}

.shopify-payment-button__button--branded {
  z-index: auto;
}

.button:focus-visible,
.button:focus,
.button.focused,
.shopify-payment-button__button--unbranded:focus-visible,
.shopify-payment-button__button--unbranded:focus {
  outline: 0;
  box-shadow: 0 0 0 0.3rem var(--color-foreground),
    0 0 0 0.5rem rgb(var(--color-foreground-rgb) / var(--opacity-50)),
    0 0 0.5rem 0.4rem rgb(var(--color-foreground-rgb) / var(--opacity-30));
}

.button:focus:not(:focus-visible):not(.focused),
.shopify-payment-button__button--unbranded:focus:not(:focus-visible):not(.focused) {
  box-shadow: inherit;
}

.button::selection,
.shopify-challenge__button::selection,
.customer button::selection {
  background-color: rgb(var(--color-primary-button-text-rgb) / var(--opacity-30));
}

.button,
.button-label,
.shopify-challenge__button,
.customer button {
  font-size: var(--font-size--md);
  letter-spacing: 0.1rem;
}

.button--tertiary {
  font-size: var(--font-size--2xs);
  padding: 1rem 1.5rem;
  min-width: calc(9rem + var(--style-border-width-secondary) * 2);
  min-height: calc(3.5rem + var(--style-border-width-secondary) * 2);
}

.button--small {
  padding: 1.2rem 2.6rem;
}

/* Shopify Accelerated Checkout */
shopify-accelerated-checkout {
  --shopify-accelerated-checkout-button-border-radius: var(--style-border-radius-buttons-primary);
  --shopify-accelerated-checkout-button-box-shadow: var(--shadow-horizontal-offset) var(--shadow-vertical-offset) var(--shadow-blur-radius) var(--color-shadow);
}

shopify-accelerated-checkout-cart {
  --shopify-accelerated-checkout-button-border-radius: var(--style-border-radius-buttons-secondary);
  --shopify-accelerated-checkout-button-box-shadow: var(--shadow-horizontal-offset) var(--shadow-vertical-offset) var(--shadow-blur-radius) var(--color-shadow);
}

/* Button - other */
.button.is-active {
  color: var(--color-primary-button-background);
  background-color: var(--color-primary-button-text);
}

.button[disabled],
button.shopify-payment-button__button--unbranded[disabled],
.button[aria-disabled="true"],
.button.disabled,
.customer button:disabled,
.customer button[aria-disabled="true"],
.customer button.disabled,
.quantity__button.disabled {
  cursor: not-allowed;
  opacity: var(--opacity-50);
}

.button.loading {
  color: transparent;
  position: relative;
  pointer-events: none;

  >.loading__spinner {
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    position: absolute;
    height: 100%;
    display: flex;
    align-items: center;

    .spinner {
      width: fit-content;
    }

    .path {
      stroke: var(--color-primary-button-text);
    }
  }
}

@media screen and (forced-colors: active) {
  .button.loading {
    color: var(--color-foreground);
  }
}

.button,
.button-secondary,
.shopify-challenge__button,
button.shopify-payment-button__button--unbranded {
  --shadow-horizontal-offset: var(--buttons-shadow-horizontal-offset);
  --shadow-vertical-offset: var(--buttons-shadow-vertical-offset);
  --shadow-blur-radius: var(--buttons-shadow-blur-radius);
  --text-align: center;
  display: inline-grid;
  align-content: center;
  text-decoration: none;
  text-align: var(--text-align);
  color: var(--button-color);
  appearance: none;
  background: var(--button-background-color);
  background-origin: border-box;
  border: var(--button-border-width) solid var(--button-border-color);
  border-radius: var(--button-border-radius);
  font-family: var(--button-font-family, var(--font-paragraph--family));
  font-style: var(--font-paragraph--style);
  font-size: var(--button-font-size, var(--font-size--paragraph-md));
  font-weight: var(--button-font-weight, var(--font-paragraph--weight));
  text-transform: var(--button-text-case, var(--font-paragraph--case));
  line-height: var(--font-paragraph--line-height);
  margin-block: 0;
  transition: color var(--animation-speed) var(--animation-easing),
    box-shadow var(--animation-speed) var(--animation-easing),
    background-color var(--animation-speed) var(--animation-easing);
  cursor: pointer;
  width: fit-content;
  box-shadow: var(--shadow-horizontal-offset) var(--shadow-vertical-offset) var(--shadow-blur-radius) var(--color-shadow);
  padding-block:  var(--button-padding-vertical-mobile, var(--button-padding-vertical));
  padding-inline: var(--button-padding-horizontal-mobile, var(--button-padding-horizontal));
}

.button.w-full,
.button-secondary.w-full,
.shopify-challenge__button.w-full,
button.shopify-payment-button__button--unbranded.w-full {
  width: 100%;
}

@media (min-width: 750px) {
  .button,
  .button-secondary,
  .shopify-challenge__button,
  button.shopify-payment-button__button--unbranded {
    padding-block:  var(--button-padding-vertical);
    padding-inline: var(--button-padding-horizontal);
  }
}

.button--full-width {
  width: 100%;
}

.button:not(.button-secondary, .button-unstyled) {
  outline-color: var(--button-background-color);
}

textarea,
input {
  background-color: var(--color-input-background);
  border-color: var(--color-input-border);
}

textarea::placeholder,
input::placeholder {
  color: var(--color-input-text);
}

textarea:not(:placeholder-shown)::placeholder,
input:not(:placeholder-shown)::placeholder {
  opacity: var(--opacity-0);
}

.button[hidden] {
  display: none;
}

.button[aria-disabled='true'],
.button-secondary[aria-disabled='true'],
.button:disabled {
  opacity: var(--opacity-50);
  cursor: not-allowed;
}

.button,
.shopify-challenge__button,
button.shopify-payment-button__button--unbranded {
  --button-font-family: var(--button-font-family-primary);
  --button-font-size: var(--button-font-size-primary);
  --button-font-weight: var(--button-font-weight-primary);
  --button-text-case: var(--button-text-case-primary);
  --button-border-radius: var(--style-border-radius-buttons-primary);
  --button-color: var(--color-primary-button-text);
  --button-background-color: var(--color-primary-button-background);
  --button-border-color: var(--color-primary-button-border);
  --button-border-width: var(--style-border-width-primary);
}

@media (hover: hover) {
  .button:hover:not([disabled]):not(.button-unstyled),
  .shopify-challenge__button:hover:not([disabled]):not(.button-unstyled),
  button.shopify-payment-button__button--unbranded:hover:not([disabled]) {
    --shadow-horizontal-offset: 0;
    --shadow-vertical-offset: 0;
    --button-color: var(--color-primary-button-hover-text);
    --button-background-color: var(--color-primary-button-hover-background);
    --button-border-color: var(--color-primary-button-hover-border);

    svg {
      color: var(--color-primary-button-hover-text);
      fill: var(--color-primary-button-hover-text);
    }

    .path {
      stroke: var(--color-primary-button-hover-text);
    }
  }
}

.button-secondary {
  --button-font-family: var(--button-font-family-secondary);
  --button-font-size: var(--button-font-size-secondary);
  --button-font-weight: var(--button-font-weight-secondary);
  --button-text-case: var(--button-text-case-secondary);
  --button-border-radius: var(--style-border-radius-buttons-secondary);
  --button-color: var(--color-secondary-button-text);
  --button-background-color: var(--color-secondary-button-background);
  --button-border-color: var(--color-secondary-button-border);
  --button-border-width: var(--style-border-width-secondary);
}

@media (hover: hover) {
  .button-secondary:hover {
    --shadow-horizontal-offset: 0;
    --shadow-vertical-offset: 0;
    --button-color: var(--color-secondary-button-hover-text);
    --button-background-color: var(--color-secondary-button-hover-background);
    --button-border-color: var(--color-secondary-button-hover-border);
  }

  .shopify-challenge__button:hover:not([disabled]),
  button.shopify-payment-button__button--unbranded:hover:not([disabled]) {
    background: var(--button-background-color);
  }
}

.button-unstyled {
  display: block;
  padding: 0;
  background: inherit;
  color: inherit;
  border: 0;
  border-radius: 0;
  overflow: hidden;
  box-shadow: none;
  font-family: var(--font-paragraph--family);
  font-style: var(--font-paragraph--style);
  font-size: var(--font-paragraph--size);
}

@media (hover: hover) {
  .button-unstyled:hover {
    background: inherit;
  }
}

.button.button-unstyled:active {
  transform: none;
}

.button-unstyled--with-icon {
  color: var(--color-foreground);
  display: flex;
  gap: var(--gap-2xs);
  align-items: center;
}

.button-unstyled--transparent {
  background: transparent;
  box-shadow: none;
}

/* Button - social share */
.share-button {
  display: block;
  position: relative;

  details {
    width: fit-content;
  }
}

.share-button__button {
  font-size: var(--font-size--sm);
  display: flex;
  align-items: center;
  color: var(--color-primary);
  margin-left: 0;
  padding-left: 0;
  min-height: 4.4rem;

  @media (hover: hover) {
    &:hover {
      text-decoration: underline;
      text-underline-offset: 0.3rem;
    }
  }

  .icon-share {
    height: 1.2rem;
    margin-inline-end: 1rem;
    min-width: 1.3rem;
  }
}

details[open]>.share-button__fallback {
  animation: animateMenuOpen var(--duration-default) ease;
}

.share-button__button,
.share-button__fallback button {
  cursor: pointer;
  background-color: transparent;
  border: none;
}

.share-button__fallback {
  display: flex;
  align-items: center;
  position: absolute;
  top: 3rem;
  left: 0.1rem;
  z-index: 3;
  width: 100%;
  min-width: max-content;
  border-radius: var(--inputs-radius);
  border: 0;

  &:after {
    pointer-events: none;
    content: "";
    position: absolute;
    top: var(--inputs-border-width);
    right: var(--inputs-border-width);
    bottom: var(--inputs-border-width);
    left: var(--inputs-border-width);
    border: 0.1rem solid transparent;
    border-radius: var(--inputs-radius);
    box-shadow: 0 0 0 var(--inputs-border-width) var(--color-foreground);
    transition: box-shadow var(--duration-short) ease;
    z-index: 1;
  }

  &:before {
    background: var(--color-background);
    pointer-events: none;
    content: "";
    position: absolute;
    inset: 0;
    border-radius: var(--inputs-radius-outset);
    box-shadow: var(--inputs-shadow-horizontal-offset) var(--inputs-shadow-vertical-offset) var(--inputs-shadow-blur-radius) var(--color-shadow);
    z-index: -1;
  }

  button {
    width: 4.4rem;
    height: 4.4rem;
    padding: 0;
    flex-shrink: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
    right: var(--inputs-border-width);

    @media (hover: hover) {
      &:hover {
        color: rgb(var(--color-foreground-rgb) / var(--opacity-75));
      }

      &:hover .svg-wrapper {
        transform: scale(1.07);
      }
    }
  }
}

.share-button__close:not(.hidden)+.share-button__copy {
  display: none;
}

.share-button__close,
.share-button__copy {
  background-color: transparent;
  color: var(--color-foreground);
}

.share-button__copy:focus-visible,
.share-button__close:focus-visible {
  background: var(--color-background);
  z-index: 2;
}

.share-button__copy:focus,
.share-button__close:focus {
  background: var(--color-background);
  z-index: 2;
}

.field:not(:focus-visible):not(.focused)+.share-button__copy:not(:focus-visible):not(.focused),
.field:not(:focus-visible):not(.focused)+.share-button__close:not(:focus-visible):not(.focused) {
  background-color: inherit;
}

.share-button__fallback .field:after,
.share-button__fallback .field:before {
  content: none;
}

.share-button__fallback .field {
  border-radius: 0;
  min-width: auto;
  min-height: auto;
  transition: none;
}

.share-button__fallback .field__input:focus,
.share-button__fallback .field__input:-webkit-autofill {
  outline: 0.2rem solid rgb(var(--color-foreground-rgb) / var(--opacity-50));
  outline-offset: 0.1rem;
  box-shadow: 0 0 0 0.1rem var(--color-foreground),
    0 0 0.5rem 0.4rem rgb(var(--color-foreground-rgb) / var(--opacity-30));
}

.share-button__fallback .field__input {
  box-shadow: none;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
  filter: none;
  min-width: auto;
  min-height: auto;
}

@media (hover: hover) {
  .share-button__fallback .field__input:hover {
    box-shadow: none;
  }
}

.share-button__fallback .icon {
  width: 1.5rem;
  height: 1.5rem;
}

.share-button__message:not(:empty) {
  display: flex;
  align-items: center;
  width: 100%;
  height: 100%;
  margin-top: 0;
  padding: 0.8rem 0 0.8rem 1.5rem;
  margin: var(--inputs-border-width);
}

.share-button__message:not(:empty):not(.hidden)~* {
  display: none;
}

/* component-form */
.field__input,
.select__select,
.customer .field input,
.customer select {
  -webkit-appearance: none;
  appearance: none;
  background: var(--color-input-background);
  color: var(--color-input-text);
  font-family: var(--font-body--family);
  font-style: var(--font-body--style);
  font-weight: var(--font-body--weight);
  font-size: var(--font-input-size, var(--font-body--size));
  width: 100%;
  box-sizing: border-box;
  transition: box-shadow var(--duration-short) ease;
  border-radius: var(--inputs-radius);
  height: 4rem;
  min-height: calc(var(--inputs-border-width) * 2);
  min-width: calc(7rem + (var(--inputs-border-width) * 2));
  position: relative;
  border: 0;
}

.field:before,
.select:before,
.customer .field:before,
.customer select:before,
.input--primary:before {
  pointer-events: none;
  content: "";
  position: absolute;
  inset: 0;
  border-radius: var(--inputs-radius-outset);
  box-shadow: var(--inputs-shadow-horizontal-offset) var(--inputs-shadow-vertical-offset) var(--inputs-shadow-blur-radius) var(--color-shadow);
  z-index: -1;
}

.field:after,
.select:after,
.customer .field:after,
.customer select:after,
.input--primary:after {
  pointer-events: none;
  content: "";
  position: absolute;
  top: var(--inputs-border-width);
  right: var(--inputs-border-width);
  bottom: var(--inputs-border-width);
  left: var(--inputs-border-width);
  border: 0.1rem solid transparent;
  border-radius: var(--inputs-radius);
  box-shadow: 0 0 0 var(--inputs-border-width) var(--color-foreground);
  transition: box-shadow var(--duration-short) ease;
  z-index: 1;
}

.select__select {
  font-family: var(--font-body--family);
  font-style: var(--font-body--style);
  font-weight: var(--font-body--weight);
  font-size: var(--font-size--sm);
  color: rgb(var(--color-foreground-rgb) / var(--opacity-75));
}

.field__input:focus-visible,
.select__select:focus-visible,
.customer .field input:focus-visible,
.customer select:focus-visible {
  box-shadow: 0 0 0 calc(0.1rem + var(--inputs-border-width)) var(--color-foreground);
  outline: 0;
  border-radius: var(--inputs-radius);
}

.text-area,
.select {
  display: flex;
  position: relative;
  width: 100%;
}

/* component-input */
.input--primary.active:after,
.input--primary:focus-visible,
.input--primary:focus {
  background: rgb(var(--quantity-color-background) / var(--opacity-10));
  -webkit-background: rgb(var(--quantity-color-background) / var(--opacity-10));
  box-shadow: none;
}

@media (hover: hover) {
  .input--primary:hover:after {
    background: rgb(var(--quantity-color-background) / var(--opacity-10));
    -webkit-background: rgb(var(--quantity-color-background) / var(--opacity-10));
    box-shadow: none;
  }
}

/* Select */
.select .svg-wrapper,
.customer select+.svg-wrapper {
  height: 0.6rem;
  pointer-events: none;
  position: absolute;
  top: calc(50% - 0.2rem);
  right: calc(var(--inputs-border-width) + 1.5rem);
}

.select__select,
.customer select {
  cursor: pointer;
  padding: 0 calc(var(--inputs-border-width) + 3.5rem) 0 1rem;
  min-height: calc(var(--inputs-border-width) * 2);
}

/* Field */
.field {
  position: relative;
  width: 100%;
  display: flex;
  transition: box-shadow var(--duration-short) ease;
}

.customer .field {
  display: flex;
}

.field--with-error {
  flex-wrap: wrap;
}

.field__input,
.customer .field input {
  flex-grow: 1;
  text-align: left;
  padding: 1rem;
  margin: var(--inputs-border-width);
  transition: box-shadow var(--duration-short) ease;
}

.field__label,
.customer .field label {
  font-size: var(--font-label-size, 1.2rem);
  left: 1rem;
  top: 50%;
  transform: translateY(-50%);
  margin-bottom: 0;
  pointer-events: none;
  position: absolute;
  color: rgb(var(--color-foreground-rgb) / var(--opacity-75));
  transition: top var(--duration-medium) var(--ease-out-cubic),
  left var(--duration-medium) var(--ease-out-cubic),
    font-size var(--duration-medium) var(--ease-out-cubic),
    letter-spacing var(--duration-medium) var(--ease-out-cubic);
}

@media (hover: hover) {
  .field__input:hover~.field__label,
  .customer .field input:hover~label {
    letter-spacing: 0.15rem;
  }
}

.field__input:focus~.field__label,
.field__input:not(:placeholder-shown)~.field__label,
.field__input:-webkit-autofill~.field__label{
  font-size: var(--font-size--3xs);
  top: calc(var(--inputs-border-width) + 0.2rem);
  transform: none;
  left: 1.5rem;
  letter-spacing: 0.04rem;
}

.field__input:focus,
.field__input:not(:placeholder-shown),
.field__input:-webkit-autofill {
  padding: 1.5rem 0 0 1rem;
  margin: var(--inputs-border-width);
}

.field__input::-webkit-search-cancel-button,
.customer .field input::-webkit-search-cancel-button {
  display: none;
}

.field__button {
  align-items: center;
  background-color: transparent;
  border: 0;
  color: var(--color-primary-button-text);
  cursor: pointer;
  display: flex;
  height: 100%;
  justify-content: center;
  overflow: hidden;
  padding: 0;
  position: absolute;
  right: 0;
  top: 0;
  width: var(--minimum-touch-target);

  > .svg-wrapper {
    height: 2.5rem;
    width: 2.5rem;
  }
}

.field__input:-webkit-autofill~.field__button,
.field__input:-webkit-autofill~.field__label,
.customer .field input:-webkit-autofill~label {
  color: rgb(0, 0, 0);
}

/* Text area */
.text-area {
  font-family: var(--font-body--family);
  font-style: var(--font-body--style);
  font-weight: var(--font-body--weight);
  min-height: 10rem;
  resize: none;
}

/* Form global */
.form__label {
  display: block;
  margin-bottom: 0.6rem;
}

.form__message {
  align-items: center;
  display: flex;
  font-size: var(--font-size--sm);
  line-height: 1;
  margin-top: 1rem;
}

.form__message--large {
  font-size: var(--font-size--md);
}

.customer .field .form__message {
  font-size: var(--font-size--sm);
  text-align: left;
}

.form__message .icon,
.customer .form__message .svg-wrapper {
  flex-shrink: 0;
  height: 1.3rem;
  margin-inline-end: 0.5rem;
  width: 1.3rem;
}

.form__message--large .icon,
.customer .form__message .svg-wrapper {
  height: 1.5rem;
  width: 1.5rem;
  margin-inline-end: 1rem;
}

.customer .field .form__message .svg-wrapper {
  align-self: start;
}

.form-status {
  margin: 0;
  font-size: var(--font-size--md);
}

.form-status-list {
  padding: 0;
  margin: 2rem 0 4rem;
}

.form-status-list li {
  list-style-position: inside;
}

.form-status-list .link::first-letter {
  text-transform: capitalize;
}

/* component-localization */
.localization-form__select:before {
  pointer-events: none;
  content: "";
  position: absolute;
  inset: 0;
  border-radius: var(--localization-radius);
  box-shadow: var(--localization-shadow);
  z-index: -1;
}

.localization-form__select:after {
  pointer-events: none;
  content: "";
  position: absolute;
  top: var(--localization-border-width);
  right: var(--localization-border-width);
  bottom: var(--localization-border-width);
  left: var(--localization-border-width);
  border: 0.1rem solid transparent;
  border-radius: var(--localization-radius);
  box-shadow: 0 0 0 var(--localization-border-width) var(--color-foreground);
  transition: box-shadow var(--duration-short) ease;
  z-index: 1;
}

@media (hover: hover) {
  .localization-form__select:hover.localization-form__select:after,
  .localization-form__select:focus.localization-form__select:after {
    box-shadow: 0 0 0 calc(0.1rem + var(--localization-border-width)) var(--color-foreground);
    outline: 0;
    border-radius: var(--localization-radius);
  }
}

.localization-form__select:focus-visible.localization-form__select:after {
  box-shadow: 0 0 0 calc(0.1rem + var(--localization-border-width)) var(--color-foreground);
  outline: 0;
  border-radius: var(--localization-radius);
}

.localization-form__select:focus {
  outline: 0;
  box-shadow: none;
}

/* component-quantity */
.quantity {
  color: var(--color-foreground);
  position: relative;
  width: 11rem;
  display: flex;
  border-radius: var(--quantity-radius);
  min-height: var(--minimum-touch-target);

  &.cart-quantity {
    min-height: 4.5rem;
  }

  &:after {
    pointer-events: none;
    content: "";
    position: absolute;
    top: var(--quantity-border-width);
    right: var(--quantity-border-width);
    bottom: var(--quantity-border-width);
    left: var(--quantity-border-width);
    border: 0.1rem solid transparent;
    border-radius: var(--quantity-radius);
    box-shadow: 0 0 0 var(--quantity-border-width) rgb(var(--color-border-rgb) / var(--opacity-20));
    transition: box-shadow var(--duration-short) ease;
    z-index: 1;
  }

  &:before {
    pointer-events: none;
    content: "";
    position: absolute;
    inset: 0;
    border-radius: var(--quantity-radius);
    box-shadow: var(--quantity-shadow);
    z-index: -1;
  }
}

.quantity__input {
  color: currentColor;
  font-family: var(--font-body--family);
  font-style: var(--font-body--style);
  font-weight: var(--font-body--weight);
  font-size: var(--font-body--size);
  font-weight: 500;
  opacity: var(--opacity-85);
  text-align: center;
  background-color: transparent;
  border: 0;
  padding: 0 0.5rem;
  width: 100%;
  flex-grow: 1;
  -webkit-appearance: none;
  appearance: none;
}

.quantity__button {
  width: 3rem;
  flex-shrink: 0;
  font-size: var(--font-size--lg);
  border: 0;
  background-color: transparent;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--color-foreground);
  padding: 0;

  &:first-child {
    margin-left: calc(var(--quantity-border-width));
  }

  &:last-child {
    margin-right: calc(var(--quantity-border-width));
  }

  .svg-wrapper {
    width: 1rem;
    pointer-events: none;
  }
}

.quantity__button:focus-visible,
.quantity__input:focus-visible {
  background: var(--color-background);
  z-index: 2;
}

.quantity__button:focus,
.quantity__input:focus {
  background: var(--color-background);
  z-index: 2;
}

.quantity__button:not(:focus-visible):not(.focused),
.quantity__input:not(:focus-visible):not(.focused) {
  box-shadow: inherit;
  background-color: transparent;
}

.quantity__input:-webkit-autofill,
.quantity__input:-webkit-autofill:active {
  box-shadow: 0 0 0 10rem var(--color-foreground) inset !important;
  -webkit-box-shadow: 0 0 0 10rem var(--color-foreground) inset !important;
}

@media (hover: hover) {
  .quantity__input:-webkit-autofill:hover {
    box-shadow: 0 0 0 10rem var(--color-foreground) inset !important;
    -webkit-box-shadow: 0 0 0 10rem var(--color-foreground) inset !important;
  }
}

.quantity__input::-webkit-outer-spin-button,
.quantity__input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

.quantity__input[type="number"] {
  -moz-appearance: textfield;
}

.quantity__rules {
  position: relative;

  .divider {
    margin-top: 0.5rem;
  }

  .caption {
    display: inline-block;
    margin-block: 0;
  }
}

.quantity__rules .divider+.divider::before {
  content: "\2022";
  margin: 0 0.5rem;
}

.quantity__rules-cart {
  position: relative;
}

.quantity__rules-cart .svg-wrapper {
  width: var(--size-15);
  height: var(--size-15);
}

.quantity__tooltip-trigger {
  position: relative;
  top: 0.2rem;
  display: inline-block;
  cursor: pointer;
  padding: 0.3rem;
  border-radius: 50%;
  border: 0.1rem solid var(--color-black);
  color: var(--color-black);
  width: var(--size-23);
  height: var(--size-23);
}

.quantity__tooltip {
  position: absolute;
  bottom: 125%;
  left: 50%;
  transform: translateX(-50%);
  background: var(--color-black);
  color: var(--color-white);
  font-size: var(--font-size--2xs);
  padding: 0.4rem 0.8rem;
  border-radius: var(--quantity-radius);
  white-space: nowrap;
  opacity: var(--opacity-0);
  visibility: hidden;
  transition: opacity 0.15s ease, visibility 0.15s ease, transform 0.15s ease;
  z-index: 10;
  transform: translateX(-50%) translateY(-0.5rem);
}

.quantity__tooltip:after {
  content: '';
  position: absolute;
  top: 100%;
  left: 50%;
  transform: translateX(-50%);
  border-width: 0.5rem;
  border-style: solid;
  border-color: var(--color-black) transparent transparent transparent;
}

.quantity__tooltip-trigger:focus .quantity__tooltip {
  opacity: var(--opacity-100);
  visibility: visible;
  transform: translateX(-50%) translateY(0);
}

@media (hover: hover) {
  .quantity__tooltip-trigger:hover .quantity__tooltip {
    opacity: var(--opacity-100);
    visibility: visible;
    transform: translateX(-50%) translateY(0);
  }
}

.product__info-container .loading__spinner:not(.hidden)~*,
.quantity__rules-cart .loading__spinner:not(.hidden)~* {
  visibility: hidden;
}

/* component-modal */
.modal__toggle {
  list-style-type: none;
}

.modal__toggle-close {
  display: none;
}

.modal__toggle-open {
  display: flex;
}

.modal__close-button.link {
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 0rem;
  height: 4.4rem;
  width: 4.4rem;
  background-color: transparent;
}

.modal__close-button .icon {
  width: 1.7rem;
  height: 1.7rem;
}

.modal__content {
  position: absolute;
  inset: 0;
  background: var(--color-background);
  z-index: 4;
  display: flex;
  justify-content: center;
  align-items: center;
}

.media-modal {
  cursor: zoom-out;

  .deferred-media {
    cursor: initial;
  }
}

/* component-cart-count-bubble */
.cart-count-bubble:empty,
.wishlist-count-bubble:empty {
  display: none;
}

.cart-count-bubble,
.wishlist-count-bubble {
  position: absolute;
  color: var(--color-secondary-button-text);
  background-color: var(--color-secondary-button-background);
  /* color: var(--color-primary-button-text);
  background-color: var(--color-primary-button-hover-text); */
  height: 1.7rem;
  width: 1.7rem;
  border-radius: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 0.9rem;
  top: -1rem;
  right: 0rem;
  line-height: 1;

  &.cart-page-count-bubble {
    position: relative;
  }
}

/* utility-bar */
.utility-bar--bottom-border {
  border-bottom: 0.1rem solid rgb(var(--color-foreground-rgb) / var(--opacity-8));
}

@media screen and (max-width: 1024px) {
  .utility-bar .utility-bar__grid .list-social {
    display: none;
  }
}

.utility-bar .list-social__item .icon {
  scale: 0.9;
}

.announcement-bar,
.announcement-bar__announcement {
  color: var(--color-foreground);
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  align-content: center;
  grid-area: announcements;
}

.announcement-bar-slider,
.utility-bar__grid .announcement-bar-slider {
  width: 100%;
}

@media screen and (max-width: 749px) {
  .utility-bar__grid .announcement-bar-slider .swiper-button {
    display: none;
  }
}

.utility-bar .list-social__link:focus-visible {
  outline-offset: -0.3rem;
  box-shadow: 0 0 0 -0.2rem var(--color-foreground);
}

.localization-wrapper {
  grid-area: language-currency;
  align-self: center;
  display: flex;
  justify-content: flex-end;
}

.utility-bar .localization-wrapper .disclosure .localization-form__select,
.utility-bar .localization-wrapper .disclosure__link {
  font-size: var(--font-size--xs);
}

/* Main Header Layout */
.overflow-hidden-mobile,
.overflow-hidden-tablet,
.overflow-hidden-desktop {
  overflow: hidden;
}

@media screen and (min-width: 750px) {
  .overflow-hidden-mobile {
    overflow: clip auto;
  }
}

@media screen and (min-width: 1025px) {
  .overflow-hidden-tablet {
    overflow: auto;
  }
}

.badge {
  border: 1px solid transparent;
  border-radius: var(--badge-corner-radius);
  display: flex;
  font-size: var(--font-size--3xs);
  letter-spacing: 0.1rem;
  line-height: 1;
  padding: var(--pt, 0.5rem) var(--pr, 1.3rem) var(--pb, 0.6rem) var(--pl, 1.3rem);
  text-align: center;
  background-color: var(--color-badge-background);
  border-color: var(--color-badge-border);
  color: var(--color-badge-foreground);
  word-break: break-word;
  width: max-content;
}

@media screen and (min-width: 750px) {
  .badge {
    font-size: var(--font-size--2xs);
  }
}

.sold-out-badge {
  --color-badge-background: var(--color-sold-out-badge-background);
  --color-badge-border: var(--color-sold-out-badge-border);
  --color-badge-foreground: var(--color-sold-out-badge-foreground);
}

.new-badge {
  --color-badge-background: var(--color-new-badge-background);
  --color-badge-border: var(--color-new-badge-border);
  --color-badge-foreground: var(--color-new-badge-foreground);
}

.sale-badge {
  --color-badge-background: var(--color-sale-badge-background);
  --color-badge-border: var(--color-sale-badge-border);
  --color-badge-foreground: var(--color-sale-badge-foreground);
}

.custom-badge {
  --color-badge-background: var(--color-custom-badge-background);
  --color-badge-border: var(--color-custom-badge-border);
  --color-badge-foreground: var(--color-custom-badge-foreground);
}

.background-image {
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  background-attachment: unset;
}

@media screen and (forced-colors: active) {
  .icon {
    color: CanvasText;
    fill: CanvasText !important;
  }

  .icon-close-small path {
    stroke: CanvasText;
  }
}

.ratio {
  display: flex;
  position: relative;
  align-items: stretch;

  &::before {
    content: "";
    width: 0;
    height: 0;
    padding-bottom: var(--ratio-percent);
  }
}

/* check for flexbox gap in older Safari versions */
@supports not (inset: 10px) {
  .grid {
    margin-left: calc(-1 * var(--grid-mobile-horizontal-spacing));
  }

  .grid__item {
    padding-left: var(--grid-mobile-horizontal-spacing);
    padding-bottom: var(--grid-mobile-vertical-spacing);
  }

  @media screen and (min-width: 750px) {
    .grid {
      margin-left: calc(-1 * var(--grid-desktop-horizontal-spacing));
    }

    .grid__item {
      padding-left: var(--grid-desktop-horizontal-spacing);
      padding-bottom: var(--grid-desktop-vertical-spacing);
    }
  }

  .grid--gapless .grid__item {
    padding-left: 0;
    padding-bottom: 0;
  }

  @media screen and (min-width: 750px) {
    .grid--peek .grid__item {
      padding-left: var(--grid-mobile-horizontal-spacing);
    }
  }

  .product-grid .grid__item {
    padding-bottom: var(--grid-mobile-vertical-spacing);
  }

  @media screen and (min-width: 750px) {
    .product-grid .grid__item {
      padding-bottom: var(--grid-desktop-vertical-spacing);
    }
  }
}

/* outline and border styling for Windows High Contrast Mode */
@media (forced-colors: active) {
  .button,
  .shopify-challenge__button,
  .customer button {
    border: transparent solid 1px;
  }

  .button:focus-visible,
  .button:focus,
  .button.focused,
  .shopify-payment-button__button--unbranded:focus-visible,
  .shopify-payment-button [role="button"]:focus-visible,
  .shopify-payment-button__button--unbranded:focus,
  .shopify-payment-button [role="button"]:focus {
    outline: solid transparent 1px;
  }

  .field__input:focus,
  .select__select:focus,
  .customer .field input:focus,
  .customer select:focus,
  .localization-form__select:focus.localization-form__select:after {
    outline: transparent solid 1px;
  }

  .localization-form__select:focus {
    outline: transparent solid 1px;
  }
}

.rte:after {
  clear: both;
  content: "";
  display: block;
}

.rte>*:first-child {
  margin-top: 0;
}

.rte>*:last-child {
  margin-bottom: 0;
}

.rte table {
  table-layout: fixed;
}

@media screen and (min-width: 750px) {
  .rte table td {
    padding-inline: 1.2rem;
  }
}

.rte img {
  height: auto;
  max-width: 100%;
}

.rte ul,
.rte ol {
  list-style-position: inside;
  padding-left: 2rem;
}

.rte li {
  list-style: inherit;
}

.rte li:last-child {
  margin-bottom: 0;
}

.rte a {
  color: rgb(var(--color-primary-rgb) / var(--opacity-85));
  text-underline-offset: 0.3rem;
  text-decoration-thickness: 0.1rem;
  transition: text-decoration-thickness var(--duration-short) ease;
}

@media (hover: hover) {
  .rte a:hover {
    color: var(--color-primary);
    text-decoration-thickness: 0.2rem;
  }
}

.rte blockquote {
  display: inline-flex;

  &>* {
    margin: -0.5rem 0 -0.5rem 0;
  }
}

/* Image mask global styles */
.shape--mask {
  display: block;
  height: 0;
  width: 0;
}

.shape--arch {
  clip-path: url("#Shape-Arch");
}

.shape--blob {
  clip-path: polygon(var(--shape--blob-1));
}

.shape--chevronleft {
  clip-path: polygon(100% 0%, 85% 50%, 100% 100%, 15% 100%, 0% 50%, 15% 0%);
}

.shape--chevronright {
  clip-path: polygon(85% 0%, 100% 50%, 85% 100%, 0% 100%, 15% 50%, 0% 0%);
}

.shape--circle {
  clip-path: circle(closest-side);
}

.shape--diamond {
  clip-path: polygon(50% 0%, 100% 50%, 50% 100%, 0% 50%);
}

.shape--parallelogram {
  clip-path: polygon(15% 0, 100% 0%, 85% 100%, 0% 100%);
}

.shape--round {
  clip-path: ellipse(45% 45% at 50% 50%);
}

/* Fixed background */
.animate--fixed {
  clip-path: inset(0);
}

.animate--fixed>img:not(.zoom):not(.deferred-media__poster-button),
.animate--fixed>svg:not(.zoom):not(.deferred-media__poster-button) {
  position: fixed;
  height: 100vh;
}

/* Zoom in image on scroll */
.animate--zoom-in {
  --zoom-in-ratio: 1;
}

.animate--zoom-in>img,
.animate--zoom-in>.svg-wrapper {
  transition: scale var(--duration-short) linear;
  scale: var(--zoom-in-ratio);
}

/* Animations */
@media (prefers-reduced-motion: no-preference) {
  .animate--ambient>img,
  .animate--ambient>.svg-wrapper {
    animation: animateAmbient 30s linear infinite;
  }

  @keyframes animateAmbient {
    0% {
      transform: rotate(0deg) translateX(1em) rotate(0deg) scale(1.2);
    }

    100% {
      transform: rotate(360deg) translateX(1em) rotate(-360deg) scale(1.2);
    }
  }

  .scroll-trigger.animate--fade-in,
  .scroll-trigger.animate--slide-in {
    opacity: var(--opacity-4);
  }

  .scroll-trigger.animate--slide-in {
    transform: translateY(2rem);
  }

  .scroll-trigger:not(.scroll-trigger--offscreen).animate--fade-in {
    opacity: var(--opacity-100);
    animation: var(--animation-fade-in);
  }

  .scroll-trigger:not(.scroll-trigger--offscreen).animate--slide-in {
    animation: var(--animation-slide-in);
    animation-delay: calc(var(--animation-order) * 75ms);
  }

  .scroll-trigger.scroll-trigger--design-mode.animate--fade-in,
  .scroll-trigger.scroll-trigger--design-mode.animate--slide-in,
  .scroll-trigger:not(.scroll-trigger--offscreen).scroll-trigger--cancel {
    opacity: var(--opacity-100);
    animation: none;
    transition: none;
    transform: none;
  }

  .scroll-trigger.scroll-trigger--design-mode.animate--slide-in {
    transform: translateY(0);
  }

  @keyframes slideIn {
    from {
      transform: translateY(2rem);
      opacity: var(--opacity-1);
    }

    to {
      transform: translateY(0);
      opacity: var(--opacity-100);
    }
  }

  @keyframes fadeIn {
    from {
      opacity: var(--opacity-1);
    }

    to {
      opacity: var(--opacity-100);
    }
  }
}

/* Element Hovers: Vertical Lift, 3d Lift */
@media (prefers-reduced-motion: no-preference) and (hover: hover) {
  .animate--hover-3d-lift .card-wrapper .card--card,
  .animate--hover-3d-lift .card-wrapper .card--standard .card__inner,
  .animate--hover-3d-lift .button:not(.button--tertiary),
  .animate--hover-3d-lift .shopify-challenge__button,
  .animate--hover-3d-lift .customer button,
  .animate--hover-3d-lift .shopify-payment-button__button,
  .animate--hover-3d-lift .deferred-media .deferred-media__poster-button {
    transition: transform var(--duration-long) ease,
      box-shadow var(--duration-long) ease;
    transform-origin: center;
  }

  .animate--hover-3d-lift .card-wrapper:hover .card--card,
  .animate--hover-3d-lift .card-wrapper:hover .card--standard .card__inner,
  .animate--hover-3d-lift .button:not(.button--tertiary):not([disabled]):hover,
  .animate--hover-3d-lift .shopify-challenge__button:not([disabled]):hover,
  .animate--hover-3d-lift .customer button:not([disabled]):hover,
  .animate--hover-3d-lift .shopify-payment-button__button:hover {
    transition: transform var(--duration-extended) ease,
      box-shadow var(--duration-long) ease;
    transform: rotate(1deg);
    box-shadow: -1rem -1rem 1rem -1rem rgb(0 0 0 / var(--opacity-5)),
      1rem 1rem 1rem -1rem rgb(0 0 0 / var(--opacity-5)),
      0 0 0.5rem 0 rgb(255 255 255 / var(--opacity-0)),
      0 2rem 3.5rem -2rem rgb(0 0 0 / var(--opacity-50));
  }

  .animate--hover-3d-lift .collage__item .card-wrapper:hover .card--card,
  .animate--hover-3d-lift .collage__item .card-wrapper:hover .card--standard .card__inner {
    transform: rotate(0.5deg);
  }

  .animate--hover-3d-lift .product-grid .grid__item:hover,
  .animate--hover-3d-lift .collection-list .grid__item:hover,
  .animate--hover-3d-lift .collage__item:hover,
  .animate--hover-3d-lift .blog-articles .article:hover,
  .animate--hover-3d-lift .complementary-slide li:hover {
    z-index: 2;
  }

  .animate--hover-3d-lift .product-grid {
    isolation: isolate;
  }

  .animate--hover-3d-lift .card-wrapper .card--shape.card--standard:not(.card--text) .card__inner {
    box-shadow: none;
    transition: transform var(--duration-long) ease,
      filter var(--duration-long) ease;
  }

  .animate--hover-3d-lift .card-wrapper:hover .card--shape.card--standard:not(.card--text) .card__inner {
    transition: transform calc(2 * var(--duration-extended)) ease,
      filter var(--duration-long) ease;
    filter: drop-shadow(0rem 2rem 2rem rgb(0 0 0 / var(--opacity-15))) drop-shadow(0rem 1rem 1rem rgb(0 0 0 / var(--opacity-15)));
  }

  .animate--hover-3d-lift .card-wrapper:hover .card--card:after,
  .animate--hover-3d-lift .card-wrapper:hover .card--standard .card__inner:after,
  .animate--hover-3d-lift .card-wrapper:hover .card--shape.card--standard:not(.card--text) .card__inner .card__media:before {
    background-image: var(--easter-egg);
    background-size: 250px 250px;
    mix-blend-mode: color-dodge;
    pointer-events: none;
    z-index: 2;
  }

  .animate--hover-3d-lift .card-wrapper:hover .card--shape.card--standard:not(.card--text) .card__inner .card__media:before {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
  }

  .animate--hover-3d-lift .card-wrapper .card--card:before,
  .animate--hover-3d-lift .card-wrapper .card--standard .card__media:after {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    opacity: var(--opacity-0);
    pointer-events: none;
    transition: background-position calc(2 * var(--duration-extended)) ease,
      opacity var(--duration-default) ease;
    mix-blend-mode: overlay;
    background-size: 400% 100%;
    background-position: 90% 0;
    background-repeat: no-repeat;
    background-image: linear-gradient(135deg,
        rgb(255 255 255 / var(--opacity-0)) 45%,
        rgb(255 255 255 / var(--opacity-100)) 50%,
        rgb(255 255 255 / var(--opacity-0)) 55%);
  }

  .animate--hover-3d-lift .card-wrapper:hover .card--card:before,
  .animate--hover-3d-lift .card-wrapper:hover .card--standard .card__media:after {
    opacity: var(--opacity-20);
    transition: background-position 6s ease, opacity var(--duration-long) ease;
    background-position: left;
    z-index: 2;
  }

  :root {
    --easter-egg: none;
    --sparkle: url("./sparkle.gif");
  }

  .animate--hover-vertical-lift .button:not(.button--tertiary),
  .animate--hover-vertical-lift .shopify-challenge__button,
  .animate--hover-vertical-lift .customer button,
  .animate--hover-vertical-lift .shopify-payment-button__button {
    transition: transform var(--duration-default) var(--ease-out-slow);
  }

  .animate--hover-vertical-lift .card-wrapper .card--card,
  .animate--hover-vertical-lift .card-wrapper .card--standard .card__inner {
    transition: transform var(--duration-medium) var(--ease-out-slow);
  }

  .animate--hover-vertical-lift .card-wrapper:hover .card--card,
  .animate--hover-vertical-lift .card-wrapper:hover .card--standard .card__inner {
    transform: translateY(-0.75rem);
  }

  .animate--hover-vertical-lift .card-wrapper:active .card--card,
  .animate--hover-vertical-lift .card-wrapper:active .card--standard .card__inner {
    transform: translateY(-0.5rem);
  }

  .animate--hover-vertical-lift .button:not(.button--tertiary):not([disabled]):hover,
  .animate--hover-vertical-lift .shopify-challenge__button:not([disabled]):hover,
  .animate--hover-vertical-lift .customer button:not([disabled]):hover,
  .animate--hover-vertical-lift .shopify-payment-button__button:hover {
    transform: translateY(-0.25rem);
  }

  .animate--hover-vertical-lift .button:not(.button--tertiary):not([disabled]):active,
  .animate--hover-vertical-lift .shopify-challenge__button:not([disabled]):active,
  .animate--hover-vertical-lift .customer button:not([disabled]):active,
  .animate--hover-vertical-lift .shopify-payment-button__button:active {
    transform: translateY(0);
  }

  .animate--hover-vertical-lift .button:not([disabled]):hover:after,
  .animate--hover-vertical-lift .customer button:not([disabled]):hover:after,
  .animate--hover-vertical-lift .shopify-payment-button__button:not([disabled]):hover:after {
    box-shadow: var(--shadow-horizontal-offset) var(--shadow-vertical-offset) var(--shadow-blur-radius) var(--color-shadow);
  }
}

/* Loading spinner */
.loading__spinner {
  position: absolute;
  z-index: 1;
  width: 1.8rem;
  display: inline-block;
}

.spinner {
  animation: rotator 1.4s linear infinite;
}

@keyframes rotator {
  0% {
    transform: rotate(0deg);
  }

  100% {
    transform: rotate(270deg);
  }
}

.path {
  stroke-dasharray: 280;
  stroke-dashoffset: 0;
  transform-origin: center;
  stroke: var(--color-foreground);
  animation: dash 1.4s ease-in-out infinite;
}

@media screen and (forced-colors: active) {
  .path {
    stroke: CanvasText;
  }
}

@keyframes dash {
  0% {
    stroke-dashoffset: 280;
  }

  50% {
    stroke-dashoffset: 75;
    transform: rotate(135deg);
  }

  100% {
    stroke-dashoffset: 280;
    transform: rotate(450deg);
  }
}

.loading__spinner:not(.hidden)+.cart-item__price-wrapper,
.loading__spinner:not(.hidden)~cart-remove-button {
  opacity: var(--opacity-50);
}

.loading__spinner:not(.hidden)~cart-remove-button {
  pointer-events: none;
  cursor: default;
}

/* Loading filter blur */
.loading-filter-blur {
  opacity: var(--opacity-80);
  pointer-events: none;
  filter: blur(1.5px);
}

/* Progress bar */
.progress-bar-container {
  width: 100%;
  margin: auto;
}

.progress-bar {
  height: 0.13rem;
  width: 100%;
}

.progress-bar-value {
  width: 100%;
  height: 100%;
  background-color: var(--color-foreground);
  animation: indeterminateAnimation var(--duration-extra-longer) infinite ease-in-out;
  transform-origin: 0;
}

.progress-bar .progress-bar-value {
  display: block;
}

@keyframes indeterminateAnimation {
  0% {
    transform: translateX(-20%) scaleX(0);
  }

  40% {
    transform: translateX(30%) scaleX(0.7);
  }

  100% {
    transform: translateX(100%) scaleX(0);
  }
}

/* component-drawer */
.drawer,
.modal--popup {
  opacity: var(--opacity-0);
  visibility: hidden;
  pointer-events: none;
  transition-property: opacity, background-color, transform;
  transition-duration: var(--duration-extra-short);
  transition-timing-function: var(--cubic-smooth);
  z-index: var(--layer-menu-drawer);
}

.drawer.active,
.modal--popup[open] {
  transform: translateX(0);
  opacity: var(--opacity-100);
  visibility: visible;
  pointer-events: visible;
}

.modal__overlay:empty,
.drawer__overlay:empty {
  display: block;
  min-height: 100lvh;
  background-color: rgb(var(--color-shadow-rgb) / var(--opacity-70));
  z-index: -1;
}

/* .drawer.justify-start .drawer__inner {
  transform: translateX(-100%);
}

.drawer.justify-end .drawer__inner {
  transform: translateX(100%);
} */

.drawer__inner {
  height: 100%;
  padding: 0 1.5rem;
  border-right: 0;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  transition-property: transform, box-shadow;
  transition-duration: var(--duration-extra-long);
  transition-timing-function: var(--cubic-smooth);
}

/* drawer - button (Close) */
.drawer__close {
  top: var(--top, 0);
  right: var(--right, 0);
  z-index: var(--layer-raised);
  width: var(--minimum-touch-target);
  height: var(--minimum-touch-target);
  min-width: var(--minimum-touch-target);
  min-height: var(--minimum-touch-target);
  color: var(--color-foreground);
  background-color: transparent;
  box-shadow: 0 0 0 0.2rem transparent;
  padding: var(--padding-sm);
  display: inline-flex;
  justify-content: center;
  align-items: center;

  > button:not(.button--drawer) {
    height: 100%;
    width: 100%;
    padding: var(--padding-md);
  }

  &:has( > button) {
    padding: 0;
    > button {
      height: 100%;
      width: 100%;
      padding: var(--padding-md);
    }
  }
}

.drawer__header .drawer__close {
  margin-right: calc(-1 * var(--margin-sm));
}

.modal--popup .drawer__close {
  position: fixed;
  top: 1.5rem;
  right: 1.5rem;
  z-index: 5;
}

.drawer__close .icon-close {
  width: var(--icon-size-md);
  height: var(--icon-size-md);
  transition: transform var(--duration-default) ease;
  will-change: transform;
}
@media (forced-colors: active) {
  .drawer__close .icon-close {
    color: CanvasText;
  }
}
@media (hover: hover) {
  .drawer__close:hover .icon-close {
    transform: rotate(90deg);
  }
}

@media screen and (min-width: 750px) {
  .modal--popup .drawer__close {
    top: 2rem;
    right: 2rem;
  }
}

/* drawer - Popup */
.drawer[element-s-popup] .drawer__header.center:before {
  content: "";
  display: block;
  position: relative;
  top: 0;
  left: 0;
  width: 4.4rem;
  height: 100%;
}

.popup__inner {
  /* display: none; */
  pointer-events: none;
  box-shadow: var(--style-shadow-popover);
  border: var(--style-border-popover);
  border-radius: var(--style-border-radius-popover);
  background: var(--color-background);
  max-width: var(--modal-max-width, var(--normal-content-width));
  max-height: var(--popup-max-height, var(--modal-max-height));
  overflow-x: hidden;
  overflow-y: auto;
  opacity: var(--opacity-0);
  visibility: hidden;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -40%);
  transition-property: opacity, transform, box-shadow;
  transition-duration: var(--duration-extra-long);
  transition-timing-function: var(--cubic-smooth);
  will-change: transform;
}

.popup__inner--content {
  padding: var(--padding-5xl);
}

.popup__button svg {
  display: inline-block;
  position: relative;
  top: var(--margin-2xs);
}

.popup__content--drawer {
  position: fixed;
  border-radius: 0;
  width: var(--sidebar-width);
  max-width: 95vw;
  height: 100%;
  margin: 0 0 0 auto;
}

.popup__content--drawer:modal {
  max-height: 100dvh;
}

.drawer.active .popup__inner,
.modal--popup[open] .popup__inner {
  display: block;
  opacity: var(--opacity-100);
  visibility: visible;
  transform: translate(-50%, -50%);
  pointer-events: auto;
  box-shadow: var(--style-shadow-popup-effect, none);
}

@media screen and (max-width: 749px) {
  .popup__inner {
    width: calc(100% - 3rem);
  }

  .popup__inner--content {
    padding: var(--padding-4xl) var(--padding-xl) var(--padding-xl);
  }
}

/* drawer - Slide */
@media screen and (max-width: 749px) {
  .drawer-slide-mb {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 9;
    display: flex;
    justify-content: center;
    opacity: var(--opacity-0);
    visibility: hidden;
    pointer-events: none;
    transition-property: opacity, background-color, transform;
    transition-duration: var(--duration-extra-long);
    transition-timing-function: var(--cubic-smooth);
  }

  .drawer-slide-mb.active {
    opacity: var(--opacity-100);
    visibility: visible;
    pointer-events: visible;
  }

  .drawer-slide-mb .slide__overlay--mb:empty {
    position: fixed;
    inset: 0;
    cursor: pointer;
    display: block;
    min-height: 100lvh;
    background-color: rgb(18 18 18 / var(--opacity-35));
  }

  .drawer-slide-mb .slide__inner--mb {
    transform: translate3d(0, 100%, 0);
    transition-property: transform, box-shadow;
    transition-duration: var(--duration-extra-long);
    transition-timing-function: var(--cubic-smooth);
  }

  .drawer-slide-mb.active .slide__inner--mb {
    transform: translate3d(0, 0, 0);
    box-shadow: #ffffff1a 0 0.8rem 2.4rem, #fff3 0 1.6rem 5.6rem,
      #fff3 0 2.4rem 8rem;
  }
}

/* collapsible-tab */
collapsible-tab:not([data-tabList-mobile]) .collapsible-tab__header {
  cursor: pointer;
  pointer-events: auto;
  position: relative;
  padding-block: 1rem 0.8rem;
  border-bottom: 0.1rem solid var(--color-foreground);
}

collapsible-tab .collapsible-tab__header .icon-caret {
  height: 0.6rem;
  right: 1.5rem;
  transition: transform var(--tst-smooth);
}

collapsible-tab:not([data-tabList-mobile]) .collapsible-tab__content {
  max-height: 0;
  margin-bottom: 0;
  overflow: hidden;
  transition: max-height var(--tst-smooth);
}

collapsible-tab.is-open .collapsible-tab__header .icon-caret {
  transform: rotate(180deg);
}

@media screen and (max-width: 749px) {
  collapsible-tab[data-tabList-mobile] .collapsible-tab__header {
    cursor: pointer;
    pointer-events: auto;
    position: relative;
    padding-block: 1rem 0.8rem;
    border-bottom: 0.1rem solid var(--color-foreground);
  }

  collapsible-tab[data-tabList-mobile] .collapsible-tab__content {
    max-height: 0;
    margin-bottom: 0;
    overflow: hidden;
    transition: max-height var(--tst-smooth);
  }
}

/* Collage */
.collage-wrapper-title {
  margin-top: 0;
  margin-bottom: 3rem;
}

.collage {
  display: grid;
}

.collage__item>* {
  width: 100%;
}

.collage__item .card__content {
  flex-grow: initial;
}

@media screen and (max-width: 749px) {
  .collage--mobile {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .collage--mobile .collage__item--left:nth-child(3n - 2) {
    grid-column: span 2;
  }

  .collage--mobile .collage__item--left:nth-child(3n - 2):nth-last-child(2) {
    grid-column: span 1;
  }

  .collage--mobile .collage__item--left:nth-child(3n) {
    grid-column-start: 2;
  }

  .collage--mobile .collage__item--right:nth-child(3n - 2) {
    grid-column-start: 1;
  }

  .collage--mobile .collage__item--right:nth-child(3n - 2):last-child {
    grid-column: span 2;
  }

  .collage--mobile .collage__item--right:nth-child(3n - 1) {
    grid-column-start: 2;
  }

  .collage--mobile .collage__item--right:nth-child(3n) {
    grid-column: 1 / span 2;
  }
}

@media screen and (min-width: 750px) {
  .collage {
    grid-auto-flow: column;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: var(--gap-x) var(--gap-y);
  }

  .collage-2-columns {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .collage--4-columns {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }

  .collage__item--1,
  .collage__item--4 {
    grid-row: span 2;
  }

  .collage__item--1 {
    grid-column: 1 / span 1;
  }

  .collage--1-items .collage__item--1 {
    grid-column: 1 / span 3;
    grid-row: 1 / span 2;
  }

  .collage--2-items.collage--right .collage__item--1 {
    grid-row: 1 / span 2;
  }

  .collage--3-items.collage--right .collage__item--1 {
    grid-row: 1 / span 1;
  }

  .collage__item--2,
  .collage__item--3:not(.menu-dropdown__brand) {
    grid-column-start: 2;
  }

  .collage--2-items .collage__item--2 {
    grid-row: 1 / span 1;
  }

  .collage--right .collage__item--2,
  .collage--right .collage__item--3:not(.menu-dropdown__brand) {
    grid-column-start: 2;
  }

  .collage--2-items.collage--right .collage__item--2 {
    grid-column: 2 / span 2;
    grid-row: 1 / span 2;
  }

  .collage--3-items.collage--right .collage__item--2 {
    grid-column: 1 / span 1;
    grid-row: 2 / span 1;
  }

  .collage--3-items.collage--right .collage__item--3:not(.menu-dropdown__brand) {
    grid-column: 2 / span 2;
    grid-row: 1 / span 2;
  }

  .collage__item--4 {
    grid-column: 4 / span 1;
  }

  .collage--right .collage__item--4 {
    grid-column: 3 / span 2;
  }

  .collage__item--left:nth-child(3n - 2) {
    grid-column: 1 / span 2;
    grid-row: span 2;
  }

  .collage__item--left:nth-child(3n - 2):last-child {
    grid-column: 1 / span 3;
  }

  .collage__item--left:nth-child(3n - 1),
  .collage__item--left:nth-child(3n) {
    grid-column-start: 3;
  }

  .collage__item--left:nth-child(3n - 1):last-child {
    grid-row: span 2;
  }

  .collage__item--right:nth-child(3n - 2) {
    grid-column: 1 / span 1;
    grid-row: span 1;
  }

  .collage__item--right:nth-child(3n - 2):last-child {
    grid-column: 1 / span 3;
  }

  .collage__item--right:nth-child(3n - 1) {
    grid-column-start: 1;
  }

  .collage__item--right:nth-child(3n-1):last-child {
    grid-column: span 2;
  }

  .collage__item--right:nth-child(3n) {
    grid-column: 2 / span 2;
    grid-row: span 2;
  }

  .collage__item--collection:only-child,
  .collage__item--product:only-child {
    justify-self: center;
    max-width: 73rem;
    width: 100%;
  }
}

.collage-card {
    height: 100%;
    position: relative;
    border-radius: var(--border-radius);
    border: var(--border-width) solid var(--color-foreground);
    padding: var(--image-padding);

  &:after {
    content: '';
    position: absolute;
    z-index: -1;
    border-radius: var(--border-radius);
    box-shadow: var(--shadow-horizontal-offset) var(--shadow-vertical-offset) var(--shadow-blur-radius) var(--color-shadow);
    width: calc(var(--border-width) * 2 + 100%);
    height: calc(var(--border-width) * 2 + 100%);
    top: calc(var(--border-width) * -1);
    left: calc(var(--border-width) * -1);
  }

  &.gradient {
    transform: perspective(0);
  }

  &.product-card-wrapper {
    --border-radius: var(--product-card-corner-radius);
    --border-width: var(--product-card-border-width);
    --shadow-horizontal-offset: var(--product-card-shadow-horizontal-offset);
    --shadow-vertical-offset: var(--product-card-shadow-vertical-offset);
    --shadow-blur-radius: var(--product-card-shadow-blur-radius);
    --image-padding: var(--product-card-image-padding);
  }

  .media {
    height: 100%;
    overflow: hidden;
    border-radius: calc(var(--border-radius) - var(--border-width) - var(--image-padding));
  }

  .deferred-media {
    height: 100%;
    overflow: visible;
  }

  .deferred-media__poster {
    background-color: transparent;
    border: 0;
    &:after {
      content: '';
      position: absolute;
      z-index: 1;
      outline-offset: 0.3rem;
      bottom: calc(var(--border-width) * -1);
      left: calc(var(--border-width) * -1);
      right: calc(var(--border-width) * -1);
      top: calc(var(--border-width) * -1);
    }
  }
}

.collage-card__link {
  display: block;
  height: 100%;
}

.collage-card .deferred-media__poster:focus:after {
  box-shadow: 0 0 0 0.3rem var(--color-foreground), 0 0 0.5rem 0.4rem rgb(var(--color-foreground-rgb) / var(--opacity-30));
  outline: 0.2rem solid rgb(var(--color-foreground-rgb) / var(--opacity-50));
}

.collage-card .deferred-media__poster:focus-visible:after {
  box-shadow: 0 0 0 0.3rem var(--color-foreground), 0 0 0.5rem 0.4rem rgb(var(--color-foreground-rgb) / var(--opacity-30));
  outline: 0.2rem solid rgb(var(--color-foreground-rgb) / var(--opacity-50));
}

.collage-card .deferred-media__poster:focus:not(:focus-visible),
.collage-card .deferred-media__poster:focus:not(:focus-visible):after {
  outline: none;
  box-shadow: none;
}

.collage-card .deferred-media__poster:focus {
  outline: none;
  box-shadow: none;
}
/* Collage */

/* tabs-component */
tabs-component:not(.predictive-search-tabs) .tabs-component-content {
  display: none;

  &.--active {
    display: block;
  }
}

/* modal-component */
.modal-component {
  .modal__overlay:empty {
    background-color: rgb(var(--color-shadow-rgb) / var(--opacity-40));
  }

  .modal__inner {
    padding: 2.5rem 1.2rem;
  }

  .modal-header {
    padding-bottom: 2rem;
  }

  .modal-header__title {
    font-size: var(--size-16);
  }

  .modal__close .svg-wrapper{
    padding: 0.35rem;
    width: 2.2rem;
    height: 2.2rem;
  }

  .modal-footer {
    padding-top: 1.5rem;
  }
}

/* start base-3.css */

.media > *:not(.zoom, .deferred-media__poster-icon, template, .card-placeholder) {
  display: block;
  max-width: 100%;
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
}
@media (max-width: 767px) {
  .media > *:not(.zoom, .deferred-media__poster-icon, template, .card-placeholder) {
    object-fit: contain;
            object-position: center top;
  }
}


/* swiper-component */
.section-content-wrapper:has(.swiper),
.group-block:has(.product-grid--block .swiper-component-product-grid):not(.cus-scrollbar) {
  overflow: hidden;
}

.swiper {
  --swiper-navigation-sides-offset: 0;
  --swiper-navigation-size: 3.6rem;
  --swiper-navigation-top-offset: 50%;

  &.product-slider {
    --swiper-navigation-top-offset: calc(50% - 7rem);
  }

  .swiper-pagination {
    --swiper-pagination-bullet-inactive-color: var(--pagination-color);
    --swiper-pagination-bullet-inactive-opacity: var(--opacity-100);
    --swiper-pagination-bullet-size: 1rem;
    --swiper-pagination-color: var(--pagination-active-color);
    --swiper-pagination-bullet-horizontal-gap: 0.7rem;
  }

  .swiper-pagination-fraction {
    --swiper-pagination-fraction-color: var(--pagination-color);
  }
}

.swiper:not(.swiper-initialized) {
  .swiper-btns-wrap {
    opacity: 0;
  }
}

.swiper:not(.swiper-initialized) .grid-layout-no-js {
  --card-grid-per-row: var(--card-grid-per-row-init, var(--card-grid-per-row-mobile));
  overflow-x: hidden;
  overflow-y: hidden;
  scroll-snap-type: x mandatory;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: thin;
}
.swiper:not(.swiper-initialized) .grid-layout-no-js::-webkit-scrollbar {
  height: 8px;
}
.swiper:not(.swiper-initialized) .grid-layout-no-js > .swiper-slide {
  scroll-snap-align: center;
}
.swiper:not(.swiper-initialized) .grid-layout-no-js > .swiper-slide:last-child {
  margin-right: 0;
}
@media screen and (min-width: 750px) {
  .swiper:not(.swiper-initialized) .grid-layout-no-js {
    --card-grid-per-row: var(--card-grid-per-row-init, var(--card-grid-per-row-tablet));
  }
}
@media screen and (min-width: 1025px) {
  .swiper:not(.swiper-initialized) .grid-layout-no-js {
    --card-grid-per-row: var(--card-grid-per-row-init, var(--card-grid-per-row-tablet));
  }
}
@media screen and (min-width: 1400px) {
  .swiper:not(.swiper-initialized) .grid-layout-no-js {
    --card-grid-per-row: var(--card-grid-per-row-init, var(--card-grid-per-row-desktop));
  }
}
.swiper:not(.swiper-initialized) .swiper-wrapper.grid-layout--1 .swiper-slide:not(:first-child) {
  display: none;
}

.swiper.swiper-initialized .swiper-wrapper.grid-layout {
  display: flex;
}

ul.swiper-wrapper {
  margin: 0;
  padding: 0;
  list-style: none;
}

.swiper-pagination--outlined {
  .swiper-pagination-bullet {
    --outline: var(--swiper-pagination-bullet-inactive-color);
    border: 1px solid var(--outline);
    &:not(.swiper-pagination-bullet-active) {
      background: transparent;
    }
  }

  .swiper-pagination-bullet-active {
    --outline: var(--swiper-pagination-color);
  }
}

.section--page-width .swiper:has(.swiper-button) {
  --swiper-navigation-sides-offset: calc(var(--button-width) * -0.5);
  padding-inline: calc(var(--swiper-navigation-sides-offset) * -1);
  margin-inline: var(--swiper-navigation-sides-offset);

  .swiper-button {
    --swiper-navigation-sides-offset: 0.1rem;
  }
}

.swiper-button {
  border-radius: var(--arrow-radius);
  transition: opacity var(--animation-speed-slow) var(--cubic-fast),
    transform var(--animation-speed-slow) var(--cubic-fast);

  &.swiper-button-prev,
  &.swiper-button-next {
    --button-width: max(3.6rem, calc(var(--arrow-width) * 0.5));
    --button-height: max(3.6rem, calc(var(--arrow-height) * 0.5));
    --button-icon-size: max(1.2rem, calc(var(--arrow-icon-size) * 0.5));
    --swiper-navigation-size: var(--button-height);
    color: var(--arrow-color);
    background-color: var(--arrow-background);
    border: var(--arrow-border-thickness) solid var(--arrow-border);
    width: var(--button-width);
    height: var(--button-height);

    /* .section--full-width & {
      --swiper-navigation-sides-offset: 2rem;
    } */

    &.swiper-button-disabled {
      opacity: var(--opacity-0);
    }

    &:active {
      transform: scale(0.9);
    }

    @media screen and (min-width: 750px) {
      --button-width: max(4rem, calc(var(--arrow-width) * 0.75));
      --button-height: max(4rem, calc(var(--arrow-height) * 0.75));
      --button-icon-size: max(1.4rem, calc(var(--arrow-icon-size) * 0.75));
    }

    @media screen and (min-width: 1280px) {
      --button-width: var(--arrow-width);
      --button-height: var(--arrow-height);
      --button-icon-size: var(--arrow-icon-size);
    }
  }

  .svg-wrapper {
    width: auto;
    height: auto;
  }

  .icon {
    width: var(--button-icon-size);
  }

  @media screen and (min-width: 1025px) {
    opacity: var(--opacity-0);
    &.swiper-button-prev {
      transform: translateX(0.5rem);
    }

    &.swiper-button-next {
      transform: translateX(-0.5rem);
    }

    .swiper:hover & {
      &:not(.swiper-button-disabled) {
        opacity: var(--opacity-100);
      }

      &.swiper-button-prev,
      &.swiper-button-next {
        transform: translateX(0);
      }

      &:active {
        transform: translateX(0) scale(0.9);
      }
    }
  }
}


/* swiper buttons position */
.swiper:has(.swiper-pagination-progressbar) .swiper-btns-wrap--inside{
  position: absolute;
}

.swiper-btns-wrap--inside {
  width: 100%;
}

.swiper-btns-wrap--bottom {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: var(--gap-lg);
}

.swiper:has(.swiper-pagination.swiper-pagination-progressbar) .swiper-btns-wrap--bottom {
  margin-top: 1rem;
}

.swiper-pagination-progressbar + .swiper-btns-wrap--bottom {
  margin-top: calc(var(--margin-6xl) * 0.5);
}

.swiper-btns-wrap--bottom .swiper-button {
  position: relative;
  left: 0;
  margin: 0;
  transform: none;
  opacity: var(--opacity-100);

  &.swiper-button-disabled {
    opacity: var(--opacity-50);
  }
}

/* spacing-style */
.spacing-style,
.inherit-spacing {
  padding-block: calc(
      (var(--padding-block-start) * var(--spacing-scale)) + var(--section-top-offset, 0px)
    )
    calc(var(--padding-block-end) * var(--spacing-scale));
  padding-inline: calc(var(--padding-inline-start) * var(--spacing-scale)) calc(var(--padding-inline-end) * var(--spacing-scale));
  margin-block: calc(var(--margin-block-start) * var(--spacing-scale)) calc(var(--margin-block-end) * var(--spacing-scale));
  margin-inline: calc(var(--margin-inline-start) * var(--spacing-scale)) calc(var(--margin-inline-end) * var(--spacing-scale));

  @media (max-width: 749px) {
    padding-block: calc(
        var(--padding-block-start-mobile, calc(var(--padding-block-start) * var(--spacing-scale))) +
          var(--section-top-offset, 0px)
      )
      var(--padding-block-end-mobile, calc(var(--padding-block-end) * var(--spacing-scale)));
    padding-inline: var(
        --padding-inline-start-mobile,
        calc(var(--padding-inline-start) * var(--spacing-scale))
      )
      var(--padding-inline-end-mobile, calc(var(--padding-inline-end) * var(--spacing-scale)));
    margin-block: var(--margin-block-start-mobile, calc(var(--margin-block-start) * var(--spacing-scale)))
      var(--margin-block-end-mobile, calc(var(--margin-block-end) * var(--spacing-scale)));
    margin-inline: var(--margin-inline-start-mobile, calc(var(--margin-inline-start) * var(--spacing-scale)))
      var(--margin-inline-end-mobile, calc(var(--margin-inline-end) * var(--spacing-scale)));
  }
}

/* Base text and heading styles */
.paragraph:not(.button, .button-secondary),
.paragraph:not(.button, .button-secondary) > * {
  font-family: var(--font-body--family);
  font-style: var(--font-body--style);
  font-weight: var(--font-body--weight);
  font-size: var(--font-body--size);
  line-height: var(--font-body--line-height);
  text-transform: var(--font-body--case);
  -webkit-font-smoothing: antialiased;
  color: var(--color, var(--color-foreground));
}

.paragraph > small {
  font-size: smaller;
}

.body-xxs-font-size,
.body-l-font-size,
.body-s-font-size,
.body-xxs-font-size {
  line-height: var(--line-height--body-normal);
}

.body-3xl-font-size,
.body-2xl-font-size,
.body-xl-font-size,
.body-m-font-size,
.body-xs-font-size {
  line-height: var(--line-height--body-medium);
}

h1,
h2,
h3,
h4,
h5,
h6,
.h0,
.h1,
.h2,
.h3,
.h4,
.h5,
.h6 {
  color: var(--color, var(--color-foreground-heading));
}

h1,
.h1,
.text-block.h1 > * {
  font-size: var(--font-size--h1);
  letter-spacing: var(--font-h1--letter-spacing);
  text-transform: var(--font-h1--case);
  line-height: var(--font-h1--line-height);
}

h2,
.h2,
.text-block.h2 > * {
  font-size: var(--font-size--h2);
  letter-spacing: var(--font-h2--letter-spacing);
  text-transform: var(--font-h2--case);
  line-height: var(--font-h2--line-height);
}

h3,
.h3,
.text-block.h3 > * {
  font-size: var(--font-size--h3);
  letter-spacing: var(--font-h3--letter-spacing);
  text-transform: var(--font-h3--case);
  line-height: var(--font-h3--line-height);
}

h4,
.h4,
.text-block.h4 > * {
  font-size: var(--font-size--h4);
  letter-spacing: var(--font-h4--letter-spacing);
  text-transform: var(--font-h4--case);
  line-height: var(--font-h4--line-height);
}

h5,
.h5,
.text-block.h5 > * {
  font-size: var(--font-size--h5);
  letter-spacing: var(--font-h5--letter-spacing);
  text-transform: var(--font-h5--case);
  line-height: var(--font-h5--line-height);
}

h6,
.h6,
.text-block.h6 > * {
  font-size: var(--font-size--h6);
  letter-spacing: var(--font-h6--letter-spacing);
  text-transform: var(--font-h6--case);
  line-height: var(--font-h6--line-height);
}

/* Custom Typography style */
.custom-typography,
.custom-typography > *,
.custom-typography.heading-border--solid .text > * {
  font-family: var(--font-family);
  font-weight: var(--font-weight);
  text-transform: var(--text-transform);
  text-wrap: var(--text-wrap);
  line-height: var(--line-height);
  letter-spacing: var(--letter-spacing);
}

.custom-font-size,
.custom-font-size > *,
.custom-font-size.heading-border--solid .text > * {
  font-size: var(--font-size);
}

.custom-font-weight,
.custom-font-weight > *,
.custom-font-weight.heading-border--solid .text > * {
  font-weight: var(--weight);
}

/* Border override style */
.border-style {
  border-width: var(--border-width);
  border-style: var(--border-style);
  border-color: var(--border-color);
  border-radius: var(--border-radius);
}

/* box-shadow-style */
.shadow-style {
  box-shadow: var(--shadow-horizontal-offset) var(--shadow-vertical-offset)
    var(--shadow-blur) var(--shadow-spread-radius, 0px) var(--color-shadow);
}

.top-shadow:before {
  content: '';
  box-shadow: 0 0 10px var(--color-shadow);
  position: absolute;
  z-index: var(--layer-lowest);
  inset: 0;
  clip-path: inset(-50px 0 0 0);
}

@media (min-width: 750px) {
  .top-shadow--mobile::before {
    display: none;
  }
}

.bottom-shadow::before {
  content: '';
  box-shadow: 0 0 10px var(--color-shadow);
  position: absolute;
  z-index: var(--layer-lowest);
  inset: 0;
  clip-path: inset(0 0 -50px 0);
}

@media (min-width: 750px) {
  .bottom-shadow--mobile::before {
    display: none;
  }
}

/* Display Srollbar */
.disable-srollbar::-webkit-scrollbar {
  display: none;
}

.disable-srollbar::-webkit-scrollbar-track {
  display: none;
}

.disable-srollbar::-webkit-scrollbar-thumb {
  display: none;
}

@media (hover: hover) {
  .disable-srollbar::-webkit-scrollbar-thumb:hover {
    display: none;
  }
}

/* Base group-block */
.group-block,
.group-block-content {
  position: relative;
}

.group-block:has(> video-background-component),
.group-block:has(> .background-image-container) {
  overflow: hidden;
}

.group-block-content {
  height: 100%;
  width: 100%;
}

/* Appearance */
.background-image-container {
  overflow: hidden;
  position: absolute;
  inset: 0;
  opacity: var(--image-opacity);
}

.background-image-container img,
.background-image-container svg {
  object-fit: cover;
  width: 100%;
  height: 100%;
}

.background-image-fit img,
.background-image-fit svg {
  object-fit: contain;
}

.group-block--content-overlay {
  position: relative;
  isolation: isolate;
  > .group-block__media-wrapper
    :is(.background-image-container, .video-background) {
    position: relative;
    aspect-ratio: var(--ratio, 1);
    display: block;
  }

  > .group-block-content {
    position: absolute;
    z-index: var(--layer-flat);
    top: 0;
    left: 0;
  }
}

/* Base styles */
.group-block:has(> video-background-component),
.group-block:has(> .background-image-container) {
  overflow: hidden;
}

.group-block--height-fit {
  height: auto;
}

.group-block--height-custom,
.group-block--height-fill {
  height: var(--size-style-height);
}

.layout-panel-flex--column > .group-block--height-fit {
  flex: 0 1 auto;
}

.layout-panel-flex--column > .group-block--height-fill {
  flex: 1;
}

.layout-panel-flex--column > .group-block--height-custom {
  flex-basis: var(--size-style-height);
}

/* Element hover effect */
:root {
  --hover-lift-amount: 4px;
  --hover-scale-amount: 1.03;
  --hover-subtle-zoom-amount: 1.05;
  --hover-clip-path: inset(2% 2% 2% 2%);
  --hover-shadow-color: var(--color-shadow);
  --hover-transition-duration: 0.25s;
  --hover-transition-timing: var(--ease-out-smooth);
}
@media (prefers-reduced-motion: no-preference) {
  .card-hover--scale .group-block > .group-block__media-wrapper .background-image-container:has(> img),
  .card-hover--scale .product-card-wrapper .card .card__media,
  .card-hover--lift .product-card-wrapper .card,
  .card-hover--lift  .group-block > .group-block__media-wrapper .background-image-container:has(> img) {
    transition: transform var(--hover-transition-duration)
      var(--hover-transition-timing);
  }

  .card-hover--clip-inset .group-block .group-block-content > .image-block:has(> img),
  .card-hover--clip-inset .product-card-wrapper .card .card__media,
  .card-hover--clip-inset .group-block .background-image-container:has(> img) {
    clip-path: inset(0);
    transition: clip-path var(--hover-transition-duration)
      var(--hover-transition-timing);
  }

  .card-hover--clip-inset .group-block  > .group-block-content  > .image-block  > img,
  .card-hover--clip-inset .product-card-wrapper .card .card__media img,
  .card-hover--clip-inset .group-block > .group-block__media-wrapper .background-image-container > img {
    transition: transform var(--hover-transition-duration)
      var(--hover-transition-timing);
  }
}

@media (prefers-reduced-motion: no-preference) and (hover: hover) {
  .card-hover--lift .header .product-card-wrapper .card,
  .card-hover--scale .product-card-wrapper .card {
    transition: transform var(--hover-transition-duration) var(--hover-transition-timing);
  }

  .card-hover--lift .group-block:hover > .group-block__media-wrapper .background-image-container:has(> img),
  .card-hover--lift .product-card-wrapper .card:hover,
  .card-hover--lift .collection-card:hover,
  .card-hover--lift .resource-card:hover,
  .card-hover--lift .predictive-search-results__card:hover {
    transform: translateY(calc(-1 * var(--hover-lift-amount)));
  }

  .card-hover--lift .header .product-card-wrapper .card:hover,
  .card-hover--lift .header .collection-card:hover,
  .card-hover--lift .header .resource-card:hover,
  .card-hover--lift .header-drawer .product-card-wrapper .card:hover,
  .card-hover--lift .header-drawer .collection-card:hover,
  .card-hover--lift .header-drawer .resource-card:hover {
    transform: none;
  }

  .card-hover--scale .group-block:hover .background-image-container,
  .card-hover--scale .product-card-wrapper .card:hover,
  .card-hover--scale .collection-card:hover,
  .card-hover--scale .resource-card:hover,
  .card-hover--scale .predictive-search-results__card:hover {
    transform: scale(var(--hover-scale-amount));
  }

  .card-hover--scale .header .product-card-wrapper .card:hover,
  .card-hover--scale .header .collection-card:hover,
  .card-hover--scale .header .resource-card:hover,
  .card-hover--scale .header-drawer .product-card-wrapper .card:hover,
  .card-hover--scale .header-drawer .collection-card:hover,
  .card-hover--scale .header-drawer .resource-card:hover {
    transform: none;
  }

  .card-hover--subtle-zoom .group-block__media-wrapper:has(animate-image) {
    overflow: hidden;
  }

  .card-hover--subtle-zoom .group-block__media-wrapper:has(animate-image) .background-image-container,
  .card-hover--subtle-zoom .background-image-container img:not(.parallax-image),
  .card-hover--subtle-zoom .card-gallery,
  .card-hover--subtle-zoom .collection-card__image img,
  .card-hover--subtle-zoom .card__media,
  .card-hover--subtle-zoom .resource-card__image {
    overflow: hidden;
    transition: transform var(--hover-transition-duration) var(--hover-transition-timing);
  }

  .predictive-search-results__card .card-gallery,
  .predictive-search-results__card .collection-card__image img,
  .predictive-search-results__card .card__media,
  .predictive-search-results__card .resource-card__image {
    transition: none;
  }

  .card-hover--subtle-zoom .group-block:hover .group-block__media-wrapper:has(animate-image) .background-image-container,
  .card-hover--subtle-zoom .group-block:hover .background-image-container img,
  .card-hover--subtle-zoom .product-card-wrapper .card:hover .card-gallery,
  .card-hover--subtle-zoom .collection-card:hover .collection-card__image img,
  .card-hover--subtle-zoom .product-card-wrapper .card:hover .card__media,
  .card-hover--subtle-zoom .resource-card:hover .resource-card__image,
  .card-hover--subtle-zoom .predictive-search-results__card:hover {
    transform: scale(var(--hover-subtle-zoom-amount));
  }

  .card-hover--subtle-zoom .header .product-card-wrapper .card:hover .card-gallery,
  .card-hover--subtle-zoom .header .collection-card:hover .collection-card__image img,
  .card-hover--subtle-zoom .product-card-wrapper .card:hover .card__media,
  .card-hover--subtle-zoom .header .product-card-wrapper .card:hover .card__media,
  .card-hover--subtle-zoom .header .resource-card:hover .resource-card__image,
  .card-hover--subtle-zoom .header-drawer .product-card-wrapper .card:hover .card-gallery,
  .card-hover--subtle-zoom .header-drawer .collection-card:hover .collection-card__image img,
  .card-hover--subtle-zoom .product-card-wrapper .card:hover .card__media,
  .card-hover--subtle-zoom .header-drawer .product-card-wrapper .card:hover .card__media,
  .card-hover--subtle-zoom .header-drawer .resource-card:hover .resource-card__image {
    transform: none;
  }

  .card-hover--clip-inset .group-block:hover > .group-block-content > .image-block:has(> img),
  .card-hover--clip-inset .group-block:hover > .group-block__media-wrapper .background-image-container:has(> img),
  .card-hover--clip-inset .product-card-wrapper .card:hover .card__media {
    clip-path: var(--hover-clip-path);
  }

  .card-hover--clip-inset .product-card-wrapper .card:hover .card__media img,
  .card-hover--clip-inset .group-block:hover > .group-block-content > .image-block > img,
  .card-hover--clip-inset .group-block:hover > .group-block__media-wrapper .background-image-container > img {
    transform: scale(var(--hover-scale-amount));
  }
}

/* gap utility */
.gap-2xs {
  gap: var(--gap-2xs);
}
.gap-xs {
  gap: var(--gap-xs);
}
.gap-sm {
  gap: var(--gap-sm);
}
.gap-md {
  gap: var(--gap-md);
}
.gap-lg {
  gap: var(--gap-lg);
}
.gap-xl {
  gap: var(--gap-xl);
}
.gap-2xl {
  gap: var(--gap-2xl);
}
.gap-3xl {
  gap: var(--gap-3xl);
}
.gap-4xl {
  gap: var(--gap-4xl);
}

/* gap style small device */

@media screen and (max-width: 749px) {
  .gap-style,
  .layout-panel-flex {
    --gap-scale: var(--spacing-scale-sm);
  }
}
/* spacing style small device */
@media screen and (max-width: 1024px) {
  .spacing-style,
  .inherit-spacing {
    --spacing-scale: var(--spacing-scale-md);
  }
}

/* spacing style small device */
@media screen and (max-width: 749px) {
  .spacing-style,
  .inherit-spacing {
    --spacing-scale: var(--spacing-scale-sm);
  }
}

/* video block */
.deferred-media__poster-button {
  width: 100%;
  height: 100%;
}

.deferred-media[loaded="true"] .deferred-media__poster-button .icon-play {
  display: none;
}

deferred-media iframe {
  width: 100%;
  height: 100%;
  border: none;
  aspect-ratio: var(--size-style-aspect-ratio, auto);
}

deferred-media[class]
  :is(
    .deferred-media__poster-button img,
    .deferred-media__poster-button ~ video
  ) {
  object-fit: cover;
  height: 100%;
  aspect-ratio: var(--size-style-aspect-ratio, auto);
}

product-model model-viewer,
:is(deferred-media, product-model) > .deferred-media__poster-button ~ *:not(template) {
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
  padding: inherit;
}

.video-placeholder-wrapper {
  position: relative;
  width: 100%;
  height: 100%;
  aspect-ratio: var(--size-style-aspect-ratio, auto);
}

:not(deferred-media) > .video-placeholder-wrapper {
  width: var(--video-placeholder-width);
}

.video-placeholder-wrapper > * {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

.deferred-media__poster-icon,
.video-placeholder-wrapper__poster-icon {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  border-radius: var(--style-border-radius-50);
  display: flex;
  align-items: center;
  justify-content: center;
}

.deferred-media__poster-icon svg,
.video-placeholder-wrapper__poster-icon svg {
  width: var(--button-size);
  height: var(--button-size);
  color: var(--color-white);
  filter: drop-shadow(var(--shadow-button));

  @media (hover: hover) {
    &:hover {
      color: rgba(var(--color-white-rgb) / var(--opacity-80));
    }
  }

  @media screen and (min-width: 750px) {
    width: var(--size-40);
    height: var(--size-40);
  }
}

/* summary base */
summary {
  padding-block: var(--padding-sm);
}

/* subheading font */
.subheading {
  font-family: var(--font-subheading--family);
  font-style: var(--font-subheading--style);
  font-weight: var(--font-subheading--weight);
}

.hide-scrollbar::-webkit-scrollbar {
  display: none;
}

/* hide scorllbar on mobile */
@media screen and (max-width: 749px) {
  .hide-scrollbar-mobile {
    overflow-x: auto;
    -ms-overflow-style: none;
    flex-wrap: nowrap;

    &::-webkit-scrollbar {
      display: none;
    }
  }

  .hide-scrollbar-mobile > * {
    flex-shrink: 0;
  }
}

/* splitting text */
[data-splitting-target] {
  display: inline-block;
}

[data-splitting-target].splitting .word,
[data-splitting-target].splitting .char {
  display: inline-flex;
}

/* checkbox input */
.checkbox {
  --checkbox-size: var(--size-22);
  --checkbox-top: 50%;
  --checkbox-left: 1.5px;
  --checkbox-offset: 3px;
  --checkbox-border-radius: clamp(0px, var(--inputs-radius), 10px);
  --checkbox-label-padding: 8px;
  --checkbox-path-opacity: 0;
  --checkbox-cursor: pointer;
  --checkbox-border: 1px solid
    rgb(var(--color-foreground-rgb) / var(--opacity-35-55));

  position: relative;
  display: flex;
  align-items: center;

  @media screen and (min-width: 750px) {
    --checkbox-size: 16px;
    --checkbox-label-padding: 6px;
  }

  &:has(.checkbox__input:checked) {
    --checkbox-path-opacity: 1;
  }

  &:has(.checkbox__input:disabled) {
    --checkbox-cursor: not-allowed;
  }
}

.checkbox__input {
  position: absolute;
  opacity: var(--opacity-0);
  margin: 0;
  width: var(--checkbox-size);
  height: var(--checkbox-size);

  &:focus-visible {
    outline: none;
  }

  &:focus-visible + .checkbox__label .icon-checkmark {
    outline: var(--focus-outline-width) solid currentcolor;
    outline-offset: var(--focus-outline-offset);
  }

  &:checked + .checkbox__label .icon-checkmark {
    background-color: var(--color-foreground);
    border-color: var(--color-foreground);
  }

  &:disabled + .checkbox__label .icon-checkmark {
    background-color: var(--input-disabled-background-color);
    border-color: var(--input-disabled-border-color);
  }
}

.checkbox__label {
  position: relative;
  display: inline-flex;
  cursor: var(--checkbox-cursor);
  line-height: var(--checkbox-size);
  min-width: var(--minimum-touch-target);
}

.checkbox .icon-checkmark {
  height: var(--checkbox-size);
  width: var(--checkbox-size);
  flex-shrink: 0;
  border: var(--checkbox-border);
  border-radius: var(--checkbox-border-radius);
  background: var(--color-background);
}

.checkbox__label-text {
  padding-inline-start: var(--checkbox-label-padding);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;

  a {
    color: var(--color-primary);
    text-decoration: underline;
    text-underline-offset: 0.2em;
    text-decoration-thickness: 0.1em;
  }

  &.agree-condition-checkbox {
    white-space: normal;
    overflow: visible;
    text-overflow: clip;

    side-drawer-opener {
      display: inline-block;
    }

    button {
      color: var(--color-primary);
      text-decoration: underline;
      text-underline-offset: 0.2em;
      text-decoration-thickness: 0.1em;
      text-transform: none;
    }
  }
}

.checkbox .icon-checkmark path {
  stroke: var(--color-background);
  opacity: var(--checkbox-path-opacity);
  transition: opacity var(--animation-speed) var(--animation-easing);
}

.checkbox__input:disabled + .checkbox__label {
  color: var(--input-disabled-text-color);
}

/* product grid */
@media screen and (min-width: 750px) {
  .product-grid {
    grid-template-columns: var(--product-grid-columns-desktop);
  }
}

/* grid base */

.grid-base {
  --centered-column-number: 12;
  --full-width-column-number: 14;
  --centered: column-1 / span var(--centered-column-number);
  --full-width: column-0 / span var(--full-width-column-number);

  display: flex;
  flex-direction: column;
}

@media screen and (min-width: 750px) {
  .grid-base {
    display: grid;
    gap: 0;
    grid-template-columns:
      var(--margin-4xl) repeat(var(--centered-column-number), minmax(0, 1fr))
      var(--margin-4xl);
    grid-template-areas: "column-0 column-1 column-2 column-3 column-4 column-5 column-6 column-7 column-8 column-9 column-10 column-11 column-12 column-13";
  }
}

@media screen and (min-width: 1400px) {
  .grid-base {
    grid-template-columns:
      1fr repeat(
        var(--centered-column-number),
        minmax(
          0,
          calc(
            (var(--page-width) - var(--page-margin) * 2) /
              var(--centered-column-number)
          )
        )
      )
      1fr;
  }
}

/* summary */
@media screen and (min-width: 750px) {
  .facets .disclosure-has-popup[open] > summary + * {
    z-index: var(--layer-raised);
    opacity: var(--opacity-100);
    visibility: visible;
  }

  .facets .disclosure-has-popup[open="false"] > summary + * {
    opacity: var(--opacity-0);
    visibility: hidden;
  }
}

/* details--dropdown */

/* bubble */
.bubble {
  display: inline-flex;
  height: calc(var(--variant-picker-swatch-height) / 1.5);
  font-size: var(--font-size--xs);
  border-radius: 20px;
  min-width: var(--size-20);
  padding: 0 6px;
  background-color: rgb(from var(--color-foreground) r g b / 10%);
  color: var(--color-foreground);
  align-items: center;
  justify-content: center;
}
/* drawer */
.drawer__container:not(.blog-posts__sidebar-drawer) {
  [data-drawer-content] {
    width: min(calc(100% - var(--minimum-touch-target)), var(--drawer-max-width,var(--narrow-content-width)));
    height: 100%;
    background-color: var(--color-background);
    z-index: var(--layer-raised);
    position: relative;
  }

  &[data-drawer-direction="right"] [data-drawer-content] {
    margin-inline-start: auto;
  }

  &:not(.drawer--menu)[data-drawer-direction="left"] .drawer__close {
    right: calc(var(--minimum-touch-target) * -1);
  }

  &:not(.drawer--menu)[data-drawer-direction="right"] .drawer__close {
    left: calc(var(--minimum-touch-target) * -1);
  }

  @media screen and (max-width: 1024px) {
    &[data-mobile-drawer-direction="left"] [data-drawer-content] {
      margin-inline-end: auto;
      margin-inline-start: 0;
    }

    &[data-mobile-drawer-direction="right"] [data-drawer-content] {
      margin-inline-start: auto;
      margin-inline-end: 0;
    }
  }
}

@media screen and (min-width: 1025px) {
  .drawer__overlay:empty.lg\:none {
    display: none;
  }
}

/* swiper vertical */
.swiper-vertical .swiper-btns-wrap:not(:has(.swiper-button)),
.swiper-vertical .swiper-btns-wrap.center_vert {
  position: absolute;
  right: var(--swiper-pagination-right, 6rem);
  left: var(--swiper-pagination-left, auto);
  top: 50%;
  transform: translate3d(0px, -50%, 0);
  z-index: var(--layer-flat);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--gap-2xl);

  .swiper-button-prev,
  .swiper-button-next,
  .swiper-pagination {
    position: relative;
    transform: none;
    margin: 0;
    top: unset;
    right: unset;
    left: unset;
    bottom: unset;
  }

  .swiper-pagination {
    --swiper-pagination-bullet-vertical-gap: 1.3rem;
    order: 1;
  }

  .swiper-button-prev .icon-arrow {
    transform: rotate(-90deg);
  }

  .swiper-button-next {
    order: 2;
    .icon-arrow {
      transform: rotate(90deg);
    }
  }
}

.swiper-vertical
  .swiper-pagination-vertical.swiper-pagination-bullets.swiper-pagination-bullets-dynamic {
  width: var(--swiper-pagination-bullet-size);
}

.swiper .swiper-pagination-progressbar {
  position: relative;
  margin-top: 4rem;
}

.swiper:has(.swiper-pagination.swiper-pagination-progressbar) {
  padding-bottom: 0;
}

.swiper-vertical
  .swiper-btns-wrap:not(:has(.swiper-button)):has(
    .swiper-pagination-progressbar
  ) {
  --swiper-pagination-right: 0;
  height: 100%;

  .swiper-pagination {
    height: 100%;
    width: var(--swiper-pagination-progressbar-size, 4px);
  }
}

/* Blog post tags */
.tag-item .link {
  display: inline-flex;
  align-items: center;
  gap: var(--margin-md);
  padding: var(--padding-sm) var(--padding-md);
  background: rgba(var(--color-foreground-rgb) / 0.03);
  transition: background-color var(--animation-speed) var(--ease-out-smooth),
    box-shadow var(--animation-speed) var(--ease-out-smooth);
  border-radius: var(--style-border-radius-sm);

  @media (hover: hover) {
    &:hover {
      background: transparent;
      box-shadow: rgba(var(--color-shadow-rgb) / 0.1) 2px 4px 5.2px 0;
    }
  }

  .svg-wrapper {
    width: var(--size-15);
    height: var(--size-15);
  }
}

/* field */
.field:after {
  box-shadow: 0 0 0 var(--inputs-border-width) var(--color-input-border);
  inset: 0;
}
.field__label.field__label--static {
  position: static;
  pointer-events: visible;
  margin-bottom: var(--margin-sm);
}

.field:has(.field__label--static) {
  flex-direction: column;
  padding-inline: var(--padding-3xs);
  &::before,
  &::after {
    display: none;
  }

  :is(.field__input, input):not(:focus) {
    box-shadow: 0 0 0 calc(0.1rem + var(--inputs-border-width))
      rgba(var(--color-foreground-rgb) / 0.2);
    outline: 0;
  }
}

/* field checkbox */
.field__checkbox {
  align-items: center;
  gap: var(--margin-md);

  input[type="checkbox"] {
    position: absolute;
    opacity: var(--opacity-100);
    width: var(--size-16);
    height: var(--size-16);
    top: 0.7rem;
    left: -0.4rem;
    z-index: var(--layer-lowest);
    appearance: none;
    -webkit-appearance: none;
  }

  > svg,
  > .svg-wrapper {
    background: var(--color-background);
    flex-shrink: 0;
  }

  .svg-wrapper {
    visibility: hidden;
    position: absolute;
    left: 0.3rem;
    z-index: 5;
    top: 0.4rem;
    width: 1.1rem;
    height: 0.7rem;
  }

  > input[type="checkbox"]:checked ~ .svg-wrapper > .icon-checkmark {
    visibility: visible;
  }
}

/* Button drawer */
.button--drawer {
  padding: 0;
  cursor: pointer;
  -webkit-appearance: none;
  appearance: none;
  background-color: unset;
  border: none;
  color: currentColor;
  background-color: transparent;
}

@media (min-width: 750px) and (max-width: 1024px) {
  .layout-panel-flex.tablet-layout-panel-flex--row,
  .layout-panel-flex.tablet-layout-panel-flex--column {
    align-items: var(--horizontal-alignment-tablet);
    justify-content: var(--vertical-alignment-tablet);
  }

  .layout-panel-flex.tablet-layout-panel-flex--row {
    flex-flow: row var(--flex-wrap);
  }

  .layout-panel-flex.tablet-layout-panel-flex--column {
    flex-flow: column var(--flex-wrap);
  }
}

/* Social icons effect */
.social__item--effect {
  position: relative;
  overflow: hidden;
  svg {
    transition: opacity var(--animation-speed-slow) var(--ease-out-smooth),
      transform var(--animation-speed-slow) var(--ease-out-smooth);
  }
  svg:first-child {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    transform: translateY(100%);
  }

  @media (hover: hover) {
      &:hover {
      svg:first-child {
        opacity: 1;
        transform: translateY(0);
      }

      svg:last-child {
        opacity: 0;
        transform: translateY(-100%);
      }
    }
  }
}

/* popup */
.popup__close {
  position: absolute;
  top: 2rem;
  right: 2rem;
  z-index: var(--layer-raised);
  width: var(--size-32);
  height: var(--size-32);
  color: var(--color-foreground);
  background-color: transparent;
  border: none;
  padding: 0.6rem;
  cursor: pointer;
  border-radius: 50%;
}

/* disabled */
.disabled {
  opacity: var(--opacity-50);
  cursor: not-allowed;

  button {
    cursor: not-allowed;
  }
}

/* visible */
.fade {
  opacity: var(--opacity-0);
  transition: opacity var(--animation-speed-slow) var(--animation-timing-fade-in);
}
.fade--active {
  opacity: var(--opacity-100);
}

/* Icon caret */
.icon-caret svg {
  transition: transform var(--animation-speed) var(--animation-easing);
}

.icon-caret--forward svg {
  transform: rotate(-90deg);
}

.icon-caret--backward svg {
  transform: rotate(90deg);
}

.icon-caret--up svg {
  transform: rotate(180deg);
}

.icon-arrow--forward.icon-arrow,
.icon-arrow--forward:has(.icon-arrow) svg {
  transform: rotate(-180deg);
}

body:has(.header[transparent]) #header-group > .section-announcement-bar:hover {
  z-index:var(--layer-window-overlay);
}

/* Parallax background style large banner */
parallax-background {
  overflow: hidden;
}

.parallax-image {
  height: 130% !important;
}

/* end base-3.css */

/* start base-1.css */

.gap-style,
.layout-panel-flex {
  --gap-scale: var(--spacing-scale-md);

  @media screen and (min-width: 990px) {
    --gap-scale: var(--spacing-scale-default);
  }
}

.layout-panel-flex {
  display: flex;
  gap: var(--gap);
  height: 100%;
}

.layout-panel-flex--row {
  flex-flow: row var(--flex-wrap);
  justify-content: var(--horizontal-alignment);
  align-items: var(--vertical-alignment);
}

.layout-panel-flex--column {
  flex-flow: column var(--flex-wrap);
  align-items: var(--horizontal-alignment);
  justify-content: var(--vertical-alignment);
}

@media screen and (max-width: 749px) {
  .mobile-column {
    flex-flow: column nowrap;
    align-items: var(--horizontal-alignment);
    justify-content: var(--vertical-alignment-mobile);
  }

  .layout-panel-flex--row:not(.mobile-column) {
    .text-block {
      flex: 1 1 var(--max-width--display-tight);
    }

    .image-block {
      flex: 1 1 var(--size-style-width-mobile-min);
    }

    .button {
      flex: 0 0 fit-content;
    }
  }
}

@media (min-width: 750px) {
  .layout-panel-flex {
    flex-direction: var(--flex-direction);
  }
}
/* layout flex column tablet */
@media screen and (min-width: 750px) and (max-width: 1024px) {
  .tablet-column {
    flex-flow: column nowrap;
    align-items: var(--horizontal-alignment-tablet);
    justify-content: var(--vertical-alignment-tablet);
  }
}

/* Spacing style */
.spacing-style {
  --spacing-scale: var(--spacing-scale-md);

  @media screen and (min-width: 990px) {
    --spacing-scale: var(--spacing-scale-default);
  }

  --padding-block: 0px;
  --padding-block-start: var(--padding-block, 0px);
  --padding-block-end: var(--padding-block, 0px);
  --padding-inline: 0px;
  --padding-inline-start: var(--padding-inline, 0px);
  --padding-inline-end: var(--padding-inline, 0px);
  --margin-block: 0px;
  --margin-block-start: var(--margin-block, 0px);
  --margin-block-end: var(--margin-block, 0px);
  --margin-inline: 0px;
  --margin-inline-start: var(--margin-inline, 0px);
  --margin-inline-end: var(--margin-inline, 0px);

  @media screen and (max-width: 749px) {
    --padding-block-start-mobile: var(--padding-block-start, 0px);
    --padding-block-end-mobile: var(--padding-block-end, 0px);
    --padding-inline-start-mobile: var(--padding-inline-start, 0px);
    --padding-inline-end-mobile: var(--padding-inline-end, 0px);
    --margin-block-start-mobile: var(--margin-block-start, 0px);
    --margin-block-end-mobile: var(--margin-block-end, 0px);
    --margin-inline-start-mobile: var(--margin-inline-start, 0px);
    --margin-inline-end-mobile: var(--margin-inline-end, 0px);
  }
}

/* Size style */
.size-style {
  width: var(--size-style-width-mobile, var(--size-style-width));
  height: var(--size-style-height-mobile, var(--size-style-height));

  @media screen and (min-width: 750px) and (max-width: 1024px) {
    width: var(--size-style-width-tablet, var(--size-style-width));
    height: var(--size-style-height-tablet, var(--size-style-height));
  }

  @media screen and (min-width: 1025px) {
    width: var(--size-style-width);
    height: var(--size-style-height);
  }
}

.section {
  --full-page-grid-central-column-width: min(
    var(--page-width) - var(--page-margin) * 2,
    calc(100% - var(--page-margin) * 2)
  );
  --full-page-grid-margin: minmax(var(--page-margin), 1fr);
  --full-page-grid-with-margins: var(--full-page-grid-margin) var(--full-page-grid-central-column-width)
    var(--full-page-grid-margin);

  --util-page-margin-offset: max(
    var(--page-margin),
    calc((100% - min(var(--page-content-width), calc(100% - (var(--page-margin) * 2)))) / 2)
  );
  --full-page-margin-inline-offset: calc(((100vw - var(--scrollbar-width, 0px) - var(--full-page-grid-central-column-width)) / 2) * -1);
  width: 100%;
  position: relative;
  display: grid;
  grid-template-columns: var(--full-page-grid-with-margins);
  min-height: var(--section-min-height, 'auto');

  @media screen and (max-width: 749px){
    min-height: var(--section-min-height-mobile, var(--section-min-height));
  }
}

.section > * {
  grid-column: 2;
}

.section--page-width > * {
  grid-column: 2;
}

.section--full-width > * {
  grid-column: 1 / -1;
}

.section--page-width.section--full-width-right > * {
  grid-column: 2 / 4;
}

.section--full-width.section--full-width-margin > * {
  grid-column: 1 / -1;

  @media screen and (min-width: 750px) {
    padding-left: var(--page-margin);
    padding-right: var(--page-margin);
  }
}

.section > .force-full-width {
  grid-column: 1 / -1;
}

.section--height-small {
  --section-min-height: var(--section-height-small);
}

.section--height-medium {
  --section-min-height: var(--section-height-medium);
}

.section--height-large {
  --section-min-height: var(--section-height-large);
}

.section--height-full-screen {
  --section-min-height: 100svh;
}

.section-content-wrapper.section-content-wrapper {
  min-height: calc(var(--section-min-height, 'auto') - var(--section-height-offset, 0px));
  position: relative;
  width: 100%;
  height: 100%;
}

/* Video background */
.video-background,
.video-background * {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
}

.video-background--cover * {
  object-fit: cover;
}

.video-background--contain * {
  object-fit: contain;
}

.text-block > *:first-child,
.text-block > *:empty:first-child + * {
  margin-block-start: 0;
}

.text-block > *:last-child,
.text-block > *:has(+ *:empty:last-child) {
  margin-block-end: 0;
}

.text-block > style + * {
  margin-block-start: 0;
}

/* Accordion custom */
accordion-custom {
  details {
    &::details-content,
    .details-content {
      block-size: 0;
      overflow-y: clip;
      opacity: 0;
      interpolate-size: allow-keywords;
    }

    &:not([open]) {
      &::details-content,
      .details-content {
        padding-block: 0;
      }
    }

    &[open] {
      &::details-content,
      .details-content {
        opacity: 1;
        block-size: auto;

        @starting-style {
          block-size: 0;
          opacity: 0;
          overflow-y: clip;
        }

        &:focus-within {
          overflow-y: visible;
        }
      }
    }
  }
}

accordion-custom[data-disable-on-mobile='true'] summary {
  @media screen and (max-width: 749px) {
    cursor: auto;
  }
}

accordion-custom[data-disable-on-desktop='true'] summary {
  @media screen and (min-width: 750px) {
    cursor: auto;
  }
}

/* Links */
a {
  --button-color: var(--color, var(--color-primary));
  color: var(--button-color);
  text-decoration-color: transparent;
  text-decoration-thickness: 0.075em;
  text-underline-offset: 0.125em;
  transition: text-decoration-color var(--animation-speed) var(--animation-easing),
    color var(--animation-speed) var(--animation-easing);

  @media screen and (min-width: 1025px) {
    &:not(.button, .button-secondary):hover {
      color: var(--color-primary-hover);
    }
  }
}
@media (hover: hover) {
  :is(h1, h2, h3, h4, h5, h6, p) > a:hover {
    --button-color: var(--color, var(--color-primary-hover));
  }
}

p:not(.h1, .h2, .h3, .h4, .h5, .h6) a:where(:not(.button, .button-primary, .button-secondary)),
.rte
  :is(p, ul, ol, table):not(.h1, .h2, .h3, .h4, .h5, .h6)
  a:where(:not(.button, .button-primary, .button-secondary)) {
  text-decoration-color: currentcolor;

  @media (hover: hover) {
    &:hover {
      text-decoration-color: transparent;
      color: var(--color-primary-hover);
    }
  }
}

/* Product Media */
media-gallery {
  display: block;
  width: 100%;
}

:where(media-gallery, .product-grid__item) {
  .media-gallery__grid {
    grid-template-columns: 1fr;
    gap: var(--image-gap);
  }
}

.product-media-gallery__slideshow--single-media slideshow-container {
  @media screen and (max-width: 749px) {
    grid-area: unset;
  }
}

:not(.dialog-zoomed-gallery) > .product-media-container {
  --slide-width: round(up, 100%, 1px);

  display: flex;
  aspect-ratio: var(--gallery-aspect-ratio, var(--media-preview-ratio));
  max-height: var(--constrained-height);
  width: 100%;
  position: relative;
  overflow: hidden;

  &:where(.constrain-height) {
    --viewport-offset: 400px;
    --constrained-min-height: 300px;
    --constrained-height: max(var(--constrained-min-height), calc(100vh - var(--viewport-offset)));

    margin-right: auto;
    margin-left: auto;
  }
}

media-gallery:where(.media-gallery--grid) .media-gallery__grid {
  display: none;
}

media-gallery.media-gallery--grid .media-gallery__grid .product-media-container {
  height: 100%;
}

.product-media :is(deferred-media, product-model) {
  position: absolute;
}

@media screen and (max-width: 749px) {
  .product-media-container.constrain-height {
    max-height: none;
  }
}

@media screen and (min-width: 750px) {
  swiper-component:has(.swiper-controls__thumbnails-container[thumbnails]) {
    &:has(.swiper-controls__thumbnails-container[data-thumbnail-position='right']),
    &:has(.swiper-controls__thumbnails-container[data-thumbnail-position='left']) {
      display: flex;
      align-items: stretch;
      gap: var(--padding-2xs);
  
      .swiper-controls__thumbnails-container {
        position: absolute;
        top: 0;
        left: 0;
        z-index: 1;
        height: 100%;
  
        .swiper {
          height: 100%;
        }
      }
    }
  
    &:has(.swiper-controls__thumbnails-container[data-thumbnail-position='left']) {
      .swiper-main {
        width: 100%;
        margin-left: calc(var(--thumbnail-width, 7rem) + var(--size-10));
      }
    }
  
    &:has(.swiper-controls__thumbnails-container[data-thumbnail-position='right']) {
      .swiper-controls__thumbnails-container {
        left: auto;
        right: 0;
      }
  
      .swiper-main {
        width: 100%;
        margin-right: calc(var(--thumbnail-width, 7rem) + var(--size-10));
      }
    }
  
    .swiper-controls__thumbnails-container[data-thumbnail-position='left'] {
      order: -1;
    }
  
    [data-thumbnail-position='right'],
    [data-thumbnail-position='left'] {
      width: var(--thumbnail-width, 7rem);
    }
  
    [data-thumbnail-position='right'] {
      justify-content: flex-end;
    }
  
    [data-thumbnail-position='left'] {
      justify-content: flex-start;
    }
  }

  .product-media-container.constrain-height {
    --viewport-offset: var(--header-height, 100px);
    --constrained-min-height: 500px;
  }

  .media-gallery--two-column .media-gallery__grid {
    grid-template-columns: repeat(2, 1fr);
  }

  .media-gallery--large-first-image .product-media-container:first-child,
  .media-gallery--two-column .product-media-container:only-child {
    grid-column: span 2;
  }

  media-gallery:is(.media-gallery--grid) swiper-component {
    display: none !important;
  }

  media-gallery:where(.media-gallery--grid) .media-gallery__grid {
    display: grid !important;
  }
}

@media screen and (min-width: 1025px) {
  swiper-component:has(.swiper-controls__thumbnails-container[thumbnails]) {
    &:has(.swiper-controls__thumbnails-container[data-thumbnail-position='left']) {
      .swiper-main {
        margin-left: calc(var(--thumbnail-width, 7rem) + var(--size-30));
      }
    }

    &:has(.swiper-controls__thumbnails-container[data-thumbnail-position='right']) {
      .swiper-main {
        margin-right: calc(var(--thumbnail-width, 7rem) + var(--size-30));
      }
    }
  }
}

.product-media-container--model {
  flex-direction: column;
}

.shopify-model-viewer-ui__controls-area {
  bottom: calc(var(--minimum-touch-target) + var(--padding-sm));
}

.product-media-container img {
  aspect-ratio: inherit;
  object-fit: contain;
  object-position: center center;
}

.product-media-container.media-fit {
  --product-media-fit: cover;

  img {
    object-fit: var(--product-media-fit);
  }
}

/* Media gallery zoom dialog */
.product-media-container__zoom-button {
  position: absolute;
  width: 100%;
  height: 100%;
  z-index: var(--layer-flat);
  cursor: zoom-in;
  background-color: transparent;

  @media (hover: hover) {
    &:hover {
      background-color: transparent;
    }
  }
}

zoom-dialog dialog {
  width: 100vw;
  height: 100vh;
  border: none;
  margin: 0;
  padding: 0;
  max-width: 100%;
  max-height: 100%;
  background: var(--color-white);
  opacity: 0;
  visibility: hidden;
  transition: opacity var(--animation-speed) var(--animation-easing), visibility var(--animation-speed) linear;
  scrollbar-width: var(--scrollbar-width, 0);

  &[open] {
    opacity: 1;
    visibility: visible;
    transition-delay: var(--animation-speed), var(--animation-speed), var(--animation-speed);
  }

  @media (prefers-reduced-motion: no-preference) {
    scroll-behavior: smooth;
  }

  &::backdrop {
    background: transparent;
  }
}

.close-button {
  position: fixed;
  top: var(--margin-lg);
  right: var(--margin-lg);
  width: var(--minimum-touch-target);
  height: var(--minimum-touch-target);
  z-index: var(--layer-flat);
  background-color: transparent;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: var(--style-border-radius-50);
}

@supports not (background-color: rgb(from red 150 g b / alpha)) {
  .close-button:focus-visible {
    outline: none;
    overflow: visible;
  }

  .close-button:focus-visible::after {
    content: '';
    position: absolute;
    inset: calc(-1 * var(--focus-outline-offset));
    border: var(--focus-outline-width) solid currentColor;
    border-radius: var(--style-border-radius-50);
    display: inherit;
  }
}

.dialog--closed .close-button {
  animation: elementSlideOutBottom calc(var(--animation-speed) * 0.5) var(--animation-easing) forwards;
}

.dialog-thumbnails-list-container {
  position: fixed;
  width: 100%;
  bottom: 0;
  display: flex;
  z-index: var(--layer-raised);
}

.dialog-thumbnails-list {
  position: relative;
  display: inline-flex;
  flex-direction: row;
  gap: 8px;
  bottom: 0;
  overflow-x: auto;
  opacity: 1;
  padding: var(--padding-lg);
  margin-inline: auto;
  scrollbar-width: none;
  animation: thumbnailsSlideInBottom calc(var(--animation-speed) * 0.75) var(--animation-easing) forwards;
  animation-delay: calc(var(--animation-speed) * 1.5);
  transform: translateY(-50%);
}

.dialog--closed .dialog-thumbnails-list {
  animation: thumbnailsSlideOutBottom var(--animation-speed) var(--animation-easing) forwards;
}

@media screen and (min-width: 750px) {
  .dialog-thumbnails-list {
    position: fixed;
    flex-direction: column;
    inset: 50% var(--margin-lg) auto auto;
    right: 0;
    max-height: calc(100vh - 200px);
    overflow-y: auto;
    animation: thumbnailsSlideInTop calc(var(--animation-speed) * 0.5) var(--animation-easing) forwards;
    animation-delay: calc(var(--animation-speed) * 2);
  }

  .dialog--closed .dialog-thumbnails-list {
    animation: thumbnailsSlideOutTop var(--animation-speed) var(--animation-easing) forwards;
  }
}

.dialog-thumbnails-list__thumbnail {
  width: 48px;
  height: auto;
  transition: transform var(--animation-speed) var(--animation-easing);
  flex-shrink: 0;
  border-radius: var(--media-radius);

  img {
    height: 100%;
    object-fit: cover;
    border-radius: var(--media-radius);
    aspect-ratio: var(--aspect-ratio);
  }

  &:is([aria-selected='true']) {
    outline: var(--focus-outline-width) solid currentcolor;
    outline-offset: calc(var(--focus-outline-offset) / 2);
    border: var(--style-border-width) solid rgb(var(--color-border-rgb) / var(--media-border-opacity));
  }
}

.button.dialog-thumbnails-list__thumbnail:active {
  transform: none;
}

.close-button svg {
  width: var(--icon-size-md);
  height: var(--icon-size-md);
}

/* Product media */
.product-media {
  display: flex;
  flex: 1;
}

.product-media__image ~ * .deferred-media__poster-image {
  display: none;
}

.product-media-container:has(.deferred-media__playing) .product-media__image {
  opacity: 0;
  transition: opacity var(--animation-speed) var(--animation-easing);
}

:is(product-model, deferred-media) {
  height: 100%;
  width: 100%;
  position: relative;
}

product-model model-viewer,
:is(deferred-media, product-model) > .deferred-media__poster-button ~ *:not(template) {
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
  padding: inherit;
}

slideshow-slide .shopify-model-viewer-ui__controls-area.shopify-model-viewer-ui__controls-area {
  bottom: var(--padding-sm);
  right: var(--padding-sm);
}

.dialog-zoomed-gallery .shopify-model-viewer-ui__controls-area.shopify-model-viewer-ui__controls-area {
  bottom: var(--padding-lg);
  right: var(--padding-lg);
}

@media screen and (max-width: 749px) {
  swiper-component:has(:not(.mobile\:hidden) :is(.swiper-controls__dots, .swiper-controls__counter))
    .shopify-model-viewer-ui__controls-area {
    bottom: calc(var(--minimum-touch-target) + var(--padding-sm));
  }
}

@media screen and (min-width: 750px) {
  swiper-component:has(:not(.desktop\:hidden) :is(.swiper-controls__dots, .swiper-controls__counter))
    .shopify-model-viewer-ui__controls-area {
    bottom: calc(var(--minimum-touch-target) + var(--padding-sm));
  }

  .dialog-zoomed-gallery .shopify-model-viewer-ui__controls-area.shopify-model-viewer-ui__controls-area {
    bottom: var(--padding-lg);
    right:  var(--padding-lg);
  }
}

:is(deferred-media, .video-placeholder-wrapper).border-style {
  overflow: hidden;
}

deferred-media {
  &:has(:focus-visible) {
    outline: var(--focus-outline-width) solid currentcolor;
    outline-offset: var(--focus-outline-offset);
  }

  @supports not selector(:focus-visible) {
    &:has(:focus) {
      outline: var(--focus-outline-width) solid currentcolor;
      outline-offset: var(--focus-outline-offset);
    }
  }
}

.deferred-media__poster-button {
  width: 100%;
  height: 100%;
  aspect-ratio: var(--video-aspect-ratio, auto);
}

.deferred-media__poster-button.deferred-media__playing {
  opacity: 0;
  transition: opacity 0.3s ease;
}

deferred-media img {
  height: 100%;
  object-fit: cover;
  transition: opacity 0.3s ease;
}

deferred-media iframe {
  width: 100%;
  height: 100%;
  border: none;
  aspect-ratio: var(--size-style-aspect-ratio, auto);
}

deferred-media[data-media-loaded] img {
  opacity: 0;
}

.deferred-media__poster-icon,
.video-placeholder-wrapper__poster-icon {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  border-radius: var(--style-border-radius-50);
  display: flex;
  align-items: center;
  justify-content: center;
}

.deferred-media__poster-icon svg,
.video-placeholder-wrapper__poster-icon svg {
  width: var(--button-size);
  height: var(--button-size);
  color: var(--color-white);
  filter: drop-shadow(var(--shadow-button));

  @media (hover: hover) {
    &:hover svg {
      color: rgb(var(--color-white-rgb) / var(--opacity-80));
    }
  }

  @media screen and (min-width: 750px) {
    width: 4rem;
    height: 4rem;
  }
}

deferred-media[class] :is(.deferred-media__poster-button img, .deferred-media__poster-button ~ video) {
  object-fit: cover;
  height: 100%;
  aspect-ratio: var(--size-style-aspect-ratio, auto);
}

.button-shopify-xr {
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  padding: var(--padding-md);
}

.button-shopify-xr > svg {
  width: var(--icon-size-sm);
  height: var(--icon-size-sm);
  fill: currentcolor;
  margin-inline-end: var(--margin-md);
}

.button-shopify-xr[data-shopify-xr-hidden] {
  display: none;
}

/* Add to cart button */
.button[id^='ProductSubmitButton-'] {
  width: 100%;
  position: relative;
  overflow: hidden;
}

/* Cart bubble */
.cart-bubble {
  --cart-padding: 0.2em;

  position: relative;
  width: 20px;
  aspect-ratio: 1;
  border-radius: var(--style-border-radius-50);
  border-width: 0;
  display: grid;
  line-height: normal;
  place-content: center;
  color: var(--color-primary-button-text);
  padding-inline: var(--cart-padding);
}

.cart-bubble__background {
  position: absolute;
  inset: 0;
  background-color: var(--color-primary-button-background);
  border-radius: var(--style-border-radius-50);
}

.cart-bubble__text {
  font-size: var(--font-size--2xs);
  z-index: var(--layer-flat);
  line-height: 1;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* Quantity selector */
.quantity-selector {
  --quantity-selector-width: 4.5rem;

  display: flex;
  justify-content: space-between;
  align-items: center;
  color: var(--color-input-text);
  background-color: var(--color-input-background);
  border-radius: var(--inputs-radius);
  flex: 1 1 var(--quantity-selector-width);
  align-self: stretch;
  transition: background-color var(--animation-speed) var(--animation-easing);

  @media (hover: hover) {
    &:hover {
      background-color: var(--color-input-hover-background);
    }
  }

  .quantity__button{
    position: absolute;
    z-index: 3;

    &.quantity-minus{
      left: 0;
      right: auto;
    }

    &.quantity-plus{
      right: 0;
      left: auto;
    }
  }
}

.add-to-cart-button,
.quick-add__submit {
  min-height: var(--size-45);
}

.product-form__buttons:has(.add-to-cart-button.button-secondary) .quantity-selector {
  border-radius: var(--style-border-radius-buttons-secondary);
}

.quantity-selector :is(.quantity-minus, .quantity-plus) {
  padding: var(--button-padding-vertical) 0;
  background: transparent;
  box-shadow: none;
  display: flex;
  justify-content: center;
  align-items: center;
  cursor: pointer;
  width: var(--size-45);
  height: var(--size-45);
  flex-shrink: 0;
  color: var(--color-input-text);
}

.quantity-selector .quantity-minus {
  border-start-start-radius: var(--inputs-radius);
  border-end-start-radius: var(--inputs-radius);
}

.quantity-selector .quantity-plus {
  border-start-end-radius: var(--inputs-radius);
  border-end-end-radius: var(--inputs-radius);
}

.product-details .quantity-selector .quantity-minus {
  border-start-start-radius: var(--style-border-radius-buttons-primary);
  border-end-start-radius: var(--style-border-radius-buttons-primary);
}

.product-details .quantity-selector .quantity-plus {
  border-start-end-radius: var(--style-border-radius-buttons-primary);
  border-end-end-radius: var(--style-border-radius-buttons-primary);
}

.quantity-selector .svg-wrapper {
  transition: transform var(--animation-speed) var(--animation-easing);
}

.quantity-selector svg {
  width: var(--icon-size-xs);
  height: var(--icon-size-xs);
}

:is(.quantity-minus, .quantity-plus):active .svg-wrapper {
  transform: scale(0.9);
}

.quantity-selector input[type='number'] {
  margin: 0;
  text-align: center;
  border: none;
  appearance: none;
  max-width: 100%;
  border-radius: var(--style-border-radius-buttons);
  color: var(--color-input-text);
  background-color: transparent;
}

.quantity-selector input[type='number']::-webkit-inner-spin-button,
.quantity-selector input[type='number']::-webkit-outer-spin-button {
  appearance: none;
}

.quantity-selector input[type='number'] {
  appearance: textfield;
}

.pills__pill {
  --pills-pill-background-color: rgb(var(--color-foreground-rgb) / var(--opacity-5-15));

  color: var(--color-foreground);
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: var(--gap-sm);
  min-width: 48px;
  padding: 6px 12px;
  border-radius: var(--style-border-radius-pills);
  cursor: pointer;
  background-color: var(--pills-pill-background-color);
  transition: background-color var(--animation-speed) var(--animation-easing);

  @media (hover: hover) {
    &:hover {
      --pills-pill-background-color: rgb(var(--color-foreground-rgb) / var(--opacity-10-25));
    }
  }

  @media screen and (max-width: 749px) {
    padding: var(--padding-xs) var(--padding-md);
  }
}

.pills__pill > .svg-wrapper {
  --close-icon-opacity: 0.4;
  --icon-stroke-width: 1px;

  color: var(--color-foreground);
}

.pills__pill--swatch {
  @media screen and (max-width: 749px) {
    padding-inline-start: var(--padding-sm);
  }
}

.pills__pill--swatch .swatch {
  margin-right: -4px;
}

.pills__pill--desktop-small {
  @media screen and (min-width: 750px) {
    font-size: var(--font-size--xs);
  }
}

.swiper-controls__thumbnails-container .swiper:not(.swiper-initialized) .swiper-wrapper {
  height: auto;
}

.swiper-controls__thumbnails {
  height: fit-content;

  .swiper-control {
    border-radius: var(--media-radius);
    height: auto;
    aspect-ratio: var(--aspect-ratio);

    img {
      border-radius: var(--media-radius);
    }
  }

  @media screen and (min-width: 750px) {
    &[data-thumbnail-direction="vertical"]:not(.swiper-initialized) {
      .swiper-wrapper {
        flex-direction: column;
        gap: 0.8rem;
      }
    }
  }
}

.button.swiper-controls__thumbnail:active {
  transform: none;
}

.swiper-slide-thumb-active {
  opacity: var(--opacity-30);
}

.swiper-main {
  width: 100%;
}

product-info .swiper-main .swiper-pagination-progressbar {
  width: 100%;
}

.swiper-controls__thumbnail-badge {
  position: absolute;
  top: var(--padding-2xs);
  right: var(--padding-2xs);
  width: clamp(32px, 25%, 44px);
  height: clamp(32px, 25%, 44px);
  background-color: var(--color-background);
  border-radius: var(--style-border-radius-xs);
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 0 0 1px rgb(var(--color-foreground-rgb) / var(--opacity-50));
}

.swiper-controls__thumbnail-badge svg {
  width: 60%;
  height: 60%;
  fill: var(--color-foreground);
  opacity: 0.6;
}

.color-scheme-custom {
  color: var(--color-foreground);
  background: var(--color-background);
}

.alertBox {
  display: flex;
  gap: var(--gap-sm);
  width: 100%;
  font-size: var(--font-size--sm);
  padding: var(--size-20) var(--size-17);
  border-radius: var(--inputs-radius);
}

.alertBox--success {
  color: var(--color-success-text);
  background-color: var(--color-success-background);
}

.alertBox--error {
  color: var(--color-error-text);
  background-color: var(--color-error-background);
}

.alertBox--info {
  color: var(--color-info-text);
  background-color: var(--color-info-background);
}

.alertBox--warning {
  color: var(--color-warning-text);
  background-color: var(--color-warning-background);
}

text-loader-component {
  --shimmer-text-color: rgb(var(--color-foreground-rgb) / var(--opacity-50));
  --shimmer-color-light: rgb(var(--color-foreground-rgb) / var(--opacity-10));
  --shimmer-speed: 1.25s;

  display: inline-block;
  position: relative;
  transition: color var(--animation-speed-slow) ease;
  line-height: 1;

  &::after {
    content: attr(value);
    position: absolute;
    inset: 0;
    color: transparent;
    opacity: 0;
    transition: opacity var(--animation-speed-slow) var(--animation-easing);
    pointer-events: none;
    background-image: linear-gradient(
      -85deg,
      var(--shimmer-text-color) 10%,
      var(--shimmer-color-light) 50%,
      var(--shimmer-text-color) 90%
    );
    background-clip: text;
    background-size: 200% 100%;
    background-position: 100% 0;
    place-content: center;
  }

  &[shimmer] {
    color: transparent;

    &::after {
      opacity: 1;
      animation: text-shimmer var(--shimmer-speed) infinite linear;
    }
  }
}

/* end base-1.css */

/* start base-2.css */

img {
  width: 100%;
  height: auto;
}

.section-resource-list__header {
  width: 100%;
}

.section-resource-list__content {
  display: flex;
  flex-direction: column;
  align-items: var(--horizontal-alignment);
  gap: var(--gap);
  width: 100%;
}

.section-resource-list__content:empty {
  display: none;
}

.section-resource-list__header:is(:empty, :has(.group-block-content:empty)),
.section-resource-list__content:empty {
  display: none;
}

@media screen and (max-width: 749px) {
  .mobile-column {
      flex-flow: column nowrap;
      align-items: var(--horizontal-alignment-mobile);
      justify-content: var(--vertical-alignment-mobile);
  }

  .layout-panel-flex--row {
      justify-content: var(--horizontal-alignment-mobile);

      &:not(.mobile-column) {
          .text-block {
              flex: 1 1 var(--max-width--display-tight);
          }

          .image-block {
              flex: 1 1 var(--size-style-width-mobile-min);
          }

          .button {
              flex: 0 0 fit-content;
          }
      }
  }

}

/* Spacing style */
.spacing-style {
  --spacing-scale: var(--spacing-scale-md);

  @media screen and (min-width: 990px) {
      --spacing-scale: var(--spacing-scale-default);
  }

  @media screen and (max-width: 749px) {
      --spacing-scale: var(--spacing-scale-sm);
  }
}

/* Appearance */
.background-image-container {
  overflow: hidden;
  position: absolute;
  inset: 0;
  opacity: var(--image-opacity);
}

.background-image-container img,
.background-image-container svg {
  object-fit: cover;
  width: 100%;
  height: 100%;
}

.background-image-fit img,
.background-image-fit svg {
  object-fit: contain;
}

/* Base styles */
.group-block:has(> video-background-component),
.group-block:has(> .background-image-container) {
  overflow: hidden;
}

/* Dimension utilities - Height */
.group-block--height-fit {
  height: auto;
}

.group-block--height-custom,
.group-block--height-fill {
  height: var(--size-style-height);
}

/* Flex behavior for height variants */
.layout-panel-flex--column > .group-block--height-fit {
  flex: 0 1 auto;
}

.layout-panel-flex--column > .group-block--height-fill {
  flex: 1;
}

.layout-panel-flex--column > .group-block--height-custom {
  flex-basis: var(--size-style-height);
}

/* Component carousel */
@media screen and (max-width: 749px) {
  .swiper-component-mobile .md\:grid {
      flex-wrap: nowrap;
      gap: 0px;
  }

  .swiper-component-mobile .grid__item.swiper-slide {
      max-width: 100%;
  }
}

/* end base-2.css */

/* start base-5.css */

.justify-left {
  justify-content: flex-start;
}

.justify-right {
  justify-content: flex-end;
}

.swiper-wrapper[style*="--card-grid-per-row-mobile"] > * {
  --card-grid-per-row: var(--card-grid-per-row-mobile);
}

.resource-list--grid {
  display: grid;
  gap: var(--resource-list-mobile-row-gap, var(--resource-list-row-gap)) var(--resource-list-mobile-column-gap, var(--resource-list-column-gap));
  grid-template-columns: var(--resource-list-columns-mobile);
}

.section-resource-list {
  gap: var(--gap) 0;
}

.form-input{
  font-size: var(--font-body--size);
  line-height: var(--font-body--line-height);
  font-family: var(--font-body--family);
  font-style: var(--font-body--style);
  font-weight: var(--font-body--weight);
  width: 100%;
  border: 1px solid var(--color-input-border);
  padding: 15px 10px;
}

[style*="--dots-top-offset"].swiper:has(.swiper-pagination.swiper-pagination-bullets:not(.swiper-pagination-lock)) {
  padding-bottom: calc(var(--dots-top-offset, 4rem) + (var(--font-body--size) * var(--font-body--line-height))) !important;

  @media screen and (max-width: 1024px) {
    padding-bottom: calc(var(--dots-top-offset, 4rem) * 0.75 + (var(--font-body--size) * var(--font-body--line-height))) !important;
  }

  @media screen and (max-width: 749px) {
    padding-bottom: calc(var(--dots-top-offset, 4rem) * 0.5 + (var(--font-body--size) * var(--font-body--line-height))) !important;
  }
}

.swiper .swiper-pagination.swiper-pagination-progressbar{
  margin-top: calc(var(--progress-top-offset, 4rem) - 4px);
}

.swiper .swiper-pagination.swiper-pagination-bullets:not(.swiper-pagination-bullets-dynamic),
.swiper .swiper-pagination.swiper-pagination-progressbar{
  bottom: 0;
}

.section:has(parallax-element){
  z-index: 2;
}

.cart-count-bubble,
.wishlist-count-bubble {
  top: 0;
  left: calc(50% + 12px);
  right: 0;
  transform: translateX(-50%);
}

.header__icon--text .wishlist-count-bubble {
  top: -1.2rem;
  left: unset;
  transform: none;
}

.card-hover--lift .product-grid-item:has(.card--block-media.border-style),
.card-hover--lift .product-grid__item:has(.card--block-media.border-style){
  padding-top: 4px;
}

.tabs-header {
  flex: 1;
  max-width: var(--tabs_header_max_width);
}

.tabs-product-header-wrapper {
  width: 100%;
  max-width: 100%;
}

.tabs-product-header-wrapper .tabs-product-header {
  overflow: auto;
  max-width: 100%;
}

.tabs-product-header-wrapper .tabs-product-header .tabs-product-header__item {
  white-space: nowrap;
  min-width: fit-content;
}

.swiper.swiper-vertical .swiper-button{
  width: var(--button-height);
  height: var(--button-width);
}

.placeholder-svg[style="height: 100%;"] svg{
  width: 100%;
  height: 100%;
}

.image-block__link,
.image-block__link:empty {
display: block;
position: absolute;
inset: 0;
}

.image-block__link ~ :is(img, .collection-banner__caption) {
pointer-events: none;
:is(a, button, input, textarea, select) {
  pointer-events: auto;
}
}

email-signup .checkbox__label-text{
  line-height: 1.5;
  white-space: unset;
  overflow: unset;
  text-overflow: unset;
}

email-signup .checkbox .icon-checkmark{
  width: calc(var(--checkbox-size) * 1.5);
  height: calc(var(--checkbox-size) * 1.5);
}

#predictive-search-queries{
  margin-block-end: 2rem;
}

@media (min-width: 750px) {
  .swiper-wrapper[style*="--card-grid-per-row-tablet"] > * {
      --card-grid-per-row: var(--card-grid-per-row-tablet);
  }

  .resource-list--grid {
      grid-template-columns: var(--resource-list-columns-tablet, var(--resource-list-columns));
  }

  .section-footer summary.menu__heading:hover{
      background-color: transparent;
  }
}

@media (min-width: 1025px) {
  .swiper-wrapper[style*="--card-grid-per-row-desktop"] > * {
      --card-grid-per-row: var(--card-grid-per-row-desktop);
  }

  .resource-list--grid {
      gap: var(--resource-list-row-gap) var(--resource-list-column-gap);
      grid-template-columns: var(--resource-list-columns-desktop, var(--resource-list-columns));
  }
}

@media screen and (max-width: 749px) {
  .layout-panel-flex {
      flex-direction: var(--flex-direction-mobile);
      margin-left:-5px;
  }

  .menu:not(:has(.menu__heading--empty)) .details-content > ul{
      padding-block-start: 0;
  }

  .menu--accordion .menu__details .menu__heading{
      border-bottom: 1px solid;
  }
}

/* end base-5.css */

/* start base-4.css */

.swiper-horizontal>.swiper-pagination-progressbar.swiper-pagination-progressbar--left, .swiper-pagination-progressbar.swiper-pagination-horizontal.swiper-pagination-progressbar--left {
  left: var(--swiper-pagination-progressbar-left, 0) !important;
}

@media (max-width: 1024px) {
  .swiper-horizontal>.swiper-pagination-progressbar.swiper-pagination-progressbar--left, .swiper-pagination-progressbar.swiper-pagination-horizontal.swiper-pagination-progressbar--left {
    left:  calc(var(--swiper-pagination-progressbar-left) * 0.75);
  }
}

@media (max-width: 749px) {
  .swiper-horizontal>.swiper-pagination-progressbar.swiper-pagination-progressbar--left, .swiper-pagination-progressbar.swiper-pagination-horizontal.swiper-pagination-progressbar--left {
    left:  calc(var(--swiper-pagination-progressbar-left) * 0.5);
  }
}

.swiper:has(.swiper-pagination.swiper-pagination-lock) {
  padding-bottom: 0;
}

.link {
  font-style: var(--font-style);
}

.price-item--sale {
  color: var(--sale-price-color);
}

.text-clamp-style .card__heading .text-block .text {
  --lineHeight : calc(var(--line-height) * var(--font-size));
  --row: var(--text-clamp);
  height: calc(var(--lineHeight) * var(--row));
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: var(--row);
  -webkit-box-orient: vertical;
}

/* css for description template */
.description-sample {
  .flex-block {
    display: flex;
    flex-wrap: wrap;
    gap: 30px;
    container-type: inline-size;
    container-name: flexBlock;

    &.row-reverse {
      flex-direction: row-reverse;
    }

    + .banner-block {
      margin-top: 30px;
    }

    > .flex-item {
      width: calc(50% - 15px);

      @media (max-width: 749px) {
        width: 100%;
      }
    }

    @container flexBlock (max-width: 500px) {
      > .flex-item {
        width: 100%;
      }
    }

    .banner-content {
      border: 1px solid var(--color-border, #323232);
      display: flex;
      align-content: center;
    }

    .content-box {
      max-width: 430px;
      padding: 30px 15px;
      margin: 0 auto;
      text-align: center;
      position: relative;
      display: flex;
      flex-direction: column;
      justify-content: center;
      align-items: center;

      .banner-sub-title {
        margin-bottom: 18px;
      }

      .banner-heading {
        display: inline-block;
        position: relative;
        margin-top: 0;
        margin-bottom: 42px;

        &:before {
          content: "";
          position: absolute;
          left: 50%;
          bottom: -25px;
          -moz-transform: translateX(-50%);
          -o-transform: translateX(-50%);
          -ms-transform: translateX(-50%);
          -webkit-transform: translateX(-50%);
          transform: translate(-50%);
          height: 2px;
          width: 40px;
          display: inline-block;
          background-color: var(--color, var(--color-foreground-heading));
        }
      }

      .banner-text {
        margin-bottom: 25px;
      }
    }
  }
  .quote {
    border: none;
    position: relative;
    padding: 0;
    margin-top: 0;
    margin-left: 0;
    margin-right: 0;

    h4 {
      margin-bottom: 18px;
      margin-top: 0;
    }

    p {
      padding: 34px 40px;
      margin: 0;
      background: #fafafa;

      @media (max-width: 749px) {
        padding: 15px 20px;
      }
    }
  }

  .banner-item {
    position: relative;
  }

  .video-open-popup {
    position: absolute;
    top: auto;
    left: auto;
    bottom: 30px;
    right: 30px;

    .svg-wrapper {
      width: 40px;
      height: 40px;
    }

    button {
      background: transparent;

      &:after {
        display: none;
      }

      @media (hover: hover) {
        &:hover {
          background: transparent;
        }
      }
    }
  }

  .img-box {
    height: 100%;
  }
  .image-adapt {
    height: 100%;
    display: flex;
  }

  table {
    tr:nth-child(odd) {
      background-color: #fafafa;
    }

    td {
      padding: 10px;
    }
  }
}


.popup__inner--video {
  width: 50%;
  height: fit-content;

  @media (max-width: 749px) {
    width: 80%;
  }

  iframe {
    aspect-ratio: 4/3;
  }
}

.italic {
  font-style: italic;
}

.menu--accordion .menu__details {
  .icon-plus-block {
    display: block;
  }

  .icon-minus-block {
    display: none;
    width: 100%;
    height: 100%;
    align-content: center;
  }
}

.menu--accordion .menu__details[open] {
  .icon-caret {
    transform: rotate(-90deg);
  }

  .icon-plus-block {
    display: none;
  }

  .icon-minus-block {
    display: block;
  }
}

.link.mega-menu__link--level-2 {
  font-size: var(--button-font-size-link-2);
  font-weight: var(--button-font-weight-link-2);
  text-transform: var(--text-transform-link-2);
}

.link.mega-menu__link--level-3 {
  font-size: var(--button-font-size-link-3);
  font-weight: var(--button-font-weight-link-3);
  text-transform: var(--text-transform-link-3);
}

.halo-compareProduct:not(.is-show) [data-compare-link] {
  display: none;
}

.header__menu-item.highlighted-item>.text {
  color: var(--color-foreground);
}

.cart-drawer text-loader-component {
  line-height: var(--font-body--line-height);
}

.cart-drawer .caption-large {
  font-size: calc(var(--font-body--size) - 2px);
}

/* end base-4.css */

#Global-Drawer .drawer__wrapper {
  max-height: calc(100vh - 50px);
  overflow-y: auto;
}

/* section-fetcher */
section-fetcher {
  pointer-events: none;
}

.button-close-circle {
  &.button-unstyled {
    overflow: visible;
  }
  @media (hover: hover) {
    transition: transform var(--animation-speed) var(--animation-easing);
    will-change: transform;

    &::after {
      content: "";
      position: absolute;
      inset: -2px;
      border: 0.1rem solid var(--color-foreground);
      border-radius: 50%;
      z-index: -1;
      transform: scale(0.8);
      transition: transform var(--animation-speed) var(--animation-easing), opacity var(--animation-speed) var(--animation-easing);
      will-change: transform, opacity;
      opacity: 0;
    }
    &:hover {
      transform: rotate(90deg);
      &::after {
        transform: scale(1);
        opacity: 1;
      }
    }
  }
}

.quick-add-modal .product-quick-add__media {
  width: calc(100% - var(--minimum-touch-target, 4.5rem));
}

.disclosure__list-wrapper {
  border-width: var(--style-border-width-popover);
  border-style: solid;
  border-color: var(--color-foreground);
  overflow: hidden;
  position: absolute;
  bottom: 100%;
  z-index: 2;
  background: var(--color-background);
  border-radius: var(--style-border-radius-popover);
  box-shadow: var(--style-shadow-popover);
  max-height: 27.5rem;
  transform: translate3d(0, 100%, 0);
}

@media screen and (min-width: 750px) {
  .disclosure__list-wrapper {
    opacity: var(--opacity-0);
    visibility: hidden;
    transform: translateY(0);
    transition-property: opacity, transform;
    transition-duration: var(--duration-medium);
    transition-timing-function: var(--cubic-smooth);
  }

  .selector__dropdown.active .disclosure__list-wrapper {
    opacity: var(--opacity-100);
    visibility: visible;
    transform: translateY(-0.4rem);
  }
}

.image-block {
  display: flex;
  justify-content: var(--horizontal-alignment, 'inline-start');
}

.image-block--height-fill .image-block__image {
  height: 100%;
}

.image-block__image {
  object-fit: var(--object-fit);
  aspect-ratio: var(--ratio);
}

.image-block.image-zoomin {
  overflow: hidden;
  .image-block__image {
    transition: transform var(--hover-transition-duration) var(--hover-transition-timing);
  }

  &:hover .image-block__image {
    transform: scale(var(--hover-subtle-zoom-amount));
  }
}

.image-block__link,
.image-block__link:empty {
  display: block;
  position: absolute;
  inset: 0;
}

.image-block__link ~ :is(.image-block__image) {
  pointer-events: none;
  :is(a) {
    pointer-events: auto;
  }
}

/* Animated Images */
animate-image {
  display: block;
  position: relative;
  overflow: hidden;
}

.js animate-image[data-animate-type="reveal_on_scroll"] img {
  opacity: 0;
  clip-path: inset(0 100% 0 0);
  transform: scale(1.2);
}

.js animate-image[data-animate-type="zoom-out"] img {
  transform: scale(1.2);
}

.js animate-image[data-animate-type="fade-in"] img {
  opacity: 0;
}

.minimum-touch-target-before:before {
  content: "";
  position: absolute;
  inset: 50%;
  transform: translate(-50%, -50%);
  width: var(--minimum-touch-target);
  height: var(--minimum-touch-target);
}

/* theme generated css */

.details__header {
  padding-right: calc(var(--padding-inline-start) + (var(--icon-size-xs) * 2));
}

.details__header .svg-wrapper {
  position: absolute;
  right: var(--padding-inline-start);
}

.swiper-btns-on-header {
  display: none;
}

.arrow-on-header .swiper-btns-on-header {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: var(--gap);
}

.swiper-btns-on-header .swiper-button {
  position: relative;
  opacity: 1 !important;
  transform: unset !important;
  margin: 0 !important;
}

.swiper-btns-on-header .swiper-button.swiper-button-disabled {
  opacity: 0.5 !important;
}

.arrow-on-header:has(.swiper-btns-on-header) .swiper-btns-wrap:not(.swiper-btns-on-header) {
  display: none;
}

.article-editorial__content-top {
  position: relative;
  margin-left: 5%;
  margin-right: 8%;
}

.article-editorial__content-left {
  width: fit-content;
  position: absolute;
  z-index: 1;
  top: 31%;
  left: 0;
}

.article-editorial__image-container {
  width: 56.4%;
  margin-right: 11%;
  margin-left: auto;
}

.article-editorial__title-container {
  --text-align: right;
  max-width: 875px;
  width: fit-content;
  line-height: 1;
  position: absolute;
  z-index: 1;
  bottom: 10%;
  right: 0;
  text-align: var(--text-align);
}

.article-editorial-block .blog-post-description > div {
  display: block;
}

@media (max-width: 749px) {
  .article-editorial__content-top {
    margin-left: 15px;
    margin-right: 15px;
  }

  .article-editorial__content-left {
    top: 10%;
  }

  .article-editorial__image-container {
    width: 75%;
    margin: auto;
  }

  .article-editorial-block .blog-post-description {
    padding-inline: 15px;
  }
}

.form-error {
  display: none;
}

.ask-an-expert--disabled .form-error {
  display: block;
}

.popup.ask-an-expert > .button {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 10px;
  text-transform: none;
  text-align: left;
}
.popup.ask-an-expert > .button svg {
  top: 0;
}
.ask-an-expert__content {
  padding: 1.5rem;
  width: 100%;
  max-width: 54.5rem;
  margin: 0 auto;
}
.ask-an-expert__content .button[type="submit"] {
  display: flex;
  justify-content: center;
  margin: 0 auto 2rem;
}

.blog-post-item .blog-post-block__image-container,
.blog-post-item .blog-post-block__content {
  width: 100%;
}
.blog-post-block__content {
  display: flex;
  flex-direction: column;
}
.blog-post-block__content a,
.blog-post-block__content .blog-post-block__content-text {
  display: block;
  text-wrap: pretty;
  text-decoration: none;
}

.blog-post-card {
  --blog-post-scale: var(--blog-post-gap-mobile);
  text-align: var(--text-align);
  gap: var(--blog-post-scale);

  @media screen and (min-width: 1025px) {
    --blog-post-scale: var(--blog-post-gap);
  }
}

.blog-post-item .blog-post-card__content,
.blog-post-item .blog-post-card__content.not-has-image {
  width: 100%;
}

.blog-post-card__content :is(a, .blog-post-card__content-text) {
  text-wrap: pretty;
}

.blog-post-card__content-label {
  padding: var(--padding-sm) var(--padding-md);
  color: #ba7a2d;
  border: var(--style-border-width) solid #ba7a2d;
  border-radius: var(--style-border-radius-sm);
  margin-right: var(--margin-lg);
}

/* Type: Classic */
.blog-post-item:has(.blog-post-card--classic) {
  &:first-child .blog-post-card {
    flex-direction: column;

    @media screen and (min-width: 750px) {
      flex-direction: column-reverse;
    }
  }

  &:not(:first-child) {
    @media screen and (max-width: 749px) {
      .blog-post-card {
        flex-direction: column;
      }
    }

    @media screen and (min-width: 750px) {
      .blog-post-card__image-container {
        width: 40%;
      }

      .blog-post-card__content:not(.not-has-image) {
        width: 60%;
      }
    }
  }
}

/* Type: Simple */
.blog-post-item:has(.blog-post-card--simple).blog-post-card {
  flex-direction: column;
}

/* Type: Balance */
.blog-post-item:has(.blog-post-card--balance) {
  .blog-post-card__content {
    height: auto;
  }

  @media screen and (min-width: 750px) {
    .balance-odd {
      flex-direction: row;
    }

    .balance-even {
      flex-direction: row-reverse;
    }

    .blog-post-card__image-container {
      width: 50%;
    }

    .blog-post-card__content:not(.not-has-image) {
      width: calc(50% - var(--blog-post-scale));
    }
  }
}

.blog-post-content {
  max-width: var(--normal-content-width);
  margin: 0 auto;
}

.blog-post-card__content-text a {
  color: var(--color-primary);
}

.custom-color,
.custom-color > :is(h1, h2, h3, h4, h5, h6, p, *) {
  color: var(--color);
}

.blog-post-details > span {
  text-overflow: clip;
  overflow: hidden;
}

.button.button--outline,
.button-secondary.button--outline {
  --border-outline-color: var(--button-color);
  background-color: transparent;
  border: 1px solid var(--border-outline-color);
}

.button {
  transition: color var(--animation-speed) var(--animation-easing), box-shadow var(--animation-speed) var(--animation-easing), background-color var(--animation-speed) var(--animation-easing), transform var(--animation-speed) var(--animation-easing);
  &:not(.deferred-media__poster,.prevent-active):active {
    transform: scale(0.9);
  }
}

.card--block-button {
  display: flex;
  justify-content: var(--horizontal-alignment);
}

.featured-article-block .blog-post-description > div:before {
  content: '';
  display: block;
  width: 33.362%;
  height: var(--font-size);
  background-color: transparent;
  float: left;
}

@media (max-width: 749px) {
  .featured-article-block .blog-post-description > div:before {
    content: '';
    display: block;
    width: calc((100vw - 30px) * 12.5 / 100);
    height: var(--font-size);
    background-color: transparent;
    float: left;
  }
}

.card--block-details {
  justify-content: var(--horizontal-alignment);
}

.blog-post-details > div {
  gap: 5px;
}

.blog-post-details > span {
  text-overflow: clip;
  overflow: hidden;
}

.blog-post-block__image-container .group-article-information {
  position: absolute;
  bottom: 0;
}

.group-collection-information {
  position: absolute;
  inset: 0;
  width: auto;
  height: auto;
}

.group-collection-information__content {
  width: 100%;
}

.group-collection-information__content > * {
  height: auto;
}

[id*="collection-infor-icon"] {
  justify-content: center;
}

.group-collection-information__content .icon-block {
  width: 100%;

  & svg {
    fill: var(--button-color);
    width: 20px;
    height: 20px;
  }
}

.group-collection-information__content .icon-block .button-secondary{
  pointer-events: auto;
  padding: 10px;
}

.collection-card__image .group-collection-information__content > *:not(.button, .button-secondary, .link) {
  opacity: 0;
  -moz-transform: rotateX(90deg);
  -o-transform: rotateX(90deg);
  -ms-transform: rotateX(90deg);
  -webkit-transform: rotateX(90deg);
  transform: rotateX(90deg);
  -webkit-transition: transform .3s linear .1s;
  -moz-transition: transform .3s linear .1s;
  -ms-transition: transform .3s linear .1s;
  -o-transition: transform .3s linear .1s;
  transition: transform .3s linear .1s;
}

.collection-card:hover .collection-card__image .group-collection-information__content > *:not(.button, .button-secondary, .link) {
  opacity: 1;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(opacity=100)";
  filter: alpha(opacity=100);
  -moz-transform: rotateX(0deg);
  -o-transform: rotateX(0deg);
  -ms-transform: rotateX(0deg);
  -webkit-transform: rotateX(0deg);
  transform: rotateX(0);
}

.collection-card__image .overlay{
  opacity: 0;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(opacity=0)";
  filter: alpha(opacity=0);
  -webkit-transition: opacity .5s ease;
  -moz-transition: opacity .5s ease;
  -ms-transition: opacity .5s ease;
  -o-transition: opacity .5s ease;
  transition: opacity .5s ease;
}

.collection-card:hover .collection-card__image .overlay{
  opacity: 1;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(opacity=100)";
  filter: alpha(opacity=100);
}

.cart-countdown-message  .svg-wrapper {
  width: var(--size-24);
  height: var(--size-24);
  margin-right: var(--size-5);
}

.cart-countdown-message  svg {
  position: relative;
  top: var(--size-6);
}

.cart-items-disabled {
  pointer-events: none;
}

.cart-page--empty .cart-items__wrapper {
  display: flex;
  flex-direction: column;
  align-items: center;
  margin-block-start: 0;
  text-align: center;
}

.cart-page__title + .cart-page__items {
  margin-block-start: var(--margin-lg);
}
.cart__summary-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.cart__summary-item.tax-note {
  font-size: var(--cart-font-size--sm);
}

.cart__discount-label {
  display: flex;
  align-items: center;
  gap: var(--gap-2xs);
}

.cart__total {
  align-items: baseline;
  font-weight: var(--font-weight-bold);
}

.cart__tax-note {
  color: rgb(var(--color-foreground-rgb) / var(--opacity-subdued-text));
}

.cart__discount-label svg {
  width: var(--icon-size-sm);
  height: var(--icon-size-sm);
  display: inline-block;
}

.cart__summary-inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--gap-2xl);
  container-type: inline-size;
  padding: 0;
  position: sticky;
  top: 0;
  align-self: start;

  @media screen and (min-width: 750px) {
    grid-row: 1 / -1;
  }
}

body:has(> #header-group .header[sticky]) .cart__summary-inner {
  top: var(--header-height, 0);
}

.cart__summary-container {
  @media screen and (max-width: 749px) {
    border: none;
  }

  @media screen and (min-width: 750px) {
    display: grid;
    grid-template-rows: subgrid;
    grid-row: 1 / -1;
  }
}

.cart__summary-container:not(.cart__container--extend),
.cart__summary-container:not(.cart__container--extend) .cart__summary-inner {
  height: auto;
}

.cart__container--extend {
  height: 100%;

  @media screen and (min-width: 750px) {
    border-right: none;
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
  }
}

.cart-actions {
  display: flex;
  flex-direction: column;
  gap: var(--gap-sm);
  border-block: 1px solid var(--color-border);
  padding-block: var(--padding-sm);
  margin-block-start: var(--margin-3xs);
}

.cart-actions__divider {
  border-block-start: 1px solid var(--color-border);
}

.cart__summary-totals:not(:has(.cart-actions)) {
  margin-block-start: var(--margin-3xs);
  border-block-start: 1px solid var(--color-border);
  padding-block-start: var(--margin-xl);
}

.cart__installments {
  color: var(--color-foreground);
}

/* If extend is on, only include top and bottom borders when the border radius is 0. */
.cart__container--extend:not(.has-border-radius) {
  @media screen and (min-width: 750px) {
    border-top: none;
    border-bottom: none;
  }
}

.cart__container--extend .cart__summary-inner {
  height: 100%;
  padding: var(--padding-md) 0 var(--padding-4xl);

  @media screen and (min-width: 750px) {
    grid-row: 2 / -1;
    padding-inline: 0 var(--gap-3xl);
    width: var(--side-cart-width);
  }
}

/* If extend is off, apply the border radius to the inner summary container */
.cart__summary-inner.has-border-radius {
  border-radius: var(--border-radius);
}

.cart-title h1 {
  margin-block-end: 0;
  display: inline-flex;
  align-items: center;
  gap: var(--gap-sm);
}

.cart-title .cart-bubble {
  width: fit-content;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: var(--style-border-radius-buttons-primary);
  aspect-ratio: auto;
  padding: var(--cart-padding);
}

.cart-title .cart-bubble[data-maintain-ratio] {
  aspect-ratio: 1;
  min-width: 26px;
}

.cart-title .cart-bubble__background {
  background-color: rgb(var(--color-foreground-rgb) / var(--opacity-10-25));
}

.cart-title .cart-bubble__text {
  color: var(--color-foreground);
  font-family: var(--font-paragraph--family);
}

.collection-card__image .group-collection-information__content .button,
.collection-card__image .group-collection-information__content .button-secondary{
  display: flex;
  align-items: center;
  justify-content: center;
  column-gap: 15px;
}
.collection-card__image .group-collection-information__content .button svg
.collection-card__image .group-collection-information__content .button-secondary svg{
  min-width: 17px;
}


.collection-card__image {
  position: relative;
  display: flex;
  width: 100%;
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: var(--ratio);
  z-index: var(--layer-base);
  overflow: hidden;
}

.collection-card__image--placeholder {
  width: 100%;
  height: 100%;
}

.collection-card__image {
  position: relative;
  display: flex;
  width: 100%;
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: var(--ratio);
  z-index: var(--layer-base);
  overflow: hidden;
}

.collection-card__image--placeholder {
  width: 100%;
  height: 100%;
}

.collection-image {
  width: var(--image-width);
}

.collection-image .collection-image__featured-image {
  aspect-ratio: var(--ratio);
  object-fit: cover;
}

.collection-links__link {
  --min-font-size: var(--font-size--4xl);
  --max-font-size: var(--font-size--6xl);

  display: flex;
  color: inherit;
  text-decoration: none;
  text-wrap: pretty;
  font-size: clamp(var(--min-font-size), 4.5vw, var(--max-font-size));

  @media (hover: hover) {
    opacity: var(--disabled-opacity);
  }

  [layout='spotlight'] & {
    opacity: var(--disabled-opacity);
  }

  &[aria-selected='true'] {
    opacity: var(--opacity-100);
  }

  .text-block {
    display: inline-block;
  }

  @media (max-width: 749px) {
    --min-font-size: var(--font-size--3xl);
    --max-font-size: var(--font-size--5xl);

    [layout='spotlight'] & {
      white-space: nowrap;
      scroll-snap-align: start;

      span {
        text-wrap: nowrap;
      }
    }
  }
}

.collection-links__count {
  font-size: 0.5em;
  opacity: var(--disabled-opacity);
  font-weight: var(--font-paragraph--weight);
}

.collection-links__image {
  align-items: center;
  justify-content: center;

  &:not([hidden]) {
    display: flex;
  }

  &[reveal] {
    --offset: 15px;

    position: fixed;
    top: 0;
    left: 0;
    z-index: var(--layer-temporary);
    display: block;
    translate: calc(var(--x) + var(--offset)) calc(var(--y) + var(--offset));
    pointer-events: none;
    width: auto;

    image-block {
      --image-height-basis: 5rem;
      height: var(--image-height);
    }
  }
}

.popup.color-comparison > .button {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 10px;
  text-transform: none;
  text-align: left;
}

.popup.color-comparison > .button svg {
  top: 0;
}

.hover-content-block {
  z-index: 999;
}

.hover-content-block.custom {
  position: absolute;
  top: var(--posTop, unset);
  right: var(--posRight, unset);
  bottom: var(--posBottom, unset);
  left: var(--posLeft, unset);
  transform: none;
}

/* Animation */
.hover-content-block > * {
  opacity: var(--opacity-0);
  transition: all var(--animation-speed-slowest) var(--ease-out-cubic);
}
.instagram-item:has(.hover-content-block):hover .hover-content-block > * {
  opacity: var(--opacity-100);
}

.hover-content-block.animate--slide-in > * {
  transform: translateY(100%);
}

.instagram-item:has(.hover-content-block):hover .animate--slide-in > * {
  transform: translateY(0);
}

.hover-content-block.animate--reveal > * {
  clip-path: inset(0 100% 0 0);
  transition: clip-path 0.8s ease;
}
.instagram-item:has(.hover-content-block):hover .animate--reveal > * {
  clip-path: inset(0 0 0 0);
}

.policy_list {
  display: flex;
  gap: var(--gap-2xs) var(--gap-sm);

  /* Depending on the content, some smaller desktop layouts will need to wrap the items to fit everything */
  flex-wrap: wrap;
  justify-content: center;

  @media screen and (min-width: 750px) {
    justify-content: flex-start;
  }
}

.social-icons__wrapper {
  display: flex;
  gap: var(--gap-sm);
  flex-wrap: wrap;
  justify-content: center;

  @media screen and (min-width: 750px) {
    flex-wrap: nowrap;
    justify-content: flex-start;
  }
}

@media (prefers-reduced-motion: no-preference) and (hover: hover) and (min-width: 1025px) {
  .group-block-content .group--reveal {
    overflow: hidden;
    transition: max-height 2s;
    max-height: 0;
  }

  .group-block-content:hover .group--reveal {
    max-height: 100%;
  }
}

.promo-code__input {
  --box-shadow-color: var(--color-input-border);

  width: 100%;
  padding-block: 0.8rem;
  padding-inline: 1.8rem 3.5rem;
  border-width: var(--input-border-width);
  border-radius: var(--input-border-radius);
  border-style: solid;
  border-color: var(--color-input-border);
  box-shadow: var(--inputs-shadow-horizontal-offset) var(--inputs-shadow-vertical-offset)
    var(--inputs-shadow-blur-radius) var(--box-shadow-color);

  &:focus {
    outline: none;
    box-shadow: none;
  }

  &.promotion-code__input--underline {
    --box-shadow-multiplier: 1;

    color: var(--color-input-text);
    background-color: transparent;
    padding: 1.6rem 2.8rem;
    border: none;
    border-radius: 0;
    box-shadow: 0 calc(var(--input-border-width) * var(--box-shadow-multiplier)) 0 var(--box-shadow-color);
    transition: box-shadow var(--animation-values);

    &:focus-visible {
      --box-shadow-multiplier: 1.75;
      --box-shadow-color: var(--color-input-text);

      outline: none;
    }
  }

  &.promotion-code__input--none {
    color: var(--color-input-text);
    background-color: var(--color-input-background);
    border: none;
  }
}

.promo-code__button {
  aspect-ratio: 1;
  padding: .8rem;
  min-width: auto;
  min-height: auto;
  display: flex;
  justify-content: center;
  align-items: center;
  overflow: visible;

  svg {
    color: var(--button-color);
    fill: currentcolor;

    @media screen and (min-width: 750px) {
      width: var(--icon-size-desktop);
      height: var(--icon-size-desktop);
    }

    @media screen and (max-width: 749px) {
      width: var(--icon-size-mobile);
      height: var(--icon-size-mobile);
    }
  }
  @media (hover: hover) {
    &:hover .tooltip {
      opacity: var(--opacity-100);
      transform: translate(-50%, 0);
      visibility: visible;
      pointer-events: auto;
    }
  }

  &.promo-code__button--integrated {
    --button-offset: 0.1rem;

    position: absolute;
    height: calc(100% - (var(--button-offset) * 2) - (var(--input-border-width) * 2));
    right: var(--input-border-width);
    top: 50%;
    transform: translateY(-50%);

    @media screen and (max-width: 749px) {
      width: fit-content;
    }
  }

  &.bor-none {
    border: none;
  }
}

.promotion-code .tooltip {
  font-size: var(--font-size--2xs);
  color: var(--color-white);
  background: var(--color-foreground);
  text-align: center;
  position: absolute;
  bottom: 100%;
  left: 50%;
  padding: 0.5rem;
  z-index: 2;
  min-width: 4rem;
  transform: translate(-50%, 50%);
  margin: 0 0 10px;
  border-radius: 0.2rem;
  transition: var(--animation-speed) var(--animation-timing-bounce);
  white-space: nowrap;
  text-transform: capitalize;
  opacity: var(--opacity-0);
  visibility: hidden;
  pointer-events: none;

  &:before {
    content: '';
    position: absolute;
    bottom: -0.7rem;
    left: 50%;
    height: 0;
    width: 0;
    border-top: 0.7rem solid var(--color-foreground);
    border-left: 0.7rem solid transparent;
    border-right: 0.7rem solid transparent;
    transform: translate(-50%);
  }
}

.icon-block {
  display: flex;
  flex-shrink: 0;
  fill: currentcolor;
}

.icon-block__media {
  height: auto;
  object-fit: cover;
  aspect-ratio: var(--ratio);
}

@media (max-width: 749px) {
  .marquee__content .marquee__repeated-items:has(.large-icon-block__media) * {
    max-width: var(--size-style-width-mobile);
  }
}

.lookbook-group:has(> .shopify-block > .circle-container) {
  container-type: inline-size;
  container-name: circle-container;
}

.circle-container {
  position: relative;
  width: fit-content;
  height: auto;
  aspect-ratio: 1/1;
  padding: 4px;
  border: 1px solid var(--circle-color);
  border-radius: 50%;
  cursor: pointer;
}

.circle-container .play-icon {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 0;
  height: 0;
  border-left: 35px solid var(--circle-color);
  border-top: 20px solid transparent;
  border-bottom: 20px solid transparent;
  z-index: 2;
}

@container circle-container (width > 250px) {
  .circle-container .play-icon {
    border-left: 40px solid var(--circle-color);
    border-top: 25px solid transparent;
    border-bottom: 25px solid transparent;
  }
}

@container circle-container (width < 150px) {
  .circle-container .play-icon {
    border-left: 17px solid var(--circle-color);
    border-top: 10px solid transparent;
    border-bottom: 10px solid transparent;
  }
}

.circle-container svg {
  width: auto;
  height: auto;
  overflow: visible;
  transform: rotate(0deg);
  animation: spin 10s linear infinite;
  animation-play-state: running;
}

.circle-container.stop-on-hover:hover svg {
  animation-play-state: paused;

}

@keyframes spin {
  from { transform: rotate(0deg); }
  to { transform: rotate(360deg); }
}

.circle-container text {
  font-size: var(--font-size--md);
  letter-spacing: 0.3rem;
  text-transform: uppercase;
  color: var(--text-color);
}

@media screen and (min-width: 1025px) {
  .lookbook-row.group-block--width-custom {
    width: calc(var(--size-style-width) + var(--custom-gap));
  }
}

.lookbook--editorial-layout {
  --column-1-width: 66.6666%;
  --column-2-width: 33.3333%;
  --lookbook-item-odd-width: calc(var(--column-1-width) - calc(var(--gap) / 2));
  --lookbook-item-even-width: calc(var(--column-2-width) - calc(var(--gap) / 2));
}

@media screen and (min-width: 750px) {
  .lookbook--editorial-layout {
    grid-template-columns: var(--lookbook-item-odd-width) var(--lookbook-item-even-width);
    gap: var(--gap);
  }

  .lookbook--editorial-layout.grid__item--right {
    grid-template-columns: var(--lookbook-item-even-width) var(--lookbook-item-odd-width);
  }
}

@media screen and (max-width: 749px) {
  .lookbook--editorial-layout {
    grid-template-columns: 100%;
  }
}

.group-block--width-full {
  width: 100%;
}

.group-block--width-fit {
  width: fit-content;
}

.lookbook--editorial-layout {
  --column-1-width: 66.6666%;
  --column-2-width: 33.3333%;
  --lookbook-item-odd-width: calc(var(--column-1-width) - calc(var(--gap) / 2));
  --lookbook-item-even-width: calc(var(--column-2-width) - calc(var(--gap) / 2));
}

@media screen and (min-width: 750px) {
  .lookbook--editorial-layout {
    grid-template-columns: var(--lookbook-item-odd-width) var(--lookbook-item-even-width);
    gap: var(--gap);
  }

  .lookbook--editorial-layout.grid__item--right {
    grid-template-columns: var(--lookbook-item-even-width) var(--lookbook-item-odd-width);
  }
}

@media screen and (max-width: 749px) {
  .lookbook--editorial-layout {
    grid-template-columns: 100%;
  }
}

marquee-component {
  background: var(--color-background);

  &.position-style {
    position: absolute;
    top: var(--position-vertical);
    left: var(--position-horizontal);
    transform: translate(-50%, -50%);
    z-index: 1;

    @media screen and (max-width: 749px) {
      top: var(--position-vertical-mobile);
      left: var(--position-horizontal-mobile);
    }
  }
}

.marquee__wrapper {
  display: flex;
  gap: var(--marquee-gap);
  width: fit-content;
  white-space: nowrap;
}

.marquee__content {
  min-width: max-content;
  display: flex;
  gap: var(--marquee-gap);
}

.marquee__content :is(p, h1, h2, h3, h4, h5, h6) {
  white-space: nowrap;
}

.marquee__content .marquee__repeated-items * {
  max-width: none;
}

.marquee__repeated-items {
  min-width: max-content;
  display: flex;
  gap: var(--marquee-gap);
  align-items: center;
  justify-content: center;
}

.marquee__repeated-items > * {
  align-content: center;
}

.hero__content-wrapper.layout-panel-flex--column marquee-component {
  --margin-inline: var(--full-page-margin-inline-offset);

  width: -webkit-fill-available;
  min-height: max-content;
}

.marquee__content .marquee__repeated-items svg{
  max-width: 200px;
  height: auto;
}

@media screen and (min-width: 750px) {
  .marquee__content .marquee__repeated-items svg{
    max-width: 400px;
  }
}

@media screen and (min-width: 1025px) {
  marquee-scroll.marquee__wrapper {
    width: 100%;
  }
  
  .marquee__content .marquee__repeated-items svg{
    max-width: none;
  }
}

@media (prefers-reduced-motion: no-preference) {
  marquee-scroll .marquee__content,
  marquee-component:not([data-disabled]):has(:not(marquee-scroll)) .marquee__wrapper {
    animation: marquee-motion var(--marquee-speed) linear infinite var(--marquee-direction);
    will-change: transform;
  }

  marquee-scroll .marquee__content {
    --percent: -100%;
    width: max-content;
  }
}

@media (prefers-reduced-motion: no-preference) and (max-width: 749px) {
  marquee-scroll .marquee__content,
  marquee-component:not([data-disabled]):has(:not(marquee-scroll)) .marquee__wrapper {
    animation-duration: calc(var(--marquee-speed) * 3);
  }
}

/* Paused on hover */
@media (hover: hover) {
  marquee-component:hover marquee-scroll .marquee__content,
  marquee-component:hover .marquee__wrapper {
    animation-play-state: paused !important;
  }
}

@keyframes marquee-motion {
  to {
    transform: translate3d(calc(var(--percent, -50%) - (var(--marquee-gap) / 2)), 0, 0);
  }
}

.show-icon {
  position: relative;
  display: block;
  margin: var(--icon-more-margin-top) auto var(--icon-more-margin-bottom);
  text-align: center;
  cursor: pointer;
  width: var(--icon-more-size);
  height: var(--icon-more-size);
  max-width: var(--icon-more-size);
  border: 1px solid var(--icon-more-border);
  background: var(--icon-more-background);
}

.show-icon::before {
  content: "";
  position: absolute;
  width: var(--icon-more-size);
  height: 2px;
  transform: translate(-50%,-50%) rotate(90deg);
  background: var(--icon-more-color);
  border: 0;
  border-radius: 0;
  top: 50%;
  left: 50%;
  pointer-events: none;
}

.show-icon::after {
  content: "";
  position: absolute;
  width: var(--icon-more-size);
  height: 2px;
  transform: translate(-50%, -50%);
  background: var(--icon-more-color);
  border: 0;
  border-radius: 0;
  top: 50%;
  left: 50%;
  pointer-events: none;
}

.site-nav-mobile--list-divider .menu-drawer__inner-submenu .menu-drawer__menu > li:has(.menu-drawer__menu-grid) {
  padding-block-end: var(--padding-lg);
}

.site-nav-mobile--list-divider .menu-drawer__inner-submenu .menu-drawer__menu > li,
.site-nav-mobile--list-divider > li {
  border-bottom: 1px solid var(--color-border);
}

.site-nav-mobile--list {
  height: 100%;
}

.site-nav-mobile--list:not(.active) {
  display: none;
}

.site-nav-mobile .menu-drawer__submenu {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
  background: var(--color-background);
  width: 100%;
}

.product-customer-viewing svg{
  display: inline-block;
  vertical-align: middle;
  width: 2rem;
  height: 2rem;
  margin: -0.2rem 0.5rem 0 0;
}
.product-customer-viewing-message {
  display: inline-block;
  vertical-align: middle;
}

/* Clear padding on mobile, if not full-width */
@media screen and (max-width: 749px) {
  .product-information.section--page-width .product-details > .group-block {
    padding-inline: 0;
  }
}

.view-product-title {
  display: none;
}

.product-details {
  padding: 0;
  display: flex;
  align-self: start;
  justify-content: center;
}

.product-information--details-overlay-on-scroll-mobile .product-details {
  position: sticky;
  top: 0;
}

.product-details .form__label {
  font-size: var(--font-size-heading);
}

@media screen and (min-width: 750px) {
  .product-details {
    position: sticky;
    top: 0;
  }

  .product-details > .group-block {
    height: min-content;
  }
}

.dialog-zoomed-gallery {
  cursor: zoom-out;
}

.dialog--preloading {
  opacity: 0;
}

.product-media__drag-zoom-wrapper {
  aspect-ratio: inherit;
  min-height: inherit;
  min-width: inherit;
  display: inherit;
  flex: inherit;
}

@media screen and (max-width: 749px) {
  media-gallery swiper-component .swiper {
    padding-bottom: 0.5rem !important;
  }

  .dialog-zoomed-gallery {
    /* Prevent scroll wheel or swipe scrolling */
    overscroll-behavior: none;
    scrollbar-width: none;
    display: flex;
    scroll-snap-type: x mandatory;
    overflow-x: hidden;
    scroll-behavior: smooth;
    height: 100%;

    &::-webkit-scrollbar {
      display: none;
    }
  }

  .dialog-zoomed-gallery .product-media-container {
    flex: 0 0 100%;
    scroll-snap-align: start;
    position: relative;
  }

  .dialog-zoomed-gallery .product-media-container--image .product-media {
    aspect-ratio: auto;
    height: 100%;
    width: 100%;
    overflow: hidden;
  }

  .dialog-zoomed-gallery .product-media-container--video,
  .dialog-zoomed-gallery .product-media-container--external_video {
    align-content: center;
  }

  .dialog-zoomed-gallery
    :is(.product-media-container--video, .product-media-container--external_video, .product-media-container--model)
    .product-media {
    aspect-ratio: auto;
    align-items: center;
    height: 100%;

    .product-media__image {
      height: 100%;
    }
  }

  .product-media__drag-zoom-wrapper {
    display: flex;
    aspect-ratio: auto;
    height: 100%;
    width: 100%;
    overflow: scroll;
    scrollbar-width: none;
    justify-content: center;

    &::-webkit-scrollbar {
      display: none;
    }
  }

  .product-media__drag-zoom-wrapper .product-media__image {
    --product-media-fit: contain;

    object-fit: var(--product-media-fit);
    overflow: hidden;
    transform: scale(var(--drag-zoom-scale))
      translate(var(--drag-zoom-translate-x, 0), var(--drag-zoom-translate-y, 0));
  }
}

.dialog-zoomed-gallery__close-button {
  color: var(--color-black);
  z-index: var(--layer-raised);
}

.dialog-zoomed-gallery .product-media-container--zoomable.product-media-container--image {
  cursor: zoom-out;
}

.product-media-container--zoomable.product-media-container--image {
  cursor: zoom-in;
}

.dialog-zoomed-gallery .product-media-container--video deferred-media,
.dialog-zoomed-gallery .product-media-container--external_video deferred-media {
  height: auto;
  aspect-ratio: var(--ratio);
}

.dialog-zoomed-gallery .product-media-container--model .product-media__image {
  /* Make the height match the height of the model-viewer */
  height: 100vh;
}

.video-dialog button {
  width: 100%;
}

.video-modal-dialog deferred-media {
  max-height: 85dvh;
}

.positive_vibes {
  position: relative;
  overflow: hidden;
  display: block;
  min-height: auto;
}

.positive_vibes .text-vibes:not(.js-active) .text-vibes--child {
  display: none;

  &:first-child {
    display: block;
  }
}

.positive_vibes .text-vibes.js-active {
  display: flex;
  flex-direction: column;
  justify-content: center;
  position: absolute;
  top: 0;
  width: 100%;
  transition: all 0.5s ease 0s;
}

.positive_vibes .text-vibes p {
  display: block;
  transition: transform 1s ease-in-out;
  margin: 0;
  padding: 0.4rem 0;
}

.positive_vibes .text-vibes p svg {
  display: inline-block;
  vertical-align: middle;
  width: 2rem;
  height: 2rem;
  stroke: transparent;
  position: relative;
  top: -2px;
  margin-inline-end: 1rem;
}

.text-vibes--child .hot-stock {
  background: var(--color-hot);
  color: var(--color-white);
  padding: 0.3rem 0.6rem 0.3rem 0.7rem;
  border-radius: 0.8rem 0;
  display: inline-block;
}

.text-vibes--child .new-arrivals {
  background: var(--color-new-arrivals);
  color: var(--color-white);
  padding: 0.3rem 0.6rem 0.3rem 0.7rem;
  border-radius: 0.8rem 0;
  display: inline-block;
  margin-inline-end: 1rem;
}

sold-in-last-component.loading {
  opacity: var(--opacity-80);
  pointer-events: none;
  filter: blur(1.5px) brightness(1.15);
  transition: opacity var(--animation-speed-slowest) var(--animation-timing-hover), filter var(--animation-speed-slowest) var(--animation-timing-hover);
}
.product-sold-in-last{
  display: inline-block;
  vertical-align: bottom;
}
.product-sold-in-last svg {
  display: inline-block;
  vertical-align: middle;
  width: 1.8rem;
  height: 1.8rem;
  position: relative;
  top: -0.2rem;
  fill: var(--color-hot);
  margin-right: 0.8rem;
}
.sold-in-last-message {
  display: inline-block;
  vertical-align: middle;
  color: var(--color-hot);
}
@media screen and (max-width: 749px) {
  .product-sold-in-last {
    display: block;
    margin: 1rem 0 0 -0.2rem;
  }
}

.product-quick-add__media {
  --layout-template: 10rem 1fr;
  display: grid;
  grid-template-columns: var(--layout-template);
  gap: 2.4rem;

  &.product-information__media--right {
    --layout-template: 1fr 10rem;
  }
}

.form-ratio {
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
}
.form-ratio--horizontal {
  flex-direction: row;
}
.form-ratio--vertical {
  flex-direction: column;
}

.add-to-cart-button-container {
  gap: 1.5rem;
}

.buy-buttons-block {
  width: 100%;
}

.product-form__buttons {
  display: flex;
  align-items: flex-end;
  flex-wrap: wrap;
  gap: var(--gap);
}

.product-form__buttons > *:not(.quantity-selector, .product-form__quantity, .add-to-cart-button-container) {
  min-width: 100%;
}

.product-form__buttons > .add-to-cart-button-container {
  flex: 1 1;
}

.product-form__buttons--stacked > *:not(.quantity-selector) {
  flex-basis: 51%;
}

.quantity-selector {
  flex-grow: 0;
}

.add-to-cart-button {
  text-transform: var(--button-text-case-primary);
}

.product-form__buttons .shopify-payment-button__button {
  width: 100%;
}

.popup.size-chart > .button {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 10px;
  text-transform: none;
  text-align: left;
}

.popup.size-chart > .button svg {
  top: 0;
}

.social-icons__icon-wrapper {
  display: flex;
  align-items: center;
  justify-content: center;
  height: var(--icon-size-lg);
}

.social-icons__icon {
  display: flex;
  fill: currentColor;
  flex-shrink: 0;
  width: var(--icon-size-lg);
  height: var(--icon-size-lg);
}

.social-icons__icon {
  display: none;
}

.social-icons__icon-wrapper:has(.social-icons__icon path) {
  width: var(--icon-size-lg);

  .social-icons__icon {
    display: block;
  }

  .social-icons__icon-label {
    display: none;
  }
}

.overlay-component {
  opacity: var(--opacity-0);
  visibility: hidden;
  transition: opacity .3s ease, visibility 0s linear .3s;
}
.is-active .overlay-component {
  min-height: 100lvh;
  transform: translateY(-100vh);
  background-color: rgb(var(--color-shadow-rgb) / var(--opacity-70));
  z-index: -1;
  opacity: var(--opacity-100);
  visibility: visible;
  transition: opacity .3s ease, visibility 0s linear 0s;
}
.sticky-atc {
  padding: 1rem;
  z-index: 11;
  opacity: 0;
  visibility: hidden;
  transform: translateY(100%);
  transition: opacity .3s ease, box-shadow .3s ease, transform .3s ease, visibility 0s linear .3s;
  box-shadow: 0 0 1rem 0 rgba(0, 0, 0, 0.2);

  .section {
    padding: 1rem;
  }
}

.sticky-cart-visible .sticky-atc {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
  transition-delay: 0s;
}

.sticky-atc.style-custom {
  max-width: var(--sticky-width);
  left: 50%;
  transform: translateX(-50%);
  bottom: var(--sticky-pos-bottom);
}

.sticky-atc__variant {
  padding: 1.5rem 0 0;
  width: 100%;
  position: absolute;
  top: 0;
  left: 0;
  background-color: #ffffff;
  transform: translateY(-100%);
  opacity: 0;
  pointer-events: none;
  transition: all 0.3s ease-in-out;
  box-shadow: 0 -0.2rem 1rem rgba(0, 0, 0, 0.2);
}

.sticky-atc.is-active .sticky-atc__variant {
  opacity: 1;
  pointer-events: auto;
}

.sticky-atc .variant-selects {
  padding: 2rem 0 0;
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
}

.sticky-atc .add-to-cart-text--add {
  display: none;
}

.sticky-atc .product-form__submit:not(.no-variants) {
  display: none;
}

.sticky-atc.is-active .product-form__submit {
  display: block;
}

.sticky-atc.is-active .button-toggle-variants {
  display: none;
}

.sticky-atc.is-active .add-to-cart-text--add {
  display: block;
}

@media screen and (min-width: 750px) {
  .sticky-atc {
    padding: 0;
  }

  .sticky-atc .section {
    border-top: 1px solid #e5e5e5;
  }

  .sticky-atc .variant-selects .variant-option {
    max-width: fit-content;
  }

  .sticky-atc__variant {
    padding: 0;
  }

  .variant-alignment--left variant-selects {
    justify-content: flex-start;
  }

  .variant-alignment--right variant-selects {
    justify-content: flex-end;
  }

  .variant-alignment--center variant-selects {
    justify-content: center;
  }
}

@media screen and (max-width: 749px) {
  .sticky-atc {
    bottom: calc(var(--toolbar-mobile-height) + 5px);
  }
  
  .sticky-atc__action {
    width: 100%;
  }
}

:root {
  --text-align-default: left;
}

.sub-collection-block {
  align-items: var(--horizontal-alignment);

  .menu__heading {
    justify-content: var(--text-align-default);
  }
}

.sub-collection-block > * {
  text-align: var(--text-align, var(--text-align-default));
  text-wrap: var(--text-wrap);
}

.sub-collection-block a {
  color: var(--color-primary);
  text-decoration-color: transparent;
  text-underline-offset: 0.3rem;

  &:hover {
    color: var(--color-primary-hover);
    text-decoration-color: var(--color-primary-hover);
  }
}

.sub-collection-block .direction--row {
  display: flex;
  justify-content: center;
  flex-direction: row;
  flex-wrap: wrap;
  gap: calc(var(--spacing--size) / 2) var(--spacing--size);

  .menu__item {
    margin: 0;
  }
}

.menu--item-dividers .direction--column > .menu__item {
  border-block-end: var(--style-border-width) solid var(--color-border);
  padding-block-end: var(--spacing--size);
}

.menu--item-dividers .direction--row > .menu__item {
  border-inline-end: var(--style-border-width) solid var(--color-border);
  padding-inline-end: var(--spacing--size);
}

.menu--item-dividers .direction--row > .menu__item:last-child {
  border-inline-end: none;
  padding-inline-end: 0;
}

.menu__item + .menu__item {
  margin-block-start: var(--spacing--size);
}

.sub-collection-block .menu__heading__default{
  display: contents;
  font-size: var(--font-heading--size);
}

.sub-collection-block .menu__heading__default [style="text-decoration:underline"]{
  text-underline-offset: 0.3rem;
}

.sub-collection-block .menu__item{
  font-size: var(--font-link--size);
}

@media screen and (max-width: 749px) {
  .sub-collection-block .direction--row {
    display: block;

    .menu__item + .menu__item {
      margin-block-start: var(--spacing--size);
    }
  }

  .sub-collection-block .mobile-row {
    display: flex;
    justify-content: center;
    flex-direction: row;
    flex-wrap: wrap;
    gap: calc(var(--spacing--size) / 2) var(--spacing--size);

    .menu__item {
      margin: 0;
    }

    .menu__item + .menu__item {
      margin-block-start: 0;
    }
  }

  .menu--item-dividers .direction--row > .menu__item,
  .menu--item-dividers .mobile-row > .menu__item:last-child {
    border-inline-end: none;
    padding-inline-end: 0;
  }

  .menu--item-dividers .mobile-row > .menu__item {
    border-inline-end: var(--style-border-width) solid var(--color-border);
    padding-inline-end: var(--spacing--size);
  }

  .menu--heading-dividers .menu__details {
    border-block-end: var(--style-border-width) solid var(--color-border);
  }

  .menu--heading-dividers .details-content {
    padding-block-end: var(--padding-sm);
  }
}

.accelerated-checkout-block[data-shopify-visual-preview] {
  width: 300px;
}

more-payment-options-link {
  font-size: smaller;
}

more-payment-options-link a {
  --button-color: var(--color-primary);
}

more-payment-options-link a:hover {
  --button-color: var(--color-primary-hover);
}

.shopify-payment-button__more-options[aria-hidden='true'] {
  display: none;
}

/* Checkout Button */
.accelerated-checkout-block.checkout--button-secondary button.shopify-payment-button__button--unbranded {
  --button-color: var(--color-primary);
  --button-background-color: transparent;
  --button-border-color: var(--color-primary);
  --button-border-width: 1px;
  --button-border-radius: 0;
  --button-padding-block-start: 10px;
  --button-padding-block-end: 10px;
}

.accelerated-checkout-block.checkout--button-secondary button.shopify-payment-button__button--unbranded:hover {
  --shadow-horizontal-offset: 0;
  --shadow-vertical-offset: 0;
  --button-color: var(--color-secondary-button-hover-text);
  --button-background-color: var(--color-secondary-button-hover-background);
  --button-border-color: var(--color-secondary-button-hover-border);
}

.add-to-cart-button-inner {
  width: 100%;
  gap: 1rem;

  button {
    padding: 0.5rem;
  }

  button svg {
    width: 2.4rem;
    height: 2.4rem;
  }

  &:has(.wishlist-button) .add-to-cart-button-container,
  &:has(.share-button) .add-to-cart-button-container {
    width: calc(100% - 4.4rem - 1rem);
  }

  &:has(.wishlist-button):has(.share-button) .add-to-cart-button-container {
    width: calc(100% - (4.4rem * 2) - 2rem);
  }
}

@media screen and (min-width: 750px) {
  .add-to-cart-button-inner {
    gap: var(--gap-sm);

    &:has(.wishlist-button) .add-to-cart-button-container,
    &:has(.share-button) .add-to-cart-button-container {
      width: calc(100% - 4.4rem - var(--gap-sm));
    }

    &:has(.wishlist-button):has(.share-button) .add-to-cart-button-container {
      width: calc(100% - (4.4rem * 2) - (var(--gap-sm) * 2));
    }
  }
}

.buy-buttons-block {
  width: 100%;
}

.product-form__buttons {
  display: flex;
  align-items: flex-end;
  flex-wrap: wrap;
  gap: var(--gap);
}

.product-form__buttons > *:not(.quantity-selector, .product-form__quantity, .add-to-cart-button-container) {
  min-width: 100%;
}

.product-form__buttons > .add-to-cart-button-container {
  flex: 1 1;

  @media screen and (max-width: 749px) {
    min-width: 100%;
  }
}

.product-form__buttons--stacked > *:not(.quantity-selector) {
  flex-basis: 51%;
}

.quantity-selector {
  flex-grow: 0;
}

.add-to-cart-button {
  text-transform: var(--button-text-case-primary);
}

.add-to-cart-button.button-secondary {
  text-transform: var(--button-text-case-secondary);
}

.product-form__buttons .shopify-payment-button__button {
  width: 100%;
}

.product__pickup-availabilities {
  width: 100%;
}

.pickup-availability__column {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
}

.pickup-availability__row {
  display: flex;
  gap: var(--padding-xs);
}

.pickup-availability__dialog-row {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
}

.pickup-availability__header-container {
  padding-block-end: var(--padding-2xl);
}

.pickup-location__wrapper {
  display: flex;
  flex-direction: column;
  padding-block: var(--padding-2xl);
  border-top: 1px solid var(--color-border);
  gap: var(--padding-xs);
}

.pickup-location__address-wrapper {
  display: flex;
  flex-direction: column;
  gap: var(--padding-md);
}

.pickup-location__dialog {
  padding: var(--padding-2xl);
  position: fixed;
  border-radius: 0;
  width: var(--sidebar-width);
  max-width: 95vw;
  height: 100%;
  margin: 0 0 0 auto;
  border: var(--style-border-drawer);
  box-shadow: var(--shadow-drawer);
  background-color: var(--color-background);
}

.pickup-location__dialog:modal {
  max-height: 100dvh;
}

.pickup-location__text-sm {
  font-size: var(--font-size--sm);
  margin: 0;
}

.pickup-location__text-xs {
  font-size: var(--font-size--xs);
  margin: 0;
}

.product-form-text__error {
  display: flex;
  align-items: flex-start;
  gap: var(--gap-xs);
}

.pickup-location__button {
  width: fit-content;
  color: var(--color-primary);
  font-size: var(--font-size--xs);
  font-family: var(--font-body--family);
  padding: 0;
  cursor: pointer;
  margin-block: var(--margin-xs);
}

.pickup-location__button:hover {
  color: var(--color-primary-hover);
}

.pickup-location__h4 {
  margin: 0;
}

.pickup-location__text-bold {
  font-size: var(--font-size--md);
  font-weight: 600;
  margin: 0;
}

.pickup-location__availability-wrapper {
  display: flex;
  align-items: center;
  gap: var(--gap-xs);
  font-family: var(--font-paragraph--family);
}

.pickup-location__address {
  font-style: normal;
}

.pickup-location__close-button {
  top: calc(var(--padding-2xl) - (var(--icon-size-xs) / 2));
  right: calc(var(--padding-2xl) - var(--icon-size-xs));
}

.submit-button {
  min-width: max-content;
}

.block-contact-form .contact-form-stack {
  --padding-gap: calc(var(--gap, 0.8rem) / 4);
  display: flex;
  flex-wrap: wrap;
  margin: 0 calc(var(--padding-gap) / -1);

  @media (min-width: 750px) {
    --padding-gap: calc(var(--gap) / 2);
  }

  > .shopify-block {
    display: contents;
  }

  .contact-form-row {
    width: 100%;
    padding: 0 var(--padding-gap);
    margin-bottom: var(--margin-sm);

    @media screen and (min-width: 750px) {
      width: calc(var(--formRowWidth, 50%));
      padding: 0 var(--padding-gap);
      margin-bottom: var(--margin-md);
    }
  }

  .button {
    width: calc(100% - (var(--padding-gap) * 2));
    Margin-inline: auto;
  }
}

.contact-form-input,
.contact-form-textarea {
  border-radius: var(--border-radius);
}

.contact-form-textarea {
  height: var(--textarea-height);
  resize: vertical;
}

.border-style--all {
  border: var(--border-width) solid var(--color-input-border);
}

.border-style--underline {
  border: none;
  border-radius: 0;
  border-bottom: var(--border-width) solid var(--color-input-border);
}

.border-style--none {
  border: none;
}

@media screen and (max-width: 1024px) {
  .form-textarea {
    height: calc(var(--textarea-height) * 0.75);
  }
}

@media screen and (max-width: 749px) {
  .form-textarea {
    height: calc(var(--textarea-height) * 0.5);
  }
}


.email-signup-block {
  @media screen and (max-width: 749px) {
    width: 100%;
  }
}

.email-signup__button {
  white-space: nowrap;
  padding: 0;
}

.email-signup__form {
  display: flex;
  flex-direction: column;
}

.email-signup__input-groups {
  position: relative;
  display: grid;
  align-items: stretch;
  grid-template-columns: 1fr auto;
  background-color: transparent;

  &:has(.email-signup__button--size-custom):not(:has(.email-signup__button--icon)) {
    @media screen and (min-width: 750px) {
      grid-template-columns: calc(100% - var(--size-style-width) - var(--gap)) var(--size-style-width);
    }
  }
}

.email-signup__input-groups:not(:has(.email-signup__button--integrated)) {
  gap: var(--gap);
}

.email-signup__input {
  --box-shadow-color: var(--color-input-border);

  width: 100%;
  border-width: var(--input-border-width);
  border-radius: var(--input-border-radius);
  border-style: solid;
  border-color: var(--color-input-border);
  box-shadow: var(--inputs-shadow-horizontal-offset) var(--inputs-shadow-vertical-offset)
    var(--inputs-shadow-blur-radius) var(--box-shadow-color);

  &.subscription-text {
    border: none;
    padding-inline: 0;
  }
}

.email-signup__input:focus-visible {
  outline: unset;
  outline-offset: unset;
  box-shadow: unset;
}

.email-signup__input.paragraph {
  color: var(--color-input-text);
  outline-color: var(--color-input-background);
}

.email-signup__input,
.email-signup__button--text {
  padding: var(--padding-lg) var(--padding-3xl);
}

.email-signup__input-groups:has(.email-signup__button--integrated) .email-signup__input {
  padding-inline: 1.8rem 5.5rem;
  padding-inline: var(--padding-vertical) var(--padding-horizontal);
}

.email-signup__input-groups:has(.email-signup__button--integrated):has(.email-signup__button--text) .email-signup__input {
  padding-inline: 1.8rem calc(var(--padding-3xl) * 5);
}

.email-signup__input-groups .email-signup__input--underline {
  --box-shadow-color: var(--color-input-border);
  --box-shadow-multiplier: 1;

  color: var(--color-input-text);
  background-color: transparent;
  padding: 1.6rem 2.8rem;
  border: none;
  border-radius: 0;
  border-bottom: var(--border-width) solid var(--border-color);
  transition: box-shadow var(--animation-values);

  &:focus-visible {
    --box-shadow-multiplier: 1.75;
    --box-shadow-color: var(--color-input-text);

    outline: none;
  }
}

.email-signup__input::placeholder {
  color: rgb(var(--color-input-text-rgb) / var(--opacity-70));
}

.email-signup__input-groups .email-signup__input--none {
  color: var(--color-input-text);
  background-color: var(--color-input-background);
  border: none;
}

.email-signup__input:has(+ .email-signup__button--icon),
.email-signup__input:has(+ .email-signup__button--integrated) {
  @media screen and (max-width: 749px) {
    text-align: left;
  }
}

.email-signup__button--icon {
  aspect-ratio: 1;
  padding-inline: var(--padding-xs);
  min-width: auto;
  min-height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;

  &.email-signup__button--icon-fill:not(.button-unstyled) {
    background-color: transparent;
    box-shadow: none;
    padding: 0.5rem;
    align-items: flex-end;

    > svg {
      padding: 0;
    }
  }

  svg {
    color: var(--button-color);
    fill: currentcolor;
    padding: 0.5rem;

    @media screen and (max-width: 749px) {
      padding: 0;
      align-self: center;
      justify-self: center;
      width: var(--icon-size-lg);
      height: var(--icon-size-lg);
    }
  }

  .icon-caret {
    transform: rotate(-90deg);
  }

  &:not(.email-signup__button--integrated) {
    width: auto;
  }
}

.email-signup__button--integrated {
  --button-offset: var(--margin-xs);

  position: absolute;
  height: calc(100% - (var(--button-offset) * 2) - (var(--border-width) * 2));
  right: calc(var(--button-offset) + var(--border-width));
  top: 50%;
  transform: translateY(-50%);

  @media screen and (max-width: 749px) {
    width: fit-content;
  }

  &.email-signup__button--text {
    padding: 0 var(--padding-3xl);
  }

  &.email-signup__button--text.button-unstyled {
    padding: 0 var(--padding-xl);
  }

  &.button-unstyled {
    border-radius: var(--input-border-radius);
  }

  &.email-signup__button--icon-fill:not(.button-unstyled) {
    align-items: center;
  }

  > svg {
    padding: 0;
  }
}

.email-signup__input--underline + .email-signup__button {
  &:not(.email-signup__button--integrated) {
    height: calc(100% + (var(--border-width) * 1));
  }
}

.email-signup__input--underline + .email-signup__button--integrated {
  right: 0;

  &.email-signup__button--text.button-unstyled {
    padding: 0;
  }

  &.button-unstyled {
    border-radius: 0;
  }
}

.email-signup__button:not(.button-unstyled) {
  background: var(--button-background-color);
  background-origin: border-box;
  color: var(--button-color);
  font-weight: var(--button-font-weight-primary);
  text-transform: var(--button-text-case-primary);
}

.email-signup__button.button-secondary {
  font-weight: var(--button-font-weight-secondary);
  text-transform: var(--button-text-case-secondary);
}

.email-signup__button.button-unstyled {
  background-color: transparent;
  color: var(--color-input-text);
}

.email-signup__button.button-unstyled:hover {
  color: rgb(var(--color-input-text-rgb) / var(--opacity-70));
  cursor: pointer;
}

.email-signup__message {
  display: flex;
  align-items: center;
  gap: var(--gap);
}

@media screen and (min-width: 750px) {
  .submit-icon-size {
    width: var(--size-style-width);
  }
  .submit-icon-size svg {
    width: var(--icon-size-desktop);
    height: var(--icon-size-desktop);
  }
}

@media screen and (max-width: 749px) {
  .submit-icon-size svg {
    width: var(--icon-size-mobile);
    height: var(--icon-size-mobile);
  }
}

.input-effect-1{transition: 0.4s;}
.input-effect-1 ~ .focus-border:before,
.input-effect-1 ~ .focus-border:after{content: ""; position: absolute; top: 0; right: 0; width: 0; height: 2px; background-color: var(--focus-border-color,#3399FF); transition: 0.2s; transition-delay: 0.2s;}
.input-effect-1 ~ .focus-border:after{top: auto; bottom: 0; right: auto; left: 0; transition-delay: 0.6s;}
.input-effect-1 ~ .focus-border i:before,
.input-effect-1 ~ .focus-border i:after{content: ""; position: absolute; top: 0; left: 0; width: 2px; height: 0; background-color: var(--focus-border-color,#3399FF); transition: 0.2s;}
.input-effect-1 ~ .focus-border i:after{left: auto; right: 0; top: auto; bottom: 0; transition-delay: 0.3s;}
.input-effect-1.has-focus-border:focus {border-color: transparent;}
.input-effect-1.has-focus-border::placeholder {transition: opacity 0.4s ease-in-out;}
.input-effect-1.has-focus-border:focus::placeholder {opacity: 0;}
.input-effect-1:focus ~ .focus-border:before,
.input-effect-1:focus ~ .focus-border:after{width: 100%; transition: 0.2s; transition-delay: 0.6s;}
.input-effect-1:focus ~ .focus-border:after{transition-delay: 0.2s;}
.input-effect-1:focus ~ .focus-border i:before,
.input-effect-1:focus ~ .focus-border i:after{height: 100%; transition: 0.2s;}
.input-effect-1:focus ~ .focus-border i:after{transition-delay: 0.4s;}

.email-signup__button {
  cursor: pointer;

  svg {
    transition: all 0.2s ease-in-out;
  }

  &:hover {
    svg {
      color: var(--color-primary);
      transform:  scale(1.05);
    }
  }
}

.custom-input-height {
  .email-signup__input {
    height: var(--input-height);

    @media screen and (max-width: 1024px) {
      height: calc(var(--input-height) * 0.75);
    }

    @media screen and (max-width: 749px) {
      height: calc(var(--input-height) * 0.5);
    }
  }
}

.collection-wrapper {
  @media screen and (min-width: 750px) {
    --facets-vertical-col-width: 6;
  }

  @media screen and (min-width: 990px) {
    --facets-vertical-col-width: 2;
  }

  @media screen and (min-width: 1025px) {
    --facets-vertical-col-width: 3;
  }

  &:has(.facets-block-wrapper--right) {
    @media screen and (min-width: 990px) {
      --facets-vertical-col-start: 13;
    }
  }
}

.facets-block-wrapper {
  @media screen and (min-width: 750px) {
    margin-inline: var(--facets-margin-left) var(--facets-margin-right);
    margin-block: 0 var(--facets-margin-bottom);
    grid-column: var(--grid-column--desktop);
  }
}

.facets-block-wrapper--vertical {
  grid-row: 1 / 4;

  @media screen and (max-width: 1024px) {
    margin: 0;
    grid-column: 6 / 14;

    .facets--vertical > .blog-posts__sidebar-item,
    .facets:not(.facets--drawer) {
      display: none;
    }
  }

  @media screen and (max-width: 749px) {
    grid-column: 7 / 14;
  }

  @media screen and (min-width: 1025px) {
    grid-column: var(--grid-column--desktop);
  }
}

.facets-block-wrapper--vertical .facets__disclosure {
  width: fit-content;
}

.facets-block-wrapper--vertical .facets__summary {
  margin-bottom: 0;
  padding: var(--padding-sm);
}

.facets-block-wrapper--vertical + .facets-toggle {
  @media screen and (max-width: 749px) {
    margin: 0;
  }
}

.facets-mobile-wrapper {
  display: flex;
  align-items: center;
  gap: var(--gap-sm);
  justify-content: flex-end;
}

.facets-mobile-wrapper:has(> :nth-child(2)) {
  justify-content: space-between;
}

dialog-component.facets-block-wrapper:not(:has(.facets--drawer[open])) {
  @media screen and (min-width: 750px) {
    display: none;
  }
}

.variant-option__swatch-wrapper {
  position: relative;
  overflow: visible;
  border-radius: var(--options-border-radius);
}

.variant-option--swatches-disabled .variant-option__swatch-wrapper {
  overflow: hidden;
}

.facets-layout .swatch-item .facet-checkbox {
  padding: 0;
  margin: 0;
}

.facets-layout .facets-layout-list--pill .input--primary {
  background-color: rgba(var(--color-foreground-rgb) / 0.05);
}

.facets-layout .swatch-item .input--primary:after {
  box-shadow: none;
  border-radius: var(--swatch--border-radius);
}

.facets {
  --facets-form-horizontal-gap: 20px;
  --facets-horizontal-max-input-wrapper-height: 230px;
  --facets-upper-z-index: var(--layer-raised);
  --facets-open-z-index: var(--layer-heightened);
  --facets-sticky-z-index: var(--layer-sticky);
  --facets-panel-min-width: 120px;
  --facets-panel-height: 300px;
  --facets-grid-panel-width: 300px;
  --facets-clear-padding: var(--padding-md);
  --facets-clear-shadow: 0 -4px 14px 0 rgb(var(--color-foreground-rgb) / var(--facets-low-opacity));
  --facets-input-label-color: rgb(var(--color-input-text-rgb) / var(--opacity-60));
  --facets-clear-all-min-width: 120px;
  --facets-see-results-min-width: 55%;
  --facets-mobile-gap: 22px;
  --facets-low-opacity: 10%;
  --facets-hover-opacity: 75%;

  top: auto;
  bottom: 0;
  height: var(--drawer-height);
  max-height: var(--drawer-height);
  width: var(--drawer-width);
  max-width: var(--drawer-max-width);
  box-shadow: none;
  padding-block: 0;
  display: block;
  grid-column-start: span 3;

  &:not(.facets--drawer) {
    @media screen and (min-width: 750px) {
      padding-inline: var(--padding-inline-start) var(--padding-inline-end);
      width: 100%;
      max-width: 100%;
    }
  }
}

.facets-container {
  display: grid;
  grid-template-columns: repeat(2, auto);
  grid-template-rows: repeat(2, auto);
  padding-top: 1rem;

  .facets--vertical & {
    display: block;
  }
}

@media screen and (min-width: 750px) {
  .facets-container > * + * {
    margin-top: 0;
  }
}

@media screen and (max-width: 1024px) {
  .facets-container {
    grid-template-columns: 1fr 1fr 1fr;
    column-gap: 2rem;
  }

  .facets {
    grid-column-start: span 1;

    &.facets-vertical-sort {
      grid-column: 2 / 6;

      .switcher-grid ul {
        padding: 1.3rem 1rem;
      }
    }

    .divider {
      display: none;
    }
  }

  .facets--vertical .facets-container {
    grid-template-columns: 1fr;
  }
}

@media screen and (max-width: 749px) {
  .facets-container {
    grid-template-columns: 1fr max-content 1fr;
  }

  .facets.facets-vertical-sort {
    grid-column: 1 / 7;
  }
}

@media screen and (min-width: 1025px) {
  .facets-vertical-form {
    display: grid;
    align-items: baseline;
    gap: 0 3.5rem;
    grid-template-columns: 1fr max-content max-content;
  }
}

.facets-vertical-sort--vertical .facets-vertical-form {
  @media screen and (min-width: 1025px) {
    grid-template-columns: 1fr;
  }

  .sorting-wrapper {
    justify-content: space-between;
  }

  .facets__summary {
    margin-bottom: 0;
    padding: var(--padding-sm);
  }
}

@media screen and (min-width: 1025px) {
  .facets-vertical-sort--vertical-divider {
    border-top: var(--style-border-width) solid var(--color-border);
  }
}

.collection-wrapper:has(.collection-wrapper--full-width) .facets--vertical:not(.facets--drawer) {
  @media screen and (min-width: 750px) {
    padding-inline-start: max(var(--padding-sm), var(--padding-inline-start));
  }
}

.facets--drawer {
  border-radius: 0;
  border-right: var(--style-border-drawer);
  box-shadow: var(--shadow-drawer);
  padding-inline: 0;
}

.facets--drawer[open] {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

.facets.facets-controls-wrapper {
  @media screen and (min-width: 750px) {
    grid-column: column-1 / column-12;
    color: rgb(var(--color-foreground-rgb) / var(--opacity-70));
    gap: 0 var(--facets-form-horizontal-gap);
    padding-bottom: var(--padding-xs);
  }
}

.collection-wrapper:has(.product-grid-mobile--large) .facets-mobile-wrapper.facets-controls-wrapper {
  @media screen and (max-width: 749px) {
    display: none;
  }
}

.facets__inputs {
  display: flex;
  flex-direction: column;
  gap: var(--padding-lg);
  width: 100%;
}

:is(.facets--drawer, .facets--vertical) .facets__inputs:not(:has(.show-more)) {
  padding-block-end: var(--padding-sm);
}

/* Facets - Price */
.facets__priceblock .facets-price__range {
  padding-block: var(--padding-sm);
}

/* Facets - Form */
.facets__form-wrapper {
  display: flex;
  flex-direction: column;
  color: var(--color-foreground-muted);
  width: 100%;
}

.facets__form-vertical .facets__form-wrapper-inner {
  display: flex;
  flex-direction: column;
  gap: var(--filter-gap-vertical);
}

.facets__form {
  display: flex;
  flex-flow: column;
  width: 100%;
  height: 100%;
  align-items: flex-start;
}

.facets:not(.facets--drawer) .facets__filters-wrapper {
  @media screen and (min-width: 750px) {
    margin-inline-end: var(--margin-md);
  }
}

/* sorting */
.sorting-wrapper {
  flex: 1;
  justify-content: flex-end;
}

/* Facets - Summary */
.facets__summary {
  --variant-picker-swatch-width: 32px;
  --variant-picker-swatch-height: 32px;
  --icon-opacity: 0.5;

  font-size: var(--body-s-font-size);
  padding: 0;
  display: flex;
  justify-content: space-between;

  &:hover {
    --icon-opacity: 1;
  }

  > .svg-wrapper {
    margin-right: 0;
  }

  @media screen and (min-width: 750px) {
    --variant-picker-swatch-width: 26px;
    --variant-picker-swatch-height: 26px;
  }
}

.facets--panel-style-underline .blog-posts__sidebar-item summary,
.facets--panel-style-underline .facets__summary {
  border-bottom: .1rem solid rgb(var(--color-foreground-rgb) / var(--opacity-10));
}

.facets__filters-wrapper:hover .facets__summary,
.facets__filters-wrapper:has(.facets__panel[open]) .facets__summary {
  opacity: var(--facets-hover-opacity);
}

.facets__filters-wrapper .facets__summary:hover,
.facets__filters-wrapper .facets__panel[open] .facets__summary {
  opacity: 1;
}

.facets__summary .icon-caret {
  height: var(--icon-size-xs);
  width: var(--icon-size-xs);
  color: rgb(var(--color-foreground-rgb) / var(--icon-opacity));
  margin-block: var(--margin-2xs);
  transition: color var(--animation-speed) var(--animation-easing),
    transform var(--animation-speed) var(--animation-easing);
}

.facets--drawer .facets__summary .icon-caret {
  margin-inline-start: var(--margin-2xs);
}

/* Facets - Bubble */
.facets__bubble {
  display: inline-flex;
  font-family: var(--font-paragraph--family);
  font-weight: var(--font-paragraph--weight);
  aspect-ratio: 1 / 1;
  line-height: 1;
}

/* Facets - Inputs */
.facets__inputs-wrapper {
  margin-block: var(--padding-xs) var(--padding-xs);
}

.facets__inputs .show-more {
  display: flex;
  flex-direction: column;
  gap: var(--gap-xl);
  margin-block-end: var(--padding-xl);
}

.facets:not(.facets--drawer) .facets__inputs-wrapper {
  @media screen and (min-width: 750px) {
    gap: var(--gap-sm);
  }
}

@media screen and (max-width: 749px) {
  .facets__inputs:has(.show-more) .facets__inputs-wrapper {
    padding-block: var(--padding-sm);
    padding-inline: var(--padding-sm);
    margin-block: calc(var(--padding-sm) * -1);
    margin-inline: calc(var(--padding-sm) * -1);
  }
}

.facets__inputs-wrapper:not(:has(.facets__inputs-list)),
.facets__inputs-wrapper .facets__inputs-list {
  display: flex;
  gap: var(--facets-mobile-gap);
  flex-direction: column;

  @media screen and (min-width: 750px) {
    gap: var(--gap-sm);
  }
}

@media screen and (min-width: 750px) {
  .facets--horizontal
    .facets__inputs-wrapper
    .facets__inputs-list--swatches:not(.facets__inputs-list--swatches-grid) {
    display: grid;
    grid-template-columns: repeat(var(--swatch-columns, 4), 1fr);
  }
}

.facets__inputs-wrapper .facets__inputs-list--swatches {
  --facets-mobile-gap: var(--gap-sm);
}

.facets__inputs-wrapper .facets__inputs-list--grid {
  --min-column-width: 20%;

  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(var(--min-column-width), 1fr));
  gap: var(--gap-sm);

  @media screen and (min-width: 750px) {
    --min-column-width: 50px;
  }
}

.facets-block-wrapper:not(.facets-block-wrapper--vertical) .facets__inputs-list--grid {
  @media screen and (min-width: 750px) {
    width: var(--facets-grid-panel-width);
  }
}

.facets__inputs-wrapper--row:not(:has(.facets__inputs-list)),
.facets__inputs-wrapper--row .facets__inputs-list {
  flex-wrap: wrap;
  flex-direction: row;
}

.facets__inputs .show-more__button {
  --show-more-icon-size: 22px;
  --show-more-gap: 8px;

  gap: var(--show-more-gap);

  @media screen and (min-width: 750px) {
    --show-more-icon-size: 16px;
    --show-more-gap: 6px;
  }
}

.facets__inputs .show-more__button .icon-plus {
  width: var(--show-more-icon-size);
  height: var(--show-more-icon-size);

  svg {
    width: var(--icon-size-xs);
    height: var(--icon-size-xs);
  }
}

/* Facets - Panel */
.facets__panel {
  padding: 0 var(--drawer-padding);
}

.facets__panel .field__input {
  font-size: var(--body-xs-font-size);
}

.facets__panel--frame .facets__summary {
  border: var(--style-border-width) solid var(--color-foreground);
  border-radius: var(--style-border-radius-buttons-primary);
}

.facets__display {
  border-width: var(--style-border-width);
  border-style: solid;
  border-color: var(--color-foreground);
  border-radius: var(--style-border-radius-buttons-primary);
  box-shadow: var(--popup-shadow);
  background: var(--color-background);
  position: absolute;
  top: 100%;
  left: 0rem;
  width: 35rem;
  box-shadow: rgba(var(--color-shadow-rgb) / 0.2) 0px 0px 20px;
}

.facets:not(.facets--drawer) .facets__panel,
.facets-controls-wrapper .facets__panel {
  @media screen and (min-width: 750px) {
    padding: 0;
  }
}

.facets-mobile-wrapper .facets__panel-content {
  border-radius: var(--style-border-radius-popover);
}

.facets-mobile-wrapper {
  --facets-upper-z-index: var(--layer-raised);
  --facets-panel-min-width: 120px;
  --facets-panel-height: 300px;
}

.facets--horizontal .facets__panel-content,
.sorting-filter__options {
  @media screen and (min-width: 750px) {
    border-radius: var(--style-border-radius-popover);
    position: absolute;
    top: 100%;
    width: max-content;
    min-width: var(--facets-panel-min-width);
    max-width: var(--facets-panel-width);
    max-height: var(--facets-panel-height);
    z-index: var(--facets-upper-z-index);
    box-shadow: var(--style-shadow-popover);
    border: var(--style-border-popover);
    background: var(--color-background);
    overflow-y: hidden;
    gap: 0;
  }
}

:is(.facets--drawer, .facets--vertical) :is(.facets__item, .sorting-filter)::before {
  content: '';
  display: block;
  height: 0;
  width: calc(100% - var(--drawer-padding) * 2);
  border-top: var(--style-border-width) solid var(--color-border);
  margin: 0 auto;
}

@media screen and (min-width: 750px) {
  .facets--horizontal .facets__item:not(:first-of-type)::before,
  .facets--horizontal .sorting-filter::before {
    content: none;
  }
}

/* Facets - Text */
.facets__label,
.facets__clear-all,
.clear-filter {
  text-decoration-color: transparent;
  text-decoration-thickness: 0.075em;
  text-underline-offset: 0.125em;
  transition: text-decoration-color var(--animation-speed) var(--animation-easing);
}

.facets__label,
.products-count-wrapper {
  text-transform: var(--facet-label-transform);
}

.clear-filter {
  background-color: transparent;
  box-shadow: none;
  padding: 0;
}

/* Facets - Label */
.facets__label {
  color: var(--color-foreground);
  cursor: pointer;
  font-size: var(--font-size, var(--body-s-font-size));
  margin: 0;
}

/* Facet checkbox */
.facet-checkbox {
  padding: 0rem;
  flex-grow: 1;
  position: relative;
  font-size: var(--font-size, var(--body-xs-font-size));
  display: flex;
  align-items: center;
  word-break: break-word;
}


/* Products count */
.products-count-wrapper {
  display: none;
}

/* Facets - Active facets */
.active-facets {
  grid-column: 1 / -1;
  grid-row: 4;
  row-gap: var(--margin-xs);

  .results-count {
    font-size: var(--body-xs-font-size);
    color: rgba(var(--color-foreground-rgb) / var(--opacity-50));
  }

  @media screen and (max-width: 1024px) {
    margin: 0 -1.2rem 1.2rem;
  }

  @media screen and (min-width: 1025px) {
    grid-column: 1 / -1;
    grid-row: 2;
  }

  .mobile-facets & {
    row-gap: var(--margin-2xs);
  }
}

.active-facets-vertical-filter .active-facets__button-wrapper {
  margin-right: 0;
}

.active-facets-vertical-filter:not(:has(+ facet-remove)) .active-facets__button-wrapper {
  display: none;
}

.active-facets__button {
  margin-right: var(--margin-xs);
  padding: calc(var(--padding-2xs) + var(--padding-3xs)) var(--padding-sm);
  border: 1px solid rgba(var(--color-foreground-rgb) / 0.05);
  background: rgba(var(--color-foreground-rgb) / 0.05);
  transition: background var(--animation-speed-slow) var(--animation-timing-hover),
    border var(--animation-speed-slow) var(--animation-timing-hover),
    transform var(--animation-speed-slow) var(--animation-timing-hover);
}

@media (hover: hover) {
  facet-remove:hover .active-facets__button {
    background: rgba(var(--color-foreground-rgb) / 0.2);
    border: 1px solid rgba(var(--color-foreground-rgb) / 0.2);
    transform: translateY(-0.2rem);
  }
}

/* Mobile specific components */
.facets__title-wrapper {
  background: var(--color-background);
  color: var(--color-foreground);
  position: sticky;
  top: 0;
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding-block: var(--padding-xs);
  padding-inline-start: var(--drawer-padding);
  padding-inline-end: var(--padding-2xs);
  z-index: var(--facets-sticky-z-index);
}

:is(.facets--horizontal, .facets--vertical) .facets__title-wrapper {
  @media screen and (min-width: 750px) {
    display: none;
  }
}

.facets-drawer__title {
  --variant-picker-swatch-width: 32px;
  --variant-picker-swatch-height: 32px;

  margin: 0;
  display: flex;
  align-items: center;
  gap: var(--gap-xs);

  @media screen and (min-width: 750px) {
    --variant-picker-swatch-width: 26px;
    --variant-picker-swatch-height: 26px;
  }
}

.facets-drawer__close {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  background-color: transparent;
  border: none;
  cursor: pointer;
  width: var(--minimum-touch-target);
  height: var(--minimum-touch-target);
  box-shadow: none;
}

/* Status */
.facets__status {
  margin-left: var(--margin-xs);
}

.facets__header-vertical .facets__status {
  margin-left: 0;
}

.facets__status:not(:empty) {
  width: max-content;
  display: flex;
  font-weight: 500;
  color: var(--color-foreground);
}

.facets--filters-title {
  margin-block-end: 0;
  color: var(--color-foreground);
  height: fit-content;

  @media screen and (max-width: 749px) {
    display: none;
  }
}

/* Facets - Vertical */
.facets--vertical {
  .active-facets-mobile {
    margin: 1.2rem 0;
    padding: 0rem var(--padding-sm);
  }
  .facets-layout-list {
    padding-block: var(--padding-xs);
    gap: var(--gap-md);
    display: flex;
    flex-flow: column;

    &.facets-layout-list--pill ,
    &:has(.swatch-item) {
      flex-direction: row;
      flex-wrap: wrap;
    }
  }
  .facets-wrap-vertical,
  .blog-posts__sidebar-item .details-content {
    padding: 0 0 var(--padding-xs);
    margin: var(--margin-sm) 0 0;
    font-size: var(--font-size--sm);
  }

  .blog-posts__sidebar-item summary {
    padding: var(--padding-sm);
  }

  &.facets--panel-style-frame .blog-posts__sidebar-item summary {
    border: var(--style-border-width) solid var(--color-foreground);
    border-radius: var(--style-border-radius-buttons-primary);
  }

  .facets__inputs:has(.show-more) .facets__inputs-wrapper {
    padding-block: var(--padding-sm);
    padding-inline: var(--padding-sm);
    margin-block: calc(var(--padding-sm) * -1);
    margin-inline: calc(var(--padding-sm) * -1);
  }

  &.facets--panel-style-underline .facets__summary,
  &.facets--panel-style-underline .blog-posts__sidebar-item summary {
    padding-inline: 0;
  }

  @media screen and (max-width: 1024px) {
    .facets-container {
      grid-template-columns: 1fr;
    }
  }

  @media screen and (min-width: 750px) {
    .facets__item:not(:first-of-type)::before,
    .sorting-filter::before {
      content: '';
    }

    .facets__inputs-wrapper .facets__inputs-list--swatches {
      gap: var(--gap-sm);
    }
  }

  @media screen and (min-width: 750px) {
    padding-block: 0 var(--padding-block-end);
    display: flex;
    flex-direction: column;
    position: auto;
    top: 0;
    bottom: auto;
    height: auto;
    max-height: none;
    width: auto;
    overflow: visible;
    gap: var(--filter-gap-vertical);
  }

  @media screen and (min-width: 1025px) {
    &.facets--vertical-sticky {
      position: sticky;
    }
  }
}

/* Facets - Horizontal */

.facets--horizontal {
  display: flex;

  .facets__list {
    padding: 1rem 0;
    gap: var(--gap-md);
    display: flex;
    flex-flow: column;
  }

  .facet-filters__sort .facets__list {
    padding: .5rem 2rem;
  }

  @media screen and (min-width: 750px) {
    padding-block: var(--padding-block-start) var(--padding-block-end);
    align-items: center;
    position: relative;
    z-index: var(--facets-upper-z-index);
    border: none;
    height: auto;
    top: initial;
    bottom: initial;
    max-height: none;
    width: auto;
    overflow: visible;
  }

  .active-facets {
    margin-top: var(--margin-2xl);

    .active-facets__button-wrapper {
      margin-right: var(--margin-xs);
    }
  }

  .products-count-wrapper {
    @media screen and (min-width: 750px) {
      display: flex;
      margin-left: auto;
      flex-shrink: 0;
      align-items: center;
      height: var(--minimum-touch-target);
    }
  }

  .active-facets__button {
    margin-top: 0;
  }

  .facets__panel .facets__status:has(:not(:empty)) {
    @media screen and (min-width: 750px) {
      display: flex;
      margin-inline-start: var(--margin-xs);
      margin-inline-end: var(--margin-xs);
    }
  }

  .facets__form {
    @media screen and (min-width: 750px) {
      gap: 0 var(--facets-form-horizontal-gap);
      flex-flow: row nowrap;
      height: auto;

      &.facets__form--divider {
        flex-direction: column;
      }
    }
  }

  .facets__panel {
    @media screen and (min-width: 750px) {
      position: relative;
      width: fit-content;
    }
  }

  .facets__inputs .show-more {
    @media screen and (min-width: 750px) {
      display: contents;
    }
  }

  .facets__inputs-wrapper {
    @media screen and (min-width: 750px) {
      max-height: var(--facets-horizontal-max-input-wrapper-height);
      scrollbar-width: none;
      -ms-overflow-style: none;
      overflow-x: auto;
      padding: var(--padding-md);
      margin-block: 0;
    }
  }

  .facet-filters__field-label {
    font-size: var(--font-size);
  }

  .facets__summary {
    padding: var(--padding-xs) var(--padding-sm);
    min-width: 9rem;
    @media screen and (min-width: 750px) {
      font-size: var(--font-size);
      justify-content: flex-start;
      height: var(--minimum-touch-target);
    }
  }

  .facets__filters-wrapper {
    @media screen and (min-width: 750px) {
      max-width: 60%;
      display: flex;
      flex-wrap: wrap;
      column-gap: var(--gap-xl);
      margin-inline-end: 0;
    }
  }

  .facets__form:not(.facets__form--divider) .sorting-wrapper {
    flex-wrap: wrap;
  }

  .facets__form.facets__form--divider {
    .sorting-wrapper {
      display: grid;
      grid-template-columns: 1fr;
      gap: var(--margin-xl);
      width: 100%;

      @media screen and (min-width: 1025px) {
        grid-template-columns: 1fr max-content minmax(max-content, 1fr);
      }
    }

    .facets__form-wrapper {
      flex: 1 0 100%;
      max-width: 100%;
    }

    .divider__line {
      flex-basis: 100%;
      min-height: 100%;
      border-bottom: 1px solid var(--color-border);
    }
  }

  .facets__form-wrapper {
    @media screen and (min-width: 750px) {
      flex-direction: row;
      height: auto;
      align-items: flex-start;
      display: flex;
      gap: var(--margin-2xl);
      flex: 1 0 60%;
      max-width: 60%;
    }

    .facets__form-wrapper-inner {
      display: flex;
      flex-wrap: wrap;
      gap: var(--margin-2xl);
    }
  }

  .swatch-input-wrapper .swatch-input__label {
    display: flex;
    align-items: center;
    gap: var(--gap-xs);
    font-size: var(--font-size--sm);
  }

  .swatch-input-wrapper .swatch-input__label .visually-hidden {
    position: static !important;
    overflow: visible;
    width: auto;
    height: auto;
    margin: 0;
    padding: unset;
    border: initial;
    clip: auto;
    word-wrap: break-word !important;
  }

  .swatch-input-wrapper .swatch-input__label .facet-checkbox__text {
    position: absolute !important;
    overflow: hidden;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    border: 0;
    clip: rect(0 0 0 0);
    word-wrap: normal !important;
  }
}

.collection-wrapper:has(> .facets--horizontal) .facets__panel[open] {
  @media screen and (min-width: 750px) {
    z-index: var(--facets-open-z-index);
  }
}

.footer-utilities {
  width: 100%;
  text-wrap: nowrap;
  border-top: var(--border-width) solid var(--color-border);
  color: var(--color-foreground-muted);
}

@media screen and (min-width: 750px){
  .group-block-content > .footer-utilities {
    width: auto;
  }
}

.footer-utilities a {
  color: var(--color-foreground-muted);
}

.footer-utilities__group {
  text-align: center;
  align-items: center;
  justify-content: var(--horizontal-alignment);
  flex-wrap: wrap;
}

.footer-utilities__group--right {
  display: flex;
  flex-direction: column;
  @media screen and (min-width: 750px) {
    flex-direction: row;
    align-items: baseline;
    gap: var(--gap-2xs) var(--gap-xl);
  }
}

.footer-utilities__group:empty {
  @media screen and (max-width: 749px) {
    display: none;
  }
}

.icon-block {
  display: flex;
  flex-shrink: 0;
  fill: currentcolor;
}

.icon-block__media {
  height: auto;
  object-fit: cover;
  aspect-ratio: var(--ratio);
}

.image-zoomin {
  overflow: hidden;
  .icon-block__media {
    transition: transform var(--hover-transition-duration) var(--hover-transition-timing);
  }

  &:hover .icon-block__media {
    transform: scale(var(--hover-subtle-zoom-amount));
  }
}

.image-carousel .swiper .swiper-pagination.swiper-pagination-pos--inside {
  --swiper-pagination-bottom: 3.5rem;
}

.image-with-content-block {
  width: var(--width);
  height: auto;
}

.image-with-content-block > * {
  text-align: var(--text-align, var(--text-align-default));
}

.text-block--align-left {
  margin-inline-end: auto;
}

.text-block--align-center {
  margin-inline: auto;
}

.text-block--align-right {
  margin-inline-start: auto;
}

.logo-block {
  width: calc(var(--logo-width) + var(--padding-inline-start) + var(--padding-inline-end));
  max-width: 100%;
  max-height: calc(var(--logo-height, 100%) + var(--padding-block-start) + var(--padding-block-end));
  font-size: var(--logo-height);
  display: flex;

  @media screen and (max-width: 749px) {
    max-height: calc(
      var(--logo-height-mobile, var(--logo-height, 100%)) + var(--padding-block-start) + var(--padding-block-end)
    );
    font-size: var(--logo-height-mobile, var(--logo-height));
    width: calc(
      var(--logo-width-mobile, var(--logo-width)) + var(--padding-inline-start) + var(--padding-inline-end)
    );
  }
  .text-block {
    line-height: 1;
  }
}

.logo-block__image-wrapper {
  display: flex;
  width: 100%;
  max-width: 100%;
  max-height: 100%;
}

.logo-block__image {
  object-fit: contain;
  width: 100%;
}

.shopify-block:has(.map-embed) {
  width: 100%;
}

.marquee-circle {
  width: var(--width);
  height: var(--width);

  @media screen and (max-width: 749px) {
    width: var(--mobile-width);
    height: var(--mobile-width);
  }

  &.position-style {
    position: absolute;
    top: var(--position-vertical);
    left: var(--position-horizontal);
    transform: translate(-50%, -50%);
    z-index: 1;

    @media screen and (max-width: 749px) {
      top: var(--position-vertical-mobile);
      left: var(--position-horizontal-mobile);
    }
  }
}

.circle-path {
  position: absolute;
  inset: 0;
}

.circle-animation {
  width: 110%;
  height: 110%;
  animation: rotate-circle var(--marquee-speed) linear infinite var(--marquee-direction);
  transform-origin: center;
  will-change: transform, letter-spacing;
  letter-spacing: 0;
}

.pause-on-hover:hover .circle-animation {
  animation-play-state: paused;
}

@keyframes rotate-circle {
  0% {
    letter-spacing: -2px;
  }
  50% {
    letter-spacing: 0;
  }
  100% {
    letter-spacing: -2px;
    transform: rotate(-1turn);
  }
}

:root {
  --text-align-default: left;
}

[style*='--horizontal-alignment: center'] .menu-block {
  --text-align-default: center;
}

[style*='--horizontal-alignment: flex-end'] .menu-block {
  --text-align-default: right;
}

[style*='--horizontal-alignment: flex-start'] > .menu-block {
  --text-align-default: left;
}

[style*='--horizontal-alignment: center'] > .menu-block {
  --text-align-default: center;
}

[style*='--horizontal-alignment: flex-end'] > .menu-block {
  --text-align-default: right;
}

.menu-block {
  align-items: var(--horizontal-alignment);

  .menu__heading {
    justify-content: var(--text-align-default);
  }
}

.menu-block > * {
  text-align: var(--text-align, var(--text-align-default));
  text-wrap: var(--text-wrap);
}

.menu-block a {
  color: var(--color-primary);
  text-decoration-color: transparent;
  text-underline-offset: 0.3rem;

  &:hover {
    color: var(--color-primary-hover);
    text-decoration-color: var(--color-primary-hover);
  }
}

.menu-block .direction--row {
  display: flex;
  justify-content: center;
  flex-direction: row;
  flex-wrap: wrap;
  gap: var(--spacing--size);

  .menu__item {
    margin: 0;
  }
}

.menu--item-dividers .direction--column > .menu__item {
  border-block-end: var(--style-border-width) solid var(--color-border);
  padding-block-end: var(--spacing--size);
}

.menu--item-dividers .direction--row > .menu__item {
  border-inline-end: var(--style-border-width) solid var(--color-border);
  padding-inline-end: var(--spacing--size);
}

.menu--item-dividers .direction--column > .menu__item:last-child {
  border-block-end: none;
  padding-block-end: 0;
}

.menu--item-dividers .direction--row > .menu__item:last-child {
  border-inline-end: none;
  padding-inline-end: 0;
}

.menu:not(:has(.menu__heading--empty)) .details-content {
  margin-block-start: var(--spacing--size);
  margin-block-end: var(--spacing--size);
}

.menu__item + .menu__item {
  margin-block-start: var(--spacing--size);
}

.menu .menu__heading--empty {
  display: none;
}

.menu__heading__default {
  display: contents;
}

.menu__heading__accordion {
  display: none;
}

@media screen and (max-width: 749px) {
  [style*='--horizontal-alignment-mobile: center'] .menu-block {
    --text-align-default: center;
  }

  [style*='--horizontal-alignment-mobile: flex-end'] .menu-block {
    --text-align-default: right;
  }

  [style*='--horizontal-alignment-mobile: flex-start'] > .menu-block {
    --text-align-default: left;
  }

  [style*='--horizontal-alignment-mobile: center'] > .menu-block {
    --text-align-default: center;
  }

  [style*='--horizontal-alignment-mobile: flex-end'] > .menu-block {
    --text-align-default: right;
  }

  .menu-block .direction--row {
    display: block;

    .menu__item + .menu__item {
      margin-block-start: var(--spacing--size);
    }
  }

  .menu-block .mobile-row {
    display: flex;
    justify-content: center;
    flex-direction: row;
    flex-wrap: wrap;
    gap: var(--spacing--size);

    .menu__item {
      margin: 0;
    }

    .menu__item + .menu__item {
      margin-block-start: 0;
    }
  }

  .menu--item-dividers .direction--column > .menu__item,
  .menu--item-dividers .mobile-column > .menu__item:last-child {
    border-block-end: none;
    padding-block-end: 0;
  }

  .menu--item-dividers .direction--row > .menu__item,
  .menu--item-dividers .mobile-row > .menu__item:last-child {
    border-inline-end: none;
    padding-inline-end: 0;
  }

  .menu--item-dividers .mobile-column > .menu__item {
    border-block-end: var(--style-border-width) solid var(--color-border);
    padding-block-end: var(--spacing--size);
  }

  .menu--item-dividers .mobile-row > .menu__item {
    border-inline-end: var(--style-border-width) solid var(--color-border);
    padding-inline-end: var(--spacing--size);
  }

  .menu--accordion .menu__heading--empty {
    display: flex;
  }

  .menu--accordion .menu__heading__accordion {
    display: contents;
  }

  .menu--accordion .menu__heading__default {
    display: none;
  }

  .menu--accordion .details-content > ul {
    padding-block-start: var(--spacing--size);
  }

  .menu--accordion .menu__details {
    padding-inline: 0;
  }

  .menu--accordion .menu__details[open] {
    --margin-block-end-mobile: calc(var(--margin-block-end, 0px) * 1.5);
  }

  .menu--heading-dividers .menu__details {
    border-block-end: var(--style-border-width) solid var(--color-border);
  }

  .menu--heading-dividers .details-content {
    padding-block-end: var(--padding-sm);
  }
}

.menu--caret .icon-plus,
.menu--plus .icon-caret {
  display: none;
}

.border-separator-item + .border-separator-item {
  &:before {
    content: '';
    position: absolute;
    top: 0;
    left: calc(var(--grid-desktop-horizontal-spacing) / -2);
    width: 0.1rem;
    height: 100%;
    background-color: var(--color-border);
  }
}

.page-block {
  display: flex;
  flex-direction: column;
  max-width: 100%;
  max-height: 100%;
  width: 100%;
  height: auto;
  align-items: flex-start;
}

.page-title {
  margin-bottom: var(--margin-xl);
}

.page-block table {
  box-shadow: none;

  td {
    border: var(--border-width) var(--border-style) var(--border-color);
  }

  tbody tr:nth-child(odd) {
    background-color: rgb(var(--color-foreground-rgb) / var(--opacity-10));
  }
}

.payment-icons__list {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
}

.payment-icons__list.left {
  justify-content: flex-start;
}

.payment-icons__list.center {
  justify-content: center;
}

.payment-icons__list.right {
  justify-content: flex-end;
}

.tax-note:empty {
  display: none;
}

form.payment-terms {
  padding-top: 0.5em;
}

.installments:not(:has(shopify-payment-terms)) {
  display: none;
}

.card--block-countdown .product-countdown-label {
  font-size: var(--font-size);
}

.product-inventory__status {
  display: flex;
  align-items: center;
  font-size: var(--font-paragraph--size);
  line-height: var(--font-paragraph--line-height);
  gap: var(--padding-xs);
}

.product-inventory__icon,
.product-inventory__icon svg {
  width: var(--icon-size-sm);
  height: var(--icon-size-sm);
}

.product-inventory__icon-low {
  color: var(--color-lowstock);
}

.product-inventory__icon-in_stock {
  color: var(--color-instock);
}

.product-inventory__icon-out_of_stock {
  color: var(--color-outofstock);
}

.product-inventory__icon circle:first-of-type {
  opacity: var(--opacity-30);
}

.product-recommendations
.product-recommendations__skeleton-item {
  aspect-ratio: 3 / 4;
  background-color: transparent;
}

@media screen and (max-width: 749px) {
  .product-recommendations__skeleton-item:nth-child(2n + 1) {
    display: none;
  }
}

product-recommendations:has([data-has-recommendations='false']) {
  display: none;
}

/* Featured Collection */
@media screen and (max-width: 749px) {
  .swiper-component-mobile .swiper-wrapper {
    flex-wrap: nowrap;
    gap: 0px;
  }

  .swiper-component-mobile .grid__item.swiper-slide {
    max-width: 100%;
  }
}

.collection-carousel-swiper-component.full-width .swiper {
  overflow: visible;
}

.collection-carousel-swiper-component.full-width .swiper-btns-wrap:not(.swiper-btns-wrap--bottom) {
  position: absolute;
  width: 100%;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
  z-index: 1;
}

.product-infinite-scroll {
  margin-top: var(--show-more-button-offset, 5.5rem);
}

@media screen and (max-width: 1024px) {
  .product-infinite-scroll {
    margin-top: calc(var(--show-more-button-offset, 5.5rem) * 0.75);
  }
  .type-style--tabs-carousel .section-global__content.has-media-banner .collection-banner {
    display: none;
  }
}

@media screen and (max-width: 749px) {
  .product-infinite-scroll {
    margin-top: calc(var(--show-more-button-offset, 5.5rem) * 0.5);
  }
}

.section--featured-collection .content-inside-media {
  padding: 3rem 1rem;

  .content-inside-media__inner {
    max-width: 500px;
  }
}

.shopify-block:has(.coupon-code-block) {
  width: 100%;
}

.coupon-code-block {
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--input-border-color);
  background-color: var(--input-bg);
  padding: var(--pt) var(--pr) var(--pb) var(--pl);
  font-weight: bold;
  width: 100%;
  cursor: default;
  transition: all 0.3s ease;
}

.coupon-code-block .coupon-code-text {
  color: var(--input-text-color);
}

.coupon-code-icon {
  position: absolute;
  right: 0;
  top: 0;
  bottom: 0;
  cursor: pointer;
  background-color: var(--icon-bg);
  color: var(--icon-color);
}

@media (hover: hover) {
  .coupon-code-icon:hover .tooltip {
    opacity: var(--opacity-100);
    transform: translate(-50%, 0);
    visibility: visible;
    pointer-events: auto;
  }
}

.coupon-code-default {
  transition: all .500s;
}

.coupon-code-copied {
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  text-align: center;
  opacity: 0;
  transform: translateY(1em);
  color: var(--input-text-color);
  transition: all .500s;
}

.coupon-code-block.copied .coupon-code-default {
  opacity: 0;
  transform: translateY(-1em);
}

.coupon-code-block.copied .coupon-code-copied {
  opacity: 1;
  transform: translateY(0);
}

.rating-block {
  width: 100%;
  align-items: var(--horizontal-alignment);
}

.rating-block__star {
  width: var(--width);
  height: var(--width);
  color: var(--rated-color);
}

.rating-wrapper {
  width: 100%;
  gap: var(--gap-xs);
  flex-wrap: wrap;
}

.rating-color--primary {
  --star-fill-color: var(--color-primary);
}

.rating-color--foreground {
  --star-fill-color: var(--color-foreground);
}

.rating-wrapper,
.rating {
  display: flex;
  align-items: center;
}

.rating-wrapper.justify-right {
  flex-direction: row-reverse;
}

.rating {
  gap: var(--gap-3xs);
}

.rating-wrapper .rating-text,
.rating-wrapper .rating-count,
.rating-wrapper .rating-count-separator {
  color: var(--star-fill-color);
  margin: 0;
  white-space: nowrap;
}

.rating-count-separator {
  opacity: var(--opacity-20);
  padding-left: calc(var(--padding-xs) / 2);
  padding-right: var(--padding-xs);
}

.stars {
  height: var(--star-size);
  fill: var(--empty-star-fill-color);
}

.filled-star {
  fill: var(--star-fill-color);
}

.spacer {
  height: var(--spacerHeight);
  width: var(--spacerWidth);
  display: block;
}

@media (max-width: 1024px) {
  .spacer {
    height: calc(var(--spacerHeight) * 0.75);
    width: calc(var(--spacerWidth) * 0.75);
  }
}

@media (max-width: 749px) {
  .spacer {
    height: calc(var(--spacerHeight) * 0.5);
    width: calc(var(--spacerWidth) * 0.5);
  }
}

@media (max-width: 480px) {
  .spacer {
    height: calc(var(--spacerHeight) * 0.25);
    width: calc(var(--spacerWidth) * 0.25);
  }
}

.storeLocator {
  display: flex;
  gap: var(--map-gap-desktop);
}

.storeLocator__item {
  padding: var(--pt) var(--pr) var(--pb) var(--pl);
  text-decoration: none;
  border-bottom: var(--border-width) solid var(--border-color);
  cursor: pointer;
}

.storeLocator__item:last-child {
  border-bottom: none;
}

.storeLocator__item.active,
.storeLocator__item:hover {
  background-color: var(--item-background);
}

.storeLocator__left {
  width: var(--map-list-width);
  overflow-y: auto;
  height: var(--map-list-height);
}

/* Scrollbar */
.storeLocator__left::-webkit-scrollbar {
  width: 4px;
}

.storeLocator__left::-webkit-scrollbar-track {
  background: #F8F8F8;
}

.storeLocator__left::-webkit-scrollbar-thumb {
  background: #51565A;
}

.shopify-block:has(.storeLocator__right) {
  width: 100%;
}

.storeLocator__right {
  flex: 1;
}

.storeLocator__right .map:after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  display: block;
  background: linear-gradient(to bottom, #fafafa 8%, #f8f8f8 60%);
  transform: translateY(-100%);
  z-index: 2;
}

.storeLocator__right .map.is-loading:after {
  animation: overlaySlide 1.2s ease forwards;
}

.storeLocator__right .map {
  position: relative;
  overflow: hidden;
}

.storeLocator__right .map,
.storeLocator__right iframe {
  width: 100%;
  height: 100%;
}

@media screen and (max-width: 749px) {
  .storeLocator {
    gap: var(--map-gap-mobile);
    flex-direction: column;
  }

  .storeLocator__left {
    width: 100%;
  }

  .storeLocator__right {
    aspect-ratio: 1 / 1;
  }
}

@keyframes overlaySlide {
  25%, 75% {
    transform: translateY(0);
  }

  100% {
    transform: translateY(100%);
  }
}

.testimonial-block-marquee {
  .marquee__content {
    --extra-desktop: calc((4 - var(--width-grid-desktop-per-row)) * var(--full-page-grid-central-column-width, 100%) / var(--width-grid-desktop-per-row));
    --extra-tablet: calc((4 - var(--width-grid-tablet-per-row)) * var(--full-page-grid-central-column-width, 100%) / var(--width-grid-tablet-per-row));
    --extra-mobile: calc((2 - var(--width-grid-mobile-per-row)) * var(--full-page-grid-central-column-width, 100%) / var(--width-grid-mobile-per-row));

    min-width: calc(100% + var(--extra-desktop) + var(--marquee-gap));

    :is(p, h1, h2, h3, h4, h5, h6) {
      white-space: pre-wrap;
    }

    @media screen and (min-width: 750px) and (max-width: 1024px) {
      min-width: calc(100% + var(--extra-tablet) + var(--marquee-gap));
    }

    @media screen and (max-width: 749px) {
      min-width: calc(100% + var(--extra-mobile) + var(--marquee-gap));
    }
  }

  marquee-scroll .marquee__content {
    width: fit-content;
  }

  .marquee__repeated-items {
    align-items: stretch;
    min-width: fit-content;
  }
}

.placeholder-video {
  aspect-ratio: 5 / 3;
}

@media screen and (min-width: 750px) {
  before-you-leave .popup__inner {
    min-width: 90vw;
  }
}

@media screen and (min-width: 1025px) {
  before-you-leave .popup__inner {
    min-width: 96rem;
  }
}

@media (min-width: 750px) {
  .blog-posts-section.layout-panel-flex--row .section-resource-list__header {
    width: calc(var(--header-width) - var(--gap) / 2);
  }

  .blog-posts-section.layout-panel-flex--row .blog-posts-block {
    width: calc(100% - var(--header-width) - var(--gap) / 2);
  }
}

@media (min-width: 750px) and (max-width: 1024px) {
  .tablet-column.blog-posts-section.layout-panel-flex--row .section-resource-list__header,
  .tablet-column.blog-posts-section.layout-panel-flex--row .blog-posts-block {
    width: 100%;
  }
}

@media (max-width: 749px) {
  .blog-posts-section.mobile-direction--row:not(.tablet-column) .section-resource-list__header {
    width: calc(var(--header-width) - var(--gap) / 2);
  }

  .blog-posts-section.mobile-direction--row:not(.tablet-column) .blog-posts-block {
    width: calc(100% - var(--header-width) - var(--gap) / 2);
  }
}

.faqs-filterDropdown {
  width: fit-content;
  min-width: 16rem;
  min-height: 4rem;

  & .faqs-filterDropdown-summary {
    padding: 0.7rem 1.8rem;
    display: flex;
    align-items: center;
    border: var(--style-border-width) solid var(--color-foreground);
    border-radius: var(--style-border-radius-buttons-primary);
  }
}

.faqs-filterDropdown-menu li {
  text-transform: capitalize;
  cursor: pointer;
}

.section-wrapper {
  --section-height-offset: 0px;
}

.section[data-shopify-visual-preview] {
  min-height: var(--section-preview-height);
  padding-top: 0;
}

.section[data-shopify-visual-preview] .custom-section-background {
  display: none;
}

@media screen and (min-width: 750px) and (max-width: 1024px) {
  .section--featured-collection-cate .section-global__content {
    display: grid;
    grid-template-columns: 1fr 2fr;
    grid-template-rows: 1fr;
    gap: var(--gap);
    grid-auto-flow: dense;

    & > :nth-child(1),
    & > :nth-child(2) {
      grid-column-end: span 1;
      grid-row-end: span 1;
    }

    & > :nth-child(3) {
      grid-column-end: span 2;
    }
  }
}

.featured-product-section .section-content-wrapper {
  grid-template-columns: 1fr;
  display: grid;
  overflow: hidden;

  @media (min-width: 750px) {
    grid-template-columns: 1fr 1fr;
  }
}

.featured-product-section .product-media-container.constrain-height {
  --viewport-offset: 400px;
  --constrained-min-height: var(--visual-preview--height, 80dvh);

  @media screen and (min-width: 750px) {
    --viewport-offset: 300px;
  }
}

.featured-product-section .product-card__link {
  --padding-block: 20px;
  --padding-inline: 20px;

  @media screen and (min-width: 750px) {
    --padding-block: 40px;
    --padding-inline: 40px;
  }
}

@media screen and (max-width: 749px) {
  .featured-product-section .media-block {
    order: -1;
  }
}

.drawer--menu-multi-tab .drawer__inner {
  padding-inline: 0;
}

.drawer--menu-multi-tab .menu-drawer__menu .menu-drawer__menu-item,
.drawer--menu-multi-tab .menu-drawer__menu-grid {
  padding-inline: var(--padding-xl);
}

.drawer--menu-multi-tab .menu-drawer__close-button {
  padding: 0 var(--minimum-touch-target) 0 var(--padding-xl);
  height: var(--minimum-touch-target);
  width: 100%;
  text-align: left;
}

.drawer--menu-multi-tab .drawer__header:has(.drawer__close){
  width: fit-content;
  position: absolute;
  right: 0;
  left: auto;
  padding: 0;
}

.drawer--menu-multi-tab .drawer__header .drawer__close{
  margin: 0;
}

.drawer--menu-multi-tab .tabs-product-header{
  --button-font-size-link: 2rem;
  --button-font-weight-link: 700;
}

.menu-drawer__menu-item.menu-drawer__menu-item--multi-tab {
  padding-inline: var(--padding-xl);
}

.mobile--multi-tab .section-resource-list,
.mobile--multi-tab {
  height: 100%;
}


.mobile--multi-tab .section-resource-list__content {
  height: calc(100% - 48px);
  position: relative;
}

.mobile--multi-tab .menu-drawer__utility-links {
  padding: 0;
}

/**
  * Blog posts page layout
  */
.blog-posts-container {
  display: flex;
  flex-direction: column;
  width: 100%;
  gap: var(--blog-post-container-gap-mobile);

  @media screen and (min-width: 750px) {
    gap: var(--blog-post-container-gap);
  }
}

.blog-posts__main .blog-post-item {
  --blog-post-card-scale: 0.6;
  grid-column: span 6;
}

.blog-posts:not(:has(.blog-posts__sidebar-drawer)) .toggle-sidebar {
  display: none;
}

.blog-posts__main:not(:has(.blog-posts__sidebar-drawer)) {
  grid-template-columns: 1fr;
}

@media screen and (min-width: 1025px) {
  .blog-posts__main:has(.blog-posts__sidebar-drawer) {
    grid-template-columns: minmax(27rem, 30%) 1fr;
    column-gap: var(--columns-gap);
  }
}

@media screen and (min-width: 1440px) {
  .blog-posts__main:has(.blog-posts__sidebar-drawer) {
    grid-template-columns: 27rem 1fr;
  }
}

/* drawer overlay */
.toggle-sidebar {
  margin-bottom: 2rem;
  margin-left: auto;
}
@media screen and (min-width: 1025px) {
  .toggle-sidebar {
    display: none;
  }
}

.cart-page {
  --cart-font-size--2xs: var(--font-size--2xs);
  --cart-font-size--xs: var(--font-size--xs);
  --cart-font-size--sm: var(--font-size--sm);
  --cart-font-size--md: var(--font-size--md);
  --cart-font-size--2xl: var(--font-size--2xl);

  display: grid;
  grid-template-columns: 1fr;
  gap: 0 var(--gap-3xl);
}

.cart-page--empty {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}

.cart-page--empty .cart-page__title,
.cart-page--empty .cart-page__more-blocks {
  margin-top: var(--margin-6xl);
}

.cart-page__more-blocks {
  width: 100%;
}

.cart-page--empty .cart-title {
  text-align: center;
}

.cart-page__main {
  grid-column: 1;
}

.cart-page__summary {
  max-width: max(50vw, 75rem);
  padding-top: var(--padding-xl);
}

@media screen and (min-width: 1025px) {
  .cart-page__items,
  .cart-page__summary {
    grid-column-end: span 2;
  }

  .cart-page__summary {
    height: 100%;
    padding-top: 0;

    /* needed to support blurred effect from hero section */
    position: relative;
  }

  .section--page-width .cart-page:has(.cart__container--extend) {
    grid-column: 2 / 4;
    grid-template-columns: 1fr minmax(
        var(--side-cart-width),
        calc((100vw - var(--page-width)) / 2 + var(--side-cart-width))
      );
  }

  .cart__container--extend {
    height: 100%;
  }
}

@media screen and (min-width: 1200px) {
  .cart-page {
    grid-template-columns: 1fr var(--side-cart-width);
    grid-template-rows: 1fr;
    grid-auto-flow: dense;
  }

  .cart-page__items,
  .cart-page__summary {
    grid-column-end: span 1;
  }
}


.main-collection-grid {
  grid-column: var(--grid-column--mobile);

  @media screen and (min-width: 750px) {
    grid-column: var(--grid-column--desktop);
  }
}

.collection-wrapper {
  @media screen and (min-width: 750px) {
    grid-template-columns:
      1fr repeat(
        var(--centered-column-number),
        minmax(0, calc((var(--page-width) - var(--page-margin) * 2) / var(--centered-column-number)))
      )
      1fr;
  }
}

/* .collection-wrapper:has(.facets-block-wrapper--full-width), */
.collection-wrapper:has(.collection-wrapper--full-width),
.collection-wrapper:has(.facets-block-wrapper--vertical) {
  @media screen and (min-width: 750px) {
    grid-column: 1 / -1;
    grid-template-columns:
      minmax(var(--page-margin), 1fr)
      24rem
      repeat(
        calc(var(--centered-column-number) - 1),
        minmax(0, calc((var(--page-width) - var(--page-margin) * 2 - 24rem) / (var(--centered-column-number) - 1)))
      )
      minmax(var(--page-margin), 1fr);
  }
}

.collection-wrapper:has(.facets-block-wrapper--vertical.facets-block-wrapper--right) {
  @media screen and (min-width: 750px) {
    grid-template-columns:
      minmax(var(--page-margin), 1fr)
      repeat(
        calc(var(--centered-column-number) - 1),
        minmax(0, calc((var(--page-width) - var(--page-margin) * 2 - 24rem) / (var(--centered-column-number) - 1)))
      )
      24rem
      minmax(var(--page-margin), 1fr);
  }
}

.collection-wrapper:has(.facets--horizontal) {
  .collection-header {
    grid-column: 1 / -1;
  }
}

.collection-wrapper:has(.facets-block-wrapper--full-width.facets-block-wrapper--vertical) {
  @media screen and (max-width: 749px) {
    display: grid;
    grid-template-columns: repeat(var(--centered-column-number), 1fr);

    .main-collection-grid {
      grid-column: 1 / 13;
    }
  }
}

.collection-wrapper:has(.facets--vertical) .facets-block-wrapper--vertical:not(.hidden) ~ .facets-vertical-sort,
.collection-wrapper:has(.facets--vertical) .facets-block-wrapper--vertical:not(.hidden) ~ .collection-header,
.collection-wrapper:has(.facets--vertical) .facets-block-wrapper--vertical:not(.hidden) ~ .main-collection-grid {
  @media screen and (min-width: 1025px) {
    grid-column: var(--facets-vertical-col-width) / var(--full-width-column-number);
  }
}

.collection-wrapper:has(.facets-block-wrapper--right .facets--vertical)
  .facets-block-wrapper--vertical:not(.hidden)
  ~ .facets-vertical-sort,
.collection-wrapper:has(.facets-block-wrapper--right .facets--vertical)
  .facets-block-wrapper--vertical:not(.hidden)
  ~ .collection-header,
.collection-wrapper:has(.facets-block-wrapper--right .facets--vertical)
  .facets-block-wrapper--vertical:not(.hidden)
  ~ .main-collection-grid {
  @media screen and (min-width: 1025px) {
    grid-column: 2 / var(--facets-vertical-col-start);
  }
}

.collection-wrapper:has(.facets--vertical, .facets--vertical .collection-header) {
  grid-template-rows: max-content max-content 1fr;
  .collection-header {
    grid-column: 1 / -1;

    @media screen and (min-width: 750px) {
      grid-column: 2/14;
    }

    @media screen and (min-width: 1025px) {
      grid-row: 1 / 2;
    }
  }

  @media screen and (max-width: 1024px) {
    .facets-block-wrapper--vertical {
      grid-row: 2 / 3;
    }

    &:has(.facets-vertical-sort--vertical-divider) .collection-header {
      border-bottom: var(--style-border-width) solid var(--color-border);
    }
  }

  .facets-block-wrapper--vertical:not(.hidden) ~ .facets-vertical-sort {
    grid-row: 2 / 3;
  }

  .facets-block-wrapper--vertical:not(.hidden) ~ .main-collection-grid {
    grid-row: 3 / 4;
  }
}

.collection-wrapper:has(.facets-block-wrapper--vertical:not(#filters-drawer)):has(.collection-wrapper--full-width) {
  @media screen and (min-width: 750px) {
    grid-column: 1 / -1;
    grid-template-columns: 0fr repeat(var(--centered-column-number), minmax(0, 1fr)) 0fr;
  }
}

:is(.collection-wrapper--full-width, .collection-wrapper--full-width-on-mobile)
  [product-grid-view='default']
  .product-grid__card {
  @media screen and (max-width: 749px) {
    padding-inline-start: max(var(--padding-xs), var(--padding-inline-start));
    padding-inline-end: max(var(--padding-xs), var(--padding-inline-end));
  }
}

:is(.collection-wrapper--full-width, .collection-wrapper--full-width-on-mobile)
  [product-grid-view='mobile-single']
  .product-grid__card {
  @media screen and (max-width: 749px) {
    padding-inline-start: max(var(--padding-xs), var(--padding-inline-start));
    padding-inline-end: max(var(--padding-xs), var(--padding-inline-end));
  }
}

/* Make product media go edge-to-edge by using negative margins */
:is(.collection-wrapper--full-width) .card-gallery,
:is(.collection-wrapper--full-width-on-mobile) .card-gallery {
  @media screen and (max-width: 749px) {
    margin-inline-start: calc(-1 * max(var(--padding-xs), var(--padding-inline-start)));
    margin-inline-end: calc(-1 * max(var(--padding-xs), var(--padding-inline-end)));
  }
}

.product-information__media {
  display: flex;
  order: 0;
  width: 0;
  min-width: 100%;
}

.product-information--details-overlay-on-scroll-mobile .product-information__media {
  position: sticky;
  top: 0;
}

@media screen and (max-width: 749px) {
  .product-information__media {
    grid-column: 1 / -1;
  }

  .product-information--media-right {
    display: flex;
    flex-direction: column;

    .product-details {
      order: 1;
      width: 100%;
    }
  }
}

@media screen and (min-width: 750px) {
  .product-information__media {
    position: sticky;
    top: 0;
  }

  .product-information__grid {
    display: grid;
    grid-template-columns: subgrid;
    grid-column: 1 / -1;
  }

  .product-information__grid.product-information--media-none,
  .product-information__grid:has(.product-information__media:empty) {
    .product-details {
      width: var(--narrow-content-width);
      margin: 0 auto;
    }
  }

  .product-information__grid:not(:has(.product-information__media:empty)) {
    &.product-information--media-left {
      grid-template-columns: 1fr max(45vw, var(--sidebar-width));

      .product-information__media {
        padding-inline-end: calc(var(--gap, 0) / 2);
      }

      .product-details {
        padding-inline-start: calc(var(--gap, 0) / 2);
      }

      &:has(.media-gallery--extend) {
        grid-column: 1 / 3;
      }

      @media screen and (max-width: 1024px) {
        .product-information__media {
          padding-inline-end: calc(var(--gap, 0) / 4);
        }

        .product-details {
          padding-inline-start: calc(var(--gap, 0) / 4);
        }
      }
    }

    &.product-information--media-right {
      grid-template-columns: min(50vw, var(--sidebar-width)) 1fr;

      .product-information__media {
        padding-left: calc(var(--gap, 0) / 2);
        order: 1;
      }

      .product-details {
        padding-right: calc(var(--gap, 0) / 2);
        order: 0;
      }

      &:has(.media-gallery--extend) {
        grid-column: 2 / -1;
      }

      @media screen and (max-width: 1024px) {
        .product-information__media {
          padding-left: calc(var(--gap, 0) / 4);
        }

        .product-details {
          padding-right: calc(var(--gap, 0) / 4);
        }
      }
    }

    &.product-information__grid--half,
    &.product-information__grid--half:has(.media-gallery--extend) {
      grid-column: 1 / -1;
      grid-template-columns:
        var(--full-page-grid-margin) calc(var(--full-page-grid-central-column-width) / 2) calc(
          var(--full-page-grid-central-column-width) / 2
        )
        var(--full-page-grid-margin);

      &.product-information--media-left {
        .product-information__media {
          grid-column: 2 / 3;

          &:has(.media-gallery--extend) {
            grid-column: 1 / 3;
          }
        }

        .product-details {
          grid-column: 3 / 4;
        }
      }

      &.product-information--media-right {
        .product-information__media {
          grid-column: 3 / 4;

          &:has(.media-gallery--extend) {
            grid-column: 3 / -1;
          }
        }

        .product-details {
          grid-column: 2 / 3;
        }
      }
    }
  }

  .section--full-width {
    .product-information__grid:not(:has(.product-information__media:empty)),
    .product-information__grid:not(:has(.product-information__media:empty)) {
      &.product-information--media-left,
      &.product-information--media-right {
        grid-column: 1 / -1;
      }

      &.product-information--media-left .product-details {
        padding-inline-end: var(--padding-lg);
      }

      &.product-information--media-right .product-details {
        padding-inline-start: var(--padding-lg);
      }

      &.product-information__grid--half.product-information--media-left {
        .product-information__media {
          grid-column: 1 / 3;
        }

        .product-details {
          grid-column: 3 / -1;
        }
      }

      &.product-information__grid--half.product-information--media-right {
        .product-information__media {
          grid-column: 3 / -1;
        }

        .product-details {
          grid-column: 1 / 3;
        }
      }
    }
  }
}

@media screen and (min-width: 1200px) {
  .product-information__grid:not(
      .product-information__grid--half,
      :has(.product-information__media:empty)
    ).product-information--media-left {
    grid-template-columns: 2fr 1.34fr;
  }

  .product-information__grid:not(
      .product-information__grid--half,
      :has(.product-information__media:empty)
    ).product-information--media-right {
    grid-template-columns: 1fr 2fr;
  }
}

.product-information__grid--limit-details .product-details > .group-block {
  max-width: var(--sidebar-width);
}

.product-information__media :is(.swiper-actions--center_vert) .swiper-pagination.swiper-pagination-bullets:not(.swiper-pagination-bullets-dynamic),
.product-information__media :is(.swiper-actions--center_vert) .swiper-pagination:not(.swiper-pagination-progressbar) {
  bottom: 1rem;

  @media screen and (min-width: 750px) {
    bottom: 2rem;
  }
}

.marquee__wrapper {
  gap: var(--marquee-gap);
  white-space: nowrap;
}

.marquee__content {
  min-width: max-content;
  gap: var(--marquee-gap);
}

.marquee__content :is(p, h1, h2, h3, h4, h5, h6) {
  white-space: nowrap;
}

.marquee__content .marquee__repeated-items * {
  max-width: none;
}

.marquee__repeated-items {
  min-width: max-content;
  gap: var(--marquee-gap);
}

.marquee__repeated-items > * {
  align-content: center;
}

.hero__content-wrapper.layout-panel-flex--column marquee-component {
  --margin-inline: var(--full-page-margin-inline-offset);

  width: -webkit-fill-available;
  min-height: max-content;
}

@media (prefers-reduced-motion: no-preference) {
  marquee-scroll .marquee__content,
  marquee-component:not([data-disabled]):has(:not(marquee-scroll)) .marquee__wrapper {
    animation: marquee-motion var(--marquee-speed) linear infinite var(--marquee-direction);
    will-change: transform;
  }

  marquee-scroll .marquee__content {
    --percent: -100%;
    width: max-content;
  }
}

@keyframes marquee-motion {

  to {
    transform: translate3d(calc(var(--percent, -100%) - (var(--marquee-gap) / 2)), 0, 0);
  }
}

.marquee__repeated-items .icon-block:has(a):hover img {
  animation: zoom-in-out 0.9s both;
}

@keyframes jello-vertical {
  0% {
    transform: scale3d(1, 1, 1);
  }
  30% {
    transform: scale3d(0.75, 1.25, 1);
  }
  40% {
    transform: scale3d(1.25, 0.75, 1);
  }
  50% {
    transform: scale3d(0.85, 1.15, 1);
  }
  65% {
    transform: scale3d(1.05, 0.95, 1);
  }
  75% {
    transform: scale3d(0.95, 1.05, 1);
  }
  100% {
    transform: scale3d(1, 1, 1);
  }
}

@keyframes zoom-in-out {
  0% {
    transform: scale(1);
  }
  50% {
    transform: scale(1.05);
  }
  100% {
    transform: scale(1);
  }
}

.media-banner[data-shopify-visual-preview] {
  min-height: var(--section-preview-height);
  padding-top: 0;
}
.section--page-width {
  &.media-banner {
    grid-template-areas: 'margin-left media margin-right' 'margin-left content margin-right';
    @media screen and (min-width: 750px) {
      grid-template-areas: 'margin-left media content margin-right';
      --media-banner-grid-columns: var(--full-page-grid-margin)
        calc((var(--full-page-grid-central-column-width) / 12) * 7)
        calc((var(--full-page-grid-central-column-width) / 12) * 5) var(--full-page-grid-margin);
    }
  }
  &.media-banner--media-right {
    @media screen and (min-width: 750px) {
      --media-banner-grid-columns: var(--full-page-grid-margin)
        calc((var(--full-page-grid-central-column-width) / 12) * 5)
        calc((var(--full-page-grid-central-column-width) / 12) * 7) var(--full-page-grid-margin);
      grid-template-areas: 'margin-left content media margin-right';
    }
  }
  &.media-banner--medium {
    @media screen and (min-width: 750px) {
      --media-banner-grid-columns: var(--full-page-grid-margin)
        repeat(2, calc(var(--full-page-grid-central-column-width) / 2)) var(--full-page-grid-margin);
    }
  }
  &.media-banner--narrow.media-banner--media-right {
    @media screen and (min-width: 750px) {
      --media-banner-grid-columns: var(--full-page-grid-margin)
        calc((var(--full-page-grid-central-column-width) / 3) * 2)
        calc(var(--full-page-grid-central-column-width) / 3) var(--full-page-grid-margin);
    }
  }
  &.media-banner--narrow {
    @media screen and (min-width: 750px) {
      --media-banner-grid-columns: var(--full-page-grid-margin)
        calc(var(--full-page-grid-central-column-width) / 3)
        calc((var(--full-page-grid-central-column-width) / 3) * 2) var(--full-page-grid-margin);
    }
  }
  &.media-banner.media-banner--media-stack,
  &.media-banner--medium.media-banner--media-stack,
  &.media-banner--narrow.media-banner--media-stack {
    @media screen and (min-width: 750px) {
      grid-template-areas: 'media';
      --media-banner-grid-columns: 1fr;
    }
  }
}
.section--full-width {
  &.media-banner--media-right {
    @media screen and (min-width: 750px) {
      --media-banner-grid-columns: 2.5fr 3.5fr;
      grid-template-areas: 'content media';
    }
  }
  &.media-banner--medium {
    @media screen and (min-width: 750px) {
      --media-banner-grid-columns: 1fr 1fr;
    }
  }
  &.media-banner--narrow {
    @media screen and (min-width: 750px) {
      --media-banner-grid-columns: 2fr 4fr;
    }
  }
  &.media-banner--narrow.media-banner--media-right {
    @media screen and (min-width: 750px) {
      --media-banner-grid-columns: 4fr 2fr;
    }
  }
  &.media-banner.media-banner--media-stack,
  &.media-banner--medium.media-banner--media-stack,
  &.media-banner--narrow.media-banner--media-stack {
    @media screen and (min-width: 750px) {
      grid-template-areas: 'media';
      --media-banner-grid-columns: 1fr;
    }
  }
}
.media-banner.media-banner--media-extend {
  grid-template-columns: var(--media-banner-grid-columns);
  grid-template-areas: 'media media media' 'margin-left content margin-right';
  @media screen and (min-width: 750px) {
    grid-template-areas: 'media media content margin-right';
  }
}
.media-banner--media-extend.media-banner--media-right {
  @media screen and (min-width: 750px) {
    grid-template-areas: 'margin-left content media media';
  }
}
.media-banner--media-right {
  @media screen and (min-width: 750px) {
    grid-template-areas: 'margin-left content media media';
  }
}
.media-banner.media-banner--media-stack {
  position: relative;
  display: flex;
  flex-direction: column;
  &.media-banner--height-auto {
    .media-block {
      aspect-ratio: var(--aspect-ratio);
    }
    .media-block:has(.deferred-media) {
      aspect-ratio: auto;
      @media screen and (min-width: 750px) {
        aspect-ratio: var(--aspect-ratio);
      }
    }
  }
  .media-block {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
    align-self: stretch;
    object-fit: cover;
  }
  .media-banner__content {
    width: 100%;
    height: 100%;
    position: relative;
    z-index: 2;
    min-height: var(--media-height);
    >.group-block-content {
      width: var(--size-style-width-mobile, var(--size-style-width));
      height: var(--size-style-height-mobile, var(--size-style-height));
      position: absolute;
      inset: 50% auto auto 50%;
      transform: translate(-50%, -50%);
      z-index: 3;
    }
  }
  @media screen and (min-width: 750px) {
    .media-banner__content {
      >.group-block-content {
        inset: var(--content-inset);
        transform: var(--content-transform);
      }
    }
  }
}
.media-banner {
  --media-banner-grid-columns: var(--full-page-grid-with-margins);
  grid-template-columns: var(--media-banner-grid-columns);
  grid-template-areas: 'media media media' 'content content content';
  min-height: var(--media-height, auto);
  @media screen and (min-width: 750px) {
    grid-template-areas: 'media content';
    --media-banner-grid-columns: 3.5fr 2.5fr;
  }
  .media-block {
    grid-area: media;
  }
  .media-banner__content {
    grid-area: content;
  }
  &.media-banner--height-auto {
    .media-block {
      aspect-ratio: var(--aspect-ratio);
    }
    .media-block:has(.deferred-media) {
      aspect-ratio: auto;
      @media screen and (min-width: 750px) {
        aspect-ratio: var(--aspect-ratio);
      }
    }
  }
}

.sec-tab__content-wrapper .tab-item:hover{
  box-shadow: 5px 9px 20px var(--border-color);
}

.multitasking-bar {
  top: 50%;
  width: auto;
  padding: 0.2rem;
  border-radius: 3rem;
  box-shadow: 0.2rem 0.4rem 1.2rem 0 rgba(var(--color-foreground-rgb) / var(--opacity-10));
  background: rgba(var(--color-background));
  opacity: var(--opacity-0);
  visibility: hidden;
  transform: translate3d(2rem, -50%, 0);
  transition: opacity var(--duration-long) ease, visibility var(--duration-long) ease,
    transform var(--duration-long) ease;
  will-change: transform;
}

.multi-t__button {
  width: var(--size-40);
  height: var(--size-40);
  background: transparent;
  transition: all var(--duration-default) ease;
}

.multi-t__button:after {
  content: '';
  display: block;
  position: absolute;
  top: 0;
  right: 0;
  width: var(--size-40);
  height: var(--size-40);
  pointer-events: none;
}

.multi-t__button .icon {
  color: rgba(var(--color-foreground));
  display: block;
  width: var(--size-18);
  height: var(--size-18);
  z-index: 1;
  transition-property: color, transform;
  transition-duration: var(--duration-long);
  transition-timing-function: ease;
  will-change: transform;
}

.multi-t__button .icon-arrow {
  transform: rotate(-90deg);
}

.multi-t__button:hover .icon {
  transform: scale(1.09);
}

.multi-t__button:hover .icon-arrow {
  transform: rotate(-90deg) scale(1.09);
}

.recently-viewed__warnings .icon {
  display: block;
  width: var(--size-46);
  height: var(--size-46);
  z-index: 1;
  color: rgb(var(--color-foreground-rgb) / var(--opacity-10));
  margin: 0 auto 1rem auto;
}

.recently-viewed-products .product-item {
  padding-bottom: 1rem;
}

.multi-t__list .list-social__item {
  padding: 0.2rem;
  border-radius: var(--style-border-radius-50);
}

.multi-t__list .list-social__link {
  padding: 0.9rem;
}

.target-block.active .multi-t__button .icon,
.button__back-to-top[data-index='1'].active.hide + .target-block .multi-t__button .icon {
  color: rgba(var(--secondary-icon));
}

.multi-t__wrap [data-index='1'].active ~ .glider {
  transform: translateY(0);
}

.multi-t__wrap [data-index='2'].active ~ .glider {
  transform: translateY(calc(100% + var(--gap-xs)));
}

.multi-t__wrap [data-index='3'].active ~ .glider {
  transform: translateY(calc(200% + var(--gap-xs) * 2));
}

.multi-t__wrap .button__back-to-top.hide ~ [data-index='2'].active ~ .glider {
  transform: translateY(0);
}

.multi-t__wrap .button__back-to-top.hide ~ [data-index='3'].active ~ .glider {
  transform: translateY(calc(100% + var(--gap-xs)));
}

.multi-t__social {
  background-color: rgba(var(--color-background));
  right: calc(100% + 0.5rem);
  padding-inline: 0.5rem;
  border-radius: 3rem;
  box-shadow: 0.2rem 0.4rem 0.9rem 0 rgb(var(--color-background-rgb) / var(--opacity-35));
  opacity: var(--opacity-0);
  visibility: hidden;
  transform: translate(2rem);
  transition: opacity var(--duration-long) ease, visibility var(--duration-long) ease,
    transform var(--duration-long) ease;
  will-change: transform;
}

.multi-t__social.active {
  opacity: var(--opacity-100);
  visibility: visible;
  transform: translateX(0);
  pointer-events: auto;

  + .target-block--tooltip {
    visibility: hidden !important;
  }
}

.multi-t__social .list-social {
  flex-wrap: nowrap;
}

.glider {
  height: var(--size-40);
  width: var(--size-40);
  z-index: -1;
  background-color: rgba(var(--secondary-icon-background));
  transition: 0.25s ease-out;
}

.button__back-to-top {
  height: var(--h-cus, 0);
  border: 1px solid rgba(var(--color-foreground-rgb) / var(--opacity-20));
  border-radius: 50%;
  transition: opacity var(--duration-medium) ease, height var(--duration-medium) var(--cubic-smooth);
}

.button__back-to-top .progress-circle path {
  fill: none;
  stroke: rgba(var(--color-foreground-rgb) / var(--opacity-20));
  stroke-width: 4;
  box-sizing: border-box;
  transition: all 200ms linear;
}

.button__back-to-top .progress-circle-fill path {
  stroke: currentColor;

  .active & {
    stroke: rgba(var(--secondary-icon));
  }
}

.button__back-to-top.hide {
  opacity: var(--opacity-0);
}

body.overflow-hidden .multitasking-bar {
  right: calc(var(--right) + var(--scrollbar-width, 0rem));
}

body:not(.has--preload-screen) .multitasking-bar {
  opacity: var(--opacity-100);
  visibility: visible;
  pointer-events: auto;
  transform: translate3d(0, -50%, 0);
}

@media only screen and (min-width: 750px) {
  .multitasking-bar {
    padding: 0.8rem;
  }

  .multi-t__button,
  .multi-t__button:after,
  .glider {
    width: var(--size-48);
    height: var(--size-48);
  }
}

@media only screen and (min-width: 1025px) {
  body.overflow-hidden .multitasking-bar {
    right: calc(var(--right) + var(--scrollbar-width, 0rem) - 0.1rem);
  }
}

.target-block {
  position: relative;

  @media (hover: hover) {
    &:hover {
      .target-block--tooltip {
        opacity: var(--opacity-100);
        visibility: visible;
        transform: translate(calc(-100% - 1.4rem), -50%);
      }
    }
  }
}

.target-block--tooltip {
  position: absolute;
  top: 50%;
  left: 0;
  width: max-content;
  height: auto;
  background-color: rgba(var(--color-background));
  color: rgba(var(--color-foreground));
  padding: 0.4rem 0.6rem;
  border-radius: var(--style-border-radius-xl);
  transform: translate(calc(-100% - 2rem), -50%);
  transition: opacity var(--animation-speed-slow) var(--animation-timing-hover),
    transform var(--animation-speed-slow) var(--animation-timing-hover);
  opacity: var(--opacity-0);
  visibility: hidden;
  pointer-events: none;
}

.product-recommendations__skeleton-item {
  aspect-ratio: 3 / 4;
  background-color: transparent;
}

@media screen and (max-width: 749px) {
  .product-recommendations__skeleton-item:nth-child(2n + 1) {
    display: none;
  }
}

product-recommendations:has([data-has-recommendations='false']) {
  display: none;
}

/* Featured Collection */
@media screen and (max-width: 749px) {
  .swiper-component-mobile .swiper-wrapper {
    flex-wrap: nowrap;
    gap: 0px;
  }

  .swiper-component-mobile .grid__item.swiper-slide {
    max-width: 100%;
  }
}

.collection-carousel-swiper-component.full-width .swiper {
  overflow: visible;
}

.collection-carousel-swiper-component.full-width .swiper-btns-wrap:not(.swiper-btns-wrap--bottom) {
  position: absolute;
  width: 100%;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
  z-index: 1;
}

.product-infinite-scroll {
  margin-top: var(--show-more-button-offset, 5.5rem);
}

@media screen and (max-width: 1024px) {
  .product-infinite-scroll {
    margin-top: calc(var(--show-more-button-offset, 5.5rem) * 0.75);
  }
  .type-style--tabs-carousel .section-global__content.has-media-banner .collection-banner {
    display: none;
  }
}

@media screen and (max-width: 749px) {
  .product-infinite-scroll {
    margin-top: calc(var(--show-more-button-offset, 5.5rem) * 0.5);
  }
}

.section--featured-collection .content-inside-media {
  padding: 3rem 1rem;

  .content-inside-media__inner {
    max-width: 500px;
  }
}

.promotion-popup__close.close-effect .line {
  background: var(--color-foreground);
}

.promotion-popup__info .promotion--button {
  padding-top: 1.6rem;
  padding-bottom: 1.4rem;
  font-size: 1.6rem;
  min-height: calc(5.2rem + var(--style-border-width-primary) * 2)
}

.promotion-popup__info .button--submit {
  max-width: calc(100% - var(--style-border-width-primary) * 2);
}

.promotion-popup__info .promotion--button svg {
  width: 1.8rem;
  height: 1.8rem;
}

.promotion--button.button--primary + .promotion--social {
  margin-top: 2rem;
}

.promotion-popup__info .field__input::-webkit-input-placeholder{
  text-transform: var(--heading-text-transform);
}

.promotion-popup__info .field__input::-moz-placeholder{
  text-transform: var(--heading-text-transform);
}

.promotion-popup__info .field__input::-ms-input-placeholder{
  text-transform: var(--heading-text-transform);
}

@media screen and (min-width: 1025px) {
  .promotion-popup__info .button--tertiary {
    font-size: 2rem;
  }
}

.accordion {
  flex: 1;
  width: 100%;
}

@container style(--border-width: 0) or style(--border-style: none) {
  .accordion--dividers:not([class*='color-']) accordion-custom:first-child .details {
    border-block-start: var(--style-border-width) solid var(--color-border);
  }

  .accordion--dividers:not([class*='color-']) accordion-custom:last-child .details {
    border-block-end: var(--style-border-width) solid var(--color-border);
  }
}

.accordion--dividers accordion-custom:not(:first-child) .details {
  border-block-start: var(--style-border-width) solid var(--color-border);
}

.accordion--dividers .details-content {
  padding-block-end: var(--padding-sm);
}

.accordion--caret .icon-plus-wrapper,
.accordion--plus .icon-caret-wrapper {
  display: none;
}

/* because we can't pass apply a specific class on a block based on its parent block setting */
.accordion .details__header {
  font-family: var(--summary-font-family);
  font-style: var(--summary-font-style);
  font-weight: var(--summary-font-weight);
  font-size: var(--summary-font-size);
  line-height: var(--summary-font-line-height);
  text-transform: var(--summary-font-case);
}

.drawer__form-field {
  label {
    font-weight: 500;
  }

  input {
    box-shadow: 0 0 0 calc(0.1rem + var(--inputs-border-width)) rgba(var(--color-foreground-rgb) / 0.2);
    outline: 0;
    border-radius: var(--inputs-radius);

    &.field__input:not(:placeholder-shown) {
      padding-top: 0px;
    }
  }

  input:focus {
    padding-top: 0px;

    &::placeholder {
      opacity: 0;
    }
  }
}

.add-to-cart-text {
  display: flex;
  gap: var(--gap-2xs);
  white-space: nowrap;
  align-items: center;
  justify-content: center;
  animation-duration: var(--animation-speed);
  animation-timing-function: var(--animation-easing);
  animation-fill-mode: forwards;
  transition: opacity var(--animation-speed) var(--animation-easing);
}

.atc-added .add-to-cart-text {
  animation-name: atc-slide-out;
}

.add-to-cart-text--added {
  position: absolute;
  inset: 0;
  animation-duration: var(--animation-speed);
  animation-timing-function: var(--animation-easing);
  animation-fill-mode: forwards;
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 0;
  transition: width var(--animation-speed) var(--animation-easing),
    opacity var(--animation-speed) var(--animation-easing);
}

.atc-added .add-to-cart-text--added {
  animation-name: atc-slide-in;
}

@keyframes atc-slide-in {
  from {
    opacity: 0;
    transform: translateY(0.5em);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes atc-slide-out {
  from {
    transform: translateY(0);
    opacity: 1;
  }

  to {
    transform: translateY(-1em);
    opacity: 0;
  }
}

@media (prefers-reduced-motion: reduce) {
  video-background-component video {
    display: none;
  }
}

.breadcrumbs__separator .icon-caret {
  transform: rotate(-90deg);
  position: relative;
}

.breadcrumbs__separator .svg-wrapper {
  width: clamp(1rem, var(--fluid-font-size), calc(var(--font-size) * 0.8));
  height: auto;
  display: block;
}

.button.size-style {
  height: auto;
}

.button.button--outline,
.button-secondary.button--outline {
  --border-outline-color: var(--button-color);
  background-color: transparent;
  border: 1px solid var(--border-outline-color);
}

.button:not(.button-unstyled) {
  --color-effect-background: var(--color-primary-button-hover-background);
  transition: color var(--animation-speed) var(--animation-easing),
    box-shadow var(--animation-speed) var(--animation-easing),
    background-color var(--animation-speed) var(--animation-easing),
    transform var(--animation-speed) var(--animation-easing);

  &:not(.deferred-media__poster, .prevent-active):active {
    transform: scale(0.9);
  }
}

.button-hover--effect .button-secondary:not(.button-unstyled, .header__icon, [disabled]) {
  --color-effect-background: var(--color-secondary-button-hover-background);
}

.button-hover--effect .button:not(.button-unstyled, .header__icon, .button--outline) {
  background-color: var(--color-primary-button-background);
}

.button-hover--effect .button-secondary:not(.button-unstyled, .header__icon, .button--outline) {
  background-color: var(--color-secondary-button-background);
}

.button-hover--effect .button-secondary:not(.button-unstyled, .header__icon, [disabled]),
.button-hover--effect .button:not(.button-unstyled, .header__icon, [disabled]) {
  --tss: transform var(--animation-slowest-smooth), opacity var(--animation-slowest-smooth);
  position: relative;
  overflow: hidden;
  isolation: isolate;

  .button-text-main {
    transition: var(--tss);
  }

  .button-overflow {
    &:after {
      content: attr(data-button-text);
      transform: translateY(100%);
      transition: var(--tss);
      display: inline-block;
      position: absolute;
      inset-block-start: 0;
      inset-inline-start: 0;
      height: 100%;
      width: 100%;
    }
  }

  &:after {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    width: 120%;
    height: calc(100% + (max(0.2rem, var(--button-border-width)) * 2));
    background-color: var(--color-effect-background);
    backface-visibility: hidden;
    will-change: transform;
    transform: translate(-50%, -50%) rotate3d(0, 0, 2, 20deg) translate3d(-1.2em, 105%, 0);
    transform-origin: 0% 100%;
    transition: var(--tss);
    z-index: -1;
  }

  &:hover {
    .button-overflow:after {
      transform: translateY(0);
    }
    .button-text-main {
      transform: translateY(-100%);
      opacity: 0;
    }
    &:after {
      transform: translate(-50%, -50%) rotate3d(0, 0, 1, 0) translate3d(0, 0, 0);
    }
  }
}

.link {
  cursor: pointer;
  height: auto;
  font-size: var(--button-font-size-link, var(--font-size--sm));
  font-weight: var(--button-font-weight-link, var(--font-body--weight));
  font-family: inherit;
  text-decoration: none;
  text-wrap: var(--text-wrap);
  text-transform: var(--text-transform);
  border: none;
  box-shadow: none;

  &[style*='--button-font-size-link'] {
    font-size: var(--button-font-size-link);
  }

  @media screen and (min-width: 1025px) {
    &:hover {
      color: var(--color-primary-hover);
    }
  }
}

.link--text {
  color: var(--color-foreground);

  @media screen and (min-width: 1025px) {
    &:hover{
      color: rgb(var(--color-foreground-rgb) / var(--opacity-75));
    }
  }
}

.link--hover-underline .text,
.link--hover-underline:not(:has(.text)) {
  transition: background-size var(--animation-values-slow), opacity var(--animation-speed)  var(--animation-delay, 0s) var(--animation-easing), color var(--animation-speed) var(--animation-delay, 0s) var(--animation-easing);
}

.link--underline:not(:has(.text)),
.link--underline .text,
.link--hover-underline .text,
.link--hover-underline:not(:has(.text)) {
  --line-link-gap: min(100%, 1.35em);
  text-decoration: none;
}

.link--underline:not(:has(.text)),
.link--underline .text {
  background: linear-gradient(to right, var(--link-underline-color, currentColor), var(--link-underline-color, currentColor)) 0 var(--line-link-gap) / 0 1px no-repeat;
  background-position-y: bottom;
  background-position-x: left;
  background-size: 100% 1px;
  transition: background-size var(--animation-values-slow), opacity var(--animation-speed)  var(--animation-delay, 0s) var(--animation-easing), color var(--animation-speed) var(--animation-delay, 0s) var(--animation-easing);
}

.link--hover-underline .text,
.link--hover-underline:not(:has(.text)) {
  background: linear-gradient(to left, var(--link-underline-color, currentColor), var(--link-underline-color, currentColor)) 0 var(--line-link-gap) / 0 1px no-repeat;
  background-position-y: bottom;
  background-position-x: right;
  display: inline;
}

@media (prefers-reduced-motion: no-preference) and (hover: hover) {
  .instagram-item .link--reveal,
  .group-block-content .link--reveal {
    position: relative;
    overflow: hidden;
    display: inline-block;
    color: transparent !important;

    .text-mask {
      display: block;
      position: absolute;
      left: 0;
      top: 0;
      width: 100%;
      height: 100%;
      color: var(--color-primary);
      transition: transform var(--animation-slowest-smooth);
      transform: translateY(100%);
    }
  }

  .group-block-content:hover .link--reveal .text-mask,
  .instagram-item:hover .link--reveal .text-mask {
    transform: translateY(0);
  }

  .group-block-content .link--reveal.link--underline,
  .instagram-item .link--reveal.link--underline {
    padding-bottom: var(--offset-underline);
    .text-mask {
      text-decoration: underline;
      text-underline-offset: var(--offset-underline);
    }
  }

  .link--hover-underline:hover .text,
  .link--hover-underline:not(:has(.text)):hover {
    background-position-x: left;
    background-size: 100% 1px;
  }

  .link--underline:hover .text,
  .link--underline:not(:has(.text)):hover {
    background-position-x: right;
    background-size: 0% 1px;
  }
}

.card_article__button {
  text-decoration: underline;
  text-underline-offset: 4px;
}

.cart-discount__input {
  height: 100%;
  flex-grow: 1;
  min-width: 0;
}

.cart-discount__pill-code {
  overflow: hidden;
  max-width: 100px;
  text-overflow: ellipsis;
  white-space: nowrap;
  margin: 0;
}

.cart-discount {
  width: 100%;
}

.cart-discount__codes {
  display: none;
  gap: var(--padding-xs);
  flex-wrap: wrap;
  list-style: none;
  padding-inline: 0;
  margin: var(--margin-sm) 0 0 0;
}

.cart-discount__codes:has(.cart-discount__pill) {
  display: flex;
}

.cart-discount__button {
  height: 100%;
}

.cart-discount__content {
  display: inherit;
  height: calc(var(--button-size) + var(--padding-2xs) + var(--padding-sm));
}

.cart-discount__pill {
  display: flex;
  color: var(--color-foreground);
  gap: var(--padding-xs);
  align-items: center;
  padding: var(--padding-2xs) var(--padding-sm);
  border-radius: var(--style-border-radius-md);
  background-color: var(--bg-medium-gray);
  font-size: var(--font-size--sm);
  text-transform: uppercase;

  .svg-wrapper {
    width: var(--size-16);
    height: var(--size-16);
  }
}

.cart-discount__form {
  display: flex;
  gap: var(--padding-md);
  align-items: stretch;
  height: 100%;

  .button {
    min-width: 10rem;
    padding-inline: 1rem;
  }

  .field .cart-discount__input {
    height: 100%;
  }
}

:is(.cart-discount__pill-remove, .cart-discount__pill-remove:hover) {
  --close-icon-opacity: 0.4;

  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--color-foreground);
  background-color: transparent;
  pointer-events: all;
  cursor: pointer;
  height: 100%;
}

.cart-discount__error {
  display: flex;
  align-items: center;
  width: 100%;
  padding-block: var(--padding-sm);
}

.cart-discount__error .svg-wrapper {
  flex-shrink: 0;
  margin-inline: var(--margin-3xs) var(--margin-xs);
}

.cart-discount__error-text {
  margin-block-start: var(--margin-3xs);
}

.discount-content {
  display: grid;
  grid-template-rows: 1fr;
  /* stylelint-disable-next-line plugin/no-unsupported-browser-features */
  clip-path: inset(-5% -5% 0 -5%);
  opacity: 1;

  &[inert] {
    grid-template-rows: 0fr;
    opacity: 0;
  }

  & > * {
    min-height: 0;
  }
}

@media (prefers-reduced-motion: no-preference) {
  .discount-content {
    transition-property: grid-template-rows, opacity;
    transition-duration: var(--surface-transition-duration);
    transition-timing-function: var(--surface-transition-timing);
  }
}

.collapsible-text-button-wrapper button {
  margin-block: var(--margin-block-start-mobile, var(--margin-block-start)) var(--margin-block-end-mobile, var(--margin-block-end));

  @media (min-width: 750px) {
    margin-block: var(--margin-block-start) var(--margin-block-end);
  }
}

.collapsible-text-content {
  overflow: hidden;
  transition: max-height 0.3s ease;
}

.collapsible-text-content.collapsed {
  max-height: var(--preview-height);
  position: relative;
}

.collapsible-text-content.collapsed:after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: 40px;
  background: linear-gradient(transparent, var(--color-background));
  pointer-events: none;
}

.collapsible-text-content.expanded {
  max-height: none;
}

.collapsible-text * {
  text-align: var(--horizontal-alignment, center);
  justify-content: var(--horizontal-alignment, center);
  align-items: var(--vertical-alignment, center);
}

.collection-card {
  --fixed-card-height: var(--height-small);

  width: 100%;
  position: relative;
}

.collection-card > svg {
  height: 100%;
  width: 100%;
  aspect-ratio: var(--ratio);
}

.collection-card__inner {
  width: 100%;
  overflow: hidden;
  position: relative;
  gap: var(--collection-card-gap);
  display: flex;
  flex-direction: column;
}

.collection-card--image-bg .collection-card__inner {
  height: 100%;
}

.collection-card__inner {
  z-index: var(--layer-flat);
  pointer-events: none;

  a,
  button {
    /* only allow interactive elements to be clickable separate from .collection-card__link */
    pointer-events: auto;
  }
}

/* allow all blocks to be selectable in editor preview */
.shopify-design-mode .collection-card__content * {
  pointer-events: auto;
}

.collection-card__content {
  position: relative;
  display: flex;
  height: 100%;
  width: 100%;
  max-width: 100%;
  flex-direction: column;
  align-items: var(--horizontal-alignment);
  justify-content: var(--vertical-alignment);
}

.collection-card__content > .size-style {
  height: auto;
}

.collection-card__link {
  position: absolute;
  inset: 0;

  /* allows focus outline to have radius in supported browsers */
  border-radius: var(--border-radius);
}

/* Nested image block rules */

.collection-card.collection-card--image-bg {
  aspect-ratio: var(--ratio);
}

.collection-card.collection-card--image-bg .collection-card__content {
  padding: var(--padding-lg);
}

/* Bento layout rules */
.collection-card--image-height-fixed .collection-card__image {
  height: var(--fixed-card-height);
  width: 100%;
}

.collection-card--image-height-fixed.collection-card--image-bg {
  height: var(--fixed-card-height);
  aspect-ratio: unset;
}

.collection-card__image .image-block__image {
  object-fit: cover;
  width: 100%;
  height: 100%;
  max-width: 100%;
}

.collection-card--image-bg .collection-card__image {
  position: absolute;
  width: 100%;
  height: 100%;
}

.resource-list:not(.hidden--desktop) .collection-card--flexible-aspect-ratio {
  &.collection-card.collection-card--image-bg,
  &.collection-card .placeholder-svg {
    aspect-ratio: 99;
  }

  .collection-card__image {
    aspect-ratio: 99;
    height: 100%;
  }

  .collection-card__inner {
    display: flex;
    flex-direction: column;
    height: 100%;
  }

  .collection-card__content {
    flex-shrink: 0;
  }

  &:not(.collection-card--image-bg) .collection-card__content {
    height: auto;
  }
}

.contact-form__form {
  display: flex;
  flex-direction: column;
  gap: var(--gap-md);
}

.contact-form__form-row {
  display: flex;
  flex-direction: column;
  gap: var(--gap-md);

  @media screen and (min-width: 750px) {
    flex-direction: row;
    align-items: center;
  }
}

.contact-form__input {
  width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  color: var(--color-foreground);
  background-color: var(--color-input-background);
  padding: var(--padding-lg) var(--padding-xl);
  border-radius: var(--inputs-radius);
  border: var(--inputs-border-width) solid var(--color-input-border);
  -webkit-font-smoothing: antialiased;
}

.contact-form__input--textarea {
  resize: vertical;
  min-height: var(--input-textarea-min-height);
}

.contact-form__error,
.contact-form__success {
  display: flex;
  align-items: center;
  gap: var(--gap-xs);
}

.disclosure-trigger {
  cursor: pointer;
  color: var(--color-foreground);
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-block: var(--padding-sm);
  width: 100%;
  border: none;
  background: #0000;

  &[aria-expanded='true'] .horizontal {
    rotate: 90deg;
  }

  &:is(:hover, :focus-visible) {
    color: rgb(var(--color-foreground-rgb) / var(--opacity-subdued-text));
  }

  .horizontal {
    transform-box: fill-box;
    transform-origin: center;
  }

  svg {
    aspect-ratio: 1;
    width: var(--icon-size-xs);
  }
}

.disclosure-trigger__label {
  display: flex;
  align-items: flex-start;
  gap: var(--gap-2xs);
  font-size: var(--cart-font-size--sm);
}

@media (prefers-reduced-motion: no-preference) {
  .disclosure-trigger .horizontal {
    transition: rotate var(--surface-transition-duration) var(--surface-transition-timing);
  }
}

.divider {
  align-self: stretch;
  display: flex;
  align-items: center;
  justify-content: var(--divider-justify-content);
}

.divider__line {
  border-bottom: var(--divider-border-thickness) solid var(--color-border);
  border-right: var(--divider-border-thickness) solid var(--color-border);
  border-radius: calc(var(--style-border-radius-sm) * var(--divider-border-rounded));
  flex-basis: var(--divider-flex-basis);
  min-height: var(--divider-flex-basis);
}

.editorial-collection__grid {
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  grid-auto-rows: 1fr;
  column-gap: 3rem;
  row-gap: 4rem;

  .resource-list__item,
  .collection-card {
    height: 100%;
  }
}

.editorial-collection__spacer {
  aspect-ratio: 1;
}

@media screen and (min-width: 750px) {
  .resource-list:not(.hidden--desktop) {
    & .collection--current__item-1,
    & .collection--current__item-2 {
      & .collection-card__inner {
        flex-direction: column-reverse;
      }
    }
  }
}

@media screen and (max-width: 749px) {
  .editorial-collection__grid {
    display: flex;
    flex-direction: column;
  }

  .editorial-collection__spacer {
    display: none;
  }

  .editorial-collection__item {
    width: 100%;
    aspect-ratio: 4 / 6;
  }
}

.editorial-product__grid {
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  grid-auto-rows: 1fr;
  gap: 1rem;

  .grid__item {
    width: 100%;
    max-width: 100%;
  }
}

.editorial-product__spacer {
  aspect-ratio: 1;
}

@media (max-width: 749px) {
  .editorial-product__grid {
    display: flex;
    flex-direction: column;
    gap: 2rem;
  }

  .editorial-product__spacer {
    display: none;
  }

  .editorial-product__item-0 {
    width: 83%;
    align-self: flex-start;
    aspect-ratio: 7 / 6;
  }
  .editorial-product__item-1 {
    width: 83%;
    align-self: flex-end;
    aspect-ratio: 4 / 5;
  }
  .editorial-product__item-2 {
    width: 66%;
    align-self: flex-start;
    aspect-ratio: 5 / 5;
  }
  .editorial-product__item-3 {
    width: 100%;
    aspect-ratio: 8 / 6;
  }
}

/* Facets - Actions */
.facets__actions {
  --to-top-gradient-background: linear-gradient(
    to top,
    rgb(var(--color-background-rgb) / var(--opacity-90)),
    rgb(var(--color-background-rgb) / var(--opacity-80)),
    rgb(var(--color-background-rgb) / var(--opacity-40)),
    transparent
  );

  order: 1;
  position: sticky;
  bottom: 0;
  display: flex;
  justify-content: space-between;
  align-items: stretch;
  gap: var(--gap-sm);
  background-image: var(--to-top-gradient-background);
  z-index: var(--facets-sticky-z-index);
  padding-block-start: var(--padding-xs);
  padding-block-end: var(--padding-md);
  padding-inline: var(--padding-lg);
  margin-top: auto;
}

.facets:not(.facets--drawer) .facets__actions {
  @media screen and (min-width: 750px) {
    position: static;
  }
}

.facets--vertical .facets__actions {
  padding-inline: 0;
  justify-content: center;
}

.facets--horizontal .facets__actions {
  @media screen and (min-width: 750px) {
    order: 0;
    bottom: auto;
    position: static;
    padding: 0;
    z-index: var(--layer-flat);
    flex-shrink: 0;
    align-items: center;
    margin-top: initial;
    background-image: none;
  }
}

.facets--horizontal .facets__actions--active::before {
  @media screen and (min-width: 750px) {
    content: '';
    border-inline-start: var(--style-border-width) solid var(--color-border);
    height: var(--font-paragraph--size);
    position: absolute;
  }
}

/* Clear button */
.facets__clear {
  display: none;
}

.facets--horizontal .facets__clear {
  @media screen and (min-width: 750px) {
    width: 100%;
    justify-content: flex-end;
    padding: 0 var(--facets-clear-padding) var(--facets-clear-padding) 0;
    cursor: pointer;
  }
}

.facets__clear--active {
  @media screen and (min-width: 750px) {
    display: flex;
  }
}

.clear-filter:hover {
  text-decoration: underline;
  background-color: transparent;
}

/* Clear all button */
.facets__clear-all {
  display: none;
  cursor: pointer;
  min-width: var(--facets-clear-all-min-width);
  transition: transform var(--animation-values), opacity var(--animation-values);
  opacity: 0;
  transform: translateY(100%);
  flex-grow: 1;
  padding-block: var(--padding-lg);
}

.facets:not(.facets--drawer) .facets__clear-all {
  box-shadow: none;
}

.facets--horizontal .facets__clear-all {
  @media screen and (min-width: 750px) {
    --facets-clear-all-min-width: var(--minimum-touch-target);
    --button-color: var(--color-primary);

    text-decoration: underline transparent 0.075em;
    text-underline-offset: 0.125em;
    width: auto;
    transform: none;
    opacity: 1;
    height: var(--minimum-touch-target);
    align-items: center;
    flex-grow: 0;
    transition: text-decoration-color var(--animation-speed) var(--animation-easing);
  }
}

.facets--horizontal .facets__clear-all:hover {
  @media screen and (min-width: 750px) {
    --button-color: var(--color-primary-hover);
  }
}

@starting-style {
  .facets__clear-all {
    opacity: 1;
    transform: translateY(0);
  }
}

.facets__clear-all.active {
  transform: translateY(0);
  opacity: 1;
  display: grid;
}

.facets--horizontal .facets__clear-all.active {
  @media screen and (min-width: 750px) {
    padding-block: 0;
    padding-inline: var(--facets-form-horizontal-gap);
    background-color: transparent;
    position: static;
    transform: none;
  }
}

@starting-style {
  .facets__clear-all.active {
    opacity: 0;
    transform: translateY(100%);
  }

  .facets--horizontal .facets__clear-all.active {
    @media screen and (min-width: 750px) {
      opacity: 1;
      transform: none;
    }
  }
}

.facets__see-results {
  min-width: var(--facets-see-results-min-width);
  flex-grow: 1;
  padding-block: var(--padding-lg);
}

.facets:not(.facets--drawer) .facets__see-results {
  @media screen and (min-width: 750px) {
    display: none;
  }
}

/* Facets - Remove buttons */
.facets-remove {
  --variant-picker-swatch-width: 20px;
  --variant-picker-swatch-height: 20px;

  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: var(--gap-xs);
  padding: 0 var(--drawer-padding);
  margin-block-start: var(--margin-2xs);
  margin-block-end: var(--margin-md);

  @media screen and (min-width: 750px) {
    --variant-picker-swatch-width: 16px;
    --variant-picker-swatch-height: 16px;

    gap: var(--gap-2xs);
  }
}

.facets__clear-all-link {
  --button-color: var(--color-primary);

  border: none;
  background-color: transparent;
  padding: var(--padding-xs);
  min-width: fit-content;
  color: var(--button-color);
  transition: text-decoration-color var(--animation-speed) var(--animation-easing),
    color var(--animation-speed) var(--animation-easing);
}

.facets__clear-all-link:hover {
  --button-color: var(--color-primary-hover);

  color: var(--button-color);
  text-decoration-color: var(--button-color);
}

.facets:not(.facets--drawer) .facets-remove--mobile-and-vertical {
  @media screen and (min-width: 750px) {
    padding: 0;
  }
}

.facets--horizontal .facets-remove--mobile-and-vertical {
  @media screen and (min-width: 750px) {
    display: none;
  }
}

.facets-remove:not(:has(facet-remove-component)) {
  display: none;
  margin: 0;
}

.facets-remove__pill {
  .svg-wrapper,
  .swatch {
    flex-shrink: 0;
  }
}

.facets--horizontal .facets-remove {
  @media screen and (min-width: 750px) {
    display: none;
  }
}

.column-options-wrapper {
  --icon-offset: -3px;

  display: flex;
  gap: var(--gap-sm);
  min-width: fit-content;
  justify-content: flex-end;
  height: var(--minimum-touch-target);
  align-items: center;
  margin-right: var(--icon-offset);
}

.column-options-wrapper:only-child {
  margin-left: auto;
}

.facets__form-wrapper > .column-options-wrapper:first-child {
  margin-left: auto;
}

.facets .column-options-wrapper {
  display: none;

  @media screen and (min-width: 750px) {
    display: flex;
  }
}

.column-options {
  display: flex;
  flex-wrap: wrap;
  gap: var(--gap-xs);
  margin: 0;
  padding: 0;
  border: none;

  @media screen and (min-width: 750px) {
    gap: var(--gap-2xs);
  }
}

.column-options__option {
  display: none;
  position: relative;
}

.column-options__option:has(.column-picker-mobile--single),
.column-options__option:has(.column-picker-mobile--double) {
  @media screen and (max-width: 749px) {
    display: flex;
  }
}

.column-options__option:has(.column-picker--default),
.column-options__option:has(.column-picker--zoom-out) {
  @media screen and (min-width: 750px) {
    display: flex;
  }
}

.column-options__legend {
  padding: 0;
  margin: 0;
}

.column-options__option-input {
  /* this is a repeating pattern a bit with the variant picker buttons */

  /* remove the checkbox from the page flow */
  position: absolute;

  /* set the dimensions to match those of the label */
  inset: 0;

  /* hide it */
  opacity: 0;
  margin: 0;
  cursor: pointer;
}

.column-picker {
  color: rgb(var(--color-foreground-rgb) / var(--opacity-50));
  padding: var(--padding-2xs);
  border-radius: var(--style-border-radius-xs);
  transition: background-color var(--animation-speed) ease, color var(--animation-speed) ease;
}

.column-options__option:hover .column-picker {
  background-color: rgb(var(--color-foreground-rgb) / var(--opacity-5));
}

.column-options__option-input:checked ~ .column-picker {
  color: rgb(var(--color-foreground-rgb));
  background-color: rgb(var(--color-foreground-rgb) / var(--opacity-5));
}

.group-block__media-wrapper.media--empty:has(.background-image-container svg ):not(:has(+ .group-block-content > *))  {
  aspect-ratio: 1/1;
}

.group-block__link,
.group-block__link:empty {
  display: block;
  position: absolute;
  inset: 0;
}

.group-block__link ~ :is(.group-block-content, .group-block__media-wrapper) {
  pointer-events: none;
  :is(a, button, input, textarea, select) {
    pointer-events: auto;
  }
}

.group-block__link ~ .group-block-content--design-mode {
  pointer-events: auto;
}

.drawer--menu .menu-drawer__utility-links .menu-drawer__back-button {
  display: flex;
  align-items: center;
  width: 100%;
  height: 100%;
  padding: var(--padding-md) var(--minimum-touch-target) var(--padding-md) var(--padding-xl);
  border: none;
  color: var(--color-foreground);
  background-color: transparent;
  text-align: left;
  text-decoration: none;
  white-space: nowrap;
  overflow-x: hidden;
  line-height: 1.2;
  box-shadow: none;
  letter-spacing: normal;

  &:hover >.svg-wrapper svg {
    color: currentColor;
    fill: currentColor;
  }
}

.drawer--menu .menu-drawer__utility-links .menu-drawer__back-button > .svg-wrapper {
  margin-right: var(--padding-md);
  width: var(--icon-size-xs);
  height: var(--icon-size-xs);
}

.menu-drawer {
  overflow-y: auto;
  
  svg {
    width: var(--icon-size-xs);
    height: var(--icon-size-xs);
  }

  .disclosure__list-wrapper {
    opacity: var(--opacity-0);
    visibility: hidden;
    transform: translateY(0);
    transition-property: opacity, transform;
    transition-duration: var(--duration-medium);
    transition-timing-function: var(--cubic-smooth);
  }

  .selector__dropdown .disclosure__list-wrapper {
    transform: translate(-5%);
    border-radius: 0;
    border: none;
    z-index: var(--layer-raised);
  }

  .selector__dropdown.active .disclosure__list-wrapper {
    transform: translate(0);
    opacity: var(--opacity-100);
    visibility: visible;
  }

  .country-selector-form__wrapper .country-selector__list,
  .localization-form--language {
    padding-inline: var(--padding-xl);
  }

  .disclosure-has-popup[open] > summary::before {
    position: absolute;
  }

  .details--dropdown .details__list {
    top: unset;
    bottom: 100%;
  }

  .country-selector-form__wrapper .localization-form:only-child {
    padding: 0;
    width: 100%;
  }

  .country-filter,
  .language-filler {
    padding-inline: var(--padding-xl);
  }

  .language-selector localization-form {
    height: 100%;
    display: flex;
  }
}

.drawer__container .list-menu__item {
  padding-block: var(--padding-sm);
}

.drawer__container.active .menu-drawer__item-animate {
  animation: menu-drawer-item-open var(--drawer-animation-speed) var(--ease-out-smooth);
  animation-delay: calc(var(--drawer-animation-speed) + (var(--menu-drawer-animation-index) - 1) * 0.1s);
  animation-fill-mode: backwards;
}

jumbo-text {
  display: block;
  font-family: var(--font-family, inherit);
  font-style: var(--font-style, normal);
  color: var(--color, inherit);
  font-weight: var(--font-weight, inherit);
  letter-spacing: var(--letter-spacing, -0.02em);
  line-height: var(--line-height, 1);
  opacity: 0;
  text-align: var(--text-align);
  text-box: var(--text-trim, trim-end cap text);
  text-transform: var(--text-transform, none);
  transition: opacity 0.3s ease;
  white-space: pre;
  width: 100%;
  will-change: font-size;
  margin-left: var(--margin-left-nudge, 0);
  margin-right: var(--margin-right-nudge, 0);
  overflow: visible;
  pointer-events: none;
}

jumbo-text.ready {
  opacity: 1;
}

jumbo-text[data-cap-text='true'] {
  text-box-edge: cap text;
}

.jumbo-text-space {
  display: inline-flex;
  width: 0.5ch;
}

:is(.jumbo-text-char, .jumbo-text-line) {
  display: inline-flex;
}

@media (prefers-reduced-motion: no-preference) {
  /* Blur effect */
  [data-text-effect='blur'] {
    filter: blur(20px);
    opacity: 0.5;
    scale: 1.05;
    transition: filter 1.6s var(--animation-timing-fade-in), opacity 1.3s var(--animation-timing-fade-in),
      scale 1.6s var(--animation-timing-fade-in);
  }

  .jumbo-text-visible[data-text-effect='blur'] {
    filter: blur(0);
    opacity: 1;
    scale: 1;
  }

  /* Reveal effect */
  .ready[data-text-effect='reveal'],
  .ready[data-text-effect='reveal'] .jumbo-text-line {
    overflow: hidden;
  }

  .ready[data-text-effect='reveal'] .jumbo-text-char {
    transform: translateY(100%);
  }

  .jumbo-text-visible[data-text-effect='reveal'] .jumbo-text-char {
    transition: transform 0.5s var(--animation-timing-fade-in) calc(var(--line-index) * 0.05s);
    transform: translateY(0);
  }

  .jumbo-text-visible[data-text-effect='reveal'],
  .jumbo-text-visible[data-text-effect='reveal'] .jumbo-text-line {
    overflow: visible;
    transition: overflow 0s linear 0.75s;
  }
}

.facets input:checked + label {
  font-weight: 500;
}

.facets .checkbox .icon-checkmark {
  transition: border-color 0.2s ease, background-color 0.2s ease;
}

.facets .checkbox:not(:has(.checkbox__input:disabled)):hover .icon-checkmark {
  border-color: rgb(var(--color-foreground-rgb) / var(--opacity-40-60));
  background-color: rgb(var(--color-foreground-rgb) / var(--opacity-5));
}

.facets .checkbox:has(.checkbox__input:checked):not(:has(.checkbox__input:disabled)):hover .icon-checkmark {
  background-color: rgb(var(--color-foreground-rgb) / var(--opacity-85));
}

.facets .checkbox:not(:has(.checkbox__input:disabled)):hover .checkbox__label-text {
  color: rgb(var(--color-foreground-rgb) / var(--opacity-90));
}

.facets .checkbox .checkbox__label-text {
  transition: color 0.2s ease, font-weight 0.2s ease;
}

/* Pill style */
.facets__pill-label {
  --pill-label-padding-inline: var(--padding-xs);
  --pill-label-border-radius: var(--style-border-radius-md);
  --pill-label-border-width: var(--variant-picker-button-border-width);
  --pill-label-height: var(--button-size-md);
  --pill-label-focus-outline-color: var(--color-foreground);
  --pill-label-color: var(--color-foreground);
  --pill-label-color-rgb: var(--color-foreground-rgb);
  --pill-label-background-color: var(--color-background);
  --pill-label-background-color-rgb: var(--color-background-rgb);
  --pill-label-border-opacity: var(--facets-low-opacity);

  display: inline-flex;
  position: relative;
  align-items: center;
  justify-content: center;
  box-shadow: inset 0 0 0 var(--pill-label-border-width) rgb(var(--pill-label-color-rgb) / var(--opacity-10-25));
  border-radius: var(--pill-label-border-radius);
  height: var(--pill-label-height);
  width: 100%;
  padding-inline: var(--pill-label-padding-inline);
  color: rgb(var(---pill-label-color-rgb));
  background-color: rgb(var(--pill-label-background-color-rgb));
  cursor: pointer;
  transition: color var(--animation-speed) var(--animation-easing),
    background-color var(--animation-speed) var(--animation-easing);
  outline-color: var(--pill-label-focus-outline-color);

  &:hover {
    --pill-label-border-opacity: 100%;
  }
}

.facets__pill-input {
  &:checked + .facets__pill-label {
    --pill-label-color: var(--color-background);
    --pill-label-background-color: var(--color-foreground);
    --pill-label-border-opacity: 0;

    font-weight: 500;
  }

  &:disabled + .facets__pill-label {
    opacity: var(--disabled-opacity);
    cursor: not-allowed;

    &:hover {
      --pill-label-border-opacity: var(--facets-low-opacity);
    }
  }
}

.facets__status-wrapper {
  display: flex;
  align-items: center;
}

.facets--drawer .facets__status-wrapper {
  @media screen and (max-width: 749px) {
    gap: var(--gap-3xs);
  }
}

.facets--vertical .facets__status-wrapper {
  gap: var(--gap-xs);
}

.facets--horizontal .facets__status-wrapper {
  gap: 0;
}

.facets__pill-input:disabled + .facets__pill-label svg {
  position: absolute;
  top: 0;
  left: 0;
  border-radius: var(--style-border-radius-md);
}

.facets__pill-label svg line {
  stroke-width: 1.5px;
  stroke: rgb(var(--color-foreground-rgb) / var(--facets-low-opacity));
}

.facets__pill-wrapper {
  position: relative;
}

.facets__pill-input {
  position: absolute;
  inset: 0;
  margin: 0;
  opacity: 0;
  cursor: pointer;
}

/* Swatches */
.facets__status--swatches {
  display: none;
}

.facets__swatch-wrapper {
  display: flex;
}

.facets__inputs-list--swatches .variant-option__button-label {
  --color-variant-text: var(--color-foreground);
}

.facets__inputs-list--swatches {
  --variant-picker-swatch-width: 32px;
  --variant-picker-swatch-height: 32px;

  @media screen and (min-width: 750px) {
    --variant-picker-swatch-width: 26px;
    --variant-picker-swatch-height: 26px;
  }
}

.facets--vertical .facets__inputs-wrapper .facets__inputs-list--swatches-grid {
  gap: var(--gap-sm);
}

.facets--vertical .facets__inputs-list--swatches .facets__inputs-list-item {
  display: flex;
}

.facets__inputs-wrapper .facets__inputs-list--swatches-grid {
  --columns: 2;

  display: grid;
  grid-template-columns: repeat(var(--columns), 1fr);
}

.facets__inputs-wrapper .facets__inputs-list--swatches-grid .variant-option--swatches {
  cursor: pointer;
  overflow: visible;

  &.variant-option--swatches-disabled,
  &:has(input:disabled) {
    cursor: not-allowed;
  }
}

.facets__inputs-wrapper .facets__inputs-list--swatches-grid label {
  cursor: pointer;
  word-break: break-word;
  white-space: normal;

  .variant-option--swatches-disabled &,
  .variant-option--swatches:has(input:disabled) & {
    cursor: not-allowed;
  }
}

.facets__inputs-wrapper .facets__inputs-list--swatches-grid .variant-option__button-label--has-swatch {
  align-items: center;
  overflow: visible;
  justify-content: flex-start;
  display: flex;
  width: 100%;
  flex-basis: unset;
  gap: var(--gap-sm);
}

.facets__inputs-wrapper .facets__inputs-list--swatches-grid .variant-option__button-label:has(:checked) {
  color: rgb(var(--color-foreground-rgb));
  background-color: rgb(var(--color-background-rgb));
  font-weight: 500;
  transition: font-weight 0.2s ease;
}

.facets .variant-option--swatches {
  --options-border-radius: var(--variant-picker-swatch-radius);

  width: auto;
}

.facets--horizontal .facets__status--swatches {
  @media screen and (min-width: 750px) {
    display: flex;
  }
}

.facets--horizontal .sorting-filter .facets__status {
  @media screen and (min-width: 750px) {
    display: none;
  }
}

.facets__status--swatches .swatch {
  width: calc(var(--variant-picker-swatch-width) / 1.5);
  height: calc(var(--variant-picker-swatch-height) / 1.5);
}

.facets__status--swatches .swatch + .swatch {
  margin-left: calc(var(--variant-picker-swatch-width) / -3);
  outline: 1px solid rgb(var(--color-background-rgb));
}

.variant-option--images {
  position: relative;
}

.variant-option--images {
  --image-facet-border-width: var(--variant-picker-button-border-width);
  --image-facet-border-opacity: var(--facets-low-opacity);
  --image-facet-border-radius: var(--style-border-radius-xs);

  border-radius: var(--image-facet-border-radius);
  box-shadow: inset 0 0 0 var(--image-facet-border-width)
    rgb(var(--color-foreground-rgb) / var(--image-facet-border-opacity));

  &:hover:not(:has(input:disabled)),
  &:has(input:checked) {
    --image-facet-border-opacity: 100%;
  }

  &:has(input:checked) {
    font-weight: 500;
    transition: font-weight 0.2s ease;
  }

  &:has(input:checked):hover {
    --image-facet-border-width: calc(var(--variant-picker-button-border-width) + 0.5px);
  }

  &:has(input:focus-visible) {
    outline: var(--focus-outline-width) solid currentcolor;
    outline-offset: var(--focus-outline-offset);
  }

  &:has(input:disabled),
  &:has(input:disabled):hover {
    --image-facet-border-opacity: 0;

    opacity: var(--disabled-opacity);
    cursor: not-allowed;

    img {
      opacity: var(--disabled-opacity);
    }

    input,
    label,
    .facets__image-label {
      cursor: not-allowed;
    }

    .facets__image-wrapper {
      border: var(--style-border-width) solid rgb(var(--color-foreground-rgb) / var(--opacity-30));
      border-radius: var(--image-facet-border-radius);
    }
  }
}

.facets__inputs-wrapper .facets__inputs-list--images {
  display: grid;
  grid-template-columns: repeat(var(--image-columns), 125px);
  gap: var(--gap-sm);
}

.facets--drawer .facets__inputs-wrapper .facets__inputs-list--images {
  grid-template-columns: repeat(3, 1fr);

  @media screen and (min-width: 750px) {
    grid-template-columns: repeat(4, 1fr);
  }
}

.facets--vertical .facets__inputs-wrapper .facets__inputs-list--images {
  grid-template-columns: repeat(2, 1fr);
}

.facets--drawer .facets__inputs-list--images {
  padding-top: var(--padding-xs);
}

.facets__image-wrapper {
  aspect-ratio: 1/1;
  width: 100%;
  padding: var(--padding-xs);
  position: relative;
  overflow: hidden;
}

.facets__image-wrapper img {
  height: 100%;
  width: 100%;
  object-fit: contain;
  border-radius: calc(var(--border-radius) / 2);
}

/* Position disabled-svg */
.variant-option--images svg {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  width: 100%;
  height: 100%;
  stroke-width: var(--border-width);
  stroke: rgb(var(--color-foreground-rgb) / var(--opacity-5));
}

/* Position label text and handle overflow */
.facets__inputs-list-item,
.variant-option--images {
  min-width: 0;
}

.facets__image-label {
  width: 100%;
  text-align: center;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  padding-block-end: var(--padding-xs);
  cursor: pointer;

  .variant-option--images:has(input:disabled) & {
    cursor: not-allowed;
  }
}

.facets__inputs-list--swatches .variant-option__button-label:hover:not(:has(input:disabled)) {
  font-weight: 500;
}

.variant-option--images:not(:has(input:disabled)) .facets__image-label:hover {
  font-weight: 500;
}

.media-banner {
  min-height: var(--media-height, auto);
  align-items: center;
}

.media-block {
  overflow: hidden;
  position: relative;

  @media screen and (min-width: 750px) {
    min-height: var(--media-height);
  }
}

.media-block__media {
  height: var(--media-height-mobile, 100%);
  object-fit: var(--image-position, 'cover');
  object-position: center center;
  width: 100%;

  @media screen and (min-width: 750px) {
    height: 100%;
    position: absolute;
  }
}

deferred-media[class].media-block__media
  :is(.deferred-media__poster-button img, .deferred-media__poster-button ~ video) {
  object-fit: var(--video-position, 'cover');
}

.media-block__media--video {
  display: flex;
  align-items: center;
  justify-content: center;

  @media screen and (max-width: 749px) {
    --media-height-mobile: auto;
  }
}

.menu-drawer__utility-links .header__icon--wishlist {
  display: flex;
  width: 100%;
  justify-content: flex-start;
  padding: var(--padding-sm) var(--padding-xl);
  gap: var(--gap-lg);

  .svg-wrapper {
    width: var(--size-24);
  }

  .wishlist-count-bubble{
    position: unset;
    transform: unset;
  }
}

.menu-drawer__utility-links .disclosure__list.country-selector__list,
.menu-drawer__utility-links .disclosure__list.language-selector__list {
  padding-block-end: var(--padding-sm);
  width: 100%;
  max-height: calc(100dvh - 16.5rem);
}

.menu-drawer__utility-links .disclosure__list-wrapper {
  position: fixed;
  width: 100%;
  top: 0;
  height: 100dvh;
  left: 0;
  background-color: var(--color-background);
  max-height: initial;
  display: grid;
  grid-template-rows: 4.5rem 1fr 5rem;
}

.menu-drawer__utility-links localization-form:has(.country-selector__list--with-multiple-currencies) {
  width: 100%;
  max-height: calc(100dvh - 9.5rem);
  display: block;

  .country-selector__list--with-multiple-currencies {
    width: 100%;
    max-height: calc(100dvh - 16.5rem);
  }
}

.menu-drawer__utility-links .language-selector--only .details--dropdown-language {
  width: 100%;
}

.header__icon--menu .button {
  padding: 0;
}

.header__icon .icon-hamburger-custom:not(.icon-flag) {
  display: block;
  height: auto;
  width: 100%;
  transition: transform var(--animation-speed-slow) var(--ease-out-smooth);
  position: relative;

  .icon-hamburger-custom__line {
    width: var(--size-22);
    height: var(--size-2);
    display: block;
    background-color: currentcolor;
    margin: .6rem auto;
    transition: transform var(--animation-speed-slow) var(--ease-out-smooth), width var(--animation-speed-slow) var(--ease-out-smooth);
    border-radius: 8px;

    &:nth-child(1),
    &:nth-child(3) {
      transition-delay: var(--animation-speed);
    }
  }
}

.header__icon--menu button.active .icon-hamburger-custom {
  --translate-y: 8px;
  transition-delay: var(--animation-speed-slowest);
  transform: rotate(45deg);

  .icon-hamburger-custom__line:nth-child(1) {
    transform: translateY(var(--translate-y));
  }
  .icon-hamburger-custom__line:nth-child(2) {
    width: 0px;
  }
  .icon-hamburger-custom__line:nth-child(3) {
    transform: translateY(calc(var(--translate-y) * -1)) rotate(90deg);
  }
}

.header__icon--menu button {
  height: var(--minimum-touch-target);
  width: var(--minimum-touch-target);
  padding: 0;
}

.multi-category_wrapper {
  padding: 30px 15px;
  margin: 0 auto;
  background-color: #dddddd;
}

.multi-category_filter .form-wrapper {
  flex-grow: 1;
}
.multi-category_filter .form-field {
  max-width: 26%;
  margin: 0;
  border-right: 1px solid #cbcbcb;
}
.multi-category_filter .form-field:first-child span {
  border-top-left-radius: 5px;
  border-bottom-left-radius: 5px;
}
.multi-category_filter .form-field.form-field-last {
  border-right: 0;
}
.multi-category_filter .form-field.form-field-last span {
  border-top-right-radius: 5px;
  border-bottom-right-radius: 5px;
}
.multi-category_filter .form-field svg {
  position: absolute;
  right: 17px;
  top: 17px;
  width: 25px;
  height: 25px;
  color: var(--color-label-multiLevel-categories);
  pointer-events: none;
}
.multi-category_filter .form-label {
  font-size: 0;
  line-height: 0;
}
.multi-category_filter .form-select {
  background: var(--bg-label-multiLevel-categories);
  color: var(--color-label-multiLevel-categories);
  height: 6rem;
  line-height: 6rem;
  padding: 0 2rem 0 3rem;
}

.multi-category_filter .form-select:has(+ .dropdown-up.open) {
  border-bottom-right-radius: 0;
  border-bottom-left-radius: 0;
}

.multi-category_filter .dropdown-up {
  top: 6rem;
  left: 0;
  background: var(--bg-label-multiLevel-categories);
  border: 1px solid #cbcbcb;
  z-index: 99;
  border-bottom-right-radius: 0.5rem;
  border-bottom-left-radius: 0.5rem;
}
.multi-category_filter .dropdown-up.open {
  display: block;
}
.multi-category_filter .dropdown-up.open + svg {
  transform: rotate(180deg);
}
.multi-category_filter .dropdown-up ul {
  max-height: 300px;
}
.multi-category_filter .dropdown-up ul > li {
  cursor: default;
  color: var(--color-label-multiLevel-categories);
  line-height: 40px;
  display: block;
  padding: 0 10px 0 30px;
  text-transform: capitalize;
  white-space: nowrap;
  width: 100%;
  margin: 0;
}
.multi-category_filter .dropdown-up ul > li:hover {
  background: #39f;
  color: #fff;
}
.multi-category_filter .group-button {
  width: 230px;
  margin-left: 10px;
  border-radius: 5px;
  overflow: hidden;
  color: var(--color-button-multiLevel-categories);
  background: var(--bg-button-multiLevel-categories);
}
.multi-category_filter .group-button a#multi-category_clear-select {
  padding: 0;
  width: 6rem;
  display: flex;
  justify-content: center;
  align-items: center;
}
.multi-category_filter .group-button a {
  background-color: transparent;
  height: 6rem;
  border: none;
}
.multi-category_filter .group-button a#multi-category_select-browse {
  width: 17rem;
  border-right: 1px solid var(--border-button-multiLevel-categories);
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
}
.multi-category_filter .group-button svg {
  fill: var(--color-button-multiLevel-categories);
  width: 1.6rem;
  height: 1.6rem;
}

.multi-category_filter .group-button:hover {
  color: var(--hover-color-button-multiLevel-categories);
  background: var(--hover-bg-button-multiLevel-categories);
}
.multi-category_filter .group-button:hover svg {
  fill: var(--hover-color-button-multiLevel-categories);
}

@media (max-width: 1024px) {
  .multi-category_filter .form-select {
    height: 5rem;
    line-height: 5rem;
    padding: 0 20px 0 25px;
  }
  .multi-category_filter .form-field svg {
    top: 1.2rem;
  }
  .multi-category_filter .group-button a {
    height: 5rem;
    line-height: 5rem;
  }
}

@media (max-width: 749px) {
  .multi-category_filter .form-wrapper {
    display: block;
    letter-spacing: -0.31em;
  }
  .multi-category_filter .form-field {
    width: calc(100% / 3);
    max-width: unset;
    letter-spacing: normal;
  }
  .multi-category_filter .group-button {
    margin: 2rem auto 0;
    letter-spacing: normal;
  }
  .multi-category_filter .form-select {
    padding: 0 1.5rem;
  }
  .multi-category_filter .form-field svg {
    right: 10px;
  }
  .multi-category_filter .dropdown-up ul > li {
    padding-left: 1.5rem;
  }
}

@media (max-width: 551px) {
  .multi-category_filter .form-field {
    width: 100%;
    border: 0;
    margin-bottom: 1rem;
  }
  .multi-category_filter .form-select {
    border-radius: .5rem;
  }
}

@media (min-width: 1025px) {
  .multi-category_wrapper {
    bottom: 6rem;
    left: 50%;
    transform: translatex(-50%);
    position: absolute;
    color: #fff;
    background-color: transparent;
    z-index: var(--layer-heightened);
    max-width: 120rem;
    width: 100%;
    padding-top: 0;
    padding-bottom: 0;
  }
}

.overlay {
  position: absolute;
  inset: 0;
  z-index: var(--overlay-layer);
  pointer-events: none;
  border-radius: var(--overlay-border-radius, 0px);
}

.overlay--solid {
  background: var(--overlay-color);
}

.overlay--gradient {
  background: linear-gradient(var(--overlay-direction), var(--overlay-color), var(--overlay-color--end));
}

@media screen and (min-width: 750px) {
  .overlay--extend-left:before,
  .overlay--extend-right:after {
    --width-extend: 7rem;
    content: '';
    position: absolute;
    inset: 0;
    z-index: var(--layer-section-background);
    pointer-events: none;
    border-radius: var(--overlay-border-radius, 0px);
    background: var(--overlay-color);
    width: var(--width-extend);
    height: 100%;
  }

  .overlay--extend-left.overlay--gradient:before,
  .overlay--extend-right.overlay--gradient:after {
    background: linear-gradient(var(--overlay-direction), var(--overlay-color), var(--overlay-color--end));
  }

  .overlay--extend-left:before {
    left: calc(var(--width-extend) * -1);
  }

  .overlay--extend-right:after {
    right: calc(var(--width-extend) * -1);
    left: auto;
  }

  *:has(+ .group-block .overlay--extend-left),
  .group-block:has(.overlay--extend-left):has(+ *) {
    z-index: var(--layer-flat);
  }
}

.pagination__list {
  justify-content: var(--pagination-alignment);
}

.pagination__list > li {
  min-width: 4rem;
}

.pagination__list > li:not(:last-child) {
  margin-right: 1.6rem;
}

.pagination__item {
  display: inline-flex;
  height: 4rem;
  color: var(--pagination-color);
  background-color: var(--pagination-active-color);
  border: var(--border-width) solid var(--pagination-color);
  font-size: var(--body-s-font-size);
  box-shadow: rgba(var(--pagination-active-color-rgb) / 0.25) 0rem 0rem 0rem 0rem;
  transition: background-color var(--animation-speed) var(--ease-out-smooth),
    box-shadow var(--animation-speed) var(--ease-out-smooth);

  &:has(.icon-arrow) {
    padding: 0 1.3rem;
  }
}

.pagination__item--current {
  background: var(--pagination-color);
  border-color: rgba(var(--pagination-active-color-rgb) / .25);
  color: var(--pagination-active-color);
  box-shadow: rgba(var(--pagination-active-color-rgb) / .25) 0 4px 4px;
}

.pagination__item:hover {
  background: transparent;
  border-color: var(--pagination-active-color);
  box-shadow: rgba(var(--pagination-active-color-rgb) / 0.25) 0 4px 4px 0;
}

.pagination__item--next,
.pagination__item--prev {
  transition: transform var(--animation-speed) var(--ease-out-smooth);

  &:hover {
    border-color: var(--pagination-active-color);
  }
}

.pagination__list > li:has(.pagination__item--next) {
  margin-right: 2rem;
}

.pagination__list > li:has(.pagination__item--prev) {
  margin-left: 0.4rem;
}

.pagination__item-arrow .svg-wrapper {
  &:has(.icon-arrow) {
    width: 3.2rem;
    height: 1.4rem;
  }

  &:has(.icon-caret) {
    margin-right: -0.2rem;
    width: 1.5rem;
    height: 1.5rem;
  }
}

.pagination__item--next {
  .icon {
    &.icon-caret {
      transform: rotate(-90deg);
    }
  }

  &:hover .icon {
    &.icon-caret {
      transform: rotate(-90deg) scale(1.07);
    }

    &.icon-arrow {
      transform: rotate(0deg) scale(1.07);
    }
  }
}

.pagination__item--prev {
  .icon {
    &.icon-caret {
      transform: rotate(90deg);
    }

    &.icon-arrow {
      transform: rotate(180deg);
    }
  }

  &:hover .icon {
    &.icon-caret {
      transform: rotate(90deg) scale(1.07);
    }

    &.icon-arrow {
      transform: rotate(180deg) scale(1.07);
    }
  }
}

.infinite-scrolling-wrapper {
  margin-top: 2rem;
}

.infinite-scrolling-btn {
  width: 100%;
  max-width: 29rem;
}

.infinite-scrolling-btn.loading {
  opacity: 0.7;
  cursor: not-allowed;
  transform: none;

  .text {
    opacity: 0;
  }
}

.pagination-wrapper.infinite-scrolling-active .pagination {
  display: none;
}

.pagination-wrapper.infinite-scrolling-active .infinite-scrolling-wrapper {
  display: block;
}

.product-grid.loading {
  opacity: 0.7;
  pointer-events: none;
}

.product-grid__item {
  animation: fadeInUp 0.5s ease-out;
}

@keyframes fadeInUp {
  from {
    opacity: 0;
    transform: translateY(20px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.pagination-page-item.pagination-page-total {
  margin: var(--margin-sm) 0;
  font-size: var(--body-s-font-size, 1.4rem);
  color: var(--color-foreground, #000);
}

.progress-wrapper {
  margin-top: 0.5rem;
}

.pagination-total-progress {
  height: 0.4rem;
  background-color: var(--pagination-color);
  border-radius: var(--style-border-radius-xs);
  max-width: 16rem;
}

.pagination-total-item {
  background-color: var(--pagination-active-color);
  border-radius: var(--style-border-radius-xs);
  transition: width 0.5s ease-in-out;
}

[data-total-start].updating,
[data-total-end].updating {
  animation: numberUpdate 0.5s ease-in-out;
}

@keyframes numberUpdate {
  0% {
    transform: scale(1);
  }
  50% {
    transform: scale(1.1);
    color: var(--pagination-active-color);
  }
  100% {
    transform: scale(1);
  }
}

@media (max-width: 749px) {
  .infinite-scrolling-btn {
    min-width: 16rem;
    padding: 1rem 2rem;
    font-size: var(--font-size--xs);
  }

  .pagination-page-item.pagination-page-total {
    gap: 0.3rem;
    font-size: var(--font-size--xs);
  }
}

.search--inline.search-modal__form {
  background-color: transparent;
}

.header__search--underline {
  --inputs-radius: 0;

  .search__input.field__input {
    padding-left: 0;
  }

  .predictive-search--center .field:after {
    top: unset;
    border: none;
  }

  .predictive-search--center .field__input:focus {
    box-shadow: none;
  }
}

.search-action .header__search--inline.header__search--frame {
  min-width: 23rem;
}

@media screen and (max-width: 749px) {
  .predictive-search-results__wrapper-products {
    --card-grid-per-row: 1;
    gap: var(--gap-md);
  }
}

/* Price filter */
.price-facet {
  container-type: inline-size;
  display: flex;
  flex-direction: column;
}

.facets__inputs-wrapper.price-facet__inputs-wrapper {
  flex-wrap: nowrap;
}

.price-facet__field {
  width: 50%;
  flex-grow: 0;
}

@container (max-width: 199px) {
  .facets__inputs-wrapper.price-facet__inputs-wrapper {
    flex-wrap: wrap;
    width: 100%;
  }

  .price-facet__inputs-wrapper .price-facet__field {
    width: 100%;
  }
}

.facets .facets__inputs-wrapper.price-facet__inputs-wrapper {
  padding: var(--inputs-border-width);
  gap: calc(var(--gap-sm) + (var(--inputs-border-width) * 2));
}

.facets--horizontal .facets__panel-content:has(.price-facet) {
  min-width: 360px;
}

.facets--horizontal .facets__inputs-wrapper.price-facet__inputs-wrapper {
  @media screen and (min-width: 750px) {
    padding: calc(var(--padding-md) + var(--inputs-border-width));
  }
}

.price-facet__input {
  width: 100%;
  text-align: right;
  padding-left: calc(2.5 * var(--input-padding-x));
}

.price-facet__input::placeholder {
  color: var(--facets-input-label-color);
}

.price-facet__separator {
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: var(--font-paragraph--size);
}

.price-facet__highest-price {
  padding: var(--padding-xs) 0 var(--padding-sm);
}

.facets--horizontal .price-facet__highest-price {
  padding: 0 var(--padding-md) var(--padding-xs);
}

.field__label.price-facet__label {
  top: 0;
  left: 0;
  color: var(--facets-input-label-color);
  padding: var(--input-padding-y) var(--input-padding-x);
  transform: none;
}

/* product grid */
.product-grid:is(.product-grid--grid)[data-view='1'] {
  --product-grid-columns-desktop: repeat(1, 1fr);
  --card-grid-per-row: 1;
}

.product-grid:is(.product-grid--grid)[data-view='1'] .card {
  --width-block-media: 40%;
  display: grid;
  grid-template-columns: var(--width-block-media) 1fr;
  column-gap: calc(var(--gap, 0) * 3);
}

@media screen and (max-width: 749px) {
  .product-grid:is(.product-grid--grid)[data-view='1'] .card {
    --width-block-media: 11rem;
    column-gap: calc(var(--gap, 0) * 1.5);
  }
}

@media screen and (min-width: 750px) {
  .product-grid:is(.product-grid--grid)[data-view='1'] .card {
    --width-block-media: 30%;
  }
}

@media screen and (min-width: 1600px) {
  .product-grid:is(.product-grid--grid)[data-view='1'] .card {
    --width-block-media: 20%;
  }
}

.product-grid:is(.product-grid--grid)[data-view='1'] .product-description__collection {
  display: block;
}

@media screen and (max-width: 749px) {
  .product-grid:is(.product-grid--grid)[data-view='1'] .product-description__collection {
      display: none;
  }
}

.product-grid:is(.product-grid--grid)[data-view='1'] .card--block-media {
  grid-column: 1;
  grid-row: 1 / span var(--total-blocks);
}

.product-grid:is(.product-grid--grid)[data-view='1'] .card-product-information.layout-panel-flex--row {
  flex-direction: column;
}

.product-grid:is(.product-grid--grid)[data-view='1'] .card--block-title {
  display: flex;
  flex-direction: column;
  gap: var(--gap);
}

.product-grid:is(.product-grid--grid)[data-view='2'] {
  --product-grid-columns-desktop: repeat(auto-fill, minmax(calc(100% / 3), 1fr));
}

.product-grid:is(.product-grid--grid)[data-view='3'] {
  --product-grid-columns-desktop: repeat(auto-fill, minmax(calc(100% / 4), 1fr));
}

@media screen and (max-width: 749px) {
  .product-grid:is(.product-grid--grid)[data-view='3'] {
    --product-grid-columns-desktop: repeat(auto-fill, minmax(calc(100% / 3), 1fr));
  }
}

.product-grid:is(.product-grid--grid)[data-view='4'] {
  --product-grid-columns-desktop: repeat(auto-fill, minmax(calc(100% / 5), 1fr));
}

@media screen and (max-width: 989px) {
  .product-grid:is(.product-grid--grid)[data-view='4'] {
    --product-grid-columns-desktop: repeat(auto-fill, minmax(calc(100% / 4), 1fr));
  }
}

@media screen and (max-width: 749px) {
  .product-grid:is(.product-grid--grid)[data-view='4'] {
    --product-grid-columns-desktop: repeat(auto-fill, minmax(calc(100% / 3), 1fr));
  }
}

.product-grid:is(.product-grid--grid)[data-view='5'] {
  --product-grid-columns-desktop: repeat(auto-fill, minmax(calc(100% / 6), 1fr));
}

@media screen and (max-width: 1599px) {
  .product-grid:is(.product-grid--grid)[data-view='5'] {
    --product-grid-columns-desktop: repeat(auto-fill, minmax(calc(100% / 5), 1fr));
  }
}

@media screen and (max-width: 989px) {
  .product-grid:is(.product-grid--grid)[data-view='5'] {
    --product-grid-columns-desktop: repeat(auto-fill, minmax(calc(100% / 4), 1fr));
  }
}

@media screen and (max-width: 749px) {
  .product-grid:is(.product-grid--grid)[data-view='5'] {
    --product-grid-columns-desktop: repeat(auto-fill, minmax(calc(100% / 3), 1fr));
  }
}
.product-grid {
  --product-grid-gap: var(--product-grid-gap-mobile);

  isolation: isolate;

  @media screen and (min-width: 750px) {
    grid-template-columns: var(--product-grid-columns-desktop);
    --product-grid-gap: var(--product-grid-gap-desktop);
  }
}

/* This triggers iOS < 16.4 */
@supports not (background-color: rgb(from red 150 g b / alpha)) {
  .product-grid .product-media,
  .product-grid .product-media-container {
    aspect-ratio: auto;
  }
}

.main-collection-grid {
  padding: var(--grid--margin--mobile);

  @media screen and (min-width: 750px) {
    padding: var(--padding-block-start) var(--padding-inline-end) var(--padding-block-end) var(--padding-inline-start);
  }
}

.main-collection-grid__empty {
  padding-block: var(--padding-6xl);
  padding-inline: var(--page-margin);
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: var(--padding-sm);
}

.main-collection-grid__empty-title {
  margin: 0;
}

.collection-wrapper--full-width .main-collection-grid__title {
  margin-left: var(--page-margin);
}

.collection-wrapper--full-width-on-mobile .main-collection-grid__title {
  @media screen and (max-width: 749px) {
    margin-left: var(--page-margin);
  }
}

.hotStock-progress {
  max-width: 300px;
  height: var(--progress-bar-height);
  background-color: #f8f8f8;
  text-align: left;
  margin: 8px 0 0;
  display: block;
  overflow: hidden;
}

.hotStock-text {
  color: var(--hot-stock-text-color);
}

.hotStock-progress-item {
  width: var(--progress-bar-width);
  height: 100%;
  display: block;
  /* animation: progressBar 1s ease-in-out; */
  background: linear-gradient(45deg, var(--progress-bar-color) 0%, var(--progress-bar-color_2) 100%);
  transition: width ease 1s;
}

@keyframes progressBar {
  0% {
    width: 0%;
  }

  100% {
    width: var(--progress-bar-width);
  }
}

.product-media {
  aspect-ratio: var(--gallery-aspect-ratio, var(--ratio));
  min-height: 0;
  min-width: 0;
}

@media screen and (min-width: 750px) {
  .media-gallery--carousel .swiper-main,
  .media-gallery--grid .product-media > * {
    border-radius: var(--media-radius, 0);
    overflow: hidden;
  }

  .product-information:not(.product-information--media-right)
    .media-gallery--carousel.media-gallery--extend
    .swiper-main {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
  }

  .product-information.product-information--media-right
    .media-gallery--carousel.media-gallery--extend
    .swiper-main {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
  }

  .product-information:not(.product-information--media-right) {
    .media-gallery--grid.media-gallery--extend:not(.media-gallery--two-column) .product-media > *,
    .media-gallery--grid.media-gallery--extend.media-gallery--two-column:not(.media-gallery--large-first-image)
      .product-media-container:nth-of-type(odd)
      .product-media
      > *,
    .media-gallery--grid.media-gallery--extend.media-gallery--two-column.media-gallery--large-first-image
      .product-media-container:is(:first-of-type, :nth-of-type(even))
      .product-media
      > * {
      border-top-left-radius: 0;
      border-bottom-left-radius: 0;
    }
  }

  .product-information.product-information--media-right {
    .media-gallery--grid.media-gallery--extend:not(.media-gallery--two-column) .product-media > *,
    .media-gallery--grid.media-gallery--extend.media-gallery--two-column:not(.media-gallery--large-first-image)
      .product-media-container:nth-of-type(even)
      .product-media
      > *,
    .media-gallery--grid.media-gallery--extend.media-gallery--two-column.media-gallery--large-first-image
      .product-media-container:is(:first-of-type, :nth-of-type(odd))
      .product-media
      > * {
      border-top-right-radius: 0;
      border-bottom-right-radius: 0;
    }
  }
}

::view-transition-old(gallery-item),
::view-transition-new(gallery-item) {
  animation-duration: 0ms;
}

.edit-cart-popup cart-remove-button {
  display: none;
}

.product-edit-item {
  display: grid;
  grid-template-columns: 11rem 1fr;
  gap: var(--gap-xl);
}

.product-edit-itemLeft,
.product-edit-itemRight {
  position: relative;
}

.product-edit-itemRight {
  text-align: left;
  grid-column: 1 / -1;
}

.product-edit-title {
  overflow: hidden;
  white-space: normal;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  text-overflow: ellipsis;
  -webkit-box-orient: vertical;
  padding: 0 0 var(--padding-3xs) 0;
  margin-top: 0;
  margin-bottom: 0;
}

.product-edit-item:not(.product-edit-itemFirst) {
  animation: search-element-slide-up var(--animation-speed-slowest) var(--ease-out-smooth) backwards;
}

.product-edit-image.card-media--portrait img {
  object-fit: cover;
  object-position: center;
}

.product-edit-price {
  margin: var(--margin-xs) 0 var(--margin-2xs) 0;
}

.product-edit-price .price {
  justify-content: flex-start;
}

.product-edit-price .old-price,
.product-edit-price .new-price {
  display: inline-block;
  vertical-align: middle;
}

.product-edit-price .old-price {
  margin: 0 var(--margin-sm) 0 0;
  text-decoration: line-through;
}

.product-edit-message,
.product-edit-quantity {
  margin: var(--margin-md) 0 0 0;
}

.product-edit-message {
  margin-bottom: var(--margin-md);
}

.product-edit-quantity {
  display: block;
  margin-top: var(--margin-xs);
}

.product-edit-quantity .form-label {
  margin-bottom: var(--margin-xs);
}

.product-edit-itemFirst .product-edit-remove {
  display: none;
}

.product-edit-item .add-more {
  margin: var(--margin-xl) 0 0 0;
  text-decoration: underline;
  text-underline-position: under;
}

.product-edit-item .add-more {
  display: none;
}

.product-edit-item .add-more .text {
  text-underline-offset: 0;
}

.product-edit-action {
  position: relative;
  margin: 0;
}

.btn_1_br_outside .product-edit-action {
  padding: var(--padding-xs) var(--padding-2xs);
}

.product-edit-action .button {
  border-radius: 0;
}

.edit-cart-show .product-edit-action .button.is-loading {
  pointer-events: none;
  font-size: 0 !important;
  transition: none;
}

.product-edit-item + .product-edit-item {
  margin-top: var(--margin-3xl);
  padding-top: var(--padding-3xl);
  border-top: 1px solid #e6e6e6;
}

.product-edit-remove {
  position: absolute;
  top: -15px;
  left: -20px;
  border-radius: 50%;
  background-color: var(--color-background);
  width: var(--size-30);
  height: var(--size-30);
  padding: var(--padding-xs);
  line-height: 1;
  letter-spacing: 0;
  font-size: 0;
  z-index: 2;
  box-shadow: 0 4px 12px rgb(var(--color-foreground-rgb) / var(--opacity-10));

  > svg,
  > .svg-wrapper {
    width: 100%;
    height: 100%;
  }

  svg {
    fill: var(--color-white);
    stroke: transparent;
  }
}

.product-edit-title-variant {
  display: block;
  font-family: var(--font-body--family);
  font-weight: var(--font-body--weight);
  font-size: var(--font-body--size);
  margin-top: var(--margin-xs);
}
.product-edit-hotStock {
  color: var(--color-hot-stock);
  font-family: var(--font-body--family);
  font-weight: var(--font-body--weight);
  font-size: var(--font-body--size);
  margin: var(--margin-xs) 0 0 0;
}


.product-edit-item:nth-last-child(1) .add-more {
  display: block;
  padding: var(--padding-2xl) 0 var(--padding-4xl) var(--padding-lg);
  border-top: 1px solid #e8e8e8;
  position: relative;
  text-transform: uppercase;
  line-height: 1;
  grid-column: 1 / -1;
}

.product-edit-item:nth-last-child(1) .add-more:before,
.product-edit-item:nth-last-child(1) .add-more:after {
  content: '';
  top: 45%;
  display: block;
  position: absolute;
  background-color: currentColor;
  transform: translateY(-50%);
}

.product-edit-item:nth-last-child(1) .add-more:after {
  width: 1px;
  height: 10px;
  left: 4px;
}

.product-edit-item:nth-last-child(1) .add-more:before {
  width: 10px;
  height: 1px;
  left: 0;
}

.update-quantity__group {
  display: flex;
  max-width: 9.4rem;
  position: relative;

  .btn-quantity {
    width: 32px;
    height: 45px;
    display: block;
    position: absolute;
    left: 0;
    top: 0;
    cursor: pointer;
  }

  .form-input {
    width: 100%;
    padding: 0 32px;
    height: 45px;
    text-align: center;
  }
}

.product-edit-quantity .update-quantity__group .btn-quantity:before {
  content: "";
  position: absolute;
  width: 12px;
  height: 1px;
  left: 10px;
  top: 22px;
  background: #5a5a5a;
}

.update-quantity__group .btn-quantity.plus {
  right: 0;
  left: auto;
}

.product-edit-quantity .update-quantity__group .btn-quantity:before {
  content: "";
  position: absolute;
  width: 12px;
  height: 1px;
  left: 10px;
  top: 22px;
  background: #5a5a5a;
}

.product-edit-quantity .update-quantity__group .btn-quantity.plus:after {
  content: "";
  position: absolute;
  width: 12px;
  height: 1px;
  left: 10px;
  top: 22px;
  background: #5a5a5a;
  transform: rotate(90deg);
}

@media (min-width: 551px) {
  .product-edit-item .product-edit-itemLeft {
    display: inline-block;
  }

  .product-edit-item .product-edit-itemRight {
    display: inline-block;
    vertical-align: top;
  }
}

@media (min-width: 750px) {
  .product-edit-item {
    grid-template-columns: 12rem 21rem minmax(30rem,1fr);
    gap: var(--padding-4xl);
  }


  .product-edit-item .product-edit-itemRight {
    grid-column: 3 / 4;
  }
}

@media (min-width: 1025px) {
  .edit-cart-popup .popup__inner {
    min-width: var(--narrow-page-width);
  }
}

.resource-card-wrapper.card-wrapper {
  height: auto;
}

.predictive-search-results__card {
  transition: transform var(--hover-transition-duration) var(--hover-transition-timing),
    box-shadow var(--hover-transition-duration) var(--hover-transition-timing);
}

.resource-card {
  --resource-card-image-size: 7.5rem;
  --resource-card-template-columns: var(--resource-card-image-size) 1fr;
  --resource-card-secondary-image-opacity: 0;
  --resource-card-primary-image-opacity: calc(1 - var(--resource-card-secondary-image-opacity));

  display: grid;
  grid-template-columns: var(--resource-card-template-columns);
  gap: var(--gap-md);
  position: relative;
  text-decoration: none;
  height: 100%;
  opacity: 0;
  animation: fadeIn var(--animation-speed-medium) var(--animation-timing-fade-in) forwards;

  @media screen and (max-width: 749px) {
    --resource-card-image-size: 5rem;
  }

  &.resource-card--column {
    --resource-card-template-columns: 1fr;
    width: 100%;
  }
}

.resource-card__link {
  position: absolute;
  inset: 0;
  z-index: 1;
}

.resource-card__content {
  display: flex;
  flex-direction: column;
  color: var(--color-foreground);
  gap: var(--padding-3xs);
  text-align: var(--text-align);

  .price {
    font-weight: 500;
    font-size: var(--font-size--sm);
  }

  &.justify-end,
  &.items-end {
    --text-align: right;
  }

  &.justify-center,
  &.items-center {
    --text-align: center;
  }

  &.justify-start,
  &.items-start {
    --text-align: left;
  }
}

.resource-card[data-resource-type='article'] .resource-card__content,
.resource-card[data-resource-type='page'] .resource-card__content {
  gap: var(--padding-xs);
}

.resource-card__media-wrapper .card__media {
  aspect-ratio: var(--resource-card-aspect-ratio, auto);
  position: relative;
}

.resource-card__image {
  object-fit: cover;
  border-radius: var(--resource-card-corner-radius);
  opacity: var(--resource-card-primary-image-opacity);
}

.resource-card__image--secondary {
  position: absolute;
  top: 0;
  opacity: var(--resource-card-secondary-image-opacity);
  border-radius: var(--resource-card-corner-radius);
}

.resource-card__media:empty {
  display: none;
}

.resource-card__image-placeholder {
  padding: var(--padding-sm);
  font-size: var(--font-size--lg);
  line-height: var(--line-height--display-loose);
  word-break: break-word;
  background-color: rgb(var(--color-foreground-rgb) / var(--opacity-5));
  aspect-ratio: var(--resource-card-aspect-ratio, auto);
  border-radius: var(--resource-card-corner-radius);
  color: var(--color-foreground);
}

.resource-card__title > * {
  margin-block: 0;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
  line-height: 1.3;
}

.resource-card__title.paragraph {
  line-height: 1.3;

  .link {
    text-transform: initial;
    padding-bottom: 0.1rem;
  }
}

.resource-card--overlay {
  height: 100%;

  &::before {
    content: '';
    position: absolute;
    inset: 50% 0 0;
    background: var(--gradient-image-overlay);
    border-radius: var(--resource-card-corner-radius);
    pointer-events: none;
    z-index: var(--layer-flat);
  }
}

.resource-card--overlay .resource-card__image {
  height: 100%;
}

.resource-card--overlay .resource-card__content {
  position: absolute;
  inset: auto 0 0;
  padding: var(--padding-lg) var(--padding-lg) var(--padding-sm);
  z-index: var(--layer-raised);
}

.resource-card--overlay .resource-card__title {
  color: var(--color-white);
}

/* Collection images */
.resource-card__image-wrapper {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: var(--gap-2xs);
}

.resource-card__collection-image {
  aspect-ratio: 1 / 1;
  object-fit: cover;
  border-radius: calc(var(--card-corner-radius) - (var(--padding-xs) / 2));
}

.resource-card__subtext {
  color: rgb(var(--color-foreground-rgb) / var(--opacity-subdued-text));
  margin-block-start: 0;
}

.resource-card__subtext.paragraph {
  font-size: var(--font-size--sm);
  line-height: var(--line-height--body-tight);
  color: rgb(var(--color-foreground-rgb) / var(--opacity-subdued-text));
  margin-block-end: 0;
}

.resource-card:not(.resource-card--product):has(.resource-card__image--secondary) {
  &:hover,
  &:focus {
    --resource-card-secondary-image-opacity: 1;
  }
}

.variant-selects {
  width: 100%;
}

.variant-selects__form {
  display: flex;
  flex-direction: column;
  gap: var(--padding-lg);
  width: 100%;
}

.variant-selects[data-shopify-visual-preview] {
  min-width: 300px;
  padding-inline-start: max(4px, var(--padding-inline-start));
}

.variant-option {
  margin-block-end: var(--margin-xl);
  --options-border-radius: var(--variant-selects-button-radius);
  --options-border-width: var(--variant-selects-button-border-width);
  --variant-option-padding-inline: var(--padding-md);
}

.variant-option--swatches {
  --options-border-radius: var(--variant-selects-swatch-radius);

  width: 100%;
}

.variant-option--swatches-disabled {
  pointer-events: none;
  cursor: not-allowed;
}

.variant-option--buttons {
  display: flex;
  flex-wrap: wrap;
  gap: var(--gap-sm);
  padding: 0;
  border: none;
}

.variant-option--buttons legend {
  padding: 0;
  margin-block-end: var(--margin-xs);
}

.variant-option__swatch-value {
  padding-inline-start: var(--padding-xs);
  color: rgb(var(--color-foreground-rgb) / var(--opacity-70));
}

.variant-option__button-label {
  --variant-selects-stroke-color: var(--color-variant-border);

  display: flex;
  flex: 0 0 calc(3ch + 1.3em);
  align-items: center;
  position: relative;
  padding-block: var(--padding-sm);
  padding-inline: var(--padding-lg);
  border: var(--style-border-width) solid var(--color-variant-border);
  border-radius: var(--options-border-radius);
  border-width: var(--options-border-width);
  overflow: clip;
  justify-content: center;
  min-height: calc(3ch + 1.3em);
  min-width: fit-content;
  white-space: nowrap;
  background-color: var(--color-variant-background);
  color: var(--color-variant-text);
  transition: background-color var(--animation-speed) var(--animation-easing),
    border-color var(--animation-speed) var(--animation-easing);

  &:hover {
    background-color: var(--color-variant-hover-background);
    border-color: var(--color-variant-hover-border);
    color: var(--color-variant-hover-text);
  }

  @media screen and (min-width: 750px) {
    padding: var(--padding-xs) var(--variant-option-padding-inline);
  }
}

.variant-option__button-label__text {
  text-align: left;
  text-wrap: auto;
}

.variant-option--equal-width-buttons {
  --variant-min-width: clamp(44px, calc(var(--variant-option-padding-inline) * 2 + var(--variant-ch)), 100%);

  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(var(--variant-min-width), 1fr));

  .variant-option__button-label {
    min-width: var(--variant-min-width);
  }

  .variant-option__button-label__text {
    text-align: center;
    text-wrap: balance;
  }
}

.variant-option__button-label:has(:focus-visible) {
  --variant-selects-stroke-color: var(--color-foreground);

  border-color: var(--color-foreground);
  outline: var(--focus-outline-width) solid var(--color-foreground);
  outline-offset: var(--focus-outline-offset);
}

.variant-option__button-label--has-swatch {
  --focus-outline-radius: var(--variant-selects-swatch-radius);
  padding: 0;
  border: none;
  display: block;
  flex-basis: auto;
  min-height: auto;
}

.variant-option__button-label:has(:checked) {
  color: var(--color-selected-variant-text);
  background-color: var(--color-selected-variant-background);
  border-color: var(--color-selected-variant-border);
  transition: background-color var(--animation-speed) var(--animation-easing),
    border-color var(--animation-speed) var(--animation-easing);

  &:hover {
    background-color: var(--color-selected-variant-hover-background);
    border-color: var(--color-selected-variant-hover-border);
    color: var(--color-selected-variant-hover-text);
  }
}

.variant-option__button-label:has([data-option-available='false']) {
  color: rgb(var(--color-variant-text-rgb) / var(--opacity-60));
}

.facets__inputs-list--swatches-grid .variant-option__button-label--has-swatch:hover .swatch {
  --focus-outline: var(--focus-outline-width) solid rgb(var(--color-foreground-rgb) / var(--opacity-35-55));
  outline: var(--focus-outline);
  outline-offset: var(--focus-outline-offset);
}

.facets__inputs-list--swatches-grid .variant-option__button-label:has(:focus-visible) .swatch {
  --focus-outline: var(--focus-outline-width) solid currentcolor;
  outline: var(--focus-outline);
  outline-offset: var(--focus-outline-offset);
}

.facets__inputs-list--swatches-grid .variant-option__button-label:has(:focus-visible) {
  outline: none;
}

.facets__inputs-list--swatches-grid .variant-option__button-label--has-swatch:hover {
  outline: none;
}

.variant-option__button-label--has-swatch:hover {
  outline: var(--focus-outline-width) solid rgb(var(--color-foreground-rgb) / var(--opacity-35-55));
  outline-offset: var(--focus-outline-offset);
}

.facets__inputs-list--swatches-grid .variant-option__button-label--has-swatch:has(:checked) {
  --focus-outline: none;
}

.facets__inputs-list--swatches-grid .variant-option__button-label--has-swatch:has(:checked) .swatch {
  outline: var(--focus-outline);
  outline-offset: var(--focus-outline-offset);
}

.variant-option__button-label--has-swatch:has(:checked) {
  --focus-outline: var(--focus-outline-width) solid var(--color-foreground);
  outline: var(--focus-outline);
  outline-offset: var(--focus-outline-offset);
}

/* This triggers iOS < 16.4. The outline bug is not recognized as a lack of @supports */
@supports not (background-color: rgb(from red 150 g b / alpha)) {
  /** There is a bug in safari < 16.4 that causes the outline to not follow the elements border radius. This is a workaround. **/
  .variant-option__button-label--has-swatch:has(:checked),
  .variant-option__button-label:has(:focus-visible) .swatch,
  .facets__inputs-list--swatches-grid .variant-option__button-label--has-swatch:hover .swatch {
    outline: none;
    position: relative;
    overflow: visible;
  }

  .variant-option__button-label--has-swatch:has(:checked)::after,
  .variant-option__button-label:has(:focus-visible) .swatch::after,
  .facets__inputs-list--swatches-grid .variant-option__button-label--has-swatch:hover .swatch::after {
    content: '';
    position: absolute;
    inset: calc(-1 * var(--focus-outline-offset));
    border: var(--focus-outline);
    border-radius: var(--focus-outline-radius, 50%);
    background-color: transparent;
    display: inherit;
  }
}

.variant-option__button-label:has([data-option-available='false']):has(:checked) {
  --variant-selects-stroke-color: rgb(var(--color-variant-text-rgb) / var(--opacity-60));

  background-color: inherit;
  color: rgb(var(--color-variant-text-rgb) / var(--opacity-60));
  border-color: var(--color-selected-variant-border);
}

.variant-option__button-label input,
.variant-option--images input {
  /* remove the checkbox from the page flow */
  position: absolute;

  /* set the dimensions to match those of the label */
  inset: 0;

  /* hide it */
  opacity: 0;
  margin: 0;
  cursor: pointer;
  width: 100%;
  height: 100%;
}

.variant-option__button-label svg {
  position: absolute;
  top: 0;
  left: 0;
  cursor: pointer;
  pointer-events: none;
  stroke-width: var(--style-border-width);
  stroke: var(--variant-selects-stroke-color);
}

.variant-option__select-wrapper {
  display: flex;
  position: relative;
  border: var(--inputs-border-width) solid var(--color-border);
  border-radius: var(--inputs-radius);
  align-items: center;
  margin-top: var(--margin-2xs);
  overflow: clip;
  transition: background-color var(--animation-speed) var(--animation-easing),
    border-color var(--animation-speed) var(--animation-easing);
}

.variant-option__select-wrapper:has(.swatch) {
  --variant-selects-swatch-width: 20px;
  --variant-selects-swatch-height: 20px;
}

.variant-option__select-wrapper:hover {
  border-color: var(--color-variant-hover-border);
}

.variant-option__select:focus-visible {
  outline: var(--focus-outline-width) solid currentcolor;
  outline-offset: var(--focus-outline-offset);
}

.variant-option__select {
  padding-block: var(--padding-md);
  padding-inline: var(--padding-lg) calc(var(--padding-lg) + var(--icon-size-2xs));
  appearance: none;
  border: 0;
  width: 100%;
  margin: 0;
  cursor: pointer;
}

.variant-option__select-wrapper .icon {
  position: absolute;
  right: var(--padding-md);
  top: 50%;
  transform: translateY(-50%);
  width: var(--icon-size-2xs);
  height: var(--icon-size-2xs);
  pointer-events: none;
}

.variant-option__select-wrapper .swatch {
  position: absolute;
  top: 50%;
  left: var(--padding-md);
  transform: translateY(-50%);
}

.variant-selects--center,
.variant-selects--center .variant-option {
  text-align: center;
  align-items: center;
  justify-content: center;
  width: 100%;
}

.variant-selects--right,
.variant-selects--right .variant-option {
  text-align: right;
  justify-content: right;
}

.share-drawer .popup__inner {
  padding: 2rem;
}

.share-header {
  margin-bottom: 1rem;
}

.wrapper-content {
  padding: 1rem 0;
}

.wrapper-content .form-label {
  margin-bottom: 1rem;
}

.share-button {
  display: block;
  position: relative;
}

.add-to-cart-button-container .share-button,
.add-to-cart-button-container .card-wishlist {
  flex: 1;
  aspect-ratio: 1 / 1;
}

.share-button__button {
  display: inline-block;
  vertical-align: top;
  width: auto;
  min-width: 10rem;
  background-color: transparent;
  box-shadow: none;
}

.share-button__button .icon {
  width: 2rem;
  height: 2rem;
  vertical-align: top;
  margin: 0;
}

.share-button__product .button {
  margin-top: 10px;
}

.share-button__product .icon-clipboard {
  height: 2.2rem;
  width: 2.2rem;
}

.share-button__message:not(:empty) {
  display: block;
  font-size: var(--font-body-size);
  font-weight: var(--font-weight-normal);
  text-align: center;
  line-height: var(--body-line-height);
  letter-spacing: var(--body-letter-spacing);
  color: var(--color-text2);
  margin: 10px 0 0 0;
}

.at-share-btn-elements .at-icon-wrapper {
  width: 22px;
  height: 22px;
  padding: 0;
  margin: 0 8px 0 0;
}

.at-share-btn-elements .at-icon-wrapper svg {
  width: 100%;
  height: 100%;
  fill: var(--icon);
}

.at-share-btn-elements .at-icon-wrapper:last-child {
  margin-right: 0;
}

.share-button__button {
  border: none;
  min-width: auto;
  font-size: 0;
  padding: 1.5rem;
  line-height: 1;
}

.share-button__button svg {
  margin-right: 0;
}

.share-button__product .share-group {
  display: flex;
  justify-content: space-between;
}

.share-button__product .share-group .button {
  width: 6rem;
  margin: 0 0 0 1rem;
  min-width: auto;
  align-items: flex-start;
  font-size: 0;
}

.share-button__product .share_toolbox {
  margin-top: 3rem;
}

.social-share {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  padding: 0;
}

.social-share .svg-wrapper {
  width: 2.4rem;
  height: 2.4rem;
}

.social-share li {
  list-style: none;
  margin-right: 1.5rem;
}

@media (max-width: 1024px) {
  .at-share-btn-elements .at-icon-wrapper {
    width: 25px;
    height: 25px;
  }

  .field__input {
    padding-top: 13px;
    padding-bottom: 13px;
  }

  .share-button__product .share-group .button {
    width: 50px;
  }
}

.sorting-filter__container {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-inline: var(--drawer-padding) 0;
  padding-block: var(--padding-sm);
  margin-inline-end: var(--margin-md);
  position: relative;
}

.sorting-filter__container .facets__label {
  font-size: var(--font-h4--size);
}

.sorting-filter__select-wrapper {
  display: flex;
  position: relative;
  border-radius: var(--variant-picker-button-radius);
  align-items: center;
  overflow: clip;
  padding: var(--padding-2xs) var(--padding-xs);
}

.sorting-filter__select-wrapper:has(:focus-visible) {
  outline: var(--focus-outline-width) solid currentcolor;
  outline-offset: var(--focus-outline-offset);
}

.sorting-filter__select-wrapper:has(:focus-visible) .sorting-filter__select {
  outline: none;
}

.sorting-filter__container .sorting-filter__select {
  appearance: none;
  border: 0;
  margin: 0;
  cursor: pointer;
  width: 100%;
  padding-inline-end: var(--icon-size-2xs);
  text-align: right;

  /* Needed for Safari */
  text-align-last: right;
}

.sorting-filter__select .icon {
  position: absolute;
  right: var(--padding-md);
  top: 50%;
  transform: translateY(-50%);
  width: var(--icon-size-2xs);
  height: var(--icon-size-2xs);
  pointer-events: none;
}

.sorting-filter {
  @media screen and (min-width: 750px) {
    z-index: var(--facets-upper-z-index);
  }
}

.sorting-filter__options {
  display: flex;
  right: 0;
  flex-direction: column;
  gap: var(--margin-3xs);
  padding: calc(var(--drawer-padding) / 2);
  color: var(--color-foreground);
  overflow-y: auto;
  scrollbar-width: none;
  -ms-overflow-style: none;

  &::-webkit-scrollbar {
    display: none;
  }
}

.sorting-filter__option {
  cursor: pointer;
  display: grid;
  grid-template-columns: var(--icon-size-sm) 1fr;
  gap: var(--margin-2xs);
  min-width: 180px;
  padding: var(--padding-2xs) calc(var(--drawer-padding) / 2) var(--padding-2xs) var(--padding-2xs);

  &:hover {
    border-radius: calc(var(--style-border-radius-popover) / 2);
    background-color: rgb(var(--color-foreground-rgb) / var(--opacity-8));
  }

  &:focus {
    border-radius: calc(var(--style-border-radius-popover) / 2);
  }
}

.sorting-filter__input {
  display: none;

  &:checked + .sorting-filter__checkmark + .sorting-filter__label {
    font-weight: 500;
  }
}

.sorting-filter__checkmark {
  visibility: hidden;
}

*:checked ~ .sorting-filter__checkmark {
  visibility: visible;
}

.sorting-filter__label {
  cursor: pointer;
  pointer-events: none;
}

.facets-toggle--no-filters .sorting-filter__select-wrapper {
  @media screen and (max-width: 749px) {
    padding-inline-start: 0;
  }
}

.facets-mobile-wrapper .sorting-filter .facets__panel {
  padding-inline: 0;
  position: relative;
}

.facets-mobile-wrapper .sorting-filter .facets__status {
  display: none;
}

.facets-mobile-wrapper:has(> :nth-child(2)) .sorting-filter .sorting-filter__options {
  left: 0;
  right: unset;
}

.facets-mobile-wrapper .sorting-filter .facets__label {
  margin-inline-end: var(--margin-2xs);
  font-size: var(--font-paragraph--size);
  color: var(--color-foreground-muted);
}

.facets-mobile-wrapper .sorting-filter__options {
  border-radius: var(--style-border-radius-popover);
  position: absolute;
  top: 0;
  right: 0;
  width: max-content;
  min-width: var(--facets-panel-min-width);
  max-width: var(--facets-panel-width);
  max-height: var(--facets-panel-height);
  z-index: var(--facets-upper-z-index);
  box-shadow: var(--style-shadow-popover);
  border: var(--style-border-popover);
  background: var(--color-background);
  overflow-y: hidden;
  padding: var(--padding-sm);
  gap: var(--gap-sm);
}

.facets-toggle .sorting-filter__container {
  @media screen and (max-width: 749px) {
    padding: 0;
  }
}

.facets-toggle .sorting-filter__container .facets__label {
  @media screen and (max-width: 749px) {
    display: none;
  }
}

.facets-toggle .sorting-filter::before {
  @media screen and (max-width: 749px) {
    display: none;
  }
}

.facets--drawer .sorting-filter {
  @media screen and (min-width: 750px) {
    display: none;
  }
}

.sorting-filter__options {
  block-size: 0;
  overflow-y: clip;
  opacity: 0;
  interpolate-size: allow-keywords;
  transition: content-visibility var(--animation-speed-slow) allow-discrete,
    padding-block var(--animation-speed-slow) var(--animation-easing),
    opacity var(--animation-speed-slow) var(--animation-easing),
    block-size var(--animation-speed-slow) var(--animation-easing);
}

details[open] .sorting-filter__options {
  opacity: 1;
  block-size: auto;

  @starting-style {
    block-size: 0;
    opacity: 0;
    overflow-y: clip;
  }

  &:focus-within {
    overflow-y: visible;
  }
}
.swiper-button {
  overflow: hidden;
  &:before {
    content: '';
    position: absolute;
    inset: 1px;
    background-color: var(--arrow-background);
    z-index: -1;
    border-radius: var(--arrow-radius);
  }

  @media (hover: hover) {
    &:hover {
      --arrow-color: var(--arrow-color-hover);
      --arrow-background: var(--arrow-background-hover);
    }
  }
}

.swiper-button .fill-bg {
  background-color: var(--arrow-color);
  z-index: -2;
  inset: -1px;
  border-radius: var(--arrow-radius);
}

.swiper-button-prev .fill-bg {
  transform: translateX(100%);
}

.swiper-button-next .fill-bg {
  transform: translateX(-100%);
}

:root {
  --text-align-default: left;
}

[style*='--horizontal-alignment: center'] .text-block {
  --text-align-default: center;
}

[style*='--horizontal-alignment: flex-end'] .text-block {
  --text-align-default: right;
}

[style*='--horizontal-alignment: flex-start'] > .text-block {
  --text-align-default: left;
}

[style*='--horizontal-alignment: center'] > .text-block {
  --text-align-default: center;
}

[style*='--horizontal-alignment: flex-end'] > .text-block {
  --text-align-default: right;
}

@media screen and (max-width: 749px) {
  [style*='--horizontal-alignment-mobile: center'] .text-block {
    --text-align-default: center;
  }

  [style*='--horizontal-alignment-mobile: flex-end'] .text-block {
    --text-align-default: right;
  }

  [style*='--horizontal-alignment-mobile: flex-start'] > .text-block {
    --text-align-default: left;
  }

  [style*='--horizontal-alignment-mobile: center'] > .text-block {
    --text-align-default: center;
  }

  [style*='--horizontal-alignment-mobile: flex-end'] > .text-block {
    --text-align-default: right;
  }
}

.highlight_text--content.highlight_text--text {
  color: var(--color);
}
.highlight_text--content.highlight_text--underline {
  position: relative;
  display: inline-block;
  z-index: 1;

  &.highlight_text--active:after {
    transform: scaleX(1);
  }
}
.highlight_text--content.highlight_text--underline:after {
  content: '';
  display: block;
  position: absolute;
  bottom: calc(var(--underline-offset, 0.2em) * -1);
  left: 0;
  width: 100%;
  height: max(1px, var(--underline-height,0.18em));
  background: var(--color);
  z-index: -1;
  transition: transform var(--animation-slowest-smooth);
  transform: scaleX(0);
  transform-origin: left;
}

.text-border-style-bottom {
  --border-style: solid;
  position: relative;
  border: none;
  &::before {
    content: '';
    display: block;
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    width: var(--width-custom, 100%);
    height: var(--border-width);
    background: var(--border-color);
  }
}

.heading-border--solid {
  .text {
    width: auto;
  }

  &.text-block--align-left-mobile {
    --padding-inline: 0 1rem;
  }
  &.text-block--align-right-mobile {
    --padding-inline: 1rem 0;
  }
  &.text-block--align-center-mobile {
    --padding-inline: 1rem;
  }

  &::before {
    content: '';
    display: block;
    position: absolute;
    top: calc(50% - var(--border-width));
    left: 0;
    width: 100%;
    height: var(--border-width);
    background: var(--border-color);
  }

  .text {
    padding-inline: var(--padding-inline);
    background: var(--color-background);

    @media screen and (min-width: 1025px) {
      min-width: 42rem;
    }
  }

  @media screen and (min-width: 750px) and (max-width: 1024px) {
    &.text-block--align-left-tablet {
      --padding-inline: 0 1.5rem;
    }
    &.text-block--align-right-tablet {
      --padding-inline: 1.5rem 0;
    }
    &.text-block--align-center-tablet {
      --padding-inline: 1.5rem;
    }
  }

  @media screen and (min-width: 1025px) {
    &.text-block--align-left {
      --padding-inline: 0 2rem;
    }
    &.text-block--align-right {
      --padding-inline: 2rem 0;
    }
    &.text-block--align-center {
      --padding-inline: 2rem;
    }
  }
}

.text-block {
  align-items: var(--horizontal-alignment);

  &.size-style {
    height: auto;
  }
}

.text-block > * {
  width: inherit;
  text-align: var(--text-align-mobile, var(--text-align-default));
  text-wrap: var(--text-wrap);

  @media screen and (min-width: 750px) and (max-width: 1024px) {
    text-align: var(--text-align-tablet, var(--text-align-default));
  }

  @media screen and (min-width: 1025px) {
    text-align: var(--text-align, var(--text-align-default));
  }
}

.text-block.text-block--custom-width  > * {
  width: 100%;
}

.text-block:not(.text-block--full-width-mobile).rte,
.text-block:not(.text-block--full-width-mobile).paragraph {
  /* Safari doesn't support pretty, so fallback to balance */
  text-wrap: balance;
  text-wrap: pretty;
}

.text-block:not(.text-block--full-width-mobile):is(.h1, .h2, .h3, .h4, .h5, .h6) {
  text-wrap: balance;
}

/* Hide underline unless text is using paragraph styles. */
.text-block:is(.h1, .h2, .h3, .h4, .h5, .h6) a {
  text-decoration-color: transparent;
}

.text-block h1,
.text-block.h1 > * {
  margin-block: var(--font-h1--spacing);
}

.text-block h2,
.text-block.h2 > * {
  margin-block: var(--font-h2--spacing);
}

.text-block h3,
.text-block.h3 > * {
  margin-block: var(--font-h3--spacing);
}

.text-block h4,
.text-block.h4 > * {
  margin-block: var(--font-h4--spacing);
}

.text-block h5,
.text-block.h5 > * {
  margin-block: var(--font-h5--spacing);
}

.text-block h6,
.text-block.h6 > * {
  margin-block: var(--font-h6--spacing);
}

.text-block p,
.text-block.p > * {
  margin-block: var(--font-paragraph--spacing);
}

.text-block .text > *:first-child,
.text-block > *:first-child {
  margin-block-start: 0;
}

.text-block .text > *:last-child,
.text-block > *:last-child {
  margin-block-end: 0;
}

.text-block--align-left-mobile,
.text-block--align-left-mobile > * {
  margin-inline-end: auto;
}

.text-block--align-center-mobile,
.text-block--align-center-mobile > * {
  margin-inline: auto;
}

.text-block--align-right-mobile,
.text-block--align-right-mobile > * {
  margin-inline-start: auto;
}

.text-block--background {
  background-color: var(--text-background-color);
  /* border-radius: var(--text-corner-radius); */

  /* To avoid text being cropped when using a border radius we add a minimum padding. */
  padding-block-start: max(var(--text-padding), var(--padding-block-start, 0));
  padding-block-end: max(var(--text-padding), var(--padding-block-end, 0));
  padding-inline-start: max(var(--text-padding), var(--padding-inline-start, 0));
  padding-inline-end: max(var(--text-padding), var(--padding-inline-end, 0));
}

.custom-color,
.custom-color > :is(h1, h2, h3, h4, h5, h6, p, *),
.text-block a {
  color: var(--color);
}

.text-block a {
  text-underline-offset: 0.3rem;
}

.stoke_text--content {
  --fill-color: var(--color-foreground);
  position: relative;
  display: inline-block;
  text-decoration: none;
  text-transform: uppercase;
  -webkit-text-stroke: 1px var(--fill-color);
  background: linear-gradient(var(--fill-color) 0 100%) left / 0 no-repeat;
  color: transparent;
  background-clip: text;
  transition: background-size var(--animation-slowest-smooth);

  /* &:hover {
      background-size: 100%;
    } */
}

@media screen and (min-width: 750px) and (max-width: 1024px) {
  .text-block:not(.text-block--full-width-tablet).rte,
  .text-block:not(.text-block--full-width-tablet).paragraph {
    /* Safari doesn't support pretty, so fallback to balance */
    text-wrap: balance;
    text-wrap: pretty;
  }

  .text-block:not(.text-block--full-width-tablet):is(.h1, .h2, .h3, .h4, .h5, .h6) {
    text-wrap: balance;
  }

  .text-block--align-left-tablet,
  .text-block--align-left-tablet > * {
    margin-inline-end: auto;
  }

  .text-block--align-center-tablet,
  .text-block--align-center-tablet > * {
    margin-inline: auto;
  }

  .text-block--align-right-tablet,
  .text-block--align-right-tablet > * {
    margin-inline-start: auto;
  }
}

@media screen and (min-width: 1025px) {
  .text-block:not(.text-block--full-width).rte,
  .text-block:not(.text-block--full-width).paragraph {
    /* Safari doesn't support pretty, so fallback to balance */
    text-wrap: balance;
    text-wrap: pretty;
  }

  .text-block:not(.text-block--full-width):is(.h1, .h2, .h3, .h4, .h5, .h6) {
    text-wrap: balance;
  }

  .text-block--align-left,
  .text-block--align-left > * {
    margin-inline-end: auto;
  }

  .text-block--align-center,
  .text-block--align-center > * {
    margin-inline: auto;
  }

  .text-block--align-right,
  .text-block--align-right > * {
    margin-inline-start: auto;
  }
}

@media (prefers-reduced-motion: no-preference) {
  /* Blur effect */
  [data-text-effect='blur'] {
    filter: blur(20px);
    opacity: 0.5;
    scale: 1.05;
    transition: filter 1.6s var(--animation-timing-fade-in), opacity 1.3s var(--animation-timing-fade-in),
      scale 1.6s var(--animation-timing-fade-in);
  }

  .text-animation-visible[data-text-effect='blur'] {
    filter: blur(0);
    opacity: 1;
    scale: 1;
  }

  /* Reveal effect */
  [data-text-effect='reveal'],
  [data-text-effect='reveal'] .text-animation-line {
    overflow: hidden;
  }

  [data-text-effect='reveal'] .text-animation-line * {
    transform: translateY(100%);
  }

  .text-animation-visible[data-text-effect='reveal'],
  .text-animation-visible[data-text-effect='reveal'] .text-animation-line {
    overflow: visible;
    transition: overflow 0s linear 0.75s;
  }

  .text-animation-visible[data-text-effect='reveal'] .text-animation-line * {
    transition: transform 0.5s var(--animation-timing-fade-in) 0.05s;
    transform: translateY(0);
  }

  /* Text animations */
  split-words:not(:has(animated-element)) {
    opacity: var(--opacity-0);
  }

  split-words .word {
    overflow: hidden;
    line-height: 1;
    margin: -.1em -.05em;
    padding: .1em .05em;
  }

  split-words[data-animate-type='slide-up'] animated-element {
    transform: translateY(95%);
    opacity: 0;
  }
}

collapsible-text {
  position: relative;

  [data-collapse-button-more],
  [data-collapse-button-less] {
    display: none;
  }

  &.is-collapsed {
    [data-collapse-button-more] {
      display: block;
    }
    [data-collapse-button-less] {
      display: none;
    }
  }
  &.is-expanded {
    [data-collapse-button-more] {
      display: none;
    }
    [data-collapse-button-less] {
      display: block;
    }
  }
}

.collection-description-preview {
  overflow: hidden;
}

.collection-description-text {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  visibility: hidden;
}

.collapsible-buttons {
  display:none;
  /* display: flex; */
  justify-content: var(--text-align);
}

.variant-selects {
  width: 100%;
}

.variant-selects__form {
  display: flex;
  flex-direction: column;
  gap: var(--padding-lg);
  width: 100%;
}

.variant-selects[data-shopify-visual-preview] {
  min-width: 300px;
  padding-inline-start: max(4px, var(--padding-inline-start));
}

.variant-option {
  margin-block-end: var(--margin-xl);
  --options-border-radius: var(--variant-selects-button-radius);
  --options-border-width: var(--variant-selects-button-border-width);
  --variant-option-padding-inline: var(--padding-md);
}

.variant-option--swatches {
  --options-border-radius: var(--variant-selects-swatch-radius);

  width: 100%;

  color-swatch {
    margin-top: 0.7rem;
  }
}

.variant-option--swatches-disabled {
  pointer-events: none;
  cursor: not-allowed;
}

.variant-option--buttons {
  display: flex;
  flex-wrap: wrap;
  gap: var(--gap-sm);
  padding: 0;
  border: none;
}

.variant-option--buttons legend {
  padding: 0;
  margin-block-end: var(--margin-xs);
}

.variant-option__swatch-value {
  padding-inline-start: var(--padding-xs);
  color: rgb(var(--color-foreground-rgb) / var(--opacity-70));
}

.variant-option__button-label {
  --variant-selects-stroke-color: var(--color-variant-border);

  display: flex;
  flex: 0 0 calc(3ch + 1.3em);
  align-items: center;
  position: relative;
  padding-block: var(--padding-sm);
  padding-inline: var(--padding-lg);
  border: var(--style-border-width) solid var(--color-variant-border);
  border-radius: var(--options-border-radius);
  border-width: var(--options-border-width);
  overflow: clip;
  justify-content: center;
  min-height: calc(3ch + 1.3em);
  min-width: fit-content;
  white-space: nowrap;
  background-color: var(--color-variant-background);
  color: var(--color-variant-text);
  transition: background-color var(--animation-speed) var(--animation-easing),
    border-color var(--animation-speed) var(--animation-easing);

  &:hover {
    background-color: var(--color-variant-hover-background);
    border-color: var(--color-variant-hover-border);
    color: var(--color-variant-hover-text);
  }

  @media screen and (min-width: 750px) {
    padding: var(--padding-xs) var(--variant-option-padding-inline);
  }
}

.variant-option__button-label__text {
  text-align: left;
  text-wrap: auto;
}

.variant-option--equal-width-buttons {
  --variant-min-width: clamp(44px, calc(var(--variant-option-padding-inline) * 2 + var(--variant-ch)), 100%);

  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(var(--variant-min-width), 1fr));

  .variant-option__button-label {
    min-width: var(--variant-min-width);
  }

  .variant-option__button-label__text {
    text-align: center;
    text-wrap: balance;
  }
}

.variant-option__button-label:has(:focus-visible) {
  --variant-selects-stroke-color: var(--color-foreground);

  border-color: var(--color-foreground);
  outline: var(--focus-outline-width) solid var(--color-foreground);
  outline-offset: var(--focus-outline-offset);
}

.variant-option__button-label--has-swatch {
  --focus-outline-radius: var(--variant-selects-swatch-radius);
  padding: 0;
  border: none;
  display: block;
  flex-basis: auto;
  min-height: auto;
}

.variant-option__button-label:has(:checked) {
  color: var(--color-selected-variant-text);
  background-color: var(--color-selected-variant-background);
  border-color: var(--color-selected-variant-border);
  transition: background-color var(--animation-speed) var(--animation-easing),
    border-color var(--animation-speed) var(--animation-easing);

  &:hover {
    background-color: var(--color-selected-variant-hover-background);
    border-color: var(--color-selected-variant-hover-border);
    color: var(--color-selected-variant-hover-text);
  }
}

.variant-option__button-label:has([data-option-available='false']) {
  color: rgb(var(--color-variant-text-rgb) / var(--opacity-60));
}

.facets__inputs-list--swatches-grid .variant-option__button-label--has-swatch:hover .swatch {
  --focus-outline: var(--focus-outline-width) solid rgb(var(--color-foreground-rgb) / var(--opacity-35-55));
  outline: var(--focus-outline);
  outline-offset: var(--focus-outline-offset);
}

.facets__inputs-list--swatches-grid .variant-option__button-label:has(:focus-visible) .swatch {
  --focus-outline: var(--focus-outline-width) solid currentcolor;
  outline: var(--focus-outline);
  outline-offset: var(--focus-outline-offset);
}

.facets__inputs-list--swatches-grid .variant-option__button-label:has(:focus-visible) {
  outline: none;
}

.facets__inputs-list--swatches-grid .variant-option__button-label--has-swatch:hover {
  outline: none;
}

.variant-option__button-label--has-swatch:hover {
  outline: var(--focus-outline-width) solid rgb(var(--color-foreground-rgb) / var(--opacity-35-55));
  outline-offset: var(--focus-outline-offset);
}

.facets__inputs-list--swatches-grid .variant-option__button-label--has-swatch:has(:checked) {
  --focus-outline: none;
}

.facets__inputs-list--swatches-grid .variant-option__button-label--has-swatch:has(:checked) .swatch {
  outline: var(--focus-outline);
  outline-offset: var(--focus-outline-offset);
}

.variant-option__button-label--has-swatch:has(:checked) {
  --focus-outline: var(--focus-outline-width) solid var(--color-foreground);
  outline: var(--focus-outline);
  outline-offset: var(--focus-outline-offset);
}

/* This triggers iOS < 16.4. The outline bug is not recognized as a lack of @supports */
@supports not (background-color: rgb(from red 150 g b / alpha)) {
  /** There is a bug in safari < 16.4 that causes the outline to not follow the elements border radius. This is a workaround. **/
  .variant-option__button-label--has-swatch:has(:checked),
  .variant-option__button-label:has(:focus-visible) .swatch,
  .facets__inputs-list--swatches-grid .variant-option__button-label--has-swatch:hover .swatch {
    outline: none;
    position: relative;
    overflow: visible;
  }

  .variant-option__button-label--has-swatch:has(:checked)::after,
  .variant-option__button-label:has(:focus-visible) .swatch::after,
  .facets__inputs-list--swatches-grid .variant-option__button-label--has-swatch:hover .swatch::after {
    content: '';
    position: absolute;
    inset: calc(-1 * var(--focus-outline-offset));
    border: var(--focus-outline);
    border-radius: var(--focus-outline-radius, 50%);
    background-color: transparent;
    display: inherit;
  }
}

.variant-option__button-label:has([data-option-available='false']):has(:checked) {
  --variant-selects-stroke-color: rgb(var(--color-variant-text-rgb) / var(--opacity-60));

  background-color: inherit;
  color: rgb(var(--color-variant-text-rgb) / var(--opacity-60));
  border-color: var(--color-selected-variant-border);
}

.variant-option__button-label input,
.variant-option--images input {
  /* remove the checkbox from the page flow */
  position: absolute;

  /* set the dimensions to match those of the label */
  inset: 0;

  /* hide it */
  opacity: 0;
  margin: 0;
  cursor: pointer;
  width: 100%;
  height: 100%;
}

.variant-option__button-label svg {
  position: absolute;
  top: 0;
  left: 0;
  cursor: pointer;
  pointer-events: none;
  stroke-width: var(--style-border-width);
  stroke: var(--variant-selects-stroke-color);
}

.variant-option__select-wrapper {
  display: flex;
  position: relative;
  border: var(--inputs-border-width) solid var(--color-border);
  border-radius: var(--inputs-radius);
  align-items: center;
  margin-top: var(--margin-2xs);
  overflow: clip;
  transition: background-color var(--animation-speed) var(--animation-easing),
    border-color var(--animation-speed) var(--animation-easing);
}

.variant-option__select-wrapper:has(.swatch) {
  --variant-selects-swatch-width: 20px;
  --variant-selects-swatch-height: 20px;
}

.variant-option__select-wrapper:hover {
  border-color: var(--color-variant-hover-border);
}

.variant-option__select:focus-visible {
  outline: var(--focus-outline-width) solid currentcolor;
  outline-offset: var(--focus-outline-offset);
}

.variant-option__select {
  padding-block: var(--padding-md);
  padding-inline: var(--padding-lg) calc(var(--padding-lg) + var(--icon-size-2xs));
  appearance: none;
  border: 0;
  width: 100%;
  margin: 0;
  cursor: pointer;
}

.variant-option__select-wrapper .icon {
  position: absolute;
  right: var(--padding-md);
  top: 50%;
  transform: translateY(-50%);
  width: var(--icon-size-2xs);
  height: var(--icon-size-2xs);
  pointer-events: none;
}

.variant-option__select-wrapper .swatch {
  position: absolute;
  top: 50%;
  left: var(--padding-md);
  transform: translateY(-50%);
}

.variant-selects--center,
.variant-selects--center .variant-option,
.variant-selects--center .swatch-custom ul {
  text-align: center;
  align-items: center;
  justify-content: center;
  width: 100%;
}

.variant-selects--right,
.variant-selects--right .variant-option,
.variant-selects--right .swatch-custom ul {
  text-align: right;
  justify-content: right;
}

.swatch-custom {
  margin-bottom: 11px;
}

.swatch-custom ul {
  column-gap: 10px;
}

.swatch-custom .item-custom--image .item-custom--inner {
  display: block;
  width: var(--swatch--size);
  height: var(--swatch--size);
  cursor: pointer;
  border-radius: var(--swatch--border-radius);
  text-align: center;
  font-size: 0;
  letter-spacing: 0;
  position: relative;
  background-size: cover;
}

.video-interaction-hint {
  opacity: var(--opacity-0);
  transition: opacity 0.3s ease;
  z-index: var(--layer-flat);
}

.video-interaction-hint:hover {
  opacity: var(--opacity-100);
}

.video-interaction-hint {
  opacity: var(--opacity-0);
  transition: opacity 0.3s ease;
  z-index: var(--layer-flat);
}

.video-interaction-hint:hover {
  opacity: var(--opacity-100);
}

.before-you-leave-content:has(.swiper) {
  overflow: hidden;
}

.blog-post__recent-posts-item {
  padding-block: var(--padding-2xs) var(--padding-sm);
}

.blog-post__recent-posts-item .blog-title {
  margin-block: 0 var(--margin-2xs);
}

.blog-post__recent-posts-item :is(.blog-title, .date) {
  font-size: var(--body-xs-font-size);
  line-height: var(--body-xs-line-height);
}

.blog-posts__sidebar {
  row-gap: 4rem;
}

.blog-posts__sidebar-heading {
  font-size: var(--font-size--sidebar-heading, var(--body-s-font-size));

  &:not(.blog-posts__sidebar-collapse-button) {
    padding-block: calc(var(--padding-xs) - var(--padding-3xs));
    margin-block-end: var(--margin-md);
  }

  &.blog-posts__sidebar-collapse-button {
    margin-block: 0;
  }

  + .svg-wrapper {
    margin-right: 0;
  }
}

@media (max-width: 1024px) {
  .blog-posts__sidebar-drawer {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: var(--layer-sidebar);
    transition: opacity var(--animation-slowest-smooth);
    opacity: 0;
    pointer-events: none;

    &[data-drawer-direction='right'] .blog-posts__sidebar-container {
      margin-left: auto;
    }

    &[data-drawer-direction='left'] .sidebar-close {
      right: calc(var(--size-40) * -1);
    }

    &[data-drawer-direction='right'] .sidebar-close {
      left: calc(var(--size-40) * -1);
    }

    &.open {
      opacity: 1;
      pointer-events: auto;
    }
  }

  .blog-posts__sidebar-container {
    width: min(90%, 35rem);
    height: 100%;
    background-color: var(--color-background);
    z-index: 2;
    position: relative;
  }

  .blog-posts__sidebar {
    width: 100%;
    height: 100%;
    overflow-y: auto;
    padding: var(--padding-xl);
    padding-bottom: var(--padding-6xl);
  }

  .sidebar-close {
    top: 0;
    z-index: 2;
    width: var(--size-40);
    height: var(--size-40);
    color: var(--color-background);
    background-color: var(--color-foreground);
    padding: var(--padding-md);
  }
}

@media screen and (min-width: 1025px) {
  .sidebar-close {
    display: none;
  }
}

.section-bulk-quick-order-list-padding:not(.spacing) {
  padding-block: 2.7rem;
  display: block;
}

@media screen and (min-width: 750px) {
  .section-bulk-quick-order-list-padding:not(.spacing) {
    padding-block: 3.6rem;
  }
}
.quick-add__product-media {
  margin-bottom: 1rem;
}

.quick-add__submit {
  --button-font-size-link: var(--font-size);
  box-sizing: border-box;
  line-height: 1;
  font-size: var(--font-size);
  text-transform: var(--text-transform);

  &.button {
    min-width: 100%;
  }

  &.link {
    min-height: initial;
    position: relative;
    padding: 0;
    .loading__spinner {
      top: 50%;
      left: 50%;
      transform: translate(-50%,-50%);
    }
  }

  &.link.loading > span {
    opacity: 0;
  }

  &.card-product__group-btn {
    padding: 0;
    color: var(--button-color);
    background: var(--button-background-color);
    min-height: initial;

    .text {
      color: var(--button-color);
      background: var(--button-background-color);
    }

    &:hover {
      --button-color: var(--color-primary-button-hover-text);
      --button-background-color: var(--color-primary-button-hover-background);
      color: var(--button-color);
      background: var(--button-background-color);

      .text {
        color: var(--button-color);
        background: var(--button-background-color);
      }
    }
  }
}

quick-add-bulk {
  position: relative;
  grid-row-start: 4;
  margin: 0 0 1rem;
  z-index: 1;
}

.card__content quick-add-bulk .quantity {
  width: 100%;
}

quick-add-bulk .progress-bar-container {
  position: absolute;
  height: 100%;
  display: flex;
  overflow: hidden;
  border-radius: var(--inputs-radius-outset);
  border: var(--inputs-border-width) solid transparent;
  z-index: -1;
}

quick-add-bulk quantity-input {
  justify-content: space-between;
}

quick-add-bulk .quantity__input {
  max-width: calc(6.5rem / var(--font-body-scale));
  flex-grow: 0;
}

.quantity__input-disabled {
  pointer-events: none;
}

/* Quick add main */
.product-quick-add {
  .product__vendor,
  .product__title {
    margin-bottom: 0.5rem;
  }

  .product .price__container {
    margin-bottom: 0;
  }

  @media screen and (min-width: 750px) {
    .product__info-wrapper {
      padding: 2rem 0 0;
    }
  }

  .price__container {
    display: block;
  }
}

.product-quick-add__header {
  padding-right: 5rem;
  .product__media-wrapper {
    @media screen and (min-width: 750px) {
      max-width: 90px;
    }
  }
}

.card-product-information {
  height: auto;
}

.card.flex-column .card-product-information {
  flex: 1;
}

.category-item__placeholder {
  background-color: #f4f4f4;

  svg {
    width: 7rem;
    height: 7rem;
    opacity: var(--opacity-30);
  }
}

.collection-header > * {
  height: auto;
}

.collection-header parallax-image {
  overflow: hidden;
}

.announcement-bar-slider .swiper-button {
  background-color: transparent;
  border: none;

  .fill-bg,
  &:before,&:after {
    display: none;
  }
}

.announcement-bar-slider .swiper-slide {
  padding-inline: var(--button-width);
}


.image-carousel-item {
  display: flex;

  /* When the image is nested in a group, section, etc, respect the parent's horizontal alignment */
  justify-content: var(--horizontal-alignment, 'inline-start');
}

.image-carousel-item--height-fill .image-carousel-item__image {
  height: 100%;
}

.image-carousel-item__image {
  object-fit: cover;
  aspect-ratio: var(--ratio);
}

.image-block--height-fill .video-block {
  height: 100%;
}

.image-block--height-fill .video-block img {
  height: 100%;
  object-fit: cover;
}

.image-block--height-fill .video-block video {
  height: 100%;
  object-fit: cover;
}

.video-block {
  object-fit: var(--object-fit, cover);
  aspect-ratio: var(--ratio);
}

.icon_media {
  display: flex;
  fill: currentcolor;
  flex-shrink: 0;
  position: absolute;
  right: 0;
  bottom: 0;
  z-index: 1;
  right: var(--icon-button-position-right);
  bottom: var(--icon-button-position-bottom);
}
.icon_media.position-left {
  right: unset;
  left: var(--icon-button-position-left);
}

.icon_media.icon_media--circle {
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: var(--icon-button-bg-color);
  color: var(--icon-button-color);
  border-radius: var(--style-border-radius-50);
  width: var(--icon-button-size);
  height: var(--icon-button-size);
}

.icon_plus {
  font-size: 0px;
  width: 48px;
  height: 48px;
  position: absolute;
  z-index: 999;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  opacity: 0;
  overflow: hidden;
  transform: translate(-50%, -50%) scale(.8) rotate(-45deg);
  transition: opacity .1s ease, transform .3s ease;
}

.icon_plus:before {
  position: absolute;
  content: "";
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  background: #fff;
  width: 2px;
  height: 100%;
}

.icon_plus:after {
  position: absolute;
  content: "";
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  background: #fff;
  width: 100%;
  height: 2px;
}

.instagram-item__image:hover .icon_plus {
  opacity: 1;
  overflow: visible;
  visibility: visible;
  transform: translate(-50%, -50%) scale(1) rotate(0);
}

.image-zoomIn img {
  transition: transform .64s ease;
}

.instagram-item__image:hover .image-zoomIn img {
  transform: scale(1.05);
  transition: transform .64s ease;
}

.instagram-item--bg-color {
  background-color: var(--background-color);
  width: 100%;
  height: 100%;
  aspect-ratio: var(--ratioBg);
}

/* Video play/pause button styles */
.video-play-button,
.video-pause-button {
  position: absolute;
  inset: 0;
  background: transparent;
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: white;
  transition: all 0.3s ease;
  border: none;
  cursor: pointer;
}

.video-pause-button {
  opacity: 0;
  visibility: hidden;
  transition: all 0.3s ease;
}

.video-playing:hover .video-pause-button {
  opacity: 1;
  visibility: visible;
}

.video-playing .video-play-button {
  opacity: 0;
  visibility: hidden;
  transition: all 0.3s ease;
}

/* Video Controls Overlay */
.video-controls-overlay {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  background: linear-gradient(transparent, rgba(0, 0, 0, 0.7));
  padding: 20px;
  opacity: 0;
  visibility: hidden;
  transition: all 0.3s ease;
  z-index: 5;
}

.video-playing:hover .video-controls-overlay {
  opacity: 1;
  visibility: visible;
}

/* Progress Bar */
.video-progress-container {
  margin-bottom: 15px;
}

.video-progress-bar {
  position: relative;
  height: 4px;
  background: rgba(255, 255, 255, 0.3);
  border-radius: 2px;
  cursor: pointer;
}

.video-progress-filled {
  height: 100%;
  background: #fff;
  border-radius: 2px;
  width: 0%;
  transition: width 0.1s ease;
}

.video-progress-handle {
  position: absolute;
  top: 50%;
  left: 0%;
  width: 12px;
  height: 12px;
  background: #fff;
  border-radius: 50%;
  transform: translate(-50%, -50%);
  opacity: 0;
  transition: opacity 0.3s ease;
}

.video-progress-bar:hover .video-progress-handle {
  opacity: 1;
}

/* Bottom Controls */
.video-controls-bottom {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 15px;
}

/* Volume Control */
.video-volume-control {
  display: flex;
  align-items: center;
  gap: 10px;
}

.video-volume-button {
  background: none;
  border: none;
  color: white;
  cursor: pointer;
  padding: 5px;
  border-radius: 4px;
  transition: background 0.3s ease;
}

.video-volume-button:hover {
  background: rgba(255, 255, 255, 0.2);
}

.video-volume-slider {
  width: 80px;
}

.volume-range {
  width: 100%;
  height: 4px;
  background: rgba(255, 255, 255, 0.3);
  border-radius: 2px;
  outline: none;
  cursor: pointer;
}

.volume-range::-webkit-slider-thumb {
  appearance: none;
  width: 12px;
  height: 12px;
  background: #fff;
  border-radius: 50%;
  cursor: pointer;
}

.volume-range::-moz-range-thumb {
  width: 12px;
  height: 12px;
  background: #fff;
  border-radius: 50%;
  border: none;
  cursor: pointer;
}

/* Time Display */
.video-time-display {
  display: flex;
  align-items: center;
  gap: 5px;
  color: white;
  font-size: var(--font-size--sm);
  font-weight: 500;
}

.time-separator {
  opacity: 0.7;
}

@media screen and (min-width: 1025px) {
  .lookbook-group.group-block--width-custom {
    width: calc(var(--size-style-width) + var(--custom-gap));
  }
}

.lookBook__btnShowProducts {
  display: flex;
  align-items: center;
  position: absolute;
  bottom: 1.5rem;
  left: 1.5rem;
  z-index: 5;
  height: 3rem;
  min-width: 14rem;
  letter-spacing: normal;
  padding: 0.5rem 1rem;

  .icon-plus-wrapper {
    width: 1.4rem;
    height: 1.4rem;
    margin-right: 0.5rem;
    transition: transform 0.3s ease;

    svg {
      color: currentColor !important;
    }
  }

  &.is-open .icon-plus-wrapper {
    transform: rotate(45deg);
  }
}

.button-hover--effect .button.lookBook__btnShowProducts:not(.button-unstyled, .header__icon) {
  position: absolute;
}

@media screen and (min-width: 1025px) {
  .lookbook-item .lookBook__btnShowProducts {
    bottom: 2.5rem;
    left: 4rem;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.3s ease-in-out;
  }

  .lookbook-item:hover .lookBook__btnShowProducts {
    opacity: 1;
    visibility: visible;
  }
}

.dots-style-dots .lookbook-dot__icon .icon-plus-wrapper,
.dots-style-number .lookbook-dot__icon .icon-plus-wrapper {
  display: none;
}

.dots-style-plus .lookbook-dot__icon {
  width: 3rem;
  height: 3rem;
  background-color: transparent;
  display: inline-flex;
  justify-content: center;
  align-items: center;

  &:before {
    top: 0;
    left: 0;
    width: 3rem;
    height: 3rem;
  }

  .icon-plus-wrapper {
    transition: transform 0.3s ease;
  }
}

.dots-style-plus .lookbook-dot.is-active .icon-plus-wrapper {
  transform: rotate(45deg);
}

a.mobile--multi-tab-button {
  padding: var(--padding-sm) var(--padding-xl);
  min-height: var(--minimum-touch-target);
  display: flex;
  align-items: center;
  justify-content: center;

  &.active,
  &:first-child:not(:has(~ .mobile--multi-tab-button.active)){
    background-color: var(--color-foreground);
    color: var(--color-background);
  }
}

#popup-recently-viewed .recently-viewed-products.collection {
  overflow-y: auto;
}

.section-header--block.border-style {
  border-width: 0 0 var(--border-width-header) 0;
  border-style: var(--border-style-header);
  border-color: var(--border-color-header);
  border-radius: var(--border-radius-header);
}

.section-header--block .link {
  min-width: fit-content;
}

slideshow-animated .slide__img-wrapper img {
  height: 140% !important;
  will-change: transform;
}

.slide__img-wrapper {
  grid-template-columns: repeat(var(--slide-media-count, 1), 1fr);
}

.slide__img-wrapper > .slide__video,
.slide__img-wrapper > .slide__video-poster {
  position: relative;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center center;
}

.slide__img-wrapper > .slide__video-poster {
  position: absolute;
}

.slide__link,
.slide__link:empty {
  display: block;
  position: absolute;
  inset: 0;
}

.slide__link ~ :is(.slide__content) {
  pointer-events: none;
  :is(a) {
    pointer-events: auto;
  }
}

.categories-list-container .category-item__img {
  aspect-ratio: var(--ratio);
  transition: transform 0.3s ease;
  object-fit: var(--image-fit);
}

.categories-list-container .category-item:hover .category-item__img {
  transform: scale(1.05);
}

@media screen and (max-width: 1024px) {
  .categories-grid.max-md\:flex-row {
    overflow-x: auto;

    .category-item {
      min-width: 28rem;
    }
  }
}

@media screen and (max-width: 749px) {
  .swiper-component-mobile .swiper-wrapper {
    flex-wrap: nowrap;
    gap: 0px;
  }

  .swiper-component-mobile .grid__item.swiper-slide {
    max-width: 100%;
  }
}

.collection-carousel-swiper-component.full-width .swiper {
  overflow: visible;
}

.collection-carousel-swiper-component.full-width .swiper-btns-wrap:not(.swiper-btns-wrap--bottom) {
  position: absolute;
  width: 100%;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
  z-index: 1;
}

.product-infinite-scroll {
  margin-top: 5.5rem;
}

.section--featured-collection .content-inside-media {
  padding: 3rem 1rem;

  .content-inside-media__inner {
    max-width: 500px;
  }
}

.collection-banner .video-wrapper {
  .content-inside-media,
  .deferred-media__poster {
    pointer-events: none;
  }

  .content-inside-media__inner {
    pointer-events: visible;
  }

  .deferred-media__poster-icon {
    pointer-events: visible;
    cursor: pointer;
  }

  &:has(.deferred-media[loaded='true']) {
    .video-wrapper__caption {
      display: none;
    }
  }
}

.collection-banner .video-poster-button {
  width: 6.4rem;
  height: 6.4rem;

  .button {
    height: 100%;
    min-width: 100%;
  }
}

.section--featured-collection:has(.type-style--tabs-grid) .has-media-banner,
.section--featured-collection:has(.type-style--tabs-carousel) .has-media-banner {
  grid-template-columns: 1fr;
  gap: var(--gap);
}

@media screen and (min-width: 1025px) {
  .section--featured-collection:has(.type-style--tabs-grid) .has-media-banner,
  .section--featured-collection:has(.type-style--tabs-carousel) .has-media-banner {
    grid-template-columns: var(--columns-vertical-int, 1fr 2fr);
    grid-template-areas: var(--grid-template-areas, 'banner content');

    .collection-banner {
      grid-area: banner;
      height: var(--size-style-height);
    }

    &.media-block--small {
      --columns-vertical-int: 0.46fr 2fr;
    }

    &.media-block--large {
      --columns-vertical-int: 1.3fr 2fr;
    }

    &.has-category-list {
      --columns-vertical-int: 1fr 2.6fr 1fr;
      --grid-template-areas: 'banner content category';

      &.media-block--small {
        --columns-vertical-int: 1fr 3.25fr 1fr;
      }
    }
  }

  .section--featured-collection:has(.type-style--tabs-grid) .has-media-banner.has-media-banner-right,
  .section--featured-collection:has(.type-style--tabs-carousel) .has-media-banner.has-media-banner-right {
    --columns-vertical-int: 2fr 1fr;

    &.media-block--small {
      --columns-vertical-int: 2fr 0.46fr;
    }

    &.media-block--large {
      --columns-vertical-int: 2fr 1.3fr;
    }
  }
}

@media screen and (max-width: 749px) {
  .swiper-component-mobile .swiper-wrapper {
    flex-wrap: nowrap;
    gap: 0px;
  }

  .swiper-component-mobile .grid__item.swiper-slide {
    max-width: 100%;
  }
}

.collection-carousel-swiper-component.full-width .swiper {
  overflow: visible;
}

.collection-carousel-swiper-component.full-width .swiper-btns-wrap:not(.swiper-btns-wrap--bottom) {
  position: absolute;
  width: 100%;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
  z-index: 1;
}

.product-infinite-scroll {
  margin-top: var(--show-more-button-offset, 5.5rem);
}

@media screen and (max-width: 1024px) {
  .product-infinite-scroll {
    margin-top: calc(var(--show-more-button-offset, 5.5rem) * 0.75);
  }
  .type-style--tabs-carousel .section-global__content.has-media-banner .collection-banner {
    display: none;
  }
}

@media screen and (max-width: 749px) {
  .product-infinite-scroll {
    margin-top: calc(var(--show-more-button-offset, 5.5rem) * 0.5);
  }

  .has-media-banner-widget.grid-layout{
    --card-grid-per-row: 1;
  }

  .has-media-banner-widget .collection-banner{
    order: 1;
  }
}

.section--featured-collection .content-inside-media {
  padding: 3rem 1rem;

  .content-inside-media__inner {
    max-width: 500px;
  }
}

.collection-banner .video-wrapper {
  .content-inside-media,
  .deferred-media__poster {
    pointer-events: none;
  }

  .content-inside-media__inner {
    pointer-events: visible;
  }

  .deferred-media__poster-icon {
    pointer-events: visible;
    cursor: pointer;
  }

  &:has(.deferred-media[loaded='true']) {
    .video-wrapper__caption {
      display: none;
    }
  }
}

.collection-banner .video-poster-button {
  width: 6.4rem;
  height: 6.4rem;

  .button {
    height: 100%;
    min-width: 100%;
  }
}

.collection-banner.image-zoomin {
  overflow: hidden;
  .collection-banner__image {
    transition: transform var(--hover-transition-duration) var(--hover-transition-timing);
  }

  &:hover .collection-banner__image {
    transform: scale(var(--hover-subtle-zoom-amount));
  }
}

body {
  --header-height: 0px;
  --header-group-height: var(--header-height);
  --transparent-header-offset-boolean: 0;
}

body:has(> #header-group > header) {
  --header-height: 60px;
}

body:has(> #header-group:empty) {
  --header-group-height: 0px;
}

.header:not([transparent]) {
  display: block;

  @media screen and (min-width: 1025px) {
    min-height: var(--header-height);
  }
}

.header-section {
  position: relative;
}

.header[transparent='not-sticky']:not([data-sticky-state]) ,
.header[transparent='not-sticky'][data-sticky-state='inactive'] {
  .header__icon.button  {
    border: none;
  }
  &:not(:has(.list-menu__item:is(:hover, [aria-expanded='true'], [data-animating]))),
  &:not(:has(.details--dropdown:not(.details--dropdown-language):is(:hover))) {
    .header__icon.button  {
      background-color: transparent;
    }
  }
}

.header:has(.header__row--bottom) .row-group--shadow .header__row--bottom {
  box-shadow: rgba(var(--color-shadow-rgb) / var(--opacity-20)) 0rem 0.2rem 2rem 0rem;
}

.header:not(:has(.header__row--bottom)) .row-group--shadow .header__row--top {
  box-shadow: rgba(var(--color-shadow-rgb) / var(--opacity-20)) 0rem 0.2rem 2rem 0rem;
}

.header[transparent] {
  --language-button-background-color: transparent;
  --language-button-border-color: transparent;

  /* used to apply transparency to .header__row, will only ever be transparent or unset */
  --header-bg-color: transparent;

  /* used to display the appropriate logo based on transparency state */
  --header-logo-opacity: 0;
  --header-logo-inverse-opacity: 1;

  position: absolute;
  top: 0;
  left: 0;
  right: 0;

  /* transparent color scheme on .header should never apply its background color */
  background-color: transparent;
  z-index: var(--layer-overlay);

  &[transparent='not-sticky'][data-sticky-state='active'] {
    --header-logo-opacity: 1;
    --header-logo-inverse-opacity: 0;
    --header-bg-color: unset;
    --color-foreground: inherit;
    --color-foreground-rgb: inherit;
    --color-background: inherit;
    --color-background-rgb: inherit;
    --color-border: inherit;
    --color-border-rgb: inherit;

    .header__row {
      transition: none;

      .button {
        --animation-speed: var(--animation-speed-fast);
      }
    }

    .details--dropdown:is(:hover) > .link.link--hover-underline .text {
      background-position-x: left;
      background-size: 100% 1px;
    }
  }

  @media screen and (hover: hover) {
    &:hover {
      --header-logo-opacity: 1;
      --header-logo-inverse-opacity: 0;
      --header-bg-color: unset;
      --color-foreground: inherit;
      --color-foreground-rgb: inherit;
      --color-background: inherit;
      --color-background-rgb: inherit;
      --color-border: inherit;
      --color-border-rgb: inherit;

      .header__row {
        transition: none;

        .button {
          --animation-speed: var(--animation-speed-fast);
        }
      }

      .details--dropdown:is(:hover) > .link.link--hover-underline .text {
        background-position-x: left;
        background-size: 100% 1px;
      }
    }
  }

  .header__row {
    transition: none;

    .button {
      --animation-speed: var(--animation-speed-slow);
    }
  }
}
@media screen and (max-width: 1024px) {
  :is(.header[transparent]:not([data-sticky-state='active']),
  .header[transparent='always'][data-sticky-state='active']) .header__row {
    --color-foreground: inherit;
    --color-foreground-rgb: inherit;
    --color-border: inherit;
    --color-border-rgb: inherit;
    --color-primary-button-text: inherit;
    --color-primary: inherit;
    --color-primary-rgb: inherit;
    --color-input-text: inherit;
    --color-input-border: inherit;

    .search--inline {
      --color-input-text: inherit;
      --color-input-border: inherit;
      --color-primary-button-text: inherit;
    }
  }
}

@media screen and (min-width: 1025px) {
  :is(.header[transparent]:not([data-sticky-state='active']),
  .header[transparent='always'][data-sticky-state='active']) .header__row:not(:hover) {
    --color-foreground: inherit;
    --color-foreground-rgb: inherit;
    --color-border: inherit;
    --color-border-rgb: inherit;
    --color-primary-button-text: inherit;
    --color-primary: inherit;
    --color-primary-rgb: inherit;
    --color-input-text: inherit;
    --color-input-border: inherit;

    .search--inline {
      --color-input-text: inherit;
      --color-input-border: inherit;
      --color-primary-button-text: inherit;
    }
  }
}

#header-group:has(#header-component[data-sticky-type]) {
  display: contents;
}

.header__row {
  --color-primary-button-background: transparent;
  --color-primary-button-border: transparent;

  position: relative;
  background-color: var(--header-bg-color, var(--color-background));

  &:has(.header__search--inline),
  &:has(.header__search--inline .search__input.field__input:focus) {
    z-index: 3;
  }

  &.header__row--top:has(.header-localization) {
    z-index: 4;
  }
}

/* Header padding styles */
.header {
  --last-item-minus-margin: 0rem;
  .header__row--top {
    padding-block-start: var(--padding-block-start-top);
    padding-block-end: var(--padding-block-end-top);

    @media screen and (max-width: 749px) {
      padding-block-start: var(--padding-block-start-top) * 0.5;
      padding-block-end: var(--padding-block-end-top) * 0.5;
    }
  }
  .header__row--bottom {
    padding-block-start: var(--padding-block-start-bottom);
    padding-block-end: var(--padding-block-end-bottom);

    @media screen and (max-width: 749px) {
      padding-block-start: var(--padding-block-start-bottom) * 0.5;
      padding-block-end: var(--padding-block-end-bottom) * 0.5;
    }
  }
}

/* Animated Sticky Header */

.header__row--top:not(.divider--page-width),
.header__row--top.divider--page-width .header__columns,
.header__row--bottom {
  border-bottom: var(--border-bottom-width) solid var(--color-border);
}

.header__row--bottom .header__column--right > *:last-child {
  margin-right: calc(var(--last-item-minus-margin) * -1);
}

@media screen and (max-width: 749px) {
  .header__row--top:not(.divider--page-width),
  .header__row--top.divider--page-width .header__columns {
    border-bottom-width: var(--border-bottom-width-mobile);
  }
}

.header__row.divider--page-width:not(.section--page-width) .header__columns:not(:has(.header-multi-site)) {
  @media screen and (min-width: 750px) {
    padding-inline-start: 0;
    padding-inline-end: 0;
    margin-inline-start: var(--page-margin);
    margin-inline-end: var(--page-margin);
  }
}

.header__row.divider--page-width:not(.section--page-width) .header__columns:has(.header-multi-site) {
  padding-inline: 0;

  @media screen and (min-width: 1025px) {
    padding-inline-start: 0;
    padding-inline-end: var(--page-margin);
  }
}

.header__column {
  display: flex;
  align-items: center;

  /* on mobile, header__column nodes are ignored to create a new grid-template-area based on all visible content */
  @media screen and (max-width: 1024px) {
    display: contents;
  }
}

.header__column--left,
.header__column--center {
  gap: var(--gap-items);
  grid-area: left;
}

.header__column--center {
  justify-content: center;
  grid-area: center;

  header-menu:only-child .overflow-menu::part(list) {
    justify-content: center;
  }
}

.header__column--right {
  gap: var(--gap-items);
  justify-content: flex-end;
  grid-area: right;

  .overflow-menu::part(list) {
    justify-content: flex-end;
  }
}

.header__columns {
  /* Three column layout */
  --header-left: 1fr;
  --header-center: auto;
  --header-right: 1fr;
  --header-template-columns: var(--header-left) var(--header-center) var(--header-right);

  /* Mobile layout */
  --header-mobile-bookend: 44px;

  display: grid;
  grid-template-areas: 'left center right';
  grid-gap: var(--gap-xl);
  grid-template-columns: var(--header-template-columns);

  /* If menu is in center column */
  &:has(.header__column--center .header-menu) {
    --header-center: auto;
    --header-left: minmax(max-content, 1fr);
    --header-right: minmax(max-content, 1fr);
  }

  /* If search and no menu in center column */
  &:has(.header__column--center .header__search):not(:has(.header__column--center .header-menu)) {
    --header-center: minmax(max-content, 1fr);
    --header-left: minmax(max-content, 1fr);
    --header-right: minmax(max-content, 1fr);

    .header__search,
    .search-action {
      width: 100%;
      justify-content: center;
    }
  }

  &:has(.header__column--center .header__search) {
    .header__search .svg-wrapper {
      margin-inline-start: 0;
    }
  }

  &:has(.header__column--left .header__search .search--inline) {
    .header__search .details__list {
      left: 0;
    }

    .header__search .search-modal__form:has(.search__input.field__input:focus) .details__list,
    .header__search .search-modal__form[open] .details__list {
      opacity: 1;
      transform: translate3d(0, 1rem, 0);
      pointer-events: auto;
    }
  }

  &:has(.header__column--center .header__search .search--inline) {
    .header__search .predictive-search--center {
      width: 100%;
      max-height: 70dvh;
    }

    .header__search .details__list {
      left: 50%;
      transform: translate(-50%, 5rem);
    }

    .header__search .search-modal__form:has(.search__input.field__input:focus) .details__list,
    .header__search .search-modal__form[open] .details__list {
      transform: translate3d(-50%, 1rem, 0);
    }
  }

  &:has(.header__column--right .header__search .search--inline) {
    .header__search .details__list {
      right: 0;
    }

    .header__search .search-modal__form:has(.search__input.field__input:focus) .details__list,
    .header__search .search-modal__form[open] .details__list {
      transform: translate3d(0, 1rem, 0);
    }
  }

  &:has(.header__search .search--inline) {
    .search__input.field__input {
      padding: 1.5rem 0 1.5rem 2rem;
    }

    .header__search--underline .search__input.field__input {
      padding-left: 0;
    }

    .header__search .details__list {
      opacity: 0;
      transition: opacity var(--animation-speed) var(--animation-easing),
        transform var(--animation-speed) var(--animation-easing);
      pointer-events: none;
    }

    .header__search .search-modal__form:has(.search__input.field__input:focus) .details__list,
    .header__search .search-modal__form[open] .details__list {
      opacity: 1;
      pointer-events: auto;
    }

    .predictive-search {
      padding-inline: var(--padding-2xl);
      max-height: 70dvh;
    }
  }

  /* If menu and search in center column */
  &:has(.header__column--center .header-menu):has(.header__column--center .header__search) {
    --header-center: minmax(max-content, 2fr);
    --header-left: minmax(max-content, 1fr);
    --header-right: minmax(max-content, 1fr);

    .header__search {
      width: 30rem;
    }

    .header__column--center {
      justify-content: space-between;
    }

    .predictive-search-results__list-inline {
      --card-grid-per-row: 2;
    }
  }

  /* If there is no center column, make the column the menu is in grow eagerly */
  &:where(:not(:has(.header__column--center))) {
    @media screen and (min-width: 750px) {
      --header-template-columns: var(--header-left) var(--header-right);

      grid-template-areas: 'left right';
    }

    /* If the header-menu is in the right column */
    &:has(.header__column--right header-menu) {
      --header-right: auto;
      --header-left: minmax(max-content, 1fr);
    }

    /* If the header-menu is in the left column */
    &:has(.header__column--left header-menu) {
      --header-left: auto;
      --header-right: minmax(max-content, 1fr);
    }
  }

  @media screen and (max-width: 1024px) {
    --header-template-columns: var(--header-mobile-bookend) var(--header-mobile-bookend) 1fr
      var(--header-mobile-bookend) var(--header-mobile-bookend);

    grid-template-areas: 'leftA leftB center rightA rightB';
    grid-column: span 3;
    grid-gap: var(--gap-2xs);
    align-items: center;
    padding-block: 0;
    padding-inline: 0 var(--padding-3xs);

    .header-logo {
      grid-area: center;
      text-align: center;
    }

    &:not(:has(.header-actions)) .search-action {
      grid-area: leftB;
    }

    .account-actions,
    &:not(:has(.account-actions)) .search-action {
      grid-area: rightA;
    }

    &:not(:has(.header-actions)) .account-actions {
      grid-area: rightB;
    }

    .search-action {
      grid-area: leftB;
    }

    .header-actions {
      grid-area: rightB;
    }

    &:has(.header-multi-site) {
      .header-multi-site {
        grid-column: 1 / 6;
        grid-row: 1;
      }

      .header-logo,
      &:not(:has(.header-actions)) .search-action,
      .account-actions,
      &:not(:has(.account-actions)) .search-action,
      .search-action,
      .header-actions {
        grid-row: 2;
      }
    }
  }
}

/* Single column layout if there are no columns within */
.header__columns:not(:has(.header__column)) {
  grid-template-columns: 1fr;
}

/* If header column has header vertical menu */
.header__columns:has(.header__column--left .header__vertical-menu)  {
  @media screen and (min-width: 750px) {
    --header-left: 1fr;
    --header-right: max-content;
  }
}
.header__columns:has(.header__column--right .header__vertical-menu) {
  @media screen and (min-width: 750px) {
    --header-left: max-content;
    --header-right: 1fr;
  }
}

/* If header column has only header menu and localization */
.header__columns:has(.header__column--left):has(.header__column--right):has(.header-menu):has(.header-localization):not(:has(.header__column--center)) {
  @media screen and (min-width: 750px) {
    --header-left: 1fr;
    --header-right: max-content;
  }
}

/* If header column has only header menu and header logo left and right has only header block */
.header__columns:has(.header__column--left .header-menu):has(.header__column--right .header-block:only-child):not(:has(.header__column--center)) {
  @media screen and (min-width: 750px) {
    --header-left: 1fr;
    --header-right: max-content;
  }
}

@media screen and (min-width: 1025px) {
  .header__columns:has(.search--inline) .header__search .details__list {
    min-width: 62.5rem;
  }
}

/* Mega menu */
.mega-menu {
  position: static;
}
.mega-menu__content:not(:has(>.header__submenu-wrapper)) {
  background: var(--color-background);
  border-left: 0;
  border-radius: 0;
  border-right: 0;
  left: 0;
  overflow-y: auto;
  padding-bottom: 0;
  padding-top: 3rem;
  position: absolute;
  right: 0;
  top: var(--top-position, 100%);
  margin-top: var(--margin-top);
  opacity: var(--opacity-0);
  visibility: hidden;
  overflow: hidden;

  .page-width--full {
    padding-inline: var(--padding-4xl);
  }

  > .list-menu--wrapper {
    overflow-y: auto;
    padding-bottom: 3rem;
    max-height: calc(100vh - var(--header-bottom-position-desktop, 20rem) - 4rem);

    &:has(.mega-menu__collage-wrapper) {
      padding-bottom: 0;
    }
  }

  &:has(.mega-menu--3) {
    padding-bottom: 0;
  }
}

.mega-menu__content:has(>.header__submenu-wrapper) {
  position: absolute;
  width: 20rem;
  border: 1px solid rgb(var(--color-foreground-rgb) / var(--opacity-20));
}

.shopify-section-header-sticky .mega-menu__content {
  max-height: calc(100vh - var(--header-bottom-position-desktop, 20rem) - 4rem);
}
.header-wrapper--border-bottom .mega-menu__content {
  border-top: 0;
}
.mega-menu__list {
  display: grid;
  gap: 1.8rem 4rem;
  grid-template-columns: repeat(var(--columns-count), minmax(0, 1fr));
  list-style: none;
  flex: 1 1 100%;
  padding: 0;


}
.header__mega-submenu ul li {
  margin-bottom: .5rem;
}
.mega-menu__collage {
  flex: 0 0 50rem;

  .collage__item--image + .menu-dropdown__brand {
    padding-left: 2rem;
  }
}

.collage__item--image {
  border: var(--border-width) solid var(--color-border);
  border-radius: var(--border-radius);
  overflow: hidden;
}

.mega-menu--2 .mega-menu__collage {
  align-items: center;
  margin-top: 1rem;

  @media screen and (min-width: 750px) {
    .collage__item--1, .collage__item--4 {
        grid-row: span 1;
    }
    .collage--2-items .collage__item--2 {
      grid-row: 1 / span 2;
    }

    .collage__item--3 {
      grid-row: 1 / span 1;
    }
  }
}
.mega-menu__collage-wrapper.mega-menu__collage-wrapper--divider {
  padding-top: 0;
  margin-top: var(--margin-4xl);
  border-top: var(--border-width, .1rem) solid rgba(var(--color-border-rgb) / var(--opacity-20));

  .mega-menu__collection {
    padding-top: var(--margin-xl);
  }
}
.mega-menu__link {
  display: inline-block;
  padding: 0;
  word-wrap: break-word;
}
.mega-menu__link--level-2 {
  font-weight: bold;
  margin-bottom: 1rem;

  &.link--hover-underline:not(:has(.text)) ~ ul {
    margin-top: 1rem;
  }
}
.header__menu-item.mega-menu__link--level-3,
.header__menu-item.mega-menu__link--level-2 {
  padding: .5rem 0;
}
.header--top-center .mega-menu__list {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  column-gap: 0;
}
.header--top-center .mega-menu__list > li {
  width: 16%;
  padding-right: 2.4rem;
}
.mega-menu__list--condensed .mega-menu__link {
  font-weight: normal;
}
@media screen and (min-width: 750px) {
  .azbrandsTable {
    max-width: 34rem;
  }
}

.azbrandsTable li {
  display: inline-block;
  vertical-align: top;
  width: 32px;
  text-align: left;
  margin-bottom: 2px;
}
.azbrandsTable .link {
  padding: 1px 0;
  text-transform: capitalize;
  opacity: var(--opacity-50);
  pointer-events: none;
}
.azbrandsTable .link.is-active {
  opacity: var(--opacity-100);
  pointer-events: auto;
}
.azbrandsTable li:first-child {
  margin-left: 0;
}


.main-collection-grid {
  grid-column:1/14;

  @media screen and (min-width: 750px) {
    grid-column: var(--grid-column--desktop);
  }
}

.collection-wrapper {
  @media screen and (min-width: 750px) {
    grid-template-columns:
      1fr repeat(
        var(--centered-column-number),
        minmax(0, calc((var(--page-width) - var(--page-margin) * 2) / var(--centered-column-number)))
      )
      1fr;
  }
}

/* .collection-wrapper:has(.facets-block-wrapper--full-width), */
.collection-wrapper:has(.collection-wrapper--full-width),
.collection-wrapper:has(.facets-block-wrapper--vertical) {
  @media screen and (min-width: 750px) {
    grid-column: 1 / -1;
    grid-template-columns:
      minmax(var(--page-margin), 1fr)
      24rem
      repeat(
        calc(var(--centered-column-number) - 1),
        minmax(0, calc((var(--page-width) - var(--page-margin) * 2 - 24rem) / (var(--centered-column-number) - 1)))
      )
      minmax(var(--page-margin), 1fr);
  }
}

.collection-wrapper:has(.facets-block-wrapper--vertical.facets-block-wrapper--right) {
  @media screen and (min-width: 750px) {
    grid-template-columns:
      minmax(var(--page-margin), 1fr)
      repeat(
        calc(var(--centered-column-number) - 1),
        minmax(0, calc((var(--page-width) - var(--page-margin) * 2 - 24rem) / (var(--centered-column-number) - 1)))
      )
      24rem
      minmax(var(--page-margin), 1fr);
  }
}

.collection-wrapper:has(.facets--horizontal) {
  .collection-header {
    grid-column: 1 / -1;
  }
}

.collection-wrapper:has(.facets-block-wrapper--full-width.facets-block-wrapper--vertical) {
  @media screen and (max-width: 749px) {
    display: grid;
    grid-template-columns: repeat(var(--centered-column-number), 1fr);

    .main-collection-grid {
      grid-column: 1 / 13;
    }
  }
}

.collection-wrapper:has(.facets--vertical) .facets-block-wrapper--vertical:not(.hidden) ~ .facets-vertical-sort ,
.collection-wrapper:has(.facets--vertical) .facets-block-wrapper--vertical:not(.hidden) ~ .collection-header ,
.collection-wrapper:has(.facets--vertical) .facets-block-wrapper--vertical:not(.hidden) ~ .main-collection-grid {
  @media screen and (min-width: 1025px) {
    grid-column: var(--facets-vertical-col-width) / var(--full-width-column-number);
  }
}

.collection-wrapper:has(.facets-block-wrapper--right .facets--vertical) .facets-block-wrapper--vertical:not(.hidden) ~ .facets-vertical-sort ,
.collection-wrapper:has(.facets-block-wrapper--right .facets--vertical) .facets-block-wrapper--vertical:not(.hidden) ~ .collection-header ,
.collection-wrapper:has(.facets-block-wrapper--right .facets--vertical) .facets-block-wrapper--vertical:not(.hidden) ~ .main-collection-grid {
  @media screen and (min-width: 1025px) {
    grid-column: 2 / var(--facets-vertical-col-start);
  }
}

.collection-wrapper:has(.facets--vertical, .facets--vertical .collection-header) {
  display: grid;
  grid-template-rows: max-content max-content 1fr;
  .collection-header {
    grid-column: 1 / -1;

    @media screen and (min-width: 750px) {
      grid-column: 2/14;
    }

    @media screen and (min-width: 1025px) {
      grid-row: 1 / 2;
    }
  }

  @media screen and (max-width: 1024px) {
    .facets-block-wrapper--vertical {
      grid-row: 2 / 3;
    }

    &:has(.facets-vertical-sort--vertical-divider) .collection-header {
      border-bottom: var(--style-border-width) solid var(--color-border);
    }
  }


  .facets-block-wrapper--vertical:not(.hidden) ~ .facets-vertical-sort {
    grid-row: 2 / 3;
  }

  .facets-block-wrapper--vertical:not(.hidden) ~ .main-collection-grid {
    grid-row: 3 / 4;
  }
}

.collection-wrapper:has(.facets-block-wrapper--vertical:not(#filters-drawer)):has(.collection-wrapper--full-width) {
  @media screen and (min-width: 750px) {
    grid-column: 1 / -1;
    grid-template-columns: 0fr repeat(var(--centered-column-number), minmax(0, 1fr)) 0fr;
  }
}

:is(.collection-wrapper--full-width, .collection-wrapper--full-width-on-mobile)
  [product-grid-view='default']
  .product-grid__card {
  @media screen and (max-width: 749px) {
    padding-inline-start: max(var(--padding-xs), var(--padding-inline-start));
    padding-inline-end: max(var(--padding-xs), var(--padding-inline-end));
  }
}

:is(.collection-wrapper--full-width, .collection-wrapper--full-width-on-mobile)
  [product-grid-view='mobile-single']
  .product-grid__card {
  @media screen and (max-width: 749px) {
    padding-inline-start: max(var(--padding-xs), var(--padding-inline-start));
    padding-inline-end: max(var(--padding-xs), var(--padding-inline-end));
  }
}

/* Make product media go edge-to-edge by using negative margins */
:is(.collection-wrapper--full-width) .card-gallery,
:is(.collection-wrapper--full-width-on-mobile) .card-gallery {
  @media screen and (max-width: 749px) {
    margin-inline-start: calc(-1 * max(var(--padding-xs), var(--padding-inline-start)));
    margin-inline-end: calc(-1 * max(var(--padding-xs), var(--padding-inline-end)));
  }
}

.predictive-search-results__no-results,
.predictive-search-results__wrapper-products .predictive-search-results__card {
  animation: search-element-slide-up var(--animation-speed-medium) var(--ease-out-smooth) backwards;
}

predictive-search-results__card--query,
.predictive-search__item-content {
  overflow: hidden;
}

.predictive-search-results__pill,
.predictive-search__item-heading {
  animation: search-element-slide-up-heading var(--animation-speed-slow) var(--ease-out-smooth) backwards;
}

.predictive-search__results-list {
  column-count: 2;
  column-gap: var(--gap-2xl);
  margin-top: var(--margin-lg);
}

@media (min-width: 1025px) {
  .predictive-search__results-list {
    column-count: 4;
  }

  .search-drawer .predictive-search__results-list {
    column-count: 2;
  }
}

.recently-viewed-products__skeleton-item {
  aspect-ratio: 3 / 4;
  background-color: transparent;
}

@media screen and (max-width: 749px) {
  .recently-viewed-products__skeleton-item:nth-child(2n + 1) {
    display: none;
  }
}

.recently-viewed__wrapper.full-width .swiper {
  overflow: visible;
}

.related-products {
  display: block;
}

.related-products__heading {
  margin: 0 0 3rem;
}

.slideshow .swiper:has(.swiper-pagination) {
  padding-bottom: 0;
}

.slideshow .swiper-pagination {
  --swiper-pagination-bottom: 4rem;
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  width: auto;

  &.swiper-pagination-pos--outside {
    position: static;
    transform: none;
    margin-top: var(--margin-3xl);
  }
}

.slideshow .swiper-slide {
  height: auto;
}

.slideshow .slideshow__slides {
  height: var(--hero-min-height, auto);
}

.slideshow :is(.swiper-actions--bottom_center, .swiper-actions--bottom_right) {
  position: absolute;
  left: 50%;
  bottom: 1rem;
  transform: translateX(-50%);
  z-index: 1;

  .swiper-btns-wrap {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: var(--button-gap);
  }

  .swiper-pagination,
  .swiper-button {
    position: relative;
    transform: none;
    margin: 0;
    inset: unset;
  }

  .swiper-button-prev {
    order: -1;
    flex-shrink: 0;
  }

  .swiper-pagination {
    order: 0;
  }

  .swiper-button-next {
    order: 1;
    flex-shrink: 0;
  }

  @media screen and (min-width: 750px) {
    bottom: 2rem;
  }

  @media screen and (min-width: 1280px) {
    bottom: 4rem;
  }
}

.slideshow :is(.swiper-actions--bottom_right) + .video-dialog {
  right: auto;
  left: var(--right);
}

.slideshow .swiper-actions--bottom_right .swiper-btns-wrap {
  justify-content: flex-end;
}

.slideshow .swiper-pagination-fraction {
  font-weight: var(--font-heading--family);
  letter-spacing: 0.02em;
  padding: 0 0 .6rem;

  &:before {
    content: '';
    display: block;
    width: 100%;
    height: 2px;
    background-color: var(--pagination-color);
    position: absolute;
    bottom: 0;
    left: 0;
    z-index: 1;
  }
}

.slideshow .swiper-actions--bottom_right .swiper-pagination-fraction {
  width: min(32rem, 100%);
  text-align: left;
}

.slideshow:has(.swiper-pagination-fraction) .slide__content {
  padding-bottom: calc(var(--arrow-height) + 1.2rem);
}

.slideshow:is(.slideshow--has-categories, .slideshow--has-right-banner) {
  --slideshow-categories-and-banner-gap: 1rem;
  margin-inline: calc(var(--slideshow-categories-and-banner-gap) * -0.5);
  row-gap: var(--slideshow-categories-and-banner-gap);
  > * {
    padding-inline: calc(var(--slideshow-categories-and-banner-gap) * 0.5);
  }
}

.slideshow.slideshow--has-right-banner .right-banner {
  flex: 0 0 var(--w-right-banner, 0rem);
  max-width: var(--w-right-banner, 0rem);
}

:is(.slideshow.slideshow--has-right-banner, .slideshow.slideshow--has-categories) .slideshow__container {
  flex: 1 1 var(--w-container, calc(100% - var(--w-left-categories, 0rem) - var(--w-right-banner, 0rem)));
  max-width: var(--w-container, calc(100% - var(--w-left-categories, 0rem) - var(--w-right-banner, 0rem)));
}

.slideshow.slideshow--has-categories.slideshow--has-right-banner {
  --w-right-banner: 100%;
}

@media (max-width: 1024px) {
  .slideshow.slideshow--has-categories .slideshow__container {
    order: -1;
  }

  .slideshow .block-categories-slider {
    order: 0;
  }
}

@media (max-width: 1439px) {
  .slideshow.slideshow--has-categories.slideshow--has-right-banner .slideshow__container {
    order: -1;
  }

  .slideshow.slideshow--has-categories.slideshow--has-right-banner .right-banner {
    order: 0;
  }

  .slideshow.slideshow--has-categories.slideshow--has-right-banner .block-categories-slider {
    order: 1;
  }

  .slideshow.slideshow--has-categories.slideshow--has-right-banner {
    --w-container: calc(100% - var(--w-right-banner));
  }
}

@media (max-width: 549px) {
  .slideshow.slideshow--has-categories.slideshow--has-right-banner {
    --w-container: 100%;
  }
}

@media (min-width: 550px) {
  .slideshow.slideshow--has-categories.slideshow--has-right-banner {
    --w-left-categories: 100%;
    --w-right-banner: 40%;
  }
}

@media (min-width: 1025px) {
  .slideshow.slideshow--has-categories {
    --w-left-categories: 30.5rem;
  }

  .slideshow.slideshow--has-categories .block-categories-slider {
    flex: 0 0 var(--w-left-categories, 0rem);
    max-width: var(--w-left-categories, 0rem);
  }

  .slideshow.slideshow--has-right-banner {
    --w-right-banner: 52rem;
  }

  .slideshow.slideshow--has-right-banner .right-banner__grid {
    --card-grid-gap: var(--slideshow-categories-and-banner-gap);
  }
}

@media (min-width: 1440px) {
  .slideshow.slideshow--has-categories.slideshow--has-right-banner {
    --w-left-categories: 20%;
    --w-right-banner: 32%;
  }
}

@media (min-width: 1600px) {
  .slideshow.slideshow--has-categories.slideshow--has-right-banner {
    --w-left-categories: 30.5rem;
    --w-right-banner: 52rem;
  }
}

.block-categories-slider .wrapper-category {
  padding: 2rem 2rem 1.7rem;
  background-color: #fff;
  box-shadow: 0 2px 1.1rem #0000001a;
  border-radius: 1rem;

  @media screen and (max-width: 749px) {
    padding-bottom: 0.5rem;
  }
}

.block-categories-slider .categories-slider--title {
  text-transform: unset;
  margin-bottom: 0.5rem;
  border-bottom: 0.1rem solid var(--background-color);

  span {
    padding: 0.6rem 2rem;
    border-radius: 0.6rem 0.6rem 0 0;
    letter-spacing: 0.02em;
    background-color: var(--background-color);
  }
}

.block-categories-slider .categories-slider--list {
  li {
    min-height: 7.2rem;

    a {
      display: flex;
      align-content: space-around;
      line-height: 2.4rem;
      color: #202020;

      img {
        max-width: 2.4rem;
        margin-bottom: 0.5rem;
        padding-top: 0.5rem;
        margin-inline: auto;
      }
    }

    .text-menu {
      overflow: hidden;
      white-space: normal;
      display: -webkit-box;
      -webkit-line-clamp: 2;
      text-overflow: ellipsis;
      -webkit-box-orient: vertical;
    }
  }

  @media screen and (min-width: 1025px) {
    li {
      border-top: 0.1rem solid #f5f5f5;
      border-right: 0.1rem solid #f5f5f5;
    }

    li:nth-child(1),
    li:nth-child(2) {
      border-top: 0;
    }

    li:nth-child(2n) {
      border-right: 0;
    }
  }

  @media (max-width: 1024px) {
    gap: 0.5rem;
    scroll-snap-type: x mandatory;
    padding-bottom: 10px;
    z-index: 1;

    li {
      scroll-snap-align: start;
      scroll-snap-stop: always;
      flex: 0 0 18%;
      max-width: 18%;
    }
  }

  @media (max-width: 549px) {
    li {
      flex: 0 0 29%;
      max-width: 29%;
    }
  }
}

/* Stack in mobile */
@media screen and (max-width: 749px) {
  .slideshow.slideshow--stack-mobile .slideshow__slides {
    min-height: auto;
  }

  .slideshow.slideshow--stack-mobile .slide__image-container {
    min-height: var(--hero-min-height, auto);
    position: relative;
  }

  .slideshow--stack-mobile .slideshow__slide {
    flex-direction: column;
  }

  .slideshow .slideshow__slides {
    height: var(--hero-min-height-mb, auto);
  }
}

.card-title-change .text:after {
  content: attr(data-change-title);
}

.header-localization .disclosure__list-wrapper {
  bottom: initial;
  top: 100%;
}

.header__icon--localization .desktop-localization-wrapper {
  flex-wrap: nowrap;
  padding-inline: var(--padding-sm);
}

.localization-form {
  display: flex;
  flex-direction: column;
  flex: auto 1 0;
  padding: 1rem;
  margin: 0 auto;

  &.localization-form--language {
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    padding: 0;
    margin: 0;
  }
}

.localization-form:only-child {
  display: inline-flex;
}

.localization-form:only-child .button,
.localization-form:only-child
  .localization-form__select:not(.localization-form__select--icon) {
  margin: 1rem 1rem 0.5rem;
  flex-grow: 1;
}

@media screen and (min-width: 750px) {
  .localization-form:only-child .button,
  .localization-form:only-child
    .localization-form__select:not(.localization-form__select--icon) {
    margin: 0;
  }
}

@media screen and (min-width: 1025px) {
  .localization-form:only-child {
    margin: 0 1rem 0 0;
  }
}

.localization-form .button:not(.menu-drawer__back-button) {
  padding: 1rem;
}

@media screen and (max-width: 749px) {
  .localization-form .button:not(.menu-drawer__back-button) {
    word-break: break-all;
  }
}

.localization-form__select:not(.localization-form__select--icon) {
  border-radius: var(--inputs-radius-outset);
  position: relative;
  margin-bottom: 1.5rem;
  padding-left: 1rem;
  text-align: left;
  min-height: calc(4rem + var(--localization-border-width) * 2);
  min-width: calc(7rem + var(--localization-border-width) * 2);
}

.disclosure__button.localization-form__select:not(
    .localization-form__select--icon
  ) {
  padding: calc(2rem + var(--localization-border-width));
  background: var(--color-background);
}

.localization-form__select:not(.localization-form__select--icon) .icon-caret {
  position: absolute;
  content: "";
  height: 0.6rem;
  right: calc(var(--localization-border-width) + 1.5rem);
  top: calc(50% - 0.2rem);
  transition: transform var(--duration-medium) ease-out;
}

.localization-selector.link:not(.disclosure__button) {
  text-decoration: none;
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  color: var(--color-foreground);
  width: 100%;
  padding-right: 4rem;
  padding-bottom: 1.5rem;
}

.disclosure .localization-form__select:not(.localization-form__select--icon) {
  padding-top: 1.5rem;
}

.localization-selector option {
  color: #000000;
}

.localization-selector + .disclosure__list-wrapper {
  opacity: var(--opacity-100);
}

.disclosure {
  position: relative;
}

.disclosure__button:not(.localization-form__select--icon) {
  align-items: center;
  cursor: pointer;
  display: flex;
  gap: 0.5rem;
  height: 4rem;
  padding: 0 1.5rem 0 1.5rem;
  font-size: var(--font-size--xs);
  background-color: transparent;
}

.disclosure__list-wrapper {
  border-width: var(--style-border-width-popover);
  border-style: solid;
  border-color: var(--color-foreground);
  overflow: hidden;
  position: absolute;
  bottom: 100%;
  z-index: 2;
  background: var(--color-background);
  border-radius: var(--style-border-radius-popover);
  box-shadow: var(--style-shadow-popover);
  max-height: 27.5rem;
  transform: translate3d(0, 100%, 0);
}

@media screen and (min-width: 750px) {
  .disclosure__list-wrapper {
    opacity: var(--opacity-0);
    visibility: hidden;
    transform: translateY(0);
    transition-property: opacity, transform;
    transition-duration: var(--duration-medium);
    transition-timing-function: var(--cubic-smooth);
  }

  .selector__dropdown.active .disclosure__list-wrapper {
    opacity: var(--opacity-100);
    visibility: visible;
    transform: translateY(-0.4rem);
  }
}

.disclosure__list {
  position: relative;
  overflow-y: auto;
  font-size: var(--font-size--sm);
  padding-bottom: 0.5rem;
  padding-top: 0.5rem;
  scroll-padding: 0.5rem 0;
  max-height: 20.5rem;
  min-width: 12rem;
  width: max-content;
}

.country-selector__list {
  padding-bottom: 0.95rem;
  padding-top: 0;
}

.country-selector__list--with-multiple-currencies {
  width: 24rem;
}

.selector__close-button {
  display: none;
}

.country-filter,
.language-filler {
  gap: 0.5rem;
  padding: var(--padding-sm);
}

.country-filter__reset-button,
.country-filter__search-icon {
  right: calc(var(--localization-border-width));
  top: var(--localization-border-width);
}

.country-filter__reset-button:not(:focus-visible)::after,
.country-filter__reset-button:not(:focus)::after {
  display: block;
  height: calc(100% - 1.8rem);
  content: "";
  position: absolute;
  right: 0;
}

.country-filter__reset-button:focus,
.country-filter__reset-button:focus-visible {
  background: var(--color-background);
  z-index: 4;
}

.country-filter__reset-button:not(:focus-visible):not(.focused) {
  box-shadow: inherit;
  background-color: inherit;
}

.country-filter__reset-button:hover .icon {
  transform: scale(1.07);
}

.country-filter__reset-button .icon.icon-close,
.country-filter__search-icon .icon {
  height: 1.8rem;
  width: 1.8rem;
  stroke-width: 0.1rem;
}

.country-filter__search-icon {
  transition: opacity var(--duration-short) ease,
    visibility var(--duration-short) ease;
  opacity: var(--opacity-100);
  visibility: visible;
  pointer-events: none;
  cursor: text;
}

.country-filter__search-icon--hidden {
  opacity: var(--opacity-0);
  visibility: hidden;
}

@media screen and (max-width: 749px) {
  .disclosure__list-wrapper.disclosure-selector {
    position: fixed;
    bottom: -1rem;
    left: 0;
    width: 100%;
    max-height: calc(100% - 20vh);
    border-radius: 0;
    border: none;
    box-shadow: none;
    z-index: 4;
  }

  .disclosure__list.country-selector__list,
  .disclosure__list.language-selector__list {
    max-height: 85%;
    min-width: 100%;
    margin-bottom: 0;
    padding-bottom: 4rem;
    z-index: 5;
  }

  .selector__close-button.link,
  .selector__close-button {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 0rem;
    background-color: transparent;
    height: 4.4rem;
    width: 4.4rem;
  }

  .selector__close-button .icon {
    width: 2rem;
    height: 2rem;
  }
}

@media screen and (min-width: 750px) {
  .country-filter--no-padding,
  .language-filler.p-0 {
    padding: 0;
  }
}

.countries {
  padding-top: 0.6rem;
}

.popular-countries {
  border-bottom: 1px solid rgb(var(--color-foreground-rgb) / var(--opacity-20));
  padding-bottom: 0.6rem;
  padding-top: 0.6rem;
}

.disclosure__item {
  position: relative;
}

.disclosure__link {
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 0.5rem;
  padding: var(--padding-xs) var(--padding-sm);
  text-decoration: none;
  color: rgb(var(--color-foreground-rgb) / var(--opacity-75));
  word-break: break-word;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
  font-size: var(--menu-localization-font-size);
  font-family: var(--menu-localization-font);
  transition: text-decoration-color var(--animation-speed) var(--animation-easing),
  color var(--animation-speed) var(--animation-easing), background var(--animation-speed) var(--animation-easing);
}

.disclosure__link:hover {
  color: var(--color-foreground);
  background: rgb(var(--color-foreground-rgb) / var(--opacity-8));
}

.disclosure__link .icon-checkmark {
  width: 1rem;
  margin-right: 0.2rem;
}

.disclosure__link .country {
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}

.disclosure__button[aria-expanded="true"] .icon-caret {
  transform: rotatex(180deg);
}

/* Header localization */
.header-localization .localization-form:only-child {
  margin: 0;
}

.header-localization
  .disclosure
  .localization-form__select:not(.localization-form__select--icon) {
  font-size: var(--menu-localization-font-size);
  letter-spacing: var(--letter-spacing--body-loose);
  font-family: var(--menu-localization-font);
  height: auto;
  min-height: initial;
  background: transparent;
}

.header-localization
  .disclosure
  .localization-form__select:not(.localization-form__select--icon):hover {
  text-decoration: underline;
}

.header-localization
  .localization-form__select:not(.localization-form__select--icon).link:after,
.header-localization
  .localization-form__select:not(.localization-form__select--icon).link:before {
  box-shadow: none;
}

.header-localization
  .localization-form__select:not(
    .localization-form__select--icon
  ).link:focus-visible {
  outline: 0.2rem solid rgb(var(--color-foreground-rgb) / var(--opacity-50));
  outline-offset: -0.2rem;
  box-shadow: 0 0 0.2rem 0 rgb(var(--color-foreground-rgb) / var(--opacity-30));
}

/* Header icons */
.desktop-localization-wrapper {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
}

.desktop-localization-wrapper .localization-form:only-child {
  padding: 0;
}

.header-localization:not(.menu-drawer__localization) {
  align-items: center;
}

.header-localization:not(.menu-drawer__localization)
  .localization-form__select:not(.localization-form__select--icon) {
  width: max-content;
  height: var(--size-38);
}

.header-localization:not(.menu-drawer__localization)
  .localization-form__select:not(.localization-form__select--icon):not(
    :has(.icon-caret)
  ) {
  padding: 0 var(--padding-xs) 0 0;
  min-width: initial;
}

.header-localization:not(.menu-drawer__localization)
  .localization-form__select:not(.localization-form__select--icon):has(
    .icon-caret
  ) {
  padding: 0 var(--padding-3xl) 0 var(--padding-md);
}

.header-localization:not(.menu-drawer__localization)
  .localization-form:only-child
  .localization-form__select:not(.localization-form__select--icon) {
  margin: 0;
}

.header-localization:not(
    .menu-drawer__localization
  ).localization-form__select:not(.localization-form__select--icon)
  > span {
  max-width: 20ch;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}

.header-localization:not(.menu-drawer__localization)
  localization-form:only-child
  .localization-form__select:not(.localization-form__select--icon)
  > span {
  max-width: 26ch;
}

.header-localization:not(.menu-drawer__localization)
  .localization-form__select:not(.localization-form__select--icon)
  .icon-caret {
  right: 0.8rem;
  min-width: initial;
  min-height: initial;
}

.header-localization .country-filter__input:focus{
  padding: 0 1.5rem;
  margin: 0;
}

@media screen and (min-width: 750px) {
  .header-localization:not(.menu-drawer__localization)
    .disclosure__list-wrapper {
    bottom: initial;
    top: 100%;
    right: 0;
    opacity: var(--opacity-0);
    visibility: hidden;
    transform: translateY(0.4rem);
    box-shadow: 0 0.4rem 2rem rgb(var(--color-shadow-rgb) / var(--opacity-15));
  }

  .header-localization:not(.menu-drawer__localization)
    .selector__dropdown.active
    .disclosure__list-wrapper {
    opacity: var(--opacity-100);
    visibility: visible;
    transform: translateY(0);
  }
}

/* Menu drawer */
.menu-drawer__localization localization-form {
  display: block;
}

.menu-drawer__localization
  .localization-form__select:not(.localization-form__select--icon) {
  background-color: initial;
  margin-top: 0;
  padding: 1rem 3.6rem 1rem 0rem;
}

.menu-drawer__localization .localization-form {
  padding: 0;
}

.menu-drawer__localization
  .localization-form:only-child
  .localization-form__select:not(.localization-form__select--icon) {
  margin: 0;
}

.menu-drawer__localization + .list-social {
  margin-top: 1rem;
}


.popup-edit-header {
  padding: var(--padding-3xl) var(--padding-4xl) var(--padding-2xl);
}

.popup-edit-header h5 {
  text-transform: capitalize;
}

.cart-edit {
  padding: 0 var(--padding-5xl);
}

.edit-cart-popup .popup-wrapper {
  padding: 0;
}

.edit-cart-popup .notifyMe .button {
  width: 100%;
  margin: var(--margin-sm) 0 0 0;
}

.edit-cart-popup .popup__inner {
  height: auto;
}

@media (max-width: 1024px) {
  .edit-cart-popup .popup__inner {
    width: 100%;
  }

  .cart-edit {
    padding: 0 var(--padding-4xl);
  }
}

@media (max-width: 749px) {
  .edit-cart-popup[open] .popup__inner {
    transform: translate(-50%, 0%);
    max-width: 100%;
    bottom: 0;
    top: unset;
  }
}

@media (max-width: 551px) {
  .product-edit-item:nth-last-child(1) .add-more {
    margin-top: var(--margin-lg);
  }

  .cart-edit {
    padding: 0 var(--padding-sm);
  }

  .product-edit-remove {
    left: -8px;
  }

  .popup-edit-header {
    padding: var(--padding-lg) var(--padding-sm)
  }
  /* END: New Style Edit Card */
  .product-edit-title {
    -webkit-line-clamp: 1;
  }

  /* START: New Style Edit Card */
  .product-edit-itemFirst {
    padding-top: var(--padding-sm);
  }

  .halo-edit-cart-popup {
    top: unset;
    bottom: 0;
  }

  body.edit-cart-show .halo-edit-cart-popup {
    transform: translate3d(0%, 0%, 0);
  }

  .product-edit-action {
    padding: var(--padding-sm);
    display: block;
  }

  .product-edit-item:nth-last-child(1) .add-more {
    padding: var(--padding-lg) 0 var(--padding-4xl) var(--padding-lg);
  }

  .product-edit-quantity .form-label {
    display: none;
  }

  .product-edit-quantity {
    margin-top: auto;
  }

  .product-edit-quantity .update-quantity__group {
    max-width: 124px;
  }

  .halo-edit-cart-popup .halo-popup-close {
    right: 12px;
    top: 12px;
    background-color: transparent;
  }

  .halo-edit-cart-popup .halo-popup-close svg {
    fill: var(--bg-black);
  }
  /* END: New Style Edit Card */
}

.header__icon--account.header__icon--account--text {
  height: initial;
  width: initial;
}

.header-logo {
  padding-inline-start: var(--header-logo-spacing-left, 0px);
  padding-inline-end: var(--header-logo-spacing-right, 0px);

  @media screen and (max-width: 1024px) {
    padding-block-start: var(--padding-xs);
    padding-block-end: var(--padding-xs);
    padding-inline-start: 0;
    padding-inline-end: 0;
  }
}

.header-logo__image-container {
  min-width: 5rem;
  width: var(--header-logo-image-width);
  height: var(--header-logo-image-height);
  display: block;
  transform-origin: left top;
  transition: transform var(--animation-speed-slowest) var(--ease-out-cubic);
  will-change: transform;

  @media (min-width: 750px) and (max-width: 1024px) {
    width: calc(var(--header-logo-image-width) * 0.6);
    height: calc(var(--header-logo-image-height) * 0.6);
  }

  img,
  svg {
    width: 100%;
    height: auto;
    aspect-ratio: var(--aspect-ratio);
    object-fit: contain;
    display: block;
  }

  @media screen and (max-width: 1024px) {
    transform-origin: center top;

    &.is-empty {
      width: 100%;
    }
  }

  @media screen and (max-width: 749px) {
    transform-origin: center;

    &.is-empty {
      padding: var(--padding-xs);
      transform-origin: center top;
    }
  }

  @media screen and (max-width: 749px) {
    width: var(--header-logo-image-width-mobile);
    height: var(--header-logo-image-height-mobile);
  }

  @media screen and (max-width: 375px) {
    width: calc(var(--header-logo-image-width-mobile) * 0.5);
    height: calc(var(--header-logo-image-height-mobile) * 0.5);
  }
}
.header__column--center .header-logo__image-container {
  transform-origin: center top;
}
.header__column--right .header-logo__image-container {
  transform-origin: right top;
}
.header-logo__image-container--inverse {
  position: absolute;
  top: 0;
  left: 0;
}
.header-logo:has(.header-logo__image-container--inverse) .header-logo__image-container--original {
  opacity: var(--header-logo-opacity, 1);
}
.header-logo__image-container--inverse {
  opacity: var(--header-logo-inverse-opacity, 0);
}
.header[transparent]:has(.details--dropdown:is(:hover)) .header-logo:has(.header-logo__image-container--inverse),
.header[data-sticky-state="active"] .header-logo:has(.header-logo__image-container--inverse) {
  --header-logo-opacity: 1;
  --header-logo-inverse-opacity: 0;
}
.header.header--reveal-logo-on-sticky[data-scroll-direction='down'] .header-logo,
.header.header--reveal-logo-on-sticky[data-sticky-state='idle'] .header-logo,
.header.header--reveal-logo-on-sticky[data-sticky-state='active'] .header-logo {
  padding: 0;
  height: calc(10rem / var(--aspect-ratio, 1));
}
.header.header--reveal-logo-on-sticky[data-scroll-direction='down'] .header-logo__image-container,
.header.header--reveal-logo-on-sticky[data-sticky-state='idle'] .header-logo__image-container,
.header.header--reveal-logo-on-sticky[data-sticky-state='active'] .header-logo__image-container {
  transform: scale(calc(10rem / var(--header-logo-image-width)));

  @media screen and (max-width: 1024px) {
    transform: scale(calc(6rem / var(--header-logo-image-width-mobile)));
  }
}

.mega-menu--3 .resource-card {
  gap: var(--gap-2xl);
}

.vertical-menu__item {
  display: flex;
  align-items: center;
}

.header__vertical-menu {
  --width-vertical-menu: 26rem;

  &:has(.header__vertical-menu__summary--radius) {
    .vertical-menu {
      border-top-right-radius: 0;
      border-top-left-radius: 0;
    }
  }

  .header__vertical-menu__summary {
    padding-inline: var(--padding-xl);
  }

  .header__vertical-menu__summary--radius {
    border-top-right-radius: var(--border-radius);
    border-top-left-radius: var(--border-radius);
  }

  .header__vertical-menu__summary-custom {
    background: var(--color-background);
    color: var(--color-foreground);
  }

  .header__vertical-menu__summary--divider {
    border-right: 1px solid rgb(var(--color-border-rgb) / var(--opacity-20));
  }

  .header__vertical-menu__summary--large {
    min-width: var(--width-vertical-menu);
  }

  &[open] .header__vertical-menu__summary .svg-wrapper {
    transform: rotate(-180deg);
  }

  .vertical-menu {
    width: var(--width-vertical-menu);

    &:hover {
      overflow: visible;
    }
  }

  .list-menu--disclosure {
    left: 100%;
    top: 0;
    padding-inline: 10px;
  }
}

.header__vertical-menu .mega-menu__content {
  left: calc(100% + var(--style-border-width-popover));
  top: 0;
  overflow: visible;
  margin-top: 0;
  border: none;
  border-radius: var(--style-border-radius-popover);
}

.header__vertical-menu .mega-menu__content:not(:has(>.header__submenu-wrapper)) {
  width: min(
      calc(var(--page-content-width) - var(--width-vertical-menu) + var(--last-item-minus-margin)),
      calc(
        100vw - var(--width-vertical-menu) - (var(--page-margin) * 2) - (var(--style-border-width-popover) * 2) +
          var(--last-item-minus-margin)
      )
    );
}

.header__vertical-menu .mega-menu:has(.mega-menu__content >.header__submenu-wrapper) {
  position: relative;
}

/* Header */
.header__menu-item > .text {
  /* color: currentColor; */
  color: #3c3c3c;
  /* transition: color var(--animation-speed-slowest); */
}
.header-wrapper--border-bottom {
  border-bottom: 0.1rem solid rgb(var(--color-foreground-rgb) / var(--opacity-8));
}
.header *[tabindex='-1']:focus {
  outline: none;
}
.header__heading {
  margin: 0;
  line-height: 0;
}
.header__heading-link {
  display: inline-block;
  padding: var(--padding-xs);
  text-decoration: none;
  word-break: break-word;

  @media screen and (max-width: 1024px) {
    padding: 0 var(--padding-xs);
  }
}
.menu__tab-logo {
  height: 1.6rem;
  width: auto;
}
/* Header icons */
.header__icon {
  @media (hover: hover) {
    svg {
      transition: transform var(--animation-speed) var(--animation-easing);
    }
    &:hover {
      svg {
        transform: scale(1.15);
      }
    }
  }
}
.header__icon.button:not(.button-secondary,.button-unstyled),
.header__icon.button {
  border: none;
  outline: none;
  background-color: transparent;
}
.header__icon:not(.header__icon--summary),
.header__icon span {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0;
}
.header__icon span:not(.icon-flag) {
  height: 100%;
}
.header__icon .svg-wrapper {
  width: 44px;
  height: 44px;
}
summary.header__icon .svg-wrapper {
  margin-inline-start: 0;
}
.header__icon::after {
  content: none;
}
.modal__close-button:hover .icon {
  transform: scale(1.07);
}
.header__icon .icon {
  height: var(--size-24);
  width: var(--size-24);
  fill: none;
  vertical-align: middle;
}
.header__icon--both {
  display: flex;
  flex-direction: column;
  font-size: var(--body-s-font-size);
  gap: var(--gap-2xs);
  padding: 0;
}
.header__icon.header__icon--search,
.header__icon.header__icon--icon {
  min-height: var(--minimum-touch-target);
  min-width: var(--minimum-touch-target);
  padding: 0;
}

.header__icon.header__icon--both {
  @media (max-width: 1024px) {
    height: var(--minimum-touch-target);
    width: var(--minimum-touch-target);
  }
}
.header__icon--cart {
  margin-right: -1.2rem;
  overflow: visible;
  height: var(--minimum-touch-target);
  width: var(--minimum-touch-target);
}
.header__icon--menu[aria-expanded='true']::before {
  content: '';
  top: 100%;
  left: 0;
  height: calc(var(--viewport-height, 100vh) - (var(--header-bottom-position, 100%)));
  width: 100%;
  display: block;
  position: absolute;
  background: rgb(var(--color-foreground-rgb) / var(--opacity-50));
}
.header__icon--account shop-user-avatar {
  --shop-avatar-size: 2.8rem;
}
account-icon {
  display: flex;
}
/* Search */
menu-drawer + .header__search {
  display: none;
}
.header--top-center header-drawer {
  grid-area: left-icons;
}
.header__search {
  display: inline-flex;
}
.header--top-center > .header__search {
  display: none;
}
.header--top-center * > .header__search {
  display: inline-flex;
}
details[open] > .search-modal {
  opacity: var(--opacity-100);
  /* animation: animateMenuOpen var(--duration-default) ease; */
}
details[open] .modal-overlay {
  display: block;
  position: absolute;
  background-color: rgb(var(--color-foreground-rgb) / var(--opacity-50));
  top: 0;
  left: 0;
  right: 0;
  height: 100vh;
}
.search-modal {
  top: 100%;
  opacity: var(--opacity-0);
  border-bottom: 0.1rem solid rgb(var(--color-foreground-rgb) / var(--opacity-8));
  min-height: calc(100% + (2 * var(--inputs-border-width)));
  height: 100%;
}
.search-modal__content {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  padding: 0 5rem 0 1rem;
  position: relative;
}
.search-modal__content-bottom {
  bottom: 0;
}
.search-modal__content-top {
  top: 0;
}
.search-modal__form {
  width: 100%;
}
.search-modal__close-button {
  position: absolute;
  right: 0.3rem;
}
/* Header menu drawer */
details:not([open]) > .header__icon--menu .icon-close,
details[open] > .header__icon--menu .icon-hamburger {
  visibility: hidden;
  opacity: var(--opacity-0);
  transform: scale(0.8);
}
.js details[open]:not(.menu-opening) > .header__icon--menu .icon-close {
  visibility: hidden;
}
.js details[open]:not(.menu-opening) > .header__icon--menu .icon-hamburger {
  visibility: visible;
  opacity: var(--opacity-100);
  transform: scale(1.07);
}
/* Header menu */
.header__inline-menu {
  display: none;
}
.header--top-center .header__inline-menu,
.header--top-center .header__heading-link {
  margin-left: 0;
}
.header__menu-item {
  padding: 1.2rem;
  text-decoration: none;
  color: rgb(var(--color-primary-rgb) / var(--opacity-100));
}
.header__menu-item.menu__link--level-1 {
  padding: 1.2rem calc(var(--gap-x) / 2 + 1.2rem);
}
.header__menu-item span:not(.svg-wrapper) {
  &.svg-wrapper {
    margin-right: 0;
  }
}

details[open='true'] > .header__menu-item .icon-caret,
.header__submenu details[open='true'] > .header__menu-item .icon-caret {
  transform: rotate(-180deg);
}
.header__active-menu-item {
  color: var(--color-foreground);
}
.global-settings-popup {
  border-radius: var(--style-border-radius-popover);
  border-color: var(--color-foreground);
  border-style: solid;
  border-width: var(--style-border-width-popover);
  box-shadow: var(--style-shadow-popover);
}
.header__submenu.list-menu {
  padding: 1rem 0;
}
.header__submenu .header__submenu {
  padding: 1rem 0;
  margin-left: 0.3rem;
}
.header__submenu .header__menu-item:after {
  right: 2rem;
}
.header__submenu li {
  &:has(.details--dropdown) .details--dropdown,
  &:not(:has(.details--dropdown)) {
    padding: 0.8rem 2rem;
  }
}

.header__submenu .header__menu-item {
  justify-content: space-between;
  padding: 0rem;

  &.header__menu-item--last {
    display: inline;
  }
}
.header__submenu .icon-caret {
  flex-shrink: 0;
  margin-left: 1rem;
  position: static;
}
header-menu > details,
details-disclosure > details {
  position: relative;
}

.list-menu {
  list-style: none;
  padding: 0;
  margin: 0;
}
.list-menu--inline {
  display: inline-flex;
  flex-wrap: wrap;
  gap: 0;
  margin-inline: calc(var(--gap-x) / 2 * -1);
  > li > .header__menu-item {
    padding-inline: calc(var(--gap-x) / 2 + 1.2rem);
  }
}
.list-menu__item {
  display: flex;
  align-items: center;
}
.list-menu__item--link {
  text-decoration: none;
  padding-bottom: 1rem;
  padding-top: 1rem;
}
@keyframes animateMenuOpen {
  0% {
    opacity: var(--opacity-0);
    transform: translateY(-1.5rem);
  }
  100% {
    opacity: var(--opacity-100);
    transform: translateY(0);
  }
}
@media screen and (min-width: 750px) {
  .search-modal__close-button {
    right: 1rem;
  }
  .search-modal__content {
    padding: 0 6rem;
  }
  .list-menu__item--link {
    padding-bottom: 0.5rem;
    padding-top: 0.5rem;
  }
}
@media screen and (min-width: 1025px) {
  body:has(.section-header .header) .utility-bar .page-width {
    padding-inline: 5rem;
  }
  .header__inline-menu {
    display: block;
  }
  .header--top-center .header__inline-menu {
    justify-self: center;
  }
  .header--top-center .header__inline-menu > .list-menu--inline {
    justify-content: center;
  }
  .header--middle-left .header__inline-menu {
    margin-left: 0;
  }
  .header:not(.header--top-center) * > .header__search,
  .header--top-center > .header__search {
    display: inline-flex;
  }
  .header:not(.header--top-center) > .header__search,
  .header--top-center * > .header__search {
    display: none;
  }
  .search-modal__form {
    max-width: 74.2rem;
  }
  .search-modal__close-button {
    position: initial;
    margin-left: 0.5rem;
  }
  .header__menu-item > a:not(:hover) {
    display: contents;
  }
}
.countdown .countdown-item {
  gap: 1.8rem;
  margin-top: 0.7rem;
}
.countdown .countdown-item:not(:last-child) {
  margin-right: 2.4rem;
}
.countdown .countdown-digit {
  min-width: 5rem;
  min-height: 6rem;
  padding: 0.5rem 0.8rem;
  margin-bottom: 0.8rem;
  border-radius: 6px;
  background-color: var(--color-primary-button-background);
  color: var(--color-primary-button-text);
  font-style: var(--font-heading-style);
}
.countdown-border-gradient .countdown-digit:before {
  content: ':';
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  border-radius: 6px;
  border: 1px solid transparent;
  background: linear-gradient(
      90.26deg,
      var(--border-color-1, var(--color-first-icon)) 2.91%,
      var(--border-color-2, var(--color-second-icon)) 99.96%
    )
    border-box;
  -webkit-mask: linear-gradient(#fff 0 0) padding-box, linear-gradient(#fff 0 0);
  -webkit-mask-composite: xor;
  mask-composite: exclude;
}
.countdown .countdown-item:not(:last-child) .countdown-digit:after {
  content: ':';
  position: absolute;
  right: -1.4rem;
  top: 50%;
  transform: translateY(-50%);
  color: var(--color-foreground);
}

.header__inline-menu {
  --submenu-animation-speed: var(--animation-speed-slowest);
  --submenu-opacity: 0;
  --submenu-height-transition: 0px;
}

.mega-menu__content:has(.mega-menu__collage-wrapper) {
  padding-bottom: 0;

  .mega-menu__list {
    padding-bottom: 3rem;
  }
}
.mega-menu__collage-wrapper {
  padding-block: var(--padding-4xl);
}

.header__menu-item.highlighted-item,
.list-menu__item.highlighted-item {
  --color-foreground: var(--highlighted-color);
  --color-foreground-rgb: var(--highlighted-color-rgb);
  color: var(--color-foreground);
}

.list-menu__item .label-wrapper {
  position: absolute;
  left: 50%;
  top: -9px;
  transform: translateX(-50%);
}

.header__menu-item {
  position: relative;
}

.header__inline-menu .label-wrapper {
  display: inline-flex;
  align-items: center;
  gap: var(--gap-xs);
  font-size: 1.2rem;
  pointer-events: none;
}

.header__inline-menu .label {
  display: inline-block;
  height: 15px;
  text-transform: capitalize;
  text-align: center;
  border-radius: var(--badge-corner-radius);
  padding: .1rem var(--padding-xs);
  position: relative;
  color: var(--color-foreground);
  background-color: var(--color-background);
  line-height: 1;

  &::before {
    content: '';
    position: absolute;
    left: 50%;
    bottom: -9px;
    transform: translate(-50%) rotate(180deg);
    border: 5px solid transparent;
    border-bottom-color: var(--color-background);
  }

  &.new-label {
    --color-foreground: var(--new-color);
    --color-foreground-rgb: var(--new-color-rgb);
    --color-background: var(--new-bg);
    --color-background-rgb: var(--new-bg-rgb);
  }

  &.sale-label {
    --color-foreground: var(--sale-color);
    --color-foreground-rgb: var(--sale-color-rgb);
    --color-background: var(--sale-bg);
    --color-background-rgb: var(--sale-bg-rgb);
  }

  &.hot-label {
    --color-foreground: var(--hot-color);
    --color-foreground-rgb: var(--hot-color-rgb);
    --color-background: var(--hot-bg);
    --color-background-rgb: var(--hot-bg-rgb);
  }
}

.mega-menu__content .label-wrapper {
  margin-left: var(--margin-xs);
  position: absolute;
  left: 100%;
  top: 50%;
  transform: translateY(-50%);
}

.mega-menu__content .label:before {
  left: -8px;
  top: 50%;
  bottom: auto;
  transform: translateY(-50%) rotate(270deg);
}

.header__inline-menu .details--dropdown > .list-menu--wrapper:not(.header__submenu-wrapper) {
  clip-path: rect(0 100% var(--submenu-height-transition) 0);
  max-height: 70dvh;
  transition: clip-path var(--submenu-animation-speed) var(--ease-out-smooth);
  pointer-events: none;
}

.header__inline-menu .details--dropdown > .list-menu--wrapper.header__submenu-wrapper {
  opacity: var(--submenu-opacity);
  visibility: hidden;
  transform: translateY(-0.4rem);
  overflow: hidden;
  transition: opacity var(--submenu-animation-speed) var(--ease-out-smooth),
    transform var(--submenu-animation-speed) var(--ease-out-smooth);
}

.header__inline-menu .details--dropdown > .list-menu--wrapper {
  overflow-y: auto;
  pointer-events: none;
}

.header__inline-menu .details--dropdown > .header__submenu-wrapper {
  min-width: initial;
  background: var(--color-background);
}

@media screen and (min-width: 1025px) {
  .list-menu--inline .details--dropdown:hover .menu__link--level-1:before {
    content: '';
    position: absolute;
    left: 0;
    top: 100%;
    width: 100%;
    height: var(--header-height);
    z-index: 1;
  }

  .header__inline-menu .details--dropdown:hover > .list-menu--wrapper {
    --submenu-opacity: 1;
    --submenu-height-transition: var(--submenu-height);
    pointer-events: auto;

    &.header__submenu-wrapper {
      visibility: visible;
      transform: translate3d(0, 0, 0);
    }
  }
}

/* mega 1 */
.mega-menu-style-1:not(:has(.collage__item--3)) {
  @media screen and (min-width: 750px) {
    .collage--2-items.collage--right .collage__item--1 {
      grid-row: 1 / span 2;
      grid-column: 1 / -1;
    }

    .collage--2-items.collage--right .collage__item--2 {
      grid-column: 1 / -1;
      grid-row: 3 / span 2;
    }
  }
}

@media screen and (max-width: 1279px) {
  .mega-menu-style-1 .mega-menu__list,
  .mega-menu-style-1 .mega-menu__collage {
    flex: 0 0 100%;
  }
}

/* mega 3 */
@media screen and (min-width: 750px) {
  .mega-menu-style-3 .collage__item--1 {
    grid-row: span 1;
  }

  .mega-menu-style-3 .resource-card {
    grid-template-columns: 11.5rem 1fr;
  }
}

@media screen and (min-width: 750px) {
  .mega-menu__collage-wrapper .collage .collage__item--1,
  .mega-menu__collage-wrapper .collage .collage__item--4,
  .mega-menu__container .collage .collage__item--1,
  .mega-menu__container .collage .collage__item--4 {
    grid-row: span 1;
  }
}


.header .link.link--multi-site {
  position: relative;
  color: rgb(var(--color));
  background-color: var(--background-color);
  padding: var(--padding-lg) var(--padding-xl);
  transition: background-color 0.3s var(--animation-timing-hover);
  font-size: var(--font-size--md);
  display: block;
  align-content: center;
  height: 100%;
  &.link--multi-site--active {
    color: rgba(var(--color-active) / var(--opacity-100));
    background-color: rgba(var(--background-color-active) / var(--opacity-100));
  }

  img,
  svg {
    width: var(--logo_size);
    min-width: var(--logo_size);
    height: auto;
  }

  svg {
    fill: currentColor;
  }

  &:hover {
    color: rgba(var(--color-active) / var(--opacity-80));
    background-color: rgba(var(--background-color-active) / var(--opacity-80));
  }
}

.header__search .search--inline .predictive-search--center .search__button {
  right: 1px;
  top: 1px;
  border-top-right-radius: var(--inputs-radius);
  border-bottom-right-radius: var(--inputs-radius);
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
  height: var(--minimum-touch-target);
}
.header__search .search--inline .predictive-search--center .search__button:not(:focus-visible):not(.focused) {
  background-color: var(--color-primary-button-background);
}

.header__search .search--inline .predictive-search--center .search__input {
  height: var(--minimum-touch-target);
}

.country-language-localization .disclosure__list-wrapper {
  max-height: initial;
  overflow: visible;
}

.country-language-localization .language-selector .language-selector__select {
  width: max-content;
  height: var(--size-38);
}

.country-language-localization .language-selector {
  padding: 1rem 1.6rem;
  gap: var(--gap-xs);
}

.menu-drawer .language-selector .details--dropdown,
.country-language-localization .language-selector .details--dropdown {
  width: max-content;
  font-size: var(--menu-localization-font-size);
  font-family: var(--menu-localization-font);
}

.language-selector__label {
  flex-shrink: 0;
  color: rgb(var(--color-foreground-rgb) / var(--opacity-subdued-text));
  font-size: var(--menu-localization-font-size);
  font-family: var(--menu-localization-font);
}

.drawer-localization__button--label {
  font-size: var(--menu-localization-font-size);
  font-family: var(--menu-localization-font);
  width: 100%;

  .icon-flag {
    width: calc(var(--menu-localization-font-size, var(--icon-size-sm)) * 1.5);
    height: var(--menu-localization-font-size, var(--icon-size-sm));
  }

  .icon-caret {
    margin-left: auto;
  }
}

.search-drawer .predictive-search {
  border: none;
  box-shadow: none;
  max-height: calc(100svh - 143px) !important;
  overflow-x: hidden;

  .resource-card {
  --resource-card-image-size: 5.5rem;
  }
}

.predictive-search .resource-card.resource-card--column {
  --resource-card-template-columns: var(--resource-card-image-size) 1fr;
}

.search-drawer .drawer__inner {
  padding: var(--padding-lg) 0;

  @media screen and (min-width: 1025px) {
    padding: var(--padding-4xl) 0;
  }

  .predictive-search--center {
    padding-inline: var(--padding-lg);
    @media screen and (min-width: 1025px) {
      padding-inline: var(--padding-4xl);
    }
  }
}

.predictive-search-tabs .tabs-product-header {
  gap: var(--gap-2xl);
  margin-bottom: 1rem;
}

.predictive-search-tab__trigger {
  background: none;
  border: none;
  padding: 0.8rem 0;
  position: relative;
  &:before ,
  &:after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 0.1rem;
    background-color: rgba(var(--color-border-rgb) / var(--opacity-20));
    transition: background-color var(--animation-speed-slow) var(--animation-easing), transform var(--animation-speed-slow) var(--animation-easing);
    transform-origin: right;
  }

  &:after {
    transform: scaleX(0);
    background-color: rgba(var(--color-border-rgb) / var(--opacity-100));
  }
}

.predictive-search-tab__trigger.--active:after{
  transform: scaleX(1);
  transform-origin: left;
}

.predictive-search-tab__panel {
  display: none;
  padding-top: 1rem;

  &.--active {
    display: block;
  }
}

.predictive-search-tabs .tabs-product-header {
  gap: var(--gap-2xl);
  margin-bottom: 1rem;
}

.predictive-search-tab__trigger {
  background: none;
  border: none;
  padding: 0.8rem 0;
  position: relative;
  &:before ,
  &:after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 0.1rem;
    background-color: rgba(var(--color-border-rgb) / var(--opacity-20));
    transition: background-color var(--animation-speed-slow) var(--animation-easing), transform var(--animation-speed-slow) var(--animation-easing);
    transform-origin: right;
  }

  &:after {
    transform: scaleX(0);
    background-color: rgba(var(--color-border-rgb) / var(--opacity-100));
  }
}

.predictive-search-tab__trigger.--active:after{
  transform: scaleX(1);
  transform-origin: left;
}

.predictive-search-tab__panel {
  display: none;
  padding-top: 1rem;

  &.--active {
    display: block;
  }
}

.facets-price__apply {
  margin-top: var(--margin-xl);
}

.field-to-price,
.field-currency {
  font-size: var(--body-xs-font-size);
}

.field__input.filter__price_number {
  padding: 1rem 0.5rem 1rem 1rem;
  text-align: right;
}
.quick-add-modal {
  inset: 0;
  background: rgb(var(--color-foreground-rgb) / var(--opacity-20));

  .product-form__buttons-wrapper {
    grid-template-columns: 1fr;
    margin-top: 1rem;
  }

  .scroll-trigger.scroll-trigger {
    animation: none;
    opacity: var(--opacity-100);
    transform: none;
  }

  .quick-order-list__container {
    padding-bottom: 1.5rem;
  }

  .product-form__submit {
    min-height: 4.4rem;
    font-size: initial;
  }

  .product__tax {
    margin-top: 0;
  }

  button[type="submit"] {
    overflow: hidden;
    position: relative;
  }

  @media screen and (min-width: 990px) {
    .shopify-payment-button {
      width: 100%;
    }
  }
}

.quick-add-modal__content {
  --modal-height-offset: 3.2rem;
  padding: 1rem 0.5rem;
  min-height: 35rem;
}

.quick-add-modal__content img {
  max-width: 100%;
}

.quick-add-modal__content:not(.quick-add-modal__content--bulk) {
  max-width: 47.5rem;
  height: auto;
  max-height: max-content;
  width: calc(100% - 3rem);
  @media screen and (min-width: 750px) {
    width: 80%;
  }

  @media screen and (min-width: 990px) {
    width: 70%;
  }
}

/* Quick add bulk */
.quick-add-modal--bulk .popup__inner {
  overflow: initial;
  @media screen and (max-width: 1279px){
    width: 100%;
  }
  @media screen and (min-width: 1280px) {
    min-width: var(--popup-max-width);
  }
}

.quick-add-modal--bulk .variant-item__image-container {
  display: inline-flex;
  align-items: flex-start;
  height: 4.5rem;
  width: 4.5rem;
}

.quick-add-modal__content-info.quick-add-modal__content-info--bulk {
  padding-bottom: 0;
}

.quick-add-modal__content-info--bulk h3 {
  margin-block: 0 0.5rem;
}

.quick-add-modal__content-info--bulk :is(.price, .card__information-volume-pricing-note) {
  display: inline-block;
}

.quick-add-modal__content-info--bulk :is(.quick-add__product-media, .quick-add__product-container, .quick-add__info) {
  width: 4.8rem;
}

.quick-add-modal__content-info--bulk-details {
  padding-left: 1rem;
}

.quick-add-modal__content-info--bulk-details > a:hover {
  text-decoration: underline;
  text-underline-offset: 0.3rem;
}

.quick-add-modal__content-info--bulk :is(.quick-add__product-media, .quick-add__product-container, .quick-add__info) {
  width: 4.8rem;
}

.quick-add-modal__content-info--bulk .quick-add__product-container img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.quick-add-modal__content-info--bulk .quick-add__content-info__media {
  width: auto;
}

.quick-add-modal__content-info {
  --modal-padding: 1.5rem;
  padding-inline-end: 4.4rem;
  display: flex;
  overflow-y: auto;
  overflow-x: hidden;
  padding: var(--modal-padding);
  height: 100%;
}

.quick-add-modal__content-info > * {
  height: auto;
  margin: 0 auto;
  max-width: 100%;
  width: 100%;
}

.quick-add-modal__content-info > .quick-add-modal__content-info {
  padding-top: 0;
  margin-top: 2.5rem;
}

.quick-add-modal__content-info > product-info {
  padding: 0;
}

.quick-add-modal--bulk .quick-add-modal__toggle {
  background: var(--color-background);
  border: 0.1rem solid rgb(var(--color-foreground-rgb) / var(--opacity-10));
  border-radius: var(--style-border-radius-50);
  color: rgb(var(--color-foreground-rgb) / var(--opacity-55));
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  padding: 1.2rem;
  z-index: 5;
  position: fixed;
  top: 1.5rem;
  right: 1.5rem;
}

.quick-add-modal__toggle .icon {
  height: auto;
  margin: 0;
  width: 1.8rem;
}

quick-add-modal .product:not(.featured-product) .product__view-details {
  display: block;
}

.quick-add-modal__content--bulk .product__view-details .icon {
  margin-left: 1.2rem;
  display: inline-block;
}

quick-add-modal
  :is(
    .quick-add-hidden,
    .product__modal-opener:not(.product__modal-opener--image),
    .product__media-item:not(:first-child)
  ) {
  display: none !important;
}

quick-add-modal .product__column-sticky {
  top: 0;
  position: relative;
}

quick-add-modal .page-width {
  padding: 0;
}

quick-add-modal .product__title > h1 {
  display: none;
}

quick-add-modal .product__title > a {
  display: block;
  text-decoration: none;
}

quick-add-modal .product__title > a:hover {
  color: var(--color-foreground);
  text-decoration: underline;
  text-underline-offset: 0.2rem;
  text-decoration-thickness: 0.3rem;
}

quick-add-modal .product-form__buttons {
  max-width: initial;
}

quick-add-modal .product-media-container.constrain-height {
  --viewport-offset: calc(
    (var(--modal-height-offset) + var(--modal-padding) + var(--style-border-width-popover)) * 2
  );
}

.quick-add-modal__content-info--bulk .quick-order-list__table .quick-order-list__table-heading--price {
  width: 22rem;
}

@media screen and (max-width: 1024px) {
  .quick-add-modal__content-info--bulk .quick-add__content-info__media {
    display: flex;
    margin: 0;
  }

  .quick-add-modal__content-info--bulk quick-order-list {
    padding-inline: 0;
  }

  .quick-add-modal__content-info.quick-add-modal__content-info--bulk {
    --modal-padding: 1.5rem;
  }
  .quick-add-modal__content-info--bulk {
    flex-direction: column;
  }
}

@media screen and (max-width: 749px) {
  .quick-add-modal__content {
    bottom: var(--modal-height-offset);
  }

  .quick-add-modal__content-info > * {
    max-height: 100%;
  }

  quick-add-modal .product--mobile-columns .product__media-item {
    width: calc(100% - 3rem - var(--grid-mobile-horizontal-spacing));
  }
}

@media screen and (min-width: 750px) {
  quick-add-modal .quick-add-modal__toggle {
    top: 2rem;
    right: 2rem;
  }

  .quick-add-modal__content-info--bulk .card__information-volume-pricing-note {
    padding-left: 1.6rem;
  }

  quick-add-modal .product:not(.product--no-media) .product__media-wrapper {
    width: calc(45% - var(--grid-desktop-horizontal-spacing) / 2);
  }

  quick-add-modal .product--columns .product__media-item:not(.product__media-item--single):not(:only-child) {
    max-width: 100%;
    width: 100%;
  }

  quick-add-modal .product-media-container.constrain-height {
    --constrained-min-height: 400px;
  }
}

@media screen and (min-width: 990px) {
  .quick-add-modal__content-info.quick-add-modal__content-info--bulk {
    overflow-y: initial;
  }

  .quick-add-modal__content-info--bulk .quick-order-list__table th {
    padding-top: 2.5rem;
  }

  .quick-add-modal__content-info--bulk thead {
    position: sticky;
    z-index: 3;
    top: -.2rem;
    background: var(--color-background);
  }
  .quick-add-modal__content-info--bulk
    :is(.quick-add__product-media, .quick-add__product-container, .quick-add__info) {
    width: 17rem;
  }

  .quick-add-modal__content-info--bulk-details,
  .quick-add-modal__content-info--bulk quick-order-list {
    padding: 0 2.5rem;
  }
  .quick-add-modal__content-info--bulk .quick-add__info {
    position: sticky;
    top: 0;
    margin-block-start: -2.5rem;
    padding-block-start: 2.5rem;
  }
}

.quick-order-list-container .quantity-popover-container {
  justify-content: center;
  margin: 0;
}

.quick-order-list-container .quick-order-list__table th {
  font-size: var(--font-size-heading);
}

.quick-order-list-container .quick-order-list__table td,
.quick-order-list-container .variant-item__name {
  font-size: var(--font-size-info);
}

.switcher-grid .grid-view--list .grid-view--item .button--grid-view {
  --color-inactive: rgba(var(--color-border-rgb) / 0.5);
  --color-active: var(--color-border);
  display: inline-block;
  vertical-align: middle;
  width: 26px;
  height: 26px;
  padding: 3px;
  border: 1px solid var(--color-inactive);
}

.switcher-grid .grid-view--list .grid-view--item.active .button--grid-view {
  border-color: var(--color-active);
}

.switcher-grid .grid-view--list .grid-view--item.grid-view-2 .button--grid-view {
  width: 19px;
}

.switcher-grid .grid-view--list .grid-view--item.grid-view-4 .button--grid-view {
  width: 33px;
}

.switcher-grid .grid-view--list .grid-view--item.grid-view-5 .button--grid-view {
  width: 40px;
}

.switcher-grid .grid-view--list .grid-view--item .button--grid-view .icon {
  width: 20px;
  height: 100%;
}

.switcher-grid .grid-view--list .grid-view--item.grid-view-5,
.switcher-grid .grid-view--list .grid-view--item.grid-view-4,
.switcher-grid .grid-view--list .grid-view--item.grid-view-3 {
  display: none;
}

.switcher-grid .grid-view--list .grid-view--item.active {
  background-color: var(--bg-white);
}

.switcher-grid .grid-view--list .grid-view--item + .grid-view--item {
  margin-left: 5px;
}

.switcher-grid .grid-view--list .grid-view--item .button--grid-view {
  position: relative;
  cursor: pointer;
}

.switcher-grid .grid-view--list .grid-view--item .button--grid-view:before {
  content: '';
  position: absolute;
  width: 4px;
  height: 18px;
  top: 3px;
  left: 3px;
  background-color: var(--color-inactive);
}

.switcher-grid .grid-view--list .grid-view--item .button--grid-view.active:before {
  --color-inactive: var(--color-border);
}

.switcher-grid .grid-view--list .grid-view--item.grid-view-list .button--grid-view:before {
  width: 18px;
  height: 4px;
  box-shadow: 0 7px 0 var(--color-inactive), 0 14px 0 var(--color-inactive);
}

@media (min-width: 360px) {
  .switcher-grid .grid-view--list .grid-view--item.grid-view-2 .button--grid-view:before {
    box-shadow: 7px 0 0 var(--color-inactive);
  }
}

@media (min-width: 750px) {
  .switcher-grid .grid-view--list .grid-view--item.grid-view-3 {
    display: inline-block;
  }

  .switcher-grid .grid-view--list .grid-view--item.grid-view-3 .button--grid-view:before {
    box-shadow: 7px 0 0 var(--color-inactive), 14px 0 0 var(--color-inactive);
  }

  .switcher-grid .grid-view--list .grid-view--item.grid-view-3.active .button--grid-view:before {
    box-shadow: 7px 0 0 var(--color-active), 14px 0 0 var(--color-active);
  }

  .switcher-grid .grid-view--list .grid-view--item.grid-view-3.active .button--grid-view {
    display: inline-block;
    vertical-align: middle;
  }
}

@media (min-width: 990px) {
  .switcher-grid .grid-view--list .grid-view--item.grid-view-4 {
    display: inline-block;
  }

  .switcher-grid .grid-view--list .grid-view--item.grid-view-4 .button--grid-view:before {
    box-shadow: 7px 0 0 var(--color-inactive), 14px 0 0 var(--color-inactive), 21px 0 0 var(--color-inactive);
  }

  .switcher-grid .grid-view--list .grid-view--item.grid-view-4.active .button--grid-view:before {
    box-shadow: 7px 0 0 var(--color-active), 14px 0 0 var(--color-active), 21px 0 0 var(--color-active);
  }
}

@media (min-width: 1600px) {
  .switcher-grid .grid-view--list .grid-view--item.grid-view-5 {
    display: inline-block;
  }

  .switcher-grid .grid-view--list .grid-view--item.grid-view-5 .button--grid-view:before {
    box-shadow: 7px 0 0 var(--color-inactive), 14px 0 0 var(--color-inactive), 21px 0 0 var(--color-inactive),
      28px 0 0 var(--color-inactive);
  }
}

.tabs-component-panel-trigger.button.--active {
  color: var(--color-primary-button-hover-text);
  background-color: var(--color-primary-button-hover-background);
  border-color: var(--color-primary-button-hover-border);
}

.tabs-component-panel-trigger.button-secondary.--active {
  color: var(--color-secondary-button-hover-text);
  background-color: var(--color-secondary-button-hover-background);
  border-color: var(--color-secondary-button-hover-border);
}

.tabs-component-panel-trigger.link.--active {
  font-weight: 700;
  background-size: 100% 2px !important;
}

.add-to-cart-button-inner .wishlist-button.wishlist-added {
  color: var(--color-primary-button-hover-text);
  background-color: var(--color-primary-button-hover-background);
  box-shadow: rgb(99 99 99 / var(--opacity-20)) 0px .2rem .8rem 0px;
}

img[src*="foamy_shoe"] {
    display: inline-block !important;
    animation: moveInCircleOnly 6s linear infinite !important;
}

@keyframes moveInCircleOnly {
  0% {
    transform: translate(0, 0);
  }
  25% {
    transform: translate(10px, 0); 
  }
  50% {
    transform: translate(10px, 10px); 
  }
  75% {
    transform: translate(0, 10px); 
  }
  100% {
    transform: translate(0, 0); 
  }
}
@media (max-width: 768px) {
  .button-secondary--AVVpXOXo0SUU0R2VZS__button_MkDPpb {
    font-size: 10px !important; 
    padding: 0.6em 1.5em !important;
    width: fit-content !important; 
    margin: 0 auto; 
  }