*, ::before, ::after {
  --tw-border-spacing-x: 0;
  --tw-border-spacing-y: 0;
  --tw-translate-x: 0;
  --tw-translate-y: 0;
  --tw-rotate: 0;
  --tw-skew-x: 0;
  --tw-skew-y: 0;
  --tw-scale-x: 1;
  --tw-scale-y: 1;
  --tw-pan-x:  ;
  --tw-pan-y:  ;
  --tw-pinch-zoom:  ;
  --tw-scroll-snap-strictness: proximity;
  --tw-gradient-from-position:  ;
  --tw-gradient-via-position:  ;
  --tw-gradient-to-position:  ;
  --tw-ordinal:  ;
  --tw-slashed-zero:  ;
  --tw-numeric-figure:  ;
  --tw-numeric-spacing:  ;
  --tw-numeric-fraction:  ;
  --tw-ring-inset:  ;
  --tw-ring-offset-width: 0px;
  --tw-ring-offset-color: #fff;
  --tw-ring-color: rgb(59 130 246 / 0.5);
  --tw-ring-offset-shadow: 0 0 #0000;
  --tw-ring-shadow: 0 0 #0000;
  --tw-shadow: 0 0 #0000;
  --tw-shadow-colored: 0 0 #0000;
  --tw-blur:  ;
  --tw-brightness:  ;
  --tw-contrast:  ;
  --tw-grayscale:  ;
  --tw-hue-rotate:  ;
  --tw-invert:  ;
  --tw-saturate:  ;
  --tw-sepia:  ;
  --tw-drop-shadow:  ;
  --tw-backdrop-blur:  ;
  --tw-backdrop-brightness:  ;
  --tw-backdrop-contrast:  ;
  --tw-backdrop-grayscale:  ;
  --tw-backdrop-hue-rotate:  ;
  --tw-backdrop-invert:  ;
  --tw-backdrop-opacity:  ;
  --tw-backdrop-saturate:  ;
  --tw-backdrop-sepia:  ;
  --tw-contain-size:  ;
  --tw-contain-layout:  ;
  --tw-contain-paint:  ;
  --tw-contain-style:  ;
}

::backdrop {
  --tw-border-spacing-x: 0;
  --tw-border-spacing-y: 0;
  --tw-translate-x: 0;
  --tw-translate-y: 0;
  --tw-rotate: 0;
  --tw-skew-x: 0;
  --tw-skew-y: 0;
  --tw-scale-x: 1;
  --tw-scale-y: 1;
  --tw-pan-x:  ;
  --tw-pan-y:  ;
  --tw-pinch-zoom:  ;
  --tw-scroll-snap-strictness: proximity;
  --tw-gradient-from-position:  ;
  --tw-gradient-via-position:  ;
  --tw-gradient-to-position:  ;
  --tw-ordinal:  ;
  --tw-slashed-zero:  ;
  --tw-numeric-figure:  ;
  --tw-numeric-spacing:  ;
  --tw-numeric-fraction:  ;
  --tw-ring-inset:  ;
  --tw-ring-offset-width: 0px;
  --tw-ring-offset-color: #fff;
  --tw-ring-color: rgb(59 130 246 / 0.5);
  --tw-ring-offset-shadow: 0 0 #0000;
  --tw-ring-shadow: 0 0 #0000;
  --tw-shadow: 0 0 #0000;
  --tw-shadow-colored: 0 0 #0000;
  --tw-blur:  ;
  --tw-brightness:  ;
  --tw-contrast:  ;
  --tw-grayscale:  ;
  --tw-hue-rotate:  ;
  --tw-invert:  ;
  --tw-saturate:  ;
  --tw-sepia:  ;
  --tw-drop-shadow:  ;
  --tw-backdrop-blur:  ;
  --tw-backdrop-brightness:  ;
  --tw-backdrop-contrast:  ;
  --tw-backdrop-grayscale:  ;
  --tw-backdrop-hue-rotate:  ;
  --tw-backdrop-invert:  ;
  --tw-backdrop-opacity:  ;
  --tw-backdrop-saturate:  ;
  --tw-backdrop-sepia:  ;
  --tw-contain-size:  ;
  --tw-contain-layout:  ;
  --tw-contain-paint:  ;
  --tw-contain-style:  ;
}

/*
! tailwindcss v3.4.17 | MIT License | https://tailwindcss.com
*/

/*
1. Prevent padding and border from affecting element width. (https://github.com/mozdevs/cssremedy/issues/4)
2. Allow adding a border to an element by just adding a border-width. (https://github.com/tailwindcss/tailwindcss/pull/116)
*/

*,
::before,
::after {
  box-sizing: border-box;
  /* 1 */
  border-width: 0;
  /* 2 */
  border-style: solid;
  /* 2 */
  border-color: #e5e7eb;
  /* 2 */
}

::before,
::after {
  --tw-content: '';
}

/*
1. Use a consistent sensible line-height in all browsers.
2. Prevent adjustments of font size after orientation changes in iOS.
3. Use a more readable tab size.
4. Use the user's configured `sans` font-family by default.
5. Use the user's configured `sans` font-feature-settings by default.
6. Use the user's configured `sans` font-variation-settings by default.
7. Disable tap highlights on iOS
*/

html,
:host {
  line-height: 1.5;
  /* 1 */
  -webkit-text-size-adjust: 100%;
  /* 2 */
  -moz-tab-size: 4;
  /* 3 */
  -o-tab-size: 4;
     tab-size: 4;
  /* 3 */
  font-family: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
  /* 4 */
  font-feature-settings: normal;
  /* 5 */
  font-variation-settings: normal;
  /* 6 */
  -webkit-tap-highlight-color: transparent;
  /* 7 */
}

