@import url('https://fonts.googleapis.com/css2?family=Fraunces:opsz,wght@9..144,600;9..144,650;9..144,700&family=Mukta:wght@400;500;600;700;800&display=swap');

/* ===== original merchant CSS (live_backup/vinner-healthcare-live.css), unchanged ===== */
.sh-header-main {
    background-color: #ffffff ;
    color: #ffffff ;
}
.sh-header-location-icon {
    fill: #68a33c ;
}
.sh-header-account-icon {
    stroke: #68a33c ;
}
.sh-header-cart-icon {
    stroke: #68a33c ;
    fill: none 
}
.sh-header-arrow-icon {
    fill: #68a33c ;
}
.sh-header-search-icon {
    stroke:#68a33c ;
}
.sh-header-cart-badge {
    background-color: #68a33c ;
    color: #FFFFFF ;
}
.sh-bottom-nav-main {
    background-color: #f5f5f5 ;
    color: #68a33c ;
}
.sh-bottom-nav-selected {
    stroke: #68a33c ;
    color: #68a33c ;
    fill: none ;
}
.sh-bottom-nav-unselected {
    stroke: #4a4a4a ;
    color: #4a4a4a ;
}
.sh-bottom-nav-cart-badge {
    background-color: #68a33c ;
    color: #FFFFFF ;
}
.sh-product-wishlist-desktop {
    border-color: #68a33c ;
}
.sh-product-share-icon {
    stroke: #68a33c ;
}
.sh-product-card-price {
    color: #000000 ;
}
.sh-product-card-mrp {
    color: #8e8c93 ;
}
.sh-product-card-name {
    color: #000000 ;
    font-weight: 400 ;
}
.sh-product-card-discount-tag {
    background-color: #68a33c ;
    color: #ffffff ;
    font-weight: 400 ;
    border-radius: 20px ;
    right: 10px ;
    top: 10px ;
    left: auto ;
}
.sh-product-discount-tag {
    background-color: #68a33c ;
    color: #ffffff ;
    font-weight: 400 ;
    border-radius: 50% ;
}
.sh-product-social-button {
    background-color: #68a33c ;
    fill: #ffffff ;
}
.sh-product-wishlisted-icon {
    fill: #68a33c ;
}
.sh-product-not-wishlisted-icon {
    stroke: #690C0C ;
}
.sh-footer-main {
    background-color: #68a33c ;
    color: #ffffff ;
}
.sh-footer-icon {
    color: #000000 ;
}
.sh-outlined-button {
    border-radius: 0px ;
}
.sh-solid-button {
    border-radius: 20px ;
    color: #ffffff ;
    background-color: #68a33c ;
    fill: none ;
    border: 1px solid #68a33c ;
}
.sh-product-plus-minus-button {
    background-color: #ffffff ;
    color: #eb1a23 ;
    border-radius: 20px ;
    fill: #fff9ee ;
    border-color:#eb1a23 ;
   
}
.sh-product-buy-now-button {
    color: #ffffff ;
    background-color: #68a33c ;
    border-radius: 20px ;
}
.sh-categories-container {
    background-color: #ffffff 
}

.sh-product-card-enquiry {
   background-color: #ffffff ;
   color: #68a33c ;
   border: 1px solid #68a33c;
}

.review-card-subtext{
    display: none;
}



#sh-footer-copyright::before {
  content: "Disclaimer: The information on www.vinnerhealthcare is for general knowledge only and not a substitute for medical advice. Products and statements are not evaluated by any medical authority and are not intended to diagnose, treat, cure, or prevent any disease. Always consult your doctor before use. Results may vary person to person.";
  display: block;
/*  background-color: #26a269; /* Green background */*/
  color: #ffffff;
  padding: 12px 16px;
  font-size: 14px;
  line-height: 1.6;
  text-align: center;
  margin-bottom: 12px;
  border-radius: 6px;
  width: 100%;
  box-sizing: border-box;
}

/* 📱 Responsive for mobile */
@media (max-width: 768px) {
  #sh-footer-copyright::before {
    font-size: 12px;
    padding: 10px 12px;
  }
}





/* ===== refine-177592.css — Vinner Healthcare look & feel (round 3, easy-checkout "basic")
   Appended after the merchant's original CSS (live_backup/vinner-healthcare-live.css), so later rules win.
   Target values: theme-preview2/preview/vinner-healthcare/preview.css + theme.css. */

/* 1. Palette tokens.
   theme_color stays #29A56C (the theme maps it to a white header and a #0E4B35 footer, styles/theme.js);
   only the button colour moves to #146B43, because white text on #29A56C is 3.1:1 (fails AA) and on #146B43 is 6.5:1.
   Header icons were theme-default black (#000); the cart badge was the light brand green. */
