.md-featured-sub-categories {
  /*
  Add the correct text decoration in Chrome, Edge, and Safari.
  */
  /*
  Remove the default font size and weight for headings.
  */
  /*
  Reset links to optimize for opt-in styling instead of opt-out.
  */
  /*
  Add the correct font weight in Edge and Safari.
  */
  /*
  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.
  */
  /*
  Add the correct font size in all browsers.
  */
  /*
  Prevent `sub` and `sup` elements from affecting the line height in all browsers.
  */
  /*
  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.
  */
  /*
  1. Change the font styles in all browsers.
  2. Remove the margin in Firefox and Safari.
  3. Remove default padding in all browsers.
  */
  /*
  Remove the inheritance of text transform in Edge and Firefox.
  */
  /*
  1. Correct the inability to style clickable types in iOS and Safari.
  2. Remove default button styles.
  */
  /*
  Use the modern Firefox focus style for all focusable elements.
  */
  /*
  Remove the additional `:invalid` styles in Firefox. (https://github.com/mozilla/gecko-dev/blob/2f9eacd9d3d995c937b4251a5557d95d494c9be1/layout/style/res/forms.css#L728-L737)
  */
  /*
  Add the correct vertical alignment in Chrome and Firefox.
  */
  /*
  Correct the cursor style of increment and decrement buttons in Safari.
  */
  /*
  1. Correct the odd appearance in Chrome and Safari.
  2. Correct the outline style in Safari.
  */
  /*
  Remove the inner padding in Chrome and Safari on macOS.
  */
  /*
  1. Correct the inability to style clickable types in iOS and Safari.
  2. Change font properties to `inherit` in Safari.
  */
  /*
  Add the correct display in Chrome and Safari.
  */
  /*
  Removes the default spacing for appropriate elements.
  */
  /*
  Prevent resizing textareas horizontally by default.
  */
  /*
  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.
  */
  /*
  Set the default cursor for buttons.
  */
  /*
  Make sure disabled buttons don't get the pointer cursor.
  */
  /*
  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.
  */
  /*
  Constrain images and videos to the parent width and preserve their intrinsic aspect ratio. (https://github.com/mozdevs/cssremedy/issues/14)
  */
  /*
  Make elements with the HTML hidden attribute stay hidden by default.
  */
  padding: 0.75rem 1rem;
  display: flex;
  max-width: fill;
  max-width: -webkit-fill-available;
  flex-direction: column;
  background-color: #f5f5f5;
}
.md-featured-sub-categories *,
.md-featured-sub-categories ::before,
.md-featured-sub-categories ::after {
  box-sizing: border-box; /* 1 */
  border-width: 0; /* 2 */
  border-style: solid; /* 2 */
  border-color: theme("borderColor.DEFAULT", currentColor); /* 2 */
}
.md-featured-sub-categories hr {
  height: 0; /* 1 */
  color: inherit; /* 2 */
  border-top-width: 1px; /* 3 */
}
.md-featured-sub-categories abbr:where([title]) {
  text-decoration: underline dotted;
}
.md-featured-sub-categories h1,
.md-featured-sub-categories h2,
.md-featured-sub-categories h3,
.md-featured-sub-categories h4,
.md-featured-sub-categories h5,
.md-featured-sub-categories h6 {
  font-size: inherit;
  font-weight: inherit;
}
.md-featured-sub-categories a {
  color: inherit;
  text-decoration: inherit;
}
.md-featured-sub-categories b,
.md-featured-sub-categories strong {
  font-weight: bolder;
}
.md-featured-sub-categories code,
.md-featured-sub-categories kbd,
.md-featured-sub-categories samp,
.md-featured-sub-categories pre {
  font-family: theme("fontFamily.mono", ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace); /* 1 */
  font-feature-settings: theme("fontFamily.mono[1].fontFeatureSettings", normal); /* 2 */
  font-variation-settings: theme("fontFamily.mono[1].fontVariationSettings", normal); /* 3 */
  font-size: 1em; /* 4 */
}
.md-featured-sub-categories small {
  font-size: 80%;
}
.md-featured-sub-categories sub,
.md-featured-sub-categories sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}
.md-featured-sub-categories sub {
  bottom: -0.25em;
}
.md-featured-sub-categories sup {
  top: -0.5em;
}
.md-featured-sub-categories table {
  text-indent: 0; /* 1 */
  border-color: inherit; /* 2 */
  border-collapse: collapse; /* 3 */
}
.md-featured-sub-categories button,
.md-featured-sub-categories input,
.md-featured-sub-categories optgroup,
.md-featured-sub-categories select,
.md-featured-sub-categories 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 */
  color: inherit; /* 1 */
  margin: 0; /* 2 */
  padding: 0; /* 3 */
}
.md-featured-sub-categories button,
.md-featured-sub-categories select {
  text-transform: none;
}
.md-featured-sub-categories button,
.md-featured-sub-categories [type=button],
.md-featured-sub-categories [type=reset],
.md-featured-sub-categories [type=submit] {
  -webkit-appearance: button; /* 1 */
  background-color: transparent; /* 2 */
  background-image: none; /* 2 */
}
.md-featured-sub-categories :-moz-focusring {
  outline: auto;
}
.md-featured-sub-categories :-moz-ui-invalid {
  box-shadow: none;
}
.md-featured-sub-categories progress {
  vertical-align: baseline;
}
.md-featured-sub-categories ::-webkit-inner-spin-button,
.md-featured-sub-categories ::-webkit-outer-spin-button {
  height: auto;
}
.md-featured-sub-categories [type=search] {
  -webkit-appearance: textfield; /* 1 */
  outline-offset: -2px; /* 2 */
}
.md-featured-sub-categories ::-webkit-search-decoration {
  -webkit-appearance: none;
}
.md-featured-sub-categories ::-webkit-file-upload-button {
  -webkit-appearance: button; /* 1 */
  font: inherit; /* 2 */
}
.md-featured-sub-categories summary {
  display: list-item;
}
.md-featured-sub-categories blockquote,
.md-featured-sub-categories dl,
.md-featured-sub-categories dd,
.md-featured-sub-categories h1,
.md-featured-sub-categories h2,
.md-featured-sub-categories h3,
.md-featured-sub-categories h4,
.md-featured-sub-categories h5,
.md-featured-sub-categories h6,
.md-featured-sub-categories hr,
.md-featured-sub-categories figure,
.md-featured-sub-categories p,
.md-featured-sub-categories pre {
  margin: 0;
}
.md-featured-sub-categories fieldset {
  margin: 0;
  padding: 0;
}
.md-featured-sub-categories legend {
  padding: 0;
}
.md-featured-sub-categories ol,
.md-featured-sub-categories ul,
.md-featured-sub-categories menu {
  list-style: none;
  margin: 0;
  padding: 0;
}
.md-featured-sub-categories dialog {
  padding: 0;
}
.md-featured-sub-categories textarea {
  resize: vertical;
}
.md-featured-sub-categories input::placeholder,
.md-featured-sub-categories textarea::placeholder {
  opacity: 1; /* 1 */
  color: theme("colors.gray.400", #9ca3af); /* 2 */
}
.md-featured-sub-categories button,
.md-featured-sub-categories [role=button] {
  cursor: pointer;
}
.md-featured-sub-categories :disabled {
  cursor: default;
}
.md-featured-sub-categories img,
.md-featured-sub-categories svg,
.md-featured-sub-categories video,
.md-featured-sub-categories canvas,
.md-featured-sub-categories audio,
.md-featured-sub-categories iframe,
.md-featured-sub-categories embed,
.md-featured-sub-categories object {
  display: block; /* 1 */
  vertical-align: middle; /* 2 */
}
.md-featured-sub-categories img,
.md-featured-sub-categories video {
  max-width: 100%;
  height: auto;
}
.md-featured-sub-categories [hidden] {
  display: none;
}
.md-featured-sub-categories svg {
  display: inline-block;
  height: 1em;
  width: 1em;
  vertical-align: middle;
  line-height: 1em;
}
.md-featured-sub-categories .flex-spacer {
  flex: 1;
}
@media (min-width: 1280px) {
  .md-featured-sub-categories {
    padding: 1.5rem 2rem;
  }
}
.md-featured-sub-categories .title {
  font-family: "Inter";
  font-size: 1rem;
  font-weight: 500;
  margin: 0;
  padding-bottom: 0.5rem;
}
.md-featured-sub-categories .list {
  display: flex;
  overflow-x: auto;
  flex-wrap: nowrap;
  position: relative;
  mask-image: linear-gradient(to right, rgb(0, 0, 0) 75%, rgba(0, 0, 0, 0));
  gap: 0.5rem;
}
@media (min-width: 640px) {
  .md-featured-sub-categories .list {
    flex-wrap: wrap;
    overflow-x: none;
    mask: unset;
  }
}
.md-featured-sub-categories .list-item {
  flex: 0 0 auto;
  display: flex;
  gap: 0.25rem;
  background-color: #fff;
  padding: 0.25rem 0.5rem;
  border-radius: 9999px;
  border: 1px solid #e5e5e5;
  position: relative;
  align-items: center;
}
@media (min-width: 640px) {
  .md-featured-sub-categories .list-item {
    padding: 0.5rem 1rem;
  }
}
.md-featured-sub-categories .list-item img {
  border-radius: 9999px;
  width: 32px;
  height: 32px;
  object-fit: cover;
}
.md-featured-sub-categories .list-item a {
  text-decoration: none;
  font-size: 0.9rem;
  font-weight: 500;
  flex: 1;
}
.md-featured-sub-categories .list-item a::after {
  content: "";
  position: absolute;
  overflow: hidden;
  inset: 0;
}

.md-products {
  /*
  Add the correct text decoration in Chrome, Edge, and Safari.
  */
  /*
  Remove the default font size and weight for headings.
  */
  /*
  Reset links to optimize for opt-in styling instead of opt-out.
  */
  /*
  Add the correct font weight in Edge and Safari.
  */
  /*
  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.
  */
  /*
  Add the correct font size in all browsers.
  */
  /*
  Prevent `sub` and `sup` elements from affecting the line height in all browsers.
  */
  /*
  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.
  */
  /*
  1. Change the font styles in all browsers.
  2. Remove the margin in Firefox and Safari.
  3. Remove default padding in all browsers.
  */
  /*
  Remove the inheritance of text transform in Edge and Firefox.
  */
  /*
  1. Correct the inability to style clickable types in iOS and Safari.
  2. Remove default button styles.
  */
  /*
  Use the modern Firefox focus style for all focusable elements.
  */
  /*
  Remove the additional `:invalid` styles in Firefox. (https://github.com/mozilla/gecko-dev/blob/2f9eacd9d3d995c937b4251a5557d95d494c9be1/layout/style/res/forms.css#L728-L737)
  */
  /*
  Add the correct vertical alignment in Chrome and Firefox.
  */
  /*
  Correct the cursor style of increment and decrement buttons in Safari.
  */
  /*
  1. Correct the odd appearance in Chrome and Safari.
  2. Correct the outline style in Safari.
  */
  /*
  Remove the inner padding in Chrome and Safari on macOS.
  */
  /*
  1. Correct the inability to style clickable types in iOS and Safari.
  2. Change font properties to `inherit` in Safari.
  */
  /*
  Add the correct display in Chrome and Safari.
  */
  /*
  Removes the default spacing for appropriate elements.
  */
  /*
  Prevent resizing textareas horizontally by default.
  */
  /*
  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.
  */
  /*
  Set the default cursor for buttons.
  */
  /*
  Make sure disabled buttons don't get the pointer cursor.
  */
  /*
  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.
  */
  /*
  Constrain images and videos to the parent width and preserve their intrinsic aspect ratio. (https://github.com/mozdevs/cssremedy/issues/14)
  */
  /*
  Make elements with the HTML hidden attribute stay hidden by default.
  */
  padding: 0.75rem 1rem;
  background-color: #f5f5f5;
  display: flex;
  flex-direction: column;
  gap: 1rem;
}
.md-products *,
.md-products ::before,
.md-products ::after {
  box-sizing: border-box; /* 1 */
  border-width: 0; /* 2 */
  border-style: solid; /* 2 */
  border-color: theme("borderColor.DEFAULT", currentColor); /* 2 */
}
.md-products hr {
  height: 0; /* 1 */
  color: inherit; /* 2 */
  border-top-width: 1px; /* 3 */
}
.md-products abbr:where([title]) {
  text-decoration: underline dotted;
}
.md-products h1,
.md-products h2,
.md-products h3,
.md-products h4,
.md-products h5,
.md-products h6 {
  font-size: inherit;
  font-weight: inherit;
}
.md-products a {
  color: inherit;
  text-decoration: inherit;
}
.md-products b,
.md-products strong {
  font-weight: bolder;
}
.md-products code,
.md-products kbd,
.md-products samp,
.md-products pre {
  font-family: theme("fontFamily.mono", ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace); /* 1 */
  font-feature-settings: theme("fontFamily.mono[1].fontFeatureSettings", normal); /* 2 */
  font-variation-settings: theme("fontFamily.mono[1].fontVariationSettings", normal); /* 3 */
  font-size: 1em; /* 4 */
}
.md-products small {
  font-size: 80%;
}
.md-products sub,
.md-products sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}
.md-products sub {
  bottom: -0.25em;
}
.md-products sup {
  top: -0.5em;
}
.md-products table {
  text-indent: 0; /* 1 */
  border-color: inherit; /* 2 */
  border-collapse: collapse; /* 3 */
}
.md-products button,
.md-products input,
.md-products optgroup,
.md-products select,
.md-products 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 */
  color: inherit; /* 1 */
  margin: 0; /* 2 */
  padding: 0; /* 3 */
}
.md-products button,
.md-products select {
  text-transform: none;
}
.md-products button,
.md-products [type=button],
.md-products [type=reset],
.md-products [type=submit] {
  -webkit-appearance: button; /* 1 */
  background-color: transparent; /* 2 */
  background-image: none; /* 2 */
}
.md-products :-moz-focusring {
  outline: auto;
}
.md-products :-moz-ui-invalid {
  box-shadow: none;
}
.md-products progress {
  vertical-align: baseline;
}
.md-products ::-webkit-inner-spin-button,
.md-products ::-webkit-outer-spin-button {
  height: auto;
}
.md-products [type=search] {
  -webkit-appearance: textfield; /* 1 */
  outline-offset: -2px; /* 2 */
}
.md-products ::-webkit-search-decoration {
  -webkit-appearance: none;
}
.md-products ::-webkit-file-upload-button {
  -webkit-appearance: button; /* 1 */
  font: inherit; /* 2 */
}
.md-products summary {
  display: list-item;
}
.md-products blockquote,
.md-products dl,
.md-products dd,
.md-products h1,
.md-products h2,
.md-products h3,
.md-products h4,
.md-products h5,
.md-products h6,
.md-products hr,
.md-products figure,
.md-products p,
.md-products pre {
  margin: 0;
}
.md-products fieldset {
  margin: 0;
  padding: 0;
}
.md-products legend {
  padding: 0;
}
.md-products ol,
.md-products ul,
.md-products menu {
  list-style: none;
  margin: 0;
  padding: 0;
}
.md-products dialog {
  padding: 0;
}
.md-products textarea {
  resize: vertical;
}
.md-products input::placeholder,
.md-products textarea::placeholder {
  opacity: 1; /* 1 */
  color: theme("colors.gray.400", #9ca3af); /* 2 */
}
.md-products button,
.md-products [role=button] {
  cursor: pointer;
}
.md-products :disabled {
  cursor: default;
}
.md-products img,
.md-products svg,
.md-products video,
.md-products canvas,
.md-products audio,
.md-products iframe,
.md-products embed,
.md-products object {
  display: block; /* 1 */
  vertical-align: middle; /* 2 */
}
.md-products img,
.md-products video {
  max-width: 100%;
  height: auto;
}
.md-products [hidden] {
  display: none;
}
.md-products svg {
  display: inline-block;
  height: 1em;
  width: 1em;
  vertical-align: middle;
  line-height: 1em;
}
.md-products .flex-spacer {
  flex: 1;
}
@media (min-width: 1280px) {
  .md-products {
    padding: 1.5rem 2rem;
  }
}
@media (min-width: 640px) {
  .md-products {
    flex-direction: row;
  }
}
.md-products .filter-shortcuts {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  padding-bottom: 1rem;
}
.md-products .filter-shortcuts .filter-shortcut-remove {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0.25rem 0.5rem;
  font-weight: 500;
  border: 1px solid #e5e5e5;
  background-color: #e5e5e5;
  gap: 0.5rem;
  color: black;
  font-size: 0.875rem;
}
.md-products .filter-shortcuts .filter-shortcut-remove:hover {
  filter: brightness(0.95);
}
.md-products .filter-shortcuts .filter-shortcut-remove div {
  display: flex;
  align-items: center;
  gap: 0.125rem;
}
.md-products .filter-shortcuts .filter-shortcut-reset {
  align-items: center;
  justify-content: center;
  padding: 0.25rem 0.5rem;
  gap: 0.5rem;
  color: #2e2ee5;
  font-size: 0.875rem;
}
.md-products .filter-shortcuts .filter-shortcut-reset:hover {
  text-decoration: underline;
}
.md-products h3 {
  font-weight: 600;
  font-family: Inter, Helvetica, sans-serif;
  font-size: 1.2rem;
  padding-bottom: 0.75rem;
}
.md-products .filters {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  font-family: Inter, Helvetica, sans-serif;
}
@media (min-width: 1280px) {
  .md-products .filters {
    width: 18rem;
  }
}
.md-products .filters:not(.open) > :not(h3, .search-field, .actions) {
  display: none;
}
@media (min-width: 640px) {
  .md-products .filters {
    width: 18rem;
  }
  .md-products .filters:not(.open) > :not(h3, .search-field, .actions) {
    display: initial;
  }
}
.md-products .filters input[type=text] {
  background-color: #fff;
  border: 1px solid #e5e5e5;
  width: 100%;
  padding: 0.3rem 0.7rem;
}
.md-products .filters input[type=text]::placeholder {
  color: #a3a3a3;
}
.md-products .filters input[type=text]:focus-visible {
  outline-color: #2e2ee5;
}
.md-products .filters hr {
  border-color: #d4d4d4;
}
.md-products .filters fieldset legend {
  font-size: 1rem;
  font-weight: 500;
  padding-bottom: 0.5rem;
}
.md-products .filters .form-radio label {
  padding-left: 0.5rem;
}
.md-products .filters .form-radio.user-reviews {
  display: flex;
  align-items: center;
}
.md-products .filters .form-radio.user-reviews label {
  display: inline-flex;
  flex-direction: row;
  align-items: center;
}
.md-products .filters .field-group {
  display: flex;
  flex-direction: column;
  gap: 0.125rem;
}
.md-products .filters .field-group.large-gap {
  gap: 0.25rem;
}
.md-products .filters .form-subcategories {
  padding-left: 0.75rem;
  display: none;
}
.md-products .filters .form-subcategories.visible {
  display: block;
}
.md-products .filters .form-input {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.md-products .filters .form-input button {
  width: 2rem;
  display: flex;
  justify-content: center;
  align-items: center;
  height: 1.5rem;
  color: black !important;
}
.md-products .filters .form-input button:hover {
  background-color: rgba(0, 0, 0, 0.1);
}
.md-products .filters .form-input button svg {
  font-size: 1.2rem;
  transition: transform 0.2s ease;
}
.md-products .filters .form-input button.open svg {
  transform: rotate(90deg);
}
.md-products .filters .form-checkbox {
  display: flex;
  align-items: center;
}
.md-products .filters .form-checkbox label {
  padding-left: 0.5rem;
  overflow: hidden;
}
.md-products .filters .actions {
  position: sticky;
  position: -webkit-sticky;
  bottom: 10px;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}
.md-products .filters .actions button,
.md-products .filters .actions .reset-filter {
  background-color: #fff;
  color: black !important;
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.2rem;
  padding: 0.5rem 1rem;
  border: 1px solid #e5e5e5;
  color: black !important;
  font-weight: 500;
}
.md-products .filters .actions button#md-more-filters,
.md-products .filters .actions .reset-filter#md-more-filters {
  padding: 0.25rem 0.5rem;
  font-size: 0.75rem;
}
@media (min-width: 640px) {
  .md-products .filters .actions button#md-more-filters,
  .md-products .filters .actions .reset-filter#md-more-filters {
    display: none;
  }
}
.md-products .filters .actions button:hover,
.md-products .filters .actions .reset-filter:hover {
  background-color: #e5e5e5;
}
.md-products .filters .actions button[type=submit],
.md-products .filters .actions .reset-filter[type=submit] {
  background-color: #2e2ee5;
  border-color: #2e2ee5;
  color: white !important;
}
.md-products .filters .actions button[type=submit]:hover,
.md-products .filters .actions .reset-filter[type=submit]:hover {
  background-color: #1919c7;
}
.md-products .products {
  flex: 1;
}
.md-products .products .no-result {
  display: flex;
  padding: 4rem 2rem;
  font-size: 1.5rem;
  font-weight: 500;
  align-items: center;
  justify-content: center;
  color: #737373;
  flex: 1;
}
@media (min-width: 1280px) {
  .md-products .products .no-result {
    font-size: 2rem;
  }
}
.md-products .products .product-list {
  display: grid;
  gap: 0.125rem;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
@media (min-width: 1024px) {
  .md-products .products .product-list {
    gap: 0.75rem;
    grid-template-columns: repeat(auto-fill, minmax(min(15rem, 100%), 1fr));
  }
}
.md-products .products .pagination {
  padding: 1rem 0;
  display: flex;
  flex-direction: row;
  gap: 0.5rem;
  align-items: center;
  justify-content: center;
}
.md-products .products .pagination .mobile:not(.page-current) {
  display: none;
}
@media (min-width: 640px) {
  .md-products .products .pagination .mobile:not(.page-current) {
    display: inherit;
  }
}
.md-products .products .pagination p {
  font-size: 0.875rem;
}
.md-products .products .pagination a {
  height: 2rem;
  padding: 0 0.6rem;
  font-size: 1.2rem;
  display: flex;
  justify-content: center;
  align-items: center;
  border: 1px solid #e5e5e5;
}
.md-products .products .pagination a.page {
  background-color: white;
}
.md-products .products .pagination a.page.page-current {
  border-color: black;
}
.md-products .products .pagination a:hover {
  background-color: #e5e5e5;
}

.average-rating {
  display: flex;
  gap: 0.125rem;
  align-items: center;
  font-weight: 600;
  font-size: 0.9rem;
}
.average-rating svg {
  color: #eab308;
}

.price-and-badge {
  display: flex;
  flex-direction: row;
  gap: 0.2rem;
  justify-content: space-between;
  justify-items: center;
  align-items: space;
}

.md-badge {
  position: absolute;
  top: 0px;
  left: 0px;
  width: fit-content;
  padding: 0.25rem 0.5rem;
  background-color: #e0f2fe;
  color: #0284c7;
  font-size: 0.7rem;
  border-radius: 0.5rem;
  cursor: default;
}
.md-badge.green {
  background-color: #dcfce7;
  color: #15803d;
}
.md-badge.red {
  background-color: #fecaca;
  color: #b91c1c;
}
.md-badge .md-badge-tooltip {
  visibility: hidden;
  width: 12rem;
  z-index: 2000;
  position: absolute;
  background-color: #fff;
  top: calc(100% + 0.25rem);
  left: 0;
  border-radius: 0.5rem;
  padding: 0.25rem 0.5rem;
  color: #000;
  font-size: 0.75rem;
  font-weight: 500;
  box-shadow: 0px 10px 14px -3px rgba(0, 0, 0, 0.24);
  border: 1px solid #e5e5e5;
  opacity: 0;
  transition: opacity 0.3s;
}
.md-badge:hover .md-badge-tooltip {
  visibility: visible;
  opacity: 1;
}

.md-product-card {
  /*
  Add the correct text decoration in Chrome, Edge, and Safari.
  */
  /*
  Remove the default font size and weight for headings.
  */
  /*
  Reset links to optimize for opt-in styling instead of opt-out.
  */
  /*
  Add the correct font weight in Edge and Safari.
  */
  /*
  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.
  */
  /*
  Add the correct font size in all browsers.
  */
  /*
  Prevent `sub` and `sup` elements from affecting the line height in all browsers.
  */
  /*
  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.
  */
  /*
  1. Change the font styles in all browsers.
  2. Remove the margin in Firefox and Safari.
  3. Remove default padding in all browsers.
  */
  /*
  Remove the inheritance of text transform in Edge and Firefox.
  */
  /*
  1. Correct the inability to style clickable types in iOS and Safari.
  2. Remove default button styles.
  */
  /*
  Use the modern Firefox focus style for all focusable elements.
  */
  /*
  Remove the additional `:invalid` styles in Firefox. (https://github.com/mozilla/gecko-dev/blob/2f9eacd9d3d995c937b4251a5557d95d494c9be1/layout/style/res/forms.css#L728-L737)
  */
  /*
  Add the correct vertical alignment in Chrome and Firefox.
  */
  /*
  Correct the cursor style of increment and decrement buttons in Safari.
  */
  /*
  1. Correct the odd appearance in Chrome and Safari.
  2. Correct the outline style in Safari.
  */
  /*
  Remove the inner padding in Chrome and Safari on macOS.
  */
  /*
  1. Correct the inability to style clickable types in iOS and Safari.
  2. Change font properties to `inherit` in Safari.
  */
  /*
  Add the correct display in Chrome and Safari.
  */
  /*
  Removes the default spacing for appropriate elements.
  */
  /*
  Prevent resizing textareas horizontally by default.
  */
  /*
  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.
  */
  /*
  Set the default cursor for buttons.
  */
  /*
  Make sure disabled buttons don't get the pointer cursor.
  */
  /*
  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.
  */
  /*
  Constrain images and videos to the parent width and preserve their intrinsic aspect ratio. (https://github.com/mozdevs/cssremedy/issues/14)
  */
  /*
  Make elements with the HTML hidden attribute stay hidden by default.
  */
  background-color: #fff;
  padding: 0.75rem;
  border-radius: 0.75rem;
  border: 1px solid #e5e5e5 !important;
  display: flex;
  flex: 1;
  flex-direction: column;
  gap: 0.5rem;
  position: relative;
  overflow: hidden;
}
.md-product-card *,
.md-product-card ::before,
.md-product-card ::after {
  box-sizing: border-box; /* 1 */
  border-width: 0; /* 2 */
  border-style: solid; /* 2 */
  border-color: theme("borderColor.DEFAULT", currentColor); /* 2 */
}
.md-product-card hr {
  height: 0; /* 1 */
  color: inherit; /* 2 */
  border-top-width: 1px; /* 3 */
}
.md-product-card abbr:where([title]) {
  text-decoration: underline dotted;
}
.md-product-card h1,
.md-product-card h2,
.md-product-card h3,
.md-product-card h4,
.md-product-card h5,
.md-product-card h6 {
  font-size: inherit;
  font-weight: inherit;
}
.md-product-card a {
  color: inherit;
  text-decoration: inherit;
}
.md-product-card b,
.md-product-card strong {
  font-weight: bolder;
}
.md-product-card code,
.md-product-card kbd,
.md-product-card samp,
.md-product-card pre {
  font-family: theme("fontFamily.mono", ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace); /* 1 */
  font-feature-settings: theme("fontFamily.mono[1].fontFeatureSettings", normal); /* 2 */
  font-variation-settings: theme("fontFamily.mono[1].fontVariationSettings", normal); /* 3 */
  font-size: 1em; /* 4 */
}
.md-product-card small {
  font-size: 80%;
}
.md-product-card sub,
.md-product-card sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}
.md-product-card sub {
  bottom: -0.25em;
}
.md-product-card sup {
  top: -0.5em;
}
.md-product-card table {
  text-indent: 0; /* 1 */
  border-color: inherit; /* 2 */
  border-collapse: collapse; /* 3 */
}
.md-product-card button,
.md-product-card input,
.md-product-card optgroup,
.md-product-card select,
.md-product-card 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 */
  color: inherit; /* 1 */
  margin: 0; /* 2 */
  padding: 0; /* 3 */
}
.md-product-card button,
.md-product-card select {
  text-transform: none;
}
.md-product-card button,
.md-product-card [type=button],
.md-product-card [type=reset],
.md-product-card [type=submit] {
  -webkit-appearance: button; /* 1 */
  background-color: transparent; /* 2 */
  background-image: none; /* 2 */
}
.md-product-card :-moz-focusring {
  outline: auto;
}
.md-product-card :-moz-ui-invalid {
  box-shadow: none;
}
.md-product-card progress {
  vertical-align: baseline;
}
.md-product-card ::-webkit-inner-spin-button,
.md-product-card ::-webkit-outer-spin-button {
  height: auto;
}
.md-product-card [type=search] {
  -webkit-appearance: textfield; /* 1 */
  outline-offset: -2px; /* 2 */
}
.md-product-card ::-webkit-search-decoration {
  -webkit-appearance: none;
}
.md-product-card ::-webkit-file-upload-button {
  -webkit-appearance: button; /* 1 */
  font: inherit; /* 2 */
}
.md-product-card summary {
  display: list-item;
}
.md-product-card blockquote,
.md-product-card dl,
.md-product-card dd,
.md-product-card h1,
.md-product-card h2,
.md-product-card h3,
.md-product-card h4,
.md-product-card h5,
.md-product-card h6,
.md-product-card hr,
.md-product-card figure,
.md-product-card p,
.md-product-card pre {
  margin: 0;
}
.md-product-card fieldset {
  margin: 0;
  padding: 0;
}
.md-product-card legend {
  padding: 0;
}
.md-product-card ol,
.md-product-card ul,
.md-product-card menu {
  list-style: none;
  margin: 0;
  padding: 0;
}
.md-product-card dialog {
  padding: 0;
}
.md-product-card textarea {
  resize: vertical;
}
.md-product-card input::placeholder,
.md-product-card textarea::placeholder {
  opacity: 1; /* 1 */
  color: theme("colors.gray.400", #9ca3af); /* 2 */
}
.md-product-card button,
.md-product-card [role=button] {
  cursor: pointer;
}
.md-product-card :disabled {
  cursor: default;
}
.md-product-card img,
.md-product-card svg,
.md-product-card video,
.md-product-card canvas,
.md-product-card audio,
.md-product-card iframe,
.md-product-card embed,
.md-product-card object {
  display: block; /* 1 */
  vertical-align: middle; /* 2 */
}
.md-product-card img,
.md-product-card video {
  max-width: 100%;
  height: auto;
}
.md-product-card [hidden] {
  display: none;
}
.md-product-card svg {
  display: inline-block;
  height: 1em;
  width: 1em;
  vertical-align: middle;
  line-height: 1em;
}
.md-product-card .flex-spacer {
  flex: 1;
}
.md-product-card .md-tag {
  position: absolute;
  top: 0px;
  right: 0px;
}
.md-product-card .md-tag .md-tag-tooltip {
  visibility: hidden;
  width: 12rem;
  z-index: 2000;
  position: absolute;
  background-color: #fff;
  top: calc(100% + 0.25rem);
  right: 0;
  border-radius: 0.5rem;
  padding: 0.25rem 0.5rem;
  color: #000;
  font-size: 0.75rem;
  font-weight: 500;
  box-shadow: 0px 10px 14px -3px rgba(0, 0, 0, 0.24);
  border: 1px solid #e5e5e5;
  opacity: 0;
  transition: opacity 0.3s;
}
.md-product-card .md-tag:hover .md-tag-tooltip {
  visibility: visible;
  opacity: 1;
}
.md-product-card img {
  aspect-ratio: 1/1;
  width: 100%;
  padding: 0.75rem;
  text-wrap: wrap;
  font-size: 0.5rem;
}
.md-product-card a {
  flex: 1;
}
.md-product-card .top-left {
  position: absolute;
  top: 0.75rem;
  left: 0.75rem;
}
.md-product-card .content {
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 0.5rem;
}
.md-product-card .content .content-top {
  position: relative;
}
.md-product-card .content .title {
  overflow: hidden;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  flex: 1 1 auto;
  font-size: 0.9rem;
}
.md-product-card .content .price {
  font-weight: 700;
  font-size: 1.5rem;
  color: #000;
  padding: 0;
}
.md-product-card .content .best-price {
  font-size: 0.8rem;
  color: #525252;
}
.md-product-card .content .best-price .days {
  font-weight: 600;
}
.md-product-card .content .availability {
  font-size: 0.8rem;
  color: #525252;
}
.md-product-card .footer {
  display: flex;
  align-items: stretch;
  justify-content: stretch;
}
.md-product-card .footer a {
  display: block;
  flex: 1;
  font-size: 0.9rem;
  text-align: center;
  font-weight: 600;
  padding: 0.5rem 1rem;
  background-color: #2e2ee5;
  color: #fff;
}
.md-product-card .footer a:hover {
  background-color: #1919c7;
}

.md-product {
  /*
  Add the correct text decoration in Chrome, Edge, and Safari.
  */
  /*
  Remove the default font size and weight for headings.
  */
  /*
  Reset links to optimize for opt-in styling instead of opt-out.
  */
  /*
  Add the correct font weight in Edge and Safari.
  */
  /*
  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.
  */
  /*
  Add the correct font size in all browsers.
  */
  /*
  Prevent `sub` and `sup` elements from affecting the line height in all browsers.
  */
  /*
  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.
  */
  /*
  1. Change the font styles in all browsers.
  2. Remove the margin in Firefox and Safari.
  3. Remove default padding in all browsers.
  */
  /*
  Remove the inheritance of text transform in Edge and Firefox.
  */
  /*
  1. Correct the inability to style clickable types in iOS and Safari.
  2. Remove default button styles.
  */
  /*
  Use the modern Firefox focus style for all focusable elements.
  */
  /*
  Remove the additional `:invalid` styles in Firefox. (https://github.com/mozilla/gecko-dev/blob/2f9eacd9d3d995c937b4251a5557d95d494c9be1/layout/style/res/forms.css#L728-L737)
  */
  /*
  Add the correct vertical alignment in Chrome and Firefox.
  */
  /*
  Correct the cursor style of increment and decrement buttons in Safari.
  */
  /*
  1. Correct the odd appearance in Chrome and Safari.
  2. Correct the outline style in Safari.
  */
  /*
  Remove the inner padding in Chrome and Safari on macOS.
  */
  /*
  1. Correct the inability to style clickable types in iOS and Safari.
  2. Change font properties to `inherit` in Safari.
  */
  /*
  Add the correct display in Chrome and Safari.
  */
  /*
  Removes the default spacing for appropriate elements.
  */
  /*
  Prevent resizing textareas horizontally by default.
  */
  /*
  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.
  */
  /*
  Set the default cursor for buttons.
  */
  /*
  Make sure disabled buttons don't get the pointer cursor.
  */
  /*
  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.
  */
  /*
  Constrain images and videos to the parent width and preserve their intrinsic aspect ratio. (https://github.com/mozdevs/cssremedy/issues/14)
  */
  /*
  Make elements with the HTML hidden attribute stay hidden by default.
  */
  display: flex;
  flex-direction: column;
  gap: 1rem;
}
.md-product *,
.md-product ::before,
.md-product ::after {
  box-sizing: border-box; /* 1 */
  border-width: 0; /* 2 */
  border-style: solid; /* 2 */
  border-color: theme("borderColor.DEFAULT", currentColor); /* 2 */
}
.md-product hr {
  height: 0; /* 1 */
  color: inherit; /* 2 */
  border-top-width: 1px; /* 3 */
}
.md-product abbr:where([title]) {
  text-decoration: underline dotted;
}
.md-product h1,
.md-product h2,
.md-product h3,
.md-product h4,
.md-product h5,
.md-product h6 {
  font-size: inherit;
  font-weight: inherit;
}
.md-product a {
  color: inherit;
  text-decoration: inherit;
}
.md-product b,
.md-product strong {
  font-weight: bolder;
}
.md-product code,
.md-product kbd,
.md-product samp,
.md-product pre {
  font-family: theme("fontFamily.mono", ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace); /* 1 */
  font-feature-settings: theme("fontFamily.mono[1].fontFeatureSettings", normal); /* 2 */
  font-variation-settings: theme("fontFamily.mono[1].fontVariationSettings", normal); /* 3 */
  font-size: 1em; /* 4 */
}
.md-product small {
  font-size: 80%;
}
.md-product sub,
.md-product sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}
.md-product sub {
  bottom: -0.25em;
}
.md-product sup {
  top: -0.5em;
}
.md-product table {
  text-indent: 0; /* 1 */
  border-color: inherit; /* 2 */
  border-collapse: collapse; /* 3 */
}
.md-product button,
.md-product input,
.md-product optgroup,
.md-product select,
.md-product 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 */
  color: inherit; /* 1 */
  margin: 0; /* 2 */
  padding: 0; /* 3 */
}
.md-product button,
.md-product select {
  text-transform: none;
}
.md-product button,
.md-product [type=button],
.md-product [type=reset],
.md-product [type=submit] {
  -webkit-appearance: button; /* 1 */
  background-color: transparent; /* 2 */
  background-image: none; /* 2 */
}
.md-product :-moz-focusring {
  outline: auto;
}
.md-product :-moz-ui-invalid {
  box-shadow: none;
}
.md-product progress {
  vertical-align: baseline;
}
.md-product ::-webkit-inner-spin-button,
.md-product ::-webkit-outer-spin-button {
  height: auto;
}
.md-product [type=search] {
  -webkit-appearance: textfield; /* 1 */
  outline-offset: -2px; /* 2 */
}
.md-product ::-webkit-search-decoration {
  -webkit-appearance: none;
}
.md-product ::-webkit-file-upload-button {
  -webkit-appearance: button; /* 1 */
  font: inherit; /* 2 */
}
.md-product summary {
  display: list-item;
}
.md-product blockquote,
.md-product dl,
.md-product dd,
.md-product h1,
.md-product h2,
.md-product h3,
.md-product h4,
.md-product h5,
.md-product h6,
.md-product hr,
.md-product figure,
.md-product p,
.md-product pre {
  margin: 0;
}
.md-product fieldset {
  margin: 0;
  padding: 0;
}
.md-product legend {
  padding: 0;
}
.md-product ol,
.md-product ul,
.md-product menu {
  list-style: none;
  margin: 0;
  padding: 0;
}
.md-product dialog {
  padding: 0;
}
.md-product textarea {
  resize: vertical;
}
.md-product input::placeholder,
.md-product textarea::placeholder {
  opacity: 1; /* 1 */
  color: theme("colors.gray.400", #9ca3af); /* 2 */
}
.md-product button,
.md-product [role=button] {
  cursor: pointer;
}
.md-product :disabled {
  cursor: default;
}
.md-product img,
.md-product svg,
.md-product video,
.md-product canvas,
.md-product audio,
.md-product iframe,
.md-product embed,
.md-product object {
  display: block; /* 1 */
  vertical-align: middle; /* 2 */
}
.md-product img,
.md-product video {
  max-width: 100%;
  height: auto;
}
.md-product [hidden] {
  display: none;
}
.md-product svg {
  display: inline-block;
  height: 1em;
  width: 1em;
  vertical-align: middle;
  line-height: 1em;
}
.md-product .flex-spacer {
  flex: 1;
}
.md-product .prime-day-tag {
  position: relative;
}
.md-product .prime-day-tag .prime-day-tag-tooltip {
  visibility: hidden;
  width: 12rem;
  z-index: 2000;
  position: absolute;
  background-color: #fff;
  top: calc(100% + 0.25rem);
  right: 0;
  border-radius: 0.5rem;
  padding: 0.25rem 0.5rem;
  color: #000;
  font-size: 0.75rem;
  font-weight: 500;
  box-shadow: 0px 10px 14px -3px rgba(0, 0, 0, 0.24);
  border: 1px solid #e5e5e5;
  opacity: 0;
  transition: opacity 0.3s;
}
.md-product .prime-day-tag:hover .prime-day-tag-tooltip {
  visibility: visible;
  opacity: 1;
}
.md-product .tools {
  display: flex;
  align-items: center;
  gap: 1rem;
  padding: 0.25rem 0;
}
.md-product .tools .btn-price-alert {
  display: flex;
  align-items: center;
  gap: 0.25rem;
  font-weight: 500;
  font-size: 0.875rem;
  background-color: #f5f5f5;
  color: #050505;
  padding: 0.25rem 0.5rem;
  border-radius: 9999px;
}
.md-product .tools .btn-price-alert:hover {
  background-color: gainsboro;
}
.md-product .similar-products {
  padding-top: 1rem;
}
.md-product .similar-products h2 {
  font-size: 1.125rem;
  font-family: Inter, Helvetica, sans-serif;
}
.md-product .similar-products p {
  font-size: 0.875rem;
  font-family: Inter, Helvetica, sans-serif;
  color: #737373;
  padding-bottom: 1rem;
}
.md-product .similar-products .grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.5rem;
}
@media (min-width: 640px) {
  .md-product .similar-products .grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}