/*
1. Remove the margin in all browsers.
2. Inherit line-height from `html` so users can set them as a class directly on the `html` element.
*/

body {
  margin: 0;
  /* 1 */
  line-height: inherit;
  /* 2 */
}

/*
1. Add the correct height in Firefox.
2. Correct the inheritance of border color in Firefox. (https://bugzilla.mozilla.org/show_bug.cgi?id=190655)
3. Ensure horizontal rules are visible by default.
*/

hr {
  height: 0;
  /* 1 */
  color: inherit;
  /* 2 */
  border-top-width: 1px;
  /* 3 */
}

/*
Add the correct text decoration in Chrome, Edge, and Safari.
*/

abbr:where([title]) {
  -webkit-text-decoration: underline dotted;
          text-decoration: underline dotted;
}

/*
Remove the default font size and weight for headings.
*/

h1,
h2,
h3,
h4,
h5,
h6 {
  font-size: inherit;
  font-weight: inherit;
}

/*
Reset links to optimize for opt-in styling instead of opt-out.
*/

a {
  color: inherit;
  text-decoration: inherit;
}

/*
Add the correct font weight in Edge and Safari.
*/

b,
strong {
  font-weight: bolder;
}

/*
1. Use the user's configured `mono` font-family by default.
2. Use the user's configured `mono` font-feature-settings by default.
3. Use the user's configured `mono` font-variation-settings by default.
4. Correct the odd `em` font sizing in all browsers.
*/

code,
kbd,
samp,
pre {
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
  /* 1 */
  font-feature-settings: normal;
  /* 2 */
  font-variation-settings: normal;
  /* 3 */
  font-size: 1em;
  /* 4 */
}

/*
Add the correct font size in all browsers.
*/

small {
  font-size: 80%;
}

/*
Prevent `sub` and `sup` elements from affecting the line height in all browsers.
*/

sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}

sub {
  bottom: -0.25em;
}

sup {
  top: -0.5em;
}

/*
1. Remove text indentation from table contents in Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=999088, https://bugs.webkit.org/show_bug.cgi?id=201297)
2. Correct table border color inheritance in all Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=935729, https://bugs.webkit.org/show_bug.cgi?id=195016)
3. Remove gaps between table borders by default.
*/

table {
  text-indent: 0;
  /* 1 */
  border-color: inherit;
  /* 2 */
  border-collapse: collapse;
  /* 3 */
}

/*
1. Change the font styles in all browsers.
2. Remove the margin in Firefox and Safari.
3. Remove default padding in all browsers.
*/

button,
input,
optgroup,
select,
textarea {
  font-family: inherit;
  /* 1 */
  font-feature-settings: inherit;
  /* 1 */
  font-variation-settings: inherit;
  /* 1 */
  font-size: 100%;
  /* 1 */
  font-weight: inherit;
  /* 1 */
  line-height: inherit;
  /* 1 */
  letter-spacing: inherit;
  /* 1 */
  color: inherit;
  /* 1 */
  margin: 0;
  /* 2 */
  padding: 0;
  /* 3 */
}

/*
Remove the inheritance of text transform in Edge and Firefox.
*/

button,
select {
  text-transform: none;
}

/*
1. Correct the inability to style clickable types in iOS and Safari.
2. Remove default button styles.
*/

button,
input:where([type='button']),
input:where([type='reset']),
input:where([type='submit']) {
  -webkit-appearance: button;
  /* 1 */
  background-color: transparent;
  /* 2 */
  background-image: none;
  /* 2 */
}

/*
Use the modern Firefox focus style for all focusable elements.
*/

:-moz-focusring {
  outline: auto;
}

/*
Remove the additional `:invalid` styles in Firefox. (https://github.com/mozilla/gecko-dev/blob/2f9eacd9d3d995c937b4251a5557d95d494c9be1/layout/style/res/forms.css#L728-L737)
*/

:-moz-ui-invalid {
  box-shadow: none;
}

/*
Add the correct vertical alignment in Chrome and Firefox.
*/

progress {
  vertical-align: baseline;
}

/*
Correct the cursor style of increment and decrement buttons in Safari.
*/

::-webkit-inner-spin-button,
::-webkit-outer-spin-button {
  height: auto;
}

/*
1. Correct the odd appearance in Chrome and Safari.
2. Correct the outline style in Safari.
*/

[type='search'] {
  -webkit-appearance: textfield;
  /* 1 */
  outline-offset: -2px;
  /* 2 */
}

/*
Remove the inner padding in Chrome and Safari on macOS.
*/

::-webkit-search-decoration {
  -webkit-appearance: none;
}

/*
1. Correct the inability to style clickable types in iOS and Safari.
2. Change font properties to `inherit` in Safari.
*/

::-webkit-file-upload-button {
  -webkit-appearance: button;
  /* 1 */
  font: inherit;
  /* 2 */
}

/*
Add the correct display in Chrome and Safari.
*/

summary {
  display: list-item;
}

/*
Removes the default spacing and border for appropriate elements.
*/

blockquote,
dl,
dd,
h1,
h2,
h3,
h4,
h5,
h6,
hr,
figure,
p,
pre {
  margin: 0;
}

fieldset {
  margin: 0;
  padding: 0;
}

legend {
  padding: 0;
}

ol,
ul,
menu {
  list-style: none;
  margin: 0;
  padding: 0;
}

/*
Reset default styling for dialogs.
*/

dialog {
  padding: 0;
}

/*
Prevent resizing textareas horizontally by default.
*/

textarea {
  resize: vertical;
}

