/** Shopify CDN: Minification failed

Line 600:0 Expected "}" to go with "{"

**/
/* ============================================================
   BIOS MEDICAL — MOBILE DOCK
   ============================================================ */


/* ============================================================
   PAGE SPACING
   ============================================================ */

body.has-mobile-dock
.shopify-section-group-footer-group:last-child {
  padding-bottom: var(--mobile-dock-height, 0px);
}


/* ============================================================
   MOBILE DOCK CONTAINER
   ============================================================ */

.mobile-dock {
  display: flex;

  position: fixed;

  left: 0;
  right: 0;
  bottom: 0;

  width: 100%;

  z-index: 100;

  overflow: hidden;

  /*
   * Hidden state.
   */
  transform: translateY(100%);

  visibility: hidden;
  opacity: 0;

  transition:
    transform var(--duration-default, 0.25s) ease,
    opacity var(--duration-default, 0.25s) ease,
    visibility var(--duration-default, 0.25s) ease;

  background: rgb(var(--color-background));
  background: var(--gradient-background);

  box-shadow:
    0 -0.1rem 0.8rem
      rgba(var(--color-foreground), 0.15),
    0 -2rem 4rem
      rgba(var(--color-foreground), 0.08);

  will-change: transform;
}


/* ============================================================
   ACTIVE / VISIBLE STATE
   ============================================================ */

.mobile-dock.is-active {
  transform: translateY(0);

  visibility: visible !important;

  opacity: 1 !important;

  overflow: visible;
}


/*
 * IMPORTANT:
 *
 * There is intentionally NO sticky-header selector here.
 *
 * The original stylesheet had:
 *
 * .shopify-section-header-sticky:not(.shopify-section-header-hidden)
 * .shopify-section-mobile-dock .mobile-dock
 *
 * which applied translateY(100%) and pushed the dock
 * off-screen when the sticky header became visible.
 *
 * That behavior has been removed.
 */


/* ============================================================
   INNER CONTAINER
   ============================================================ */

.mobile-dock .section-padding {
  padding-inline: 1.5rem;

  display: flex;

  width: 100%;

  flex-shrink: 0;
}


/* ============================================================
   DESKTOP
   ============================================================ */

@media screen and (min-width: 750px) {

  .mobile-dock {
    display: none !important;
  }

  body.has-mobile-dock
  .shopify-section-group-footer-group:last-child {
    padding-bottom: 0;
  }

}


/* ============================================================
   MOBILE
   ============================================================ */

@media screen and (max-width: 749px) {

  .mobile-dock {
    display: flex;
  }

}


/* ============================================================
   DOCK ITEMS
   ============================================================ */

.dock__item {
  flex-grow: 1;
  flex-shrink: 0;

  width: 100%;
  max-width: 100%;

  display: flex;

  flex-direction: column;

  justify-content: center;
  align-items: center;

  cursor: pointer;

  text-decoration: none;

  color: rgb(var(--color-foreground));

  position: relative;

  background: transparent;

  border: none;

  padding: 0;

  font: inherit;

  min-height: 4.4rem;
  min-width: 4.4rem;

  transition:
    opacity var(--duration-short, 0.15s) ease;

  -webkit-tap-highlight-color: transparent;

  -webkit-touch-callout: none;

  user-select: none;
}


.dock__item:active {
  opacity: 0.7;
}


/* ============================================================
   COLUMN WIDTHS
   ============================================================ */

.mobile-dock--2-col .dock__item {
  width: 50%;
}


.mobile-dock--3-col .dock__item {
  width: 33.333%;
}


.mobile-dock--4-col .dock__item {
  width: 25%;
}


.mobile-dock--5-col .dock__item {
  width: 20%;
}


.mobile-dock--6-col .dock__item {
  width: 16.666%;
}


/* ============================================================
   ICON WRAPPER
   ============================================================ */

.dock__item-icon {
  position: relative;

  display: flex;

  align-items: center;

  justify-content: center;

  margin-block-end: 0.4rem;
}


/* ============================================================
   ICONS
   ============================================================ */

.dock__item svg,
.dock__item .icon {
  height: 2.2rem;

  width: 2.2rem;

  stroke: currentColor;

  fill: none;

  pointer-events: none;
}


/*
 * Six-column sizing
 */

.mobile-dock--6-col .dock__item svg,
.mobile-dock--6-col .dock__item .icon {
  height: 1.8rem;

  width: 1.8rem;
}


/*
 * Cart
 */

.dock__item .icon-cart,
.dock__item .icon-bag {
  height: 2.2rem;

  width: 2.2rem;
}