.md-product .back-to-products {
  font-size: 0.8rem;
  color: #525252;
  width: fit-content;
}
.md-product .back-to-products:hover {
  text-decoration: underline;
}
.md-product .not-found {
  background-color: #fff;
  padding: 0.75rem;
  border-radius: 0.75rem;
  border: 1px solid #e5e5e5 !important;
  padding-top: 5rem;
  padding-bottom: 5rem;
  justify-content: center;
  align-items: center;
  font-family: Inter, Helvetica, sans-serif;
  color: #2e2ee5;
  text-align: center;
  font-size: 2rem;
  font-weight: 600;
}
.md-product .header {
  background-color: #fff;
  padding: 0.75rem;
  border-radius: 0.75rem;
  border: 1px solid #e5e5e5 !important;
  display: flex;
  flex-direction: column;
  gap: 1rem;
}
@media (min-width: 640px) {
  .md-product .header {
    flex-direction: row;
  }
}
.md-product .header .content {
  display: flex;
  flex-direction: column;
  flex: 1;
}
.md-product .header img {
  align-self: center;
  aspect-ratio: 1/1;
}
.md-product .header h1 {
  font-family: Inter, Helvetica, sans-serif !important;
  margin: 0;
  font-size: 1.125rem;
}
.md-product .header .category {
  font-size: 0.8rem;
  color: #525252;
}
.md-product .header .category a {
  font-size: 0.8rem;
  color: #525252;
}
.md-product .header .category a:hover {
  text-decoration: underline;
}
.md-product .header .price-cta {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
}
.md-product .header .price-cta .price {
  font-weight: 700;
  font-size: 1.5rem;
}
.md-product .header .price-cta a {
  display: block;
  flex: 1;
  font-size: 0.9rem;
  text-align: center;
  font-weight: 600;
  padding: 0.5rem 1rem;
  background-color: #2e2ee5;
  color: #fff;
}
.md-product .header .price-cta a:hover {
  background-color: #1919c7;
}
.md-product .prices {
  background-color: #fff;
  padding: 0.75rem;
  border-radius: 0.75rem;
  border: 1px solid #e5e5e5 !important;
}
.md-product .prices h2 {
  font-size: 1.125rem;
  font-family: Inter, Helvetica, sans-serif;
}
.md-product .prices .list {
  padding-top: 0.75rem;
  display: flex;
  gap: 0.75rem;
  flex-direction: column;
}
.md-product .prices .product-price {
  background-color: #fff;
  padding: 0.75rem;
  border-radius: 0.75rem;
  border: 1px solid #e5e5e5 !important;
  padding: 0.5rem 0.75rem;
  display: flex;
  justify-content: space-between;
  gap: 1rem;
}
.md-product .prices .product-price:hover .name {
  text-decoration: underline;
}
.md-product .prices .product-price:hover .provider {
  color: white;
  background-color: #2e2ee5;
}
.md-product .prices .product-price .name {
  font-size: 0.975rem;
  font-weight: 600;
  overflow: hidden;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}