/*
1. Reset the default placeholder opacity in Firefox. (https://github.com/tailwindlabs/tailwindcss/issues/3300)
2. Set the default placeholder color to the user's configured gray 400 color.
*/

input::-moz-placeholder, textarea::-moz-placeholder {
  opacity: 1;
  /* 1 */
  color: #9ca3af;
  /* 2 */
}

input::placeholder,
textarea::placeholder {
  opacity: 1;
  /* 1 */
  color: #9ca3af;
  /* 2 */
}

/*
Set the default cursor for buttons.
*/

button,
[role="button"] {
  cursor: pointer;
}

/*
Make sure disabled buttons don't get the pointer cursor.
*/

:disabled {
  cursor: default;
}

/*
1. Make replaced elements `display: block` by default. (https://github.com/mozdevs/cssremedy/issues/14)
2. Add `vertical-align: middle` to align replaced elements more sensibly by default. (https://github.com/jensimmons/cssremedy/issues/14#issuecomment-634934210)
   This can trigger a poorly considered lint error in some tools but is included by design.
*/

img,
svg,
video,
canvas,
audio,
iframe,
embed,
object {
  display: block;
  /* 1 */
  vertical-align: middle;
  /* 2 */
}

/*
Constrain images and videos to the parent width and preserve their intrinsic aspect ratio. (https://github.com/mozdevs/cssremedy/issues/14)
*/

img,
video {
  max-width: 100%;
  height: auto;
}

/* Make elements with the HTML hidden attribute stay hidden by default */

[hidden]:where(:not([hidden="until-found"])) {
  display: none;
}

.btn {
  display: inline-block;
  min-width: 200px;
  cursor: pointer;
  border-radius: 9999px !important;
  border-width: 2px;
  border-color: transparent;
  --tw-bg-opacity: 1;
  background-color: rgb(38 38 38 / var(--tw-bg-opacity, 1));
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
  padding-left: 1.5rem;
  padding-right: 1.5rem;
  text-align: center;
  font-size: 1.125rem;
  line-height: 1.75rem;
  font-weight: 500;
  line-height: 1.25;
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity, 1));
  transition-property: all !important;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1) !important;
  transition-duration: 300ms !important;
}

.btn:hover {
  --tw-bg-opacity: 1;
  background-color: rgb(64 64 64 / var(--tw-bg-opacity, 1));
}

.btn:focus {
  --tw-shadow: 0 0 #0000 !important;
  --tw-shadow-colored: 0 0 #0000 !important;
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow) !important;
  outline: 2px solid transparent !important;
  outline-offset: 2px !important;
}

.btn.btn-primary {
  --tw-bg-opacity: 1;
  background-color: rgb(225 228 60 / var(--tw-bg-opacity, 1));
  --tw-text-opacity: 1;
  color: rgb(0 0 0 / var(--tw-text-opacity, 1));
}

.btn.btn-primary:hover {
  --tw-bg-opacity: 1;
  background-color: rgb(241 243 165 / var(--tw-bg-opacity, 1));
}

.btn.btn-outline {
  border-width: 2px;
  border-style: solid;
  --tw-border-opacity: 1 !important;
  border-color: rgb(163 163 163 / var(--tw-border-opacity, 1)) !important;
  background-color: transparent;
  --tw-text-opacity: 1;
  color: rgb(23 23 23 / var(--tw-text-opacity, 1));
}

.btn.btn-outline:hover {
  background-color: rgb(163 163 163 / var(--tw-bg-opacity, 1));
  --tw-bg-opacity: 1;
  background-color: rgb(245 245 245 / var(--tw-bg-opacity, 1));
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity, 1));
}

.btn.btn-outline.btn.btn-primary {
  border-width: 2px;
  border-style: solid;
  --tw-border-opacity: 1;
  border-color: rgb(225 228 60 / var(--tw-border-opacity, 1));
  background-color: transparent;
  --tw-text-opacity: 1;
  color: rgb(225 228 60 / var(--tw-text-opacity, 1));
}

.btn.btn-outline.btn.btn-primary:hover {
  --tw-border-opacity: 1;
  border-color: rgb(241 243 165 / var(--tw-border-opacity, 1));
  --tw-bg-opacity: 1;
  background-color: rgb(241 243 165 / var(--tw-bg-opacity, 1));
  --tw-text-opacity: 1;
  color: rgb(0 0 0 / var(--tw-text-opacity, 1));
}

.btn.btn-link {
  border-color: transparent;
  background-color: transparent;
}

.btn.btn-link.btn-primary {
  --tw-text-opacity: 1;
  color: rgb(225 228 60 / var(--tw-text-opacity, 1));
}

.btn.btn-link.btn-primary:hover {
  --tw-bg-opacity: 0.1;
}

.btn.btn-white {
  --tw-bg-opacity: 1;
  background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));
  --tw-text-opacity: 1;
  color: rgb(0 0 0 / var(--tw-text-opacity, 1));
}

.btn.btn-white:hover {
  --tw-bg-opacity: 1;
  background-color: rgb(241 243 165 / var(--tw-bg-opacity, 1));
}

.btn.btn-sm {
  min-width: -moz-fit-content;
  min-width: fit-content;
  padding-top: 0.25rem;
  padding-bottom: 0.25rem;
  padding-left: 1rem;
  padding-right: 1rem;
  font-size: 0.875rem;
  line-height: 1.25rem;
}

.btn.btn-xs {
  min-width: -moz-fit-content;
  min-width: fit-content;
  border-width: 1px;
  padding-top: 0.25rem;
  padding-bottom: 0.25rem;
  padding-left: 0.75rem;
  padding-right: 0.75rem;
  font-size: 0.875rem;
  line-height: 1rem;
}