html:root {
  --button-main: #146B43;
  --button-contrast-text: #FFFFFF;
  --button-borderColor: #146B43;
  --header-accent: #1C2B22;
  --header-badge-main: #C2530F;
  --header-badge-contrast-text: #FFFFFF;
  --typography-font-family: "Mukta", system-ui, -apple-system, "Segoe UI", "Noto Sans", Arial, sans-serif;
  --vh-ink: #1C2B22;
  --vh-muted: #5B6B60;
  --vh-line: #E8E1D3;
  --vh-cream: #FBF7EF;
  --vh-dark: #0E3B27;
  --vh-deal: #C2530F;
  --vh-cta: #146B43;
  --vh-serif: "Fraunces", Georgia, "Times New Roman", serif;
}

/* 2. Body text: was pure #000 in Arial; now ink in Mukta (older readers, covers Devanagari). */
.sh-body { color: var(--vh-ink); font-family: var(--typography-font-family); }

/* 3. Desktop menu: was a solid #29A56C bar with white uppercase links; the mock has ink links on white with hairlines. */
.menu-bar.sh-header-menu { background: #fff; border-top: 1px solid var(--vh-line); border-bottom: 1px solid var(--vh-line); }
.menu-bar.sh-header-menu .sh-header-submenu,
.menu-bar.sh-header-menu a.links { color: var(--vh-ink); font-weight: 600; }
.menu-bar.sh-header-menu a.links:hover { color: var(--vh-cta); }

/* 4. Search: square grey box → cream pill, as in the mock. */
.MuiPaper-root:has(> .search-field) { border-radius: 999px; background: var(--vh-cream); border: 1.5px solid var(--vh-line); box-shadow: none; }

/* 5. Header icons: the original CSS made them #68a33c (a different green from the brand); now ink. */
.sh-header-cart-icon { stroke: var(--vh-ink); }
.sh-header-cart-badge { background-color: var(--vh-deal); color: #fff; }

/* 6. Section titles: Arial 24/600 #1A1A1A → Fraunces 650, ink (the mock's serif echoes the pack lettering). */
.sh-section-heading .section-heading { font-family: var(--vh-serif); font-weight: 650; letter-spacing: -.01em; color: var(--vh-ink); }

/* 7. Buttons by role. Banner "Shop Now" was theme-default black; card ADD TO CART / ORDER NOW were red #EB1A23 outlines
   (original rule .sh-product-plus-minus-button); PDP Buy Now was #68a33c. */
.ban-cont-button.universal-btn-style { background-color: var(--button-main); color: #fff; border-color: var(--button-main); }
.sh-product-plus-minus-button { color: var(--vh-cta); border-color: var(--vh-cta); background-color: #fff; }
.sh-product-buy-now-button { background-color: var(--button-main); border-color: var(--button-main); color: #fff; }
.sh-solid-button { background-color: var(--button-main); border-color: var(--button-main); }

/* 8. Product card text and tags: #000 name/price → ink; discount tag #68a33c → saffron deal colour (from the logo's leaves). */
.sh-product-card-name { color: var(--vh-ink); font-weight: 600; }
.sh-product-card-price { color: var(--vh-ink); }
.sh-product-card-mrp { color: var(--vh-muted); }
.sh-product-card-discount-tag { background-color: var(--vh-deal); color: #fff; font-weight: 700; border-radius: 6px; }
.sh-product-discount-tag { background-color: var(--vh-deal); color: #fff; font-weight: 700; border-radius: 6px; }

/* 9. Product-page icons: share/wishlist were #68a33c, the not-wishlisted heart maroon #690C0C. */
.sh-product-share-icon { stroke: var(--vh-cta); }
.sh-product-wishlisted-icon { fill: var(--vh-cta); }
.sh-product-not-wishlisted-icon { stroke: var(--vh-ink); }
.sh-product-wishlist-desktop { border-color: var(--vh-line); }
.sh-product-social-button { background-color: var(--vh-cta); }

/* 10. Footer: on this theme it is the light three-column footer (#F7F6F4; the theme's own rule beats .sh-footer-main,
   so the original #68a33c never applied). The dark forest footer of the mock is a later round (footer).
   The merchant's disclaimer (original CSS, #sh-footer-copyright::before) is kept; it was white-ish on the light footer
   because a broken comment in the original swallowed its colour. Muted ink reads at ~5:1. */
#sh-footer-copyright::before { color: var(--vh-muted); }

/* 11. Fonts that skipped the site font: MUI buttons (Consultation Now, pincode Check) were Roboto,
   the Trusted Badges plugin sets Noto Sans on its wrapper. */
.MuiButtonBase-root.MuiButton-root,
.shoopy-trusted-badges-wrapper,
.shoopy-trusted-badge-label { font-family: var(--typography-font-family); }

/* 12. Phone bottom nav: the active label was white on #f5f5f5 (invisible), the active icon #68a33c (original CSS),
   inactive labels #bbb (~1.9:1). Active = deep green, inactive = muted ink. */
.sh-bottom-nav-main .bottom-nav__buttons.sh-bottom-nav-selected,
.sh-bottom-nav-main svg.sh-bottom-nav-selected { color: var(--vh-cta); stroke: var(--vh-cta); }
.sh-bottom-nav-main .bottom-nav__buttons.sh-bottom-nav-selected .MuiBottomNavigationAction-label { color: var(--vh-cta); font-weight: 600; }
.sh-bottom-nav-main .bottom-nav__buttons.sh-bottom-nav-unselected,
.sh-bottom-nav-main .bottom-nav__buttons.sh-bottom-nav-unselected .MuiBottomNavigationAction-label { color: var(--vh-muted); }

/* 13. One content column on home (round 5): the header and categories sit in a 1280px column, but the banner+products
   collection row and the "Products" grid ran edge to edge (x=20), under the fixed "Refer & Earn" tab (x 0–44). */
.sh-generic-collection-card,
.sh-home-page-prod-section,
.sh-prod-grid-collection-card { max-width: 1280px; margin-left: auto; margin-right: auto; } /* product rows added round 7 (Bestsellers) */

/* 14. Footer (round 12): the theme's light three-column footer (#F7F6F4) → the mock's forest #0E3B27. Needs footer element + class to beat the theme rule
   (a plain .sh-footer-main lost). Phone + WhatsApp numbers carry an ID rule (.sh-footer-main #sh-footer-git-mobile p) = bold #1A1A1A, so they get their own.
   Contrast on #0E3B27: links #DCE8E0 10:1, headings #fff 12.5:1, copyright #9FB6A8 5.8:1, disclaimer #B9CCC0 7.4:1. Contact icons gold as in the mock. */
footer.three-col-footer__footer.sh-footer-main { background-color: #0E3B27; color: #DCE8E0; }
footer.sh-footer-main .three-col-footer__heading { color: #FFFFFF; }
footer.sh-footer-main .three-col-footer__link,
footer.sh-footer-main .vertical-soc-cont a,
footer.sh-footer-main a { color: #DCE8E0; }
footer.sh-footer-main .three-col-footer__link:hover,
footer.sh-footer-main .vertical-soc-cont a:hover { color: #FFFFFF; }
footer.sh-footer-main #sh-footer-git-mobile p,
footer.sh-footer-main #sh-footer-git-whatsapp p { color: #FFFFFF; }
footer.sh-footer-main .sh-footer-icon { color: #F2C14E; fill: #F2C14E; }
footer.sh-footer-main .three-col-footer__rights { color: #9FB6A8; }
footer.sh-footer-main #sh-footer-copyright::before { color: #B9CCC0; }
footer.sh-footer-main hr { border-color: rgba(255,255,255,.14); }

/* 15. Phone "Refer & Earn" tab (round 13, home only): a fixed 44×188px vertical tab at the left edge (inline left:-72px; rotate(90deg))
   covered the first 44px of every section on phones. Under 769px it becomes a horizontal pill bottom-left, centred on the WhatsApp bubble
   (bubble 64px at bottom 76px) and 25px above the 59px bottom nav. Desktop keeps the side tab (content column starts at 103px). */
@media (max-width: 768px) {
  .ref-widg .root-ctn { left: 12px !important; top: auto !important; bottom: 88px !important; width: auto !important; transform: none !important; height: 40px; padding: 6px 14px; gap: 6px; border-radius: 999px; box-shadow: 0 4px 14px rgba(0,0,0,.18); }
  .ref-widg .root-ctn img { transform: none !important; width: 22px; height: 22px; }
}

/* 16. Leftover theme-default #000 text and off-brand fonts found in the round-15 audit:
   home category tile titles, listing/category "All Products" heading + filter labels, the account pop-up labels,
   and the WhatsApp chat window (plugin) in Roboto. The theme's single-class #000 rules load after this file,
   so each selector carries one extra element/class to win the tie. Listing heading takes the section-title serif. */
h3.cat-card-title,
p.filter-sheet-title,
p.category-filter-subtitle,
p.filter-subtitle,
p.price-filter-subtitle,
body .account-popup .ac-popup-label { color: var(--vh-ink); }
h1.products-prod-head { color: var(--vh-ink); font-family: var(--vh-serif); font-weight: 650; letter-spacing: -.01em; }
#cb12_window_wrapper, #cb12_window_wrapper * { font-family: var(--typography-font-family); }