.md-product .prices .product-price .brand {
  font-size: 0.75rem;
  color: #737373;
}
.md-product .prices .product-price .pricing {
  display: flex;
  flex-direction: column;
  gap: 0.125rem;
  align-items: end;
}
.md-product .prices .product-price .price {
  font-weight: 700;
  font-size: 1.5rem;
}
.md-product .prices .product-price .provider {
  display: flex;
  justify-content: center;
  font-weight: 500;
  font-size: 0.75rem;
  border-radius: 0.5rem;
  padding: 0.125rem 0.375rem;
  border: 1.5px solid #2e2ee5;
  color: #2e2ee5;
}
.md-product .price-history {
  background-color: #fff;
  padding: 0.75rem;
  border-radius: 0.75rem;
  border: 1px solid #e5e5e5 !important;
}
.md-product .price-history .chart-container {
  width: 100%;
  height: 250px;
}
.md-product .price-history .chart-container svg {
  width: auto;
  height: auto;
}
.md-product .price-history h2 {
  font-size: 1.125rem;
  font-family: Inter, Helvetica, sans-serif;
}
.md-product .price-history .settings {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  gap: 0.5rem;
  padding: 0.5rem 0;
  align-items: center;
  justify-content: flex-end;
}
.md-product .price-history .settings a {
  display: block;
  font-size: 0.8rem;
  text-align: center;
  font-weight: 400;
  padding: 0.125rem 0.25rem;
  color: #000;
  border: 1.5px solid #e5e5e5;
}
.md-product .price-history .settings a:hover, .md-product .price-history .settings a.active {
  border-color: #2e2ee5;
}
.md-product .price-history canvas {
  padding-bottom: 2rem;
}
.md-product .price-history .prices {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  align-items: stretch;
}
@media (min-width: 640px) {
  .md-product .price-history .prices {
    flex-direction: row;
  }
}
.md-product .price-history .prices > div {
  flex: 1;
  background-color: #fff;
  padding: 0.75rem;
  border-radius: 0.75rem;
  border: 1px solid #e5e5e5 !important;
  padding: 0.5rem;
  display: flex;
  align-items: center;
  flex-direction: column;
}
.md-product .price-history .prices > div .title {
  color: #404040;
  font-size: 0.75rem;
  font-weight: 600;
}
.md-product .price-history .prices > div .when {
  font-size: 0.75rem;
  color: #737373;
}
.md-product .price-history .prices > div .price {
  font-size: 1.4rem;
  font-weight: 700;
  padding-bottom: 0.125rem;
  padding-top: 0.175rem;
}
.md-product .price-history .prices > div a {
  color: #2e2ee5;
  font-size: 0.75rem;
}
.md-product .price-history .prices > div a:hover {
  color: #1919c7;
}