.wc-block-components-button,
  .woocommerce button.button,
  .woocommerce .button {
  display: inline-block;
  cursor: pointer;
  border-radius: 9999px !important;
  border-width: 2px;
  border-color: transparent;
  --tw-bg-opacity: 1 !important;
  background-color: rgb(38 38 38 / var(--tw-bg-opacity, 1)) !important;
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
  padding-left: 1.5rem;
  padding-right: 1.5rem;
  text-align: center;
  font-size: 1.125rem;
  line-height: 1.75rem;
  font-weight: 500;
  line-height: 1.25;
  --tw-text-opacity: 1 !important;
  color: rgb(255 255 255 / var(--tw-text-opacity, 1)) !important;
  transition-property: all !important;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1) !important;
  transition-duration: 300ms !important;
}

.wc-block-components-button:hover,
  .woocommerce button.button:hover,
  .woocommerce .button:hover {
  --tw-bg-opacity: 1 !important;
  background-color: rgb(64 64 64 / var(--tw-bg-opacity, 1)) !important;
}

.wc-block-components-button:focus,
  .woocommerce button.button:focus,
  .woocommerce .button:focus {
  --tw-shadow: 0 0 #0000 !important;
  --tw-shadow-colored: 0 0 #0000 !important;
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow) !important;
  outline: 2px solid transparent !important;
  outline-offset: 2px !important;
}

.close-with-icon {
  cursor: pointer;
  background-position: center;
  background-repeat: no-repeat;
  background-size: 80%;
  background-image: url('data:image/svg+xml,<svg viewBox="0 0 15 15" xmlns="http://www.w3.org/2000/svg" class="h-8 w-8"><path fill-rule="evenodd" d="M12.85 2.85c.19-.2.19-.52 0-.71 -.2-.2-.52-.2-.71 0L7.49 6.78 2.84 2.13c-.2-.2-.52-.2-.71 0 -.2.19-.2.51 0 .7l4.64 4.64 -4.65 4.64c-.2.19-.2.51 0 .7 .19.19.51.19.7 0l4.64-4.65 4.64 4.64c.19.19.51.19.7 0 .19-.2.19-.52 0-.71L8.15 7.44l4.64-4.65Z" /></svg>');
}

.close-with-icon.color-dark {
  background-image: url('data:image/svg+xml,<svg viewBox="0 0 15 15" xmlns="http://www.w3.org/2000/svg" class="h-8 w-8" fill="%23FFFFFF"><path fill-rule="evenodd" d="M12.85 2.85c.19-.2.19-.52 0-.71 -.2-.2-.52-.2-.71 0L7.49 6.78 2.84 2.13c-.2-.2-.52-.2-.71 0 -.2.19-.2.51 0 .7l4.64 4.64 -4.65 4.64c-.2.19-.2.51 0 .7 .19.19.51.19.7 0l4.64-4.65 4.64 4.64c.19.19.51.19.7 0 .19-.2.19-.52 0-.71L8.15 7.44l4.64-4.65Z" /></svg>');
}

.bg-chevron {
  background-size: contain;
  background-position: center;
  background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTUiIGhlaWdodD0iMTUiIHZpZXdCb3g9IjAgMCAxNSAxNSIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KICA8cGF0aAogICAgZmlsbC1ydWxlPSJldmVub2RkIgogICAgY2xpcC1ydWxlPSJldmVub2RkIgogICAgZD0iTTYuMTU4NCAzLjEzNTA4QzYuMzU5ODUgMi45NDYyMSA2LjY3NjI3IDIuOTU2NDIgNi44NjUxNCAzLjE1Nzg4TDEwLjYxNTEgNy4xNTc4OEMxMC43OTU0IDcuMzUwMiAxMC43OTU0IDcuNjQ5NDkgMTAuNjE1MSA3Ljg0MTgyTDYuODY1MTQgMTEuODQxOEM2LjY3NjI3IDEyLjA0MzMgNi4zNTk4NSAxMi4wNTM1IDYuMTU4NCAxMS44NjQ2QzUuOTU2OTQgMTEuNjc1NyA1Ljk0NjczIDExLjM1OTMgNi4xMzU2IDExLjE1NzlMOS41NjUgNy40OTk4NUw2LjEzNTYgMy44NDE4MkM1Ljk0NjczIDMuNjQwMzYgNS45NTY5NCAzLjMyMzk0IDYuMTU4NCAzLjEzNTA4WiIKICAgIGZpbGw9ImN1cnJlbnRDb2xvciIKICAvPgo8L3N2Zz4K);
}

.cart-submit-button {
  display: flex !important;
  align-content: center;
  align-items: center;
  justify-content: center;
  gap: 1rem !important;
  .spinner {
    display: none;
  }
  &.is_submitting {
    .spinner {
      display: block;
    }
    .spinner {
      svg {
        /* @apply fill black */
      }
    }
  }
}

.card {
  border-radius: 0.5rem;
  --tw-bg-opacity: 1;
  background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));
  padding: 1rem;
  --tw-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
  --tw-shadow-colored: 0 4px 6px -1px var(--tw-shadow-color), 0 2px 4px -2px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

.card-header {
  margin-bottom: 0.5rem;
  font-size: 1.25rem;
  line-height: 1.75rem;
  font-weight: 700;
}

.card-body {
  --tw-text-opacity: 1;
  color: rgb(75 85 99 / var(--tw-text-opacity, 1));
}

.card-footer {
  margin-top: 1rem;
  border-top-width: 1px;
  --tw-border-opacity: 1;
  border-color: rgb(229 231 235 / var(--tw-border-opacity, 1));
  padding-top: 1rem;
}

