/* ============================================================
   FlexiVibe™ — Custom Design Override
   Emerald Green Medical-Warmth theme for joint health brand
   ============================================================ */

/* ── Logo ────────────────────────────────────────────────── */
.fv-logo-link {
  /* Remove the ratio/media padding-bottom trick from the old theme */
  padding-bottom: 0 !important;
  width: auto !important;
  max-width: none !important;
  height: auto !important;
  display: inline-flex !important;
  align-items: center;
}
.fv-logo-link::before {
  /* The Shrine theme injects a pseudo-element for ratio sizing — kill it */
  display: none !important;
  padding-top: 0 !important;
}
.fv-logo-img {
  position: static !important;
  width: auto !important;
  max-width: 186px !important;
  height: 52px !important;
  object-fit: contain;
  display: block;
}
@media screen and (max-width: 749px) {
  .fv-logo-img {
    max-width: 140px !important;
    height: 40px !important;
  }
}

/* Footer logo wrapper */
.footer-block__image-wrapper img[src*="flexivibe-logo-white"] {
  height: 48px !important;
  width: auto !important;
  max-width: 186px !important;
  object-fit: contain;
}

/* ── Root palette overrides ─────────────────────────────── */
:root {
  --fv-green-1: #1b7d45;
  --fv-green-2: #2d9e5c;
  --fv-green-light: #e8f7ee;
  --fv-green-glow: rgba(45, 158, 92, 0.35);
  --fv-dark: #0f2017;
}

/* ── Header ──────────────────────────────────────────────── */
.header-wrapper {
  border-bottom: 3px solid var(--fv-green-2) !important;
  box-shadow: 0 2px 12px rgba(45, 158, 92, 0.12) !important;
}

/* ── Horizontal ticker strip ─────────────────────────────── */
.horizontal-ticker {
  background: linear-gradient(90deg, var(--fv-green-1) 0%, var(--fv-green-2) 100%) !important;
  color: #ffffff !important;
}
.horizontal-ticker .horizontal-ticker__item,
.horizontal-ticker p {
  color: #ffffff !important;
  font-weight: 700 !important;
  letter-spacing: 0.08em !important;
}

/* ── Primary buy buttons ─────────────────────────────────── */
.button,
.btn,
.shopify-payment-button__button,
._rsi-buy-now-button,
.product-form__submit,
[class*="button--primary"] {
  border-radius: 28px !important;
  transition: box-shadow 0.22s ease, transform 0.15s ease !important;
}

.button:hover,
.btn:hover,
.product-form__submit:hover {
  box-shadow: 0 0 0 4px var(--fv-green-glow), 0 4px 16px rgba(45, 158, 92, 0.28) !important;
  transform: translateY(-1px) !important;
}

/* ── Floating buy-now bar (Releasit) ─────────────────────── */
._rsi-buy-now-button-floating ._rsi-buy-now-button {
  border-radius: 0 !important;
}

/* ── Price / sale badge ──────────────────────────────────── */
.price--on-sale .price__sale,
.price-item--sale,
.price--sale {
  color: var(--fv-green-2) !important;
}

.badge--sale,
.badge--on-sale {
  background-color: var(--fv-green-2) !important;
  color: #fff !important;
  border-radius: 6px !important;
}

/* ── Product benefit text icons ──────────────────────────── */
.product__text .material-symbols-outlined {
  color: var(--fv-green-2) !important;
}

/* ── Star rating row ─────────────────────────────────────── */
.rating-stars__container svg {
  color: #f59e0b !important;
  fill: #f59e0b !important;
}

/* ── Low-stock urgency indicator ─────────────────────────── */
.low-stock-urgency__dot {
  background-color: var(--fv-green-2) !important;
}

/* ── Accordion (FAQ) ─────────────────────────────────────── */
.accordion__summary:hover .accordion__title {
  color: var(--fv-green-2) !important;
}

/* ── Footer overrides ────────────────────────────────────── */
footer.footer,
.color-scheme-sections--29709065814365__footer {
  background: var(--fv-dark) !important;
  --gradient-background: var(--fv-dark) !important;
}

/* ── Footer contact block ────────────────────────────────── */
.footer-contact-info {
  color: rgba(255, 255, 255, 0.85);
  font-size: 1.3rem;
  text-align: center;
  padding: 8px 16px 18px;
  line-height: 2;
}
.footer-contact-info a {
  color: rgba(255, 255, 255, 0.85);
  text-decoration: none;
  transition: color 0.2s;
}
.footer-contact-info a:hover {
  color: var(--fv-green-2);
  text-decoration: underline;
}

/* ── Footer legal block ──────────────────────────────────── */
.footer-legal {
  color: rgba(255, 255, 255, 0.48);
  font-size: 1.15rem;
  text-align: center;
  padding: 6px 16px 10px;
  line-height: 1.8;
}

/* ── Section headings highlight colour ───────────────────── */
.title-with-highlight strong {
  color: var(--fv-green-2) !important;
}

/* ── Picker / quantity border accent ─────────────────────── */
:root {
  --pickers-border-color: var(--fv-green-2);
  --quantity-border-color: var(--fv-green-2);
}

/* ── Scroll-to-top button ────────────────────────────────── */
.scroll-to-top-btn {
  background: var(--fv-green-2) !important;
  color: #fff !important;
}