.md-chart-tooltip {
  /*
  Add the correct text decoration in Chrome, Edge, and Safari.
  */
  /*
  Remove the default font size and weight for headings.
  */
  /*
  Reset links to optimize for opt-in styling instead of opt-out.
  */
  /*
  Add the correct font weight in Edge and Safari.
  */
  /*
  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.
  */
  /*
  Add the correct font size in all browsers.
  */
  /*
  Prevent `sub` and `sup` elements from affecting the line height in all browsers.
  */
  /*
  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.
  */
  /*
  1. Change the font styles in all browsers.
  2. Remove the margin in Firefox and Safari.
  3. Remove default padding in all browsers.
  */
  /*
  Remove the inheritance of text transform in Edge and Firefox.
  */
  /*
  1. Correct the inability to style clickable types in iOS and Safari.
  2. Remove default button styles.
  */
  /*
  Use the modern Firefox focus style for all focusable elements.
  */
  /*
  Remove the additional `:invalid` styles in Firefox. (https://github.com/mozilla/gecko-dev/blob/2f9eacd9d3d995c937b4251a5557d95d494c9be1/layout/style/res/forms.css#L728-L737)
  */
  /*
  Add the correct vertical alignment in Chrome and Firefox.
  */
  /*
  Correct the cursor style of increment and decrement buttons in Safari.
  */
  /*
  1. Correct the odd appearance in Chrome and Safari.
  2. Correct the outline style in Safari.
  */
  /*
  Remove the inner padding in Chrome and Safari on macOS.
  */
  /*
  1. Correct the inability to style clickable types in iOS and Safari.
  2. Change font properties to `inherit` in Safari.
  */
  /*
  Add the correct display in Chrome and Safari.
  */
  /*
  Removes the default spacing for appropriate elements.
  */
  /*
  Prevent resizing textareas horizontally by default.
  */
  /*
  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.
  */
  /*
  Set the default cursor for buttons.
  */
  /*
  Make sure disabled buttons don't get the pointer cursor.
  */
  /*
  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.
  */
  /*
  Constrain images and videos to the parent width and preserve their intrinsic aspect ratio. (https://github.com/mozdevs/cssremedy/issues/14)
  */
  /*
  Make elements with the HTML hidden attribute stay hidden by default.
  */
  background-color: #fff;
  padding: 0.5rem;
  border-radius: 0.5rem;
  border: 1px solid #e5e5e5;
  display: flex;
  flex-direction: column;
  gap: 0.2rem;
  line-height: normal;
}
.md-chart-tooltip *,
.md-chart-tooltip ::before,
.md-chart-tooltip ::after {
  box-sizing: border-box; /* 1 */
  border-width: 0; /* 2 */
  border-style: solid; /* 2 */
  border-color: theme("borderColor.DEFAULT", currentColor); /* 2 */
}
.md-chart-tooltip hr {
  height: 0; /* 1 */
  color: inherit; /* 2 */
  border-top-width: 1px; /* 3 */
}
.md-chart-tooltip abbr:where([title]) {
  text-decoration: underline dotted;
}
.md-chart-tooltip h1,
.md-chart-tooltip h2,
.md-chart-tooltip h3,
.md-chart-tooltip h4,
.md-chart-tooltip h5,
.md-chart-tooltip h6 {
  font-size: inherit;
  font-weight: inherit;
}
.md-chart-tooltip a {
  color: inherit;
  text-decoration: inherit;
}
.md-chart-tooltip b,
.md-chart-tooltip strong {
  font-weight: bolder;
}
.md-chart-tooltip code,
.md-chart-tooltip kbd,
.md-chart-tooltip samp,
.md-chart-tooltip pre {
  font-family: theme("fontFamily.mono", ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace); /* 1 */
  font-feature-settings: theme("fontFamily.mono[1].fontFeatureSettings", normal); /* 2 */
  font-variation-settings: theme("fontFamily.mono[1].fontVariationSettings", normal); /* 3 */
  font-size: 1em; /* 4 */
}
.md-chart-tooltip small {
  font-size: 80%;
}
.md-chart-tooltip sub,
.md-chart-tooltip sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}
.md-chart-tooltip sub {
  bottom: -0.25em;
}
.md-chart-tooltip sup {
  top: -0.5em;
}
.md-chart-tooltip table {
  text-indent: 0; /* 1 */
  border-color: inherit; /* 2 */
  border-collapse: collapse; /* 3 */
}
.md-chart-tooltip button,
.md-chart-tooltip input,
.md-chart-tooltip optgroup,
.md-chart-tooltip select,
.md-chart-tooltip 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 */
  color: inherit; /* 1 */
  margin: 0; /* 2 */
  padding: 0; /* 3 */
}
.md-chart-tooltip button,
.md-chart-tooltip select {
  text-transform: none;
}
.md-chart-tooltip button,
.md-chart-tooltip [type=button],
.md-chart-tooltip [type=reset],
.md-chart-tooltip [type=submit] {
  -webkit-appearance: button; /* 1 */
  background-color: transparent; /* 2 */
  background-image: none; /* 2 */
}
.md-chart-tooltip :-moz-focusring {
  outline: auto;
}
.md-chart-tooltip :-moz-ui-invalid {
  box-shadow: none;
}
.md-chart-tooltip progress {
  vertical-align: baseline;
}
.md-chart-tooltip ::-webkit-inner-spin-button,
.md-chart-tooltip ::-webkit-outer-spin-button {
  height: auto;
}
.md-chart-tooltip [type=search] {
  -webkit-appearance: textfield; /* 1 */
  outline-offset: -2px; /* 2 */
}
.md-chart-tooltip ::-webkit-search-decoration {
  -webkit-appearance: none;
}
.md-chart-tooltip ::-webkit-file-upload-button {
  -webkit-appearance: button; /* 1 */
  font: inherit; /* 2 */
}
.md-chart-tooltip summary {
  display: list-item;
}
.md-chart-tooltip blockquote,
.md-chart-tooltip dl,
.md-chart-tooltip dd,
.md-chart-tooltip h1,
.md-chart-tooltip h2,
.md-chart-tooltip h3,
.md-chart-tooltip h4,
.md-chart-tooltip h5,
.md-chart-tooltip h6,
.md-chart-tooltip hr,
.md-chart-tooltip figure,
.md-chart-tooltip p,
.md-chart-tooltip pre {
  margin: 0;
}
.md-chart-tooltip fieldset {
  margin: 0;
  padding: 0;
}
.md-chart-tooltip legend {
  padding: 0;
}
.md-chart-tooltip ol,
.md-chart-tooltip ul,
.md-chart-tooltip menu {
  list-style: none;
  margin: 0;
  padding: 0;
}
.md-chart-tooltip dialog {
  padding: 0;
}
.md-chart-tooltip textarea {
  resize: vertical;
}
.md-chart-tooltip input::placeholder,
.md-chart-tooltip textarea::placeholder {
  opacity: 1; /* 1 */
  color: theme("colors.gray.400", #9ca3af); /* 2 */
}
.md-chart-tooltip button,
.md-chart-tooltip [role=button] {
  cursor: pointer;
}
.md-chart-tooltip :disabled {
  cursor: default;
}
.md-chart-tooltip img,
.md-chart-tooltip svg,
.md-chart-tooltip video,
.md-chart-tooltip canvas,
.md-chart-tooltip audio,
.md-chart-tooltip iframe,
.md-chart-tooltip embed,
.md-chart-tooltip object {
  display: block; /* 1 */
  vertical-align: middle; /* 2 */
}
.md-chart-tooltip img,
.md-chart-tooltip video {
  max-width: 100%;
  height: auto;
}
.md-chart-tooltip [hidden] {
  display: none;
}
.md-chart-tooltip svg {
  display: inline-block;
  height: 1em;
  width: 1em;
  vertical-align: middle;
  line-height: 1em;
}
.md-chart-tooltip .flex-spacer {
  flex: 1;
}
.md-chart-tooltip .price {
  font-size: 1rem;
  font-weight: 600;
}
.md-chart-tooltip .datetime {
  font-size: 0.75rem;
  color: #525252;
}
.md-chart-tooltip .provider {
  font-size: 0.75rem;
  color: #525252;
  font-weight: 700;
}

.md-products-filtered {
  width: 100%;
}
.md-products-filtered .splide {
  width: 100%;
}
.md-products-filtered .splide__list {
  display: flex;
  align-items: stretch;
  width: 100%;
}
.md-products-filtered .splide__list > * {
  display: flex;
  margin-right: 16px;
  align-items: stretch;
  width: 224px;
  min-width: 224px;
  max-width: 224px;
}
.md-products-filtered .splide__arrow {
  height: 32px;
  width: 32px;
  opacity: 0;
  background-color: white;
  box-shadow: 0px 2px 10px rgba(0, 0, 0, 0.2);
  transition: opacity 250ms ease;
  z-index: 10;
}
.md-products-filtered .splide__arrow:disabled {
  visibility: hidden;
}
.md-products-filtered:hover .splide__arrow {
  opacity: 1;
}
.md-products-filtered .show-more {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  font-weight: 600;
  font-size: 14px;
  flex: 1;
  gap: 8px;
}
.md-products-filtered .show-more .icon {
  background-color: #fff;
  border-radius: 9999px;
  width: 48px;
  height: 48px;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px solid #f5f5f5;
  transition: box-shadow 250ms ease;
}
.md-products-filtered .show-more:hover {
  text-decoration: underline;
}
.md-products-filtered .show-more:hover .icon {
  box-shadow: 0px 3px 8px rgba(0, 0, 0, 0.14);
}

.md-watch-product-modal {
  background-color: transparent;
  position: fixed;
  display: flex;
  justify-items: center;
  color: #000;
  margin: 16px auto;
  align-items: start;
  border: none;
  max-width: none !important;
  min-height: 100vh;
}
@media (min-width: 640px) {
  .md-watch-product-modal {
    align-items: center;
  }
}
.md-watch-product-modal:not([open]) {
  display: none;
}
.md-watch-product-modal .modal-container {
  position: relative;
  border: 1px solid #f5f5f5;
  background: #fff;
  padding: 16px;
}
.md-watch-product-modal::backdrop {
  background-color: rgba(0, 0, 0, 0.7);
}
.md-watch-product-modal .content {
  display: flex;
  flex-direction: column;
  max-width: 333px;
  width: 100%;
}
.md-watch-product-modal .title {
  text-align: center;
  font-size: 1.5rem;
  font-weight: 800;
}
.md-watch-product-modal .description {
  color: #000;
  margin-top: 0;
  font-size: 0.9rem;
}
.md-watch-product-modal .button-close {
  position: absolute;
  border: none;
  cursor: pointer;
  background-color: transparent;
  padding: 0;
  top: 10px;
  right: 10px;
  line-height: auto;
  color: #000;
}
.md-watch-product-modal .button-close svg {
  font-size: 1rem;
}
.md-watch-product-modal .product {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  align-items: center;
}
@media (min-width: 640px) {
  .md-watch-product-modal .product {
    flex-direction: row;
  }
}
.md-watch-product-modal .product img {
  width: 128px;
  height: 128px;
}
@media (min-width: 640px) {
  .md-watch-product-modal .product img {
    width: 64px;
    height: 64px;
  }
}
.md-watch-product-modal .product .product__information {
  display: flex;
  flex-direction: column;
  font-size: 0.825rem;
  font-weight: 500;
}
.md-watch-product-modal .btn {
  font-weight: 500;
  cursor: pointer;
  font-size: 1rem;
  line-height: auto;
  background-color: #f0f0f0;
  color: #000000;
  border: none;
  padding: 0.5rem 1rem;
}
.md-watch-product-modal .btn:hover {
  background-color: #d7d7d7;
}
.md-watch-product-modal .btn.btn-primary {
  background-color: #2e2ee5;
  color: white;
}
.md-watch-product-modal .btn.btn-primary:hover {
  background-color: #1919c7;
}
.md-watch-product-modal .btns {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.25rem;
  padding-top: 1rem;
}
.md-watch-product-modal form {
  padding-top: 1rem;
  display: flex;
  flex-direction: column;
  gap: 1rem;
}
.md-watch-product-modal form label {
  font-size: 0.875rem;
  font-weight: 500;
}
.md-watch-product-modal form input {
  font-size: 1rem;
  padding: 0.5rem 0.5rem;
  border: 1px solid #e5e5e5;
}
.md-watch-product-modal form .percentages {
  display: flex;
  align-items: center;
  justify-content: stretch;
  gap: 0.5rem;
  flex-wrap: wrap;
}
.md-watch-product-modal form .percentages * {
  flex: 1;
  font-weight: 600;
  cursor: pointer;
  font-size: 0.875rem;
  line-height: auto;
  background-color: #f0f0f0;
  color: #000;
  border: none;
  padding: 0.25rem 0.5rem;
  border-radius: 9999px;
}
.md-watch-product-modal form .percentages *:hover {
  background-color: #d7d7d7;
}
.md-watch-product-modal form .form-item {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
}

.md-watch-product-toasts {
  position: fixed;
  pointer-events: none;
  top: 0;
  right: 0;
  left: 0;
  z-index: 10000;
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 0.5rem;
}
.md-watch-product-toasts > div {
  background-color: white;
  display: flex;
  align-items: center;
  padding: 0.25rem 0.5rem;
  opacity: 0;
  transition: opacity 0.5s ease, transform 0.5s ease;
  transform: translateY(-4rem);
  gap: 0.5rem;
  box-shadow: 0px 4px 8px -1px rgba(0, 0, 0, 0.2);
}
.md-watch-product-toasts > div[data-state=open] {
  opacity: 1;
  transform: translateY(0);
}
.md-watch-product-toasts > div[data-state=close] {
  opacity: 0;
  transform: translateY(-4rem);
}
.md-watch-product-toasts > div svg {
  color: #2e2ee5;
}
.md-watch-product-toasts > div div {
  color: #000;
}

.md-loader {
  --shadow-color: 0deg 0% 0%;
  position: fixed;
  top: 0;
  right: 0;
  left: 0;
  bottom: 0;
  background-color: rgba(255, 255, 255, 0.5);
  backdrop-filter: blur(5px);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 9999;
}
.md-loader > div {
  background-color: #ffffff;
  box-sizing: content-box;
  padding: 10px;
  height: 42px;
  width: 42px;
  border-radius: 8px;
  border: 1px solid #f0f0f0;
  box-shadow: 0px 0.5px 0.6px hsl(var(--shadow-color)/0.09), 0px 1.5px 1.7px -0.8px hsl(var(--shadow-color)/0.09), -0.1px 3.8px 4.3px -1.7px hsl(var(--shadow-color)/0.09), -0.1px 9.1px 10.2px -2.5px hsl(var(--shadow-color)/0.09);
  color: #2e2ee5;
}
.md-loader > div svg {
  animation-name: mdSpin;
  animation-duration: 2000ms;
  animation-iteration-count: infinite;
  animation-timing-function: linear;
}

@keyframes mdSpin {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}

/*# sourceMappingURL=style.css.map */