.visible {
  visibility: visible;
}

.collapse {
  visibility: collapse;
}

.absolute {
  position: absolute;
}

.relative {
  position: relative;
}

.bottom-2 {
  bottom: 0.5rem;
}

.left-2 {
  left: 0.5rem;
}

.right-2 {
  right: 0.5rem;
}

.top-2 {
  top: 0.5rem;
}

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

.m-0 {
  margin: 0px;
}

.mx-auto {
  margin-left: auto;
  margin-right: auto;
}

.my-1 {
  margin-top: 0.25rem;
  margin-bottom: 0.25rem;
}

.my-1\.5 {
  margin-top: 0.375rem;
  margin-bottom: 0.375rem;
}

.my-10 {
  margin-top: 2.5rem;
  margin-bottom: 2.5rem;
}

.my-2 {
  margin-top: 0.5rem;
  margin-bottom: 0.5rem;
}

.my-4 {
  margin-top: 1rem;
  margin-bottom: 1rem;
}

.my-8 {
  margin-top: 2rem;
  margin-bottom: 2rem;
}

.-ml-1 {
  margin-left: -0.25rem;
}

.mb-2 {
  margin-bottom: 0.5rem;
}

.mb-4 {
  margin-bottom: 1rem;
}

.mb-6 {
  margin-bottom: 1.5rem;
}

.ml-0 {
  margin-left: 0px;
}

.ml-auto {
  margin-left: auto;
}

.mr-2 {
  margin-right: 0.5rem;
}

.mr-3 {
  margin-right: 0.75rem;
}

.mt-10 {
  margin-top: 2.5rem;
}

.mt-2 {
  margin-top: 0.5rem;
}

.mt-4 {
  margin-top: 1rem;
}

.mt-6 {
  margin-top: 1.5rem;
}

.block {
  display: block;
}

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

.\!flex {
  display: flex !important;
}

.flex {
  display: flex;
}

.table {
  display: table;
}

.grid {
  display: grid;
}

.contents {
  display: contents;
}

.hidden {
  display: none;
}

.aspect-square {
  aspect-ratio: 1 / 1;
}

.size-5 {
  width: 1.25rem;
  height: 1.25rem;
}

.h-5 {
  height: 1.25rem;
}

.h-6 {
  height: 1.5rem;
}

.h-7 {
  height: 1.75rem;
}

.h-8 {
  height: 2rem;
}

.h-auto {
  height: auto;
}

.h-full {
  height: 100%;
}

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

.w-5 {
  width: 1.25rem;
}

.w-8 {
  width: 2rem;
}

.w-full {
  width: 100%;
}

.min-w-\[200px\] {
  min-width: 200px;
}

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

.max-w-2xl {
  max-width: 42rem;
}

.max-w-xl {
  max-width: 36rem;
}

.border-collapse {
  border-collapse: collapse;
}

.transform {
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}

@keyframes bounce {
  0%, 100% {
    transform: translateY(-25%);
    animation-timing-function: cubic-bezier(0.8,0,1,1);
  }

  50% {
    transform: none;
    animation-timing-function: cubic-bezier(0,0,0.2,1);
  }
}

.animate-bounce {
  animation: bounce 1s infinite;
}

@keyframes ping {
  75%, 100% {
    transform: scale(2);
    opacity: 0;
  }
}

.animate-ping {
  animation: ping 1s cubic-bezier(0, 0, 0.2, 1) infinite;
}

@keyframes pulse {
  50% {
    opacity: .5;
  }
}

.animate-pulse {
  animation: pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
}

@keyframes spin {
  to {
    transform: rotate(360deg);
  }
}

.animate-spin {
  animation: spin 1s linear infinite;
}

.animate-vibrate {
  animation: vibrate 1s ease-in-out 1;
}

.cursor-default {
  cursor: default;
}

.cursor-pointer {
  cursor: pointer;
}

.resize {
  resize: both;
}

.auto-rows-fr {
  grid-auto-rows: minmax(0, 1fr);
}

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

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

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

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

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

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

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

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

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

.\!gap-4 {
  gap: 1rem !important;
}

.gap-1 {
  gap: 0.25rem;
}

.gap-2 {
  gap: 0.5rem;
}

.gap-4 {
  gap: 1rem;
}

.gap-5 {
  gap: 1.25rem;
}

.gap-6 {
  gap: 1.5rem;
}

.overflow-hidden {
  overflow: hidden;
}

.\!rounded-full {
  border-radius: 9999px !important;
}

.rounded {
  border-radius: 0.25rem;
}

.rounded-full {
  border-radius: 9999px;
}

.rounded-lg {
  border-radius: 0.5rem;
}

.border {
  border-width: 1px;
}

.border-2 {
  border-width: 2px;
}

.border-t {
  border-top-width: 1px;
}

.border-solid {
  border-style: solid;
}

.\!border-neutral-400 {
  --tw-border-opacity: 1 !important;
  border-color: rgb(163 163 163 / var(--tw-border-opacity, 1)) !important;
}

.\!border-neutral-800 {
  --tw-border-opacity: 1 !important;
  border-color: rgb(38 38 38 / var(--tw-border-opacity, 1)) !important;
}

.border-accent {
  --tw-border-opacity: 1;
  border-color: rgb(225 228 60 / var(--tw-border-opacity, 1));
}

.border-neutral-400 {
  --tw-border-opacity: 1;
  border-color: rgb(163 163 163 / var(--tw-border-opacity, 1));
}

.border-neutral-800 {
  --tw-border-opacity: 1;
  border-color: rgb(38 38 38 / var(--tw-border-opacity, 1));
}

.border-transparent {
  border-color: transparent;
}