.mobile-dock--6-col
.dock__item .icon-cart,
.mobile-dock--6-col
.dock__item .icon-bag {
  height: 1.8rem;

  width: 1.8rem;
}


/*
 * Hamburger
 */

.dock__item .icon-hamburger {
  stroke-width: 2;
}


/*
 * Accordion icons
 */

.dock__item .icon-accordion {
  height: 2.2rem;

  width: 2.2rem;
}


.mobile-dock--6-col
.dock__item .icon-accordion {
  height: 1.8rem;

  width: 1.8rem;
}


/* ============================================================
   LABELS
   ============================================================ */

.dock__item-label {
  font-size: 1.2rem;

  font-family:
    var(--font-body-family);

  font-style:
    var(--font-body-style);

  font-weight:
    var(--font-body-weight);

  letter-spacing: 0.02rem;

  line-height: 1.2;

  color:
    rgba(var(--color-foreground), 0.75);

  text-align: center;

  white-space: nowrap;
}


/* ============================================================
   CART COUNT
   ============================================================ */

.dock__item .cart-count-bubble {
  position: absolute;

  background-color:
    rgb(var(--color-button));

  color:
    rgb(var(--color-button-text));

  height: 1.7rem;

  min-width: 1.7rem;

  border-radius: 100%;

  display: flex;

  justify-content: center;

  align-items: center;

  font-size: 0.9rem;

  inset-block-start: -0.4rem;

  inset-inline-end: -0.2rem;

  line-height:
    calc(
      1 +
      0.1 /
      var(--font-body-scale)
    );

  padding-inline: 0.3rem;

  pointer-events: none;
}


.dock__item
.cart-count-bubble:empty {
  display: none;
}


.dock__item
.cart-count-bubble--dot {
  min-width: 1rem;

  height: 1rem;

  padding: 0;
}


/* ============================================================
   COLOR SCHEMES
   ============================================================ */

.mobile-dock.color-accent-1,
.mobile-dock.color-accent-2,
.mobile-dock.color-background-1,
.mobile-dock.color-background-2,
.mobile-dock.color-inverse {
  color:
    rgb(var(--color-foreground));

  background-color:
    rgb(var(--color-background));
}


/* ============================================================
   ACCESSIBILITY
   ============================================================ */

.dock__item:focus-visible {
  outline:
    0.2rem solid
    rgba(var(--color-foreground), 0.5);

  outline-offset: -0.2rem;
}


/* ============================================================
   HOVER
   ============================================================ */

@media (hover: hover) {

  .dock__item:hover {
    opacity: 0.8;
  }

}


/* ============================================================
   SEARCH MODAL
   ============================================================ */

body.overflow-hidden {
  overflow: hidden;
}


details-modal#header-search[open] {
  overflow-x: hidden;
}


details-modal#header-search
.search-modal__content {
  max-width: 100%;

  overflow-x: clip;

  overflow-y: visible;
}


/* ============================================================
   BACK TO TOP
   ============================================================ */

@media screen and (max-width: 749px) {

  body.has-mobile-dock
  .back-to-top {
    bottom:
      calc(
        var(--mobile-dock-height, 0px)
        + 2rem
      );
  }


  body.has-mobile-dock
  #back-to-top,

  body.has-mobile-dock
  .scroll-to-top,

  body.has-mobile-dock
  [class*="back-to-top"],

  body.has-mobile-dock
  [id*="back-to-top"] {
    bottom:
      calc(
        var(--mobile-dock-height, 0px)
        + 2rem
      );
  }

}


/* ============================================================
   CART DRAWER
   ============================================================ */

@media screen and (max-width: 749px) {

  body.has-mobile-dock
  cart-drawer,

  body.has-mobile-dock
  cart-drawer .drawer {
    box-shadow: none;
  }

}


/* ============================================================
   REDUCED MOTION
   ============================================================ */

@media (prefers-reduced-motion: reduce) {

  .mobile-dock {
    transition: none;
  }


  .dock__item {
    transition: none;
  }

}


/* ============================================================
   HIGH CONTRAST
   ============================================================ */

@media (prefers-contrast: high) {

  .mobile-dock {
    border-top:
      0.2rem solid currentColor;
  }


  .dock__item:focus-visible {
    outline-width: 0.3rem;
  }

}


/* ============================================================
   RTL
   ============================================================ */

[dir="rtl"]
.dock__item-icon {
  direction: rtl;
}


/* ============================================================
   LOADING STATE
   ============================================================ */

.mobile-dock[aria-busy="true"] {
  pointer-events: none;

  opacity: 0.6;
}


/* ============================================================
   PRINT
   ============================================================ */

@media print {

  .mobile-dock {
    display: none !important;
  }