/* Bottom pill on phone product pages, ported from the Tilda store (zylo-online.ru/styler-gold). */
.zylo-dock { display: none; }
@media (max-width: 640px) {
  html.zylo-has-dock:not([data-zylo-pdp="e"]) body { padding-bottom: calc(84px + env(safe-area-inset-bottom)) !important; }
  /* The pill replaces the floating capsules and the price bar on phones. */
  html.zylo-has-dock:not([data-zylo-pdp="e"]) :is(.zylo-floating-home, .zylo-floating-favorites, .zylo-floating-cart, .zylo-mobile-purchase) { display: none !important; }
  html.zylo-has-dock:not([data-zylo-pdp="e"]) .zylo-dock {
    box-sizing: border-box;
    position: fixed;
    left: 50%;
    bottom: calc(8px + env(safe-area-inset-bottom));
    z-index: 9999;
    display: flex;
    align-items: center;
    gap: 4px;
    width: calc(100% - 32px);
    max-width: 460px;
    padding: 6px 7px;
    border: 1px solid rgb(255 255 255 / 85%);
    border-radius: 28px;
    background: rgb(216 216 216 / 92%);
    box-shadow: 0 5px 18px rgb(0 0 0 / 8%);
    -webkit-backdrop-filter: blur(12px);
    backdrop-filter: blur(12px);
    transform: translateX(-50%);
    touch-action: manipulation;
    transition: opacity .2s ease, transform .2s ease, visibility .2s;
  }
  html.zylo-dock-typing .zylo-dock { opacity: 0; visibility: hidden; pointer-events: none; transform: translate(-50%, 20px); }
}
.zylo-dock__nav, .zylo-dock__markets { display: flex; flex: 0 0 auto; align-items: center; gap: 4px; }
.zylo-dock__icon {
  box-sizing: border-box;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 46px;
  height: 46px;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 18px;
  background: #f9f9f9;
  color: #070d1b !important;
  text-decoration: none;
  cursor: pointer;
  -webkit-appearance: none;
  appearance: none;
}
.zylo-dock__icon svg { display: block; width: 23px; height: 23px; fill: currentColor; }
.zylo-dock__count {
  box-sizing: border-box;
  position: absolute;
  top: -3px;
  right: -3px;
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 18px;
  height: 18px;
  padding: 0 5px;
  border-radius: 999px;
  background: #070d1b;
  color: #fff;
  font: 500 10px/1 var(--zylo-font, Raleway, Arial, sans-serif);
  font-variant-numeric: tabular-nums;
}
.zylo-dock__count[hidden] { display: none; }
.zylo-woocommerce .zylo-dock .zylo-dock__buy {
  box-sizing: border-box;
  flex: 1 1 auto;
  min-width: 0;
  height: 46px;
  margin: 0 2px;
  padding: 0 10px;
  border: 0 !important;
  border-radius: 20px;
  background: #f9f9f9 !important;
  color: #070d1b !important;
  box-shadow: 0 1px 6px rgb(0 0 0 / 4%) !important;
  font: 500 14px/1.2 var(--zylo-font, Raleway, Arial, sans-serif);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  cursor: pointer;
  -webkit-appearance: none;
  appearance: none;
}
.zylo-dock__market {
  display: block;
  flex: 0 0 40px;
  width: 40px;
  height: 40px;
  overflow: hidden;
  border-radius: 50%;
  background: #fff;
  box-shadow: 0 1px 5px rgb(0 0 0 / 5%);
}
.zylo-dock__market img { display: block; width: 100%; height: 100%; object-fit: cover; pointer-events: none; }
.zylo-dock :is(a, button):focus-visible { outline: 2px solid #070d1b; outline-offset: 2px; }
.zylo-dock :is(a, button):active { transform: scale(.96); }
@media (max-width: 359px) {
  .zylo-dock__icon { width: 42px; height: 42px; border-radius: 16px; }
  .zylo-dock__icon svg { width: 21px; height: 21px; }
  .zylo-dock__market { flex-basis: 36px; width: 36px; height: 36px; }
  .zylo-woocommerce .zylo-dock .zylo-dock__buy { height: 42px; padding: 0 8px; font-size: 13px; }
}
/* The classic phone footer keeps the original round actions and price bar.
   Scope every override to the selected variant; wider screens and preview E
   retain their existing controls. The server supplies the body class before
   paint, and AJAX navigation replaces it with the arriving page's choice. */
@media (max-width: 640px) {
  html:not([data-zylo-pdp="e"]) body.single-product.zylo-footer-classic {
    padding-bottom: calc(80px + env(safe-area-inset-bottom));
  }
  html:not([data-zylo-pdp="e"]) body.single-product.zylo-footer-classic :is(.zylo-floating-home, .zylo-floating-favorites, .zylo-floating-cart) {
    box-sizing: border-box;
    position: fixed;
    left: auto;
    right: 15px;
    z-index: 9998;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 2px;
    width: 56px;
    min-width: 56px;
    height: 56px;
    min-height: 56px;
    margin: 0;
    padding: 7px 4px;
    border: 1px solid #e4d7d0;
    border-radius: 50%;
    background: #fffaf7;
    color: #895c4d !important;
    box-shadow: 0 3px 22px #0002;
    text-decoration: none;
    touch-action: manipulation;
  }
  html:not([data-zylo-pdp="e"]) body.single-product.zylo-footer-classic .zylo-floating-home { bottom: calc(222px + env(safe-area-inset-bottom)); }
  html:not([data-zylo-pdp="e"]) body.single-product.zylo-footer-classic .zylo-floating-favorites { bottom: calc(156px + env(safe-area-inset-bottom)); }
  html:not([data-zylo-pdp="e"]) body.single-product.zylo-footer-classic .zylo-floating-cart {
    bottom: calc(90px + env(safe-area-inset-bottom));
    border-color: var(--zylo-action);
    background: var(--zylo-action);
    color: #fff !important;
    box-shadow: 0 6px 24px rgb(81 46 34 / 23%);
  }
  html:not([data-zylo-pdp="e"]) body.single-product.zylo-footer-classic :is(.zylo-floating-home, .zylo-floating-favorites, .zylo-floating-cart) svg {
    display: block;
    order: 0;
    flex: 0 0 22px;
    width: 22px;
    height: 22px;
  }
  html:not([data-zylo-pdp="e"]) body.single-product.zylo-footer-classic :is(.zylo-floating-home, .zylo-floating-favorites, .zylo-floating-cart) .zylo-quick-action-label {
    order: 1;
    font: 500 8px/1.2 var(--zylo-font, Raleway, Arial, sans-serif);
  }
  html:not([data-zylo-pdp="e"]) body.single-product.zylo-footer-classic :is(.zylo-floating-cart [data-zylo-count], .zylo-floating-favorites [data-zylo-favorites-count]) {
    box-sizing: border-box;
    position: absolute;
    top: -3px;
    right: -3px;
    bottom: auto;
    left: auto;
    min-width: 18px;
    height: 18px;
    margin: 0;
    padding: 0 3px;
    border: 1px solid #fff;
    border-radius: 999px;
    background: #654b3c;
    color: #fff;
    font: 500 10px/1 var(--zylo-font, Raleway, Arial, sans-serif);
  }
  html:not([data-zylo-pdp="e"]) body.single-product.zylo-footer-classic .zylo-mobile-purchase {
    box-sizing: border-box;
    display: flex;
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 9999;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    background: #fff;
    padding: 12px 20px calc(12px + env(safe-area-inset-bottom));
    box-shadow: 0 -2px 16px #0001;
  }
  html:not([data-zylo-pdp="e"]) body.single-product.zylo-footer-classic .zylo-mobile-purchase strong { font: 18px Arial, sans-serif; }
  html:not([data-zylo-pdp="e"]) body.single-product.zylo-footer-classic .zylo-mobile-purchase [data-zylo-add] {
    flex: 0 0 auto;
    min-height: 52px;
    padding: 12px 24px;
    border-radius: 10px;
    font-size: 16px;
    cursor: pointer;
  }
  html:is(.zylo-cart-open, .zylo-favorites-open, .zylo-dock-typing):not([data-zylo-pdp="e"]) body.single-product.zylo-footer-classic :is(.zylo-floating-home, .zylo-floating-favorites, .zylo-floating-cart, .zylo-mobile-purchase) {
    visibility: hidden;
    pointer-events: none;
  }
}
/* Classic actions step aside while reading (mobile-dock.js); the purchase row,
   when visible, replaces both the actions and the price bar. */
@media (max-width: 640px) {
  html:not([data-zylo-pdp="e"]) body.single-product.zylo-footer-classic :is(.zylo-floating-home, .zylo-floating-favorites, .zylo-floating-cart) {
    transition: opacity .2s ease, transform .2s ease, visibility .2s;
  }
  html:is(.zylo-quick-hidden, .zylo-buybox-visible):not([data-zylo-pdp="e"]) body.single-product.zylo-footer-classic :is(.zylo-floating-home, .zylo-floating-favorites, .zylo-floating-cart) {
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transform: translateX(18px) scale(.9);
  }
  html:not([data-zylo-pdp="e"]) body.single-product.zylo-footer-classic .zylo-mobile-purchase {
    transition: transform .2s ease, visibility .2s;
  }
  html.zylo-buybox-visible:not([data-zylo-pdp="e"]) body.single-product.zylo-footer-classic .zylo-mobile-purchase {
    visibility: hidden;
    pointer-events: none;
    transform: translateY(100%);
  }
}
/* Tablets keep their capsule row at the bottom of the product page; it steps
   aside the same way while the shopper scrolls down through the description. */
@media (min-width: 641px) and (max-width: 1024px) {
  body.single-product :is(.zylo-floating-home, .zylo-floating-favorites, .zylo-floating-cart) {
    transition: opacity .2s ease, transform .2s ease, visibility .2s;
  }
  html.zylo-quick-hidden body.single-product :is(.zylo-floating-home, .zylo-floating-favorites, .zylo-floating-cart) {
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transform: translateY(14px);
  }
}
@media (max-width: 640px) and (hover: hover) {
  html:not([data-zylo-pdp="e"]) body.single-product.zylo-footer-classic :is(.zylo-floating-home, .zylo-floating-favorites):hover {
    border-color: #c7a18e !important;
    background: #f3e7de !important;
    color: #895c4d !important;
  }
  html:not([data-zylo-pdp="e"]) body.single-product.zylo-footer-classic .zylo-floating-cart:hover {
    border-color: var(--zylo-action-hover) !important;
    background: var(--zylo-action-hover) !important;
    color: #fff !important;
  }
}
@media (prefers-reduced-motion: reduce) {
  .zylo-dock, .zylo-dock :is(a, button), .zylo-mobile-purchase, :is(.zylo-floating-home, .zylo-floating-favorites, .zylo-floating-cart) { transition: none !important; }
  .zylo-dock :is(a, button):active { transform: none; }
}