.\!bg-neutral-800 {
  --tw-bg-opacity: 1 !important;
  background-color: rgb(38 38 38 / var(--tw-bg-opacity, 1)) !important;
}

.bg-accent {
  --tw-bg-opacity: 1;
  background-color: rgb(225 228 60 / var(--tw-bg-opacity, 1));
}

.bg-accent-50 {
  --tw-bg-opacity: 1;
  background-color: rgb(252 252 233 / var(--tw-bg-opacity, 1));
}

.bg-neutral-100 {
  --tw-bg-opacity: 1;
  background-color: rgb(245 245 245 / var(--tw-bg-opacity, 1));
}

.bg-neutral-50 {
  --tw-bg-opacity: 1;
  background-color: rgb(250 250 250 / var(--tw-bg-opacity, 1));
}

.bg-neutral-800 {
  --tw-bg-opacity: 1;
  background-color: rgb(38 38 38 / var(--tw-bg-opacity, 1));
}

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

.bg-white {
  --tw-bg-opacity: 1;
  background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));
}

.bg-yellow-50 {
  --tw-bg-opacity: 1;
  background-color: rgb(254 252 232 / var(--tw-bg-opacity, 1));
}

.bg-contain {
  background-size: contain;
}

.bg-center {
  background-position: center;
}

.bg-no-repeat {
  background-repeat: no-repeat;
}

.p-4 {
  padding: 1rem;
}

.px-1 {
  padding-left: 0.25rem;
  padding-right: 0.25rem;
}

.px-2 {
  padding-left: 0.5rem;
  padding-right: 0.5rem;
}

.px-3 {
  padding-left: 0.75rem;
  padding-right: 0.75rem;
}

.px-4 {
  padding-left: 1rem;
  padding-right: 1rem;
}

.px-6 {
  padding-left: 1.5rem;
  padding-right: 1.5rem;
}

.py-1 {
  padding-top: 0.25rem;
  padding-bottom: 0.25rem;
}

.py-1\.5 {
  padding-top: 0.375rem;
  padding-bottom: 0.375rem;
}

.py-2 {
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
}

.py-3 {
  padding-top: 0.75rem;
  padding-bottom: 0.75rem;
}

.pt-4 {
  padding-top: 1rem;
}

.text-left {
  text-align: left;
}

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

.text-lg {
  font-size: 1.125rem;
  line-height: 1.75rem;
}

.text-sm {
  font-size: 0.875rem;
  line-height: 1.25rem;
}

.text-xl {
  font-size: 1.25rem;
  line-height: 1.75rem;
}

.text-xs {
  font-size: 0.75rem;
  line-height: 1rem;
}

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

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

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

.leading-4 {
  line-height: 1rem;
}

.leading-5 {
  line-height: 1.25rem;
}

.leading-tight {
  line-height: 1.25;
}

.\!text-black {
  --tw-text-opacity: 1 !important;
  color: rgb(0 0 0 / var(--tw-text-opacity, 1)) !important;
}

.\!text-white {
  --tw-text-opacity: 1 !important;
  color: rgb(255 255 255 / var(--tw-text-opacity, 1)) !important;
}

.text-accent {
  --tw-text-opacity: 1;
  color: rgb(225 228 60 / var(--tw-text-opacity, 1));
}

.text-black {
  --tw-text-opacity: 1;
  color: rgb(0 0 0 / var(--tw-text-opacity, 1));
}

.text-neutral-800 {
  --tw-text-opacity: 1;
  color: rgb(38 38 38 / var(--tw-text-opacity, 1));
}

.text-neutral-900 {
  --tw-text-opacity: 1;
  color: rgb(23 23 23 / var(--tw-text-opacity, 1));
}

.text-white {
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity, 1));
}

.underline {
  text-decoration-line: underline;
}

.\!opacity-25 {
  opacity: 0.25 !important;
}

.opacity-25 {
  opacity: 0.25;
}

.opacity-30 {
  opacity: 0.3;
}

.opacity-50 {
  opacity: 0.5;
}

.opacity-75 {
  opacity: 0.75;
}

.opacity-70 {
  opacity: 0.7;
}

.shadow-md {
  --tw-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
  --tw-shadow-colored: 0 4px 6px -1px var(--tw-shadow-color), 0 2px 4px -2px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

.outline {
  outline-style: solid;
}

.outline-1 {
  outline-width: 1px;
}

.outline-2 {
  outline-width: 2px;
}

.outline-accent {
  outline-color: #e1e43c;
}

.outline-accent-100 {
  outline-color: #F8F9D2;
}

.outline-neutral-200 {
  outline-color: #e5e5e5;
}

.outline-neutral-300 {
  outline-color: #d4d4d4;
}

.outline-transparent {
  outline-color: transparent;
}

.outline-yellow-400 {
  outline-color: #facc15;
}

.grayscale {
  --tw-grayscale: grayscale(100%);
  filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
}

.filter {
  filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
}

.\!transition-all {
  transition-property: all !important;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1) !important;
  transition-duration: 150ms !important;
}

.transition-all {
  transition-property: all;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}

.\!duration-300 {
  transition-duration: 300ms !important;
}

.ease-in-out {
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
}

.multiple-product-holder-container,
.multiple-product-add-container,
.products-container {
  display: none;
  &.is-active {
    display: block;
  }
}

.product-toggle.variable-thumb {
  position: relative;
  &.disabled {
    cursor: default;
  }
  &.disabled {
    --tw-bg-opacity: 1 !important;
    background-color: rgb(245 245 245 / var(--tw-bg-opacity, 1)) !important;
  }
  &.disabled:hover {
    outline: 2px solid transparent !important;
    outline-offset: 2px !important;
  }
  &.disabled {
    background-image: none !important;
    & > div,
    & > img {
      opacity: 0.25 !important;
    }
    & > div,
    & > img {
      --tw-grayscale: grayscale(100%);
      filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
    }
    &:after {
      position: absolute;
    }
    &:after {
      left: 0.5rem;
    }
    &:after {
      right: 0.5rem;
    }
    &:after {
      top: 0.5rem;
    }
    &:after {
      bottom: 0.5rem;
    }
    &:after {
      background-size: contain;
    }
    &:after {
      background-position: center;
    }
    &:after {
      background-repeat: no-repeat;
    }
    &:after {
      content: '';
      background-image: url('data:image/svg+xml,<svg width="500" height="132" viewBox="0 0 500 132" fill="none" xmlns="http://www.w3.org/2000/svg"><rect x="1" y="1" width="498" height="129.568" stroke="%23D75C72" stroke-width="2" stroke-dasharray="12 12"/><path d="M168.987 37.688C163.371 37.688 160.371 34.232 160.371 28.952V28.76C160.371 23.552 164.019 20 168.891 20C173.019 20 176.091 22.016 176.499 26.24H172.515C172.227 24.176 171.075 23.072 168.915 23.072C166.203 23.072 164.475 25.184 164.475 28.736V28.928C164.475 32.48 166.107 34.544 168.939 34.544C171.075 34.544 172.563 33.464 172.875 31.256H176.691C176.259 35.504 173.211 37.688 168.987 37.688Z" fill="%23D75C72"/><path d="M187.204 34.592C190.108 34.592 191.932 32.36 191.932 28.904V28.712C191.932 25.376 190.156 23.096 187.156 23.096C184.18 23.096 182.38 25.28 182.38 28.736V28.928C182.38 32.432 184.396 34.592 187.204 34.592ZM187.132 37.688C181.756 37.688 178.324 33.968 178.324 28.952V28.76C178.324 23.648 182.068 20.024 187.156 20.024C192.316 20.024 195.988 23.504 195.988 28.664V28.856C195.988 33.968 192.484 37.688 187.132 37.688Z" fill="%23D75C72"/><path d="M198.805 37.424V20.264H203.941L207.949 30.944L211.909 20.264H216.949V37.424H213.085V25.376L208.333 37.424H207.061L202.285 25.376V37.424H198.805Z" fill="%23D75C72"/><path d="M220.769 37.424V20.264H224.681V37.424H220.769Z" fill="%23D75C72"/><path d="M228.477 37.424V20.264H232.989L239.517 31.568V20.264H242.973V37.424H239.085L231.933 25.208V37.424H228.477Z" fill="%23D75C72"/><path d="M254.513 37.688C248.897 37.688 245.777 34.04 245.777 28.952V28.76C245.777 23.6 249.449 20 254.513 20C258.329 20 261.737 21.752 262.145 26H258.281C257.945 23.984 256.625 23.072 254.561 23.072C251.585 23.072 249.833 25.304 249.833 28.808V29C249.833 32.312 251.249 34.688 254.609 34.688C257.489 34.688 258.665 33.032 258.737 31.064H254.873V28.232H262.577V30.056C262.577 34.64 259.649 37.688 254.513 37.688Z" fill="%23D75C72"/><path d="M276.712 37.688C272.008 37.688 269.848 35.48 269.632 32.048H273.352C273.52 33.584 274.168 34.856 276.712 34.856C278.416 34.856 279.544 33.92 279.544 32.576C279.544 31.208 278.824 30.728 276.304 30.344C271.912 29.768 270.112 28.448 270.112 25.136C270.112 22.208 272.56 20.024 276.352 20.024C280.216 20.024 282.472 21.752 282.784 25.16H279.208C278.968 23.6 278.056 22.88 276.352 22.88C274.648 22.88 273.784 23.672 273.784 24.824C273.784 26.048 274.336 26.624 276.976 27.008C281.128 27.536 283.264 28.664 283.264 32.216C283.264 35.264 280.768 37.688 276.712 37.688Z" fill="%23D75C72"/><path d="M293.938 34.592C296.842 34.592 298.666 32.36 298.666 28.904V28.712C298.666 25.376 296.89 23.096 293.89 23.096C290.914 23.096 289.114 25.28 289.114 28.736V28.928C289.114 32.432 291.13 34.592 293.938 34.592ZM293.866 37.688C288.49 37.688 285.058 33.968 285.058 28.952V28.76C285.058 23.648 288.802 20.024 293.89 20.024C299.05 20.024 302.722 23.504 302.722 28.664V28.856C302.722 33.968 299.218 37.688 293.866 37.688Z" fill="%23D75C72"/><path d="M313.532 34.592C316.436 34.592 318.26 32.36 318.26 28.904V28.712C318.26 25.376 316.484 23.096 313.484 23.096C310.508 23.096 308.708 25.28 308.708 28.736V28.928C308.708 32.432 310.724 34.592 313.532 34.592ZM313.46 37.688C308.084 37.688 304.652 33.968 304.652 28.952V28.76C304.652 23.648 308.396 20.024 313.484 20.024C318.644 20.024 322.316 23.504 322.316 28.664V28.856C322.316 33.968 318.812 37.688 313.46 37.688Z" fill="%23D75C72"/><path d="M325.134 37.424V20.264H329.646L336.174 31.568V20.264H339.63V37.424H335.742L328.59 25.208V37.424H325.134Z" fill="%23D75C72"/><path d="M71.413 111.568C55.733 111.568 48.533 104.208 47.813 92.768H60.213C60.773 97.888 62.933 102.128 71.413 102.128C77.093 102.128 80.853 99.008 80.853 94.528C80.853 89.968 78.453 88.368 70.053 87.088C55.413 85.168 49.413 80.768 49.413 69.728C49.413 59.968 57.573 52.688 70.213 52.688C83.093 52.688 90.613 58.448 91.653 69.808H79.733C78.933 64.608 75.893 62.208 70.213 62.208C64.533 62.208 61.653 64.848 61.653 68.688C61.653 72.768 63.493 74.688 72.293 75.968C86.133 77.728 93.253 81.488 93.253 93.328C93.253 103.488 84.933 111.568 71.413 111.568Z" fill="%23D75C72"/><path d="M128.834 101.248C138.514 101.248 144.594 93.808 144.594 82.288V81.648C144.594 70.528 138.674 62.928 128.674 62.928C118.754 62.928 112.754 70.208 112.754 81.728V82.368C112.754 94.048 119.474 101.248 128.834 101.248ZM128.594 111.568C110.674 111.568 99.2342 99.168 99.2342 82.448V81.808C99.2342 64.768 111.714 52.688 128.674 52.688C145.874 52.688 158.114 64.288 158.114 81.488V82.128C158.114 99.168 146.434 111.568 128.594 111.568Z" fill="%23D75C72"/><path d="M167.507 110.688V53.488H180.467V100.528H203.747V110.688H167.507Z" fill="%23D75C72"/><path d="M225.232 100.608H230.512C242.032 100.608 247.472 94.128 247.472 82.288V81.648C247.472 69.888 242.432 63.568 230.352 63.568H225.232V100.608ZM212.272 110.688V53.488H230.992C251.072 53.488 260.992 64.368 260.992 81.488V82.128C260.992 99.248 250.992 110.688 230.912 110.688H212.272Z" fill="%23D75C72"/><path d="M314.694 101.248C324.374 101.248 330.454 93.808 330.454 82.288V81.648C330.454 70.528 324.534 62.928 314.534 62.928C304.614 62.928 298.614 70.208 298.614 81.728V82.368C298.614 94.048 305.334 101.248 314.694 101.248ZM314.454 111.568C296.534 111.568 285.094 99.168 285.094 82.448V81.808C285.094 64.768 297.574 52.688 314.534 52.688C331.734 52.688 343.974 64.288 343.974 81.488V82.128C343.974 99.168 332.294 111.568 314.454 111.568Z" fill="%23D75C72"/><path d="M376.486 111.568C361.446 111.568 352.886 103.568 352.886 88.368V53.488H365.926V87.568C365.926 97.088 368.726 101.248 376.566 101.248C384.246 101.248 387.606 97.568 387.606 87.088V53.488H400.646V87.888C400.646 103.488 391.926 111.568 376.486 111.568Z" fill="%23D75C72"/><path d="M423.707 110.688V63.568H408.267V53.488H452.187V63.568H436.747V110.688H423.707Z" fill="%23D75C72"/></svg>');
    }
  }
}

.hover\:\!border-neutral-400:hover {
  --tw-border-opacity: 1 !important;
  border-color: rgb(163 163 163 / var(--tw-border-opacity, 1)) !important;
}

.hover\:border-accent-200:hover {
  --tw-border-opacity: 1;
  border-color: rgb(241 243 165 / var(--tw-border-opacity, 1));
}

.hover\:\!bg-neutral-100:hover {
  --tw-bg-opacity: 1 !important;
  background-color: rgb(245 245 245 / var(--tw-bg-opacity, 1)) !important;
}

.hover\:\!bg-neutral-700:hover {
  --tw-bg-opacity: 1 !important;
  background-color: rgb(64 64 64 / var(--tw-bg-opacity, 1)) !important;
}

.hover\:bg-accent-200:hover {
  --tw-bg-opacity: 1;
  background-color: rgb(241 243 165 / var(--tw-bg-opacity, 1));
}

.hover\:bg-neutral-100:hover {
  --tw-bg-opacity: 1;
  background-color: rgb(245 245 245 / var(--tw-bg-opacity, 1));
}

.hover\:bg-neutral-200:hover {
  --tw-bg-opacity: 1;
  background-color: rgb(229 229 229 / var(--tw-bg-opacity, 1));
}

.hover\:bg-neutral-400:hover {
  --tw-bg-opacity: 1;
  background-color: rgb(163 163 163 / var(--tw-bg-opacity, 1));
}

.hover\:bg-neutral-700:hover {
  --tw-bg-opacity: 1;
  background-color: rgb(64 64 64 / var(--tw-bg-opacity, 1));
}

.hover\:opacity-100:hover {
  opacity: 1;
}

.hover\:\!outline-none:hover {
  outline: 2px solid transparent !important;
  outline-offset: 2px !important;
}

.hover\:outline-neutral-400:hover {
  outline-color: #a3a3a3;
}

.focus\:\!shadow-none:focus {
  --tw-shadow: 0 0 #0000 !important;
  --tw-shadow-colored: 0 0 #0000 !important;
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow) !important;
}

.focus\:\!outline-none:focus {
  outline: 2px solid transparent !important;
  outline-offset: 2px !important;
}

@media (min-width: 768px) {
  .md\:grid-cols-2 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .md\:grid-cols-3 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .md\:gap-5 {
    gap: 1.25rem;
  }

  .md\:px-4 {
    padding-left: 1rem;
    padding-right: 1rem;
  }
}

@media (min-width: 1024px) {
  .lg\:grid-cols-4 {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }

  .lg\:gap-4 {
    gap: 1rem;
  }

  .lg\:py-3 {
    padding-top: 0.75rem;
    padding-bottom: 0.75rem;
  }
}