/* MPBD-DESIGN-TOKENS
   Medical Product BD — brand design tokens.
   Brand navy #1e3e72 sampled from the "Medical Product" logo. */
:root {
  --mpbd-primary: #1e3e72;        /* brand navy (logo) */
  --mpbd-primary-dark: #15294d;
  --mpbd-primary-light: #2f5ba8;  /* hover / links */
  --mpbd-accent: #f5821f;         /* CTA / add-to-cart */
  --mpbd-sale: #e63946;           /* discount / price-drop */
  --mpbd-success: #1aa260;        /* in stock */
  --mpbd-ink: #1f2a37;            /* body text */
  --mpbd-muted: #6b7280;
  --mpbd-line: #e5e7eb;
  --mpbd-bg-soft: #f4f6f9;
  --mpbd-radius: 10px;
  --mpbd-container: 1320px;
}
/* END MPBD-DESIGN-TOKENS */

/* MPBD-FEATURED-FIX — show the page featured image PROPERLY. Astra force-crops it to a distorted
   oversized 16:9 (object-fit:cover) banner with negative margins (a square 800x800 image became a
   stretched 1520x855 that overflowed). Instead: display at natural ratio, contained, centered. */
body.page .ast-single-post-featured-section {
  display: block !important; max-width: 1000px !important; width: auto !important;
  margin-left: auto !important; margin-right: auto !important; margin-top: 22px !important; padding: 0 16px !important;
}
body.page .ast-single-post-featured-section img {
  width: auto !important; max-width: 100% !important; height: auto !important; max-height: 430px;
  aspect-ratio: auto !important; object-fit: contain !important; margin: 0 auto; display: block; border-radius: 12px;
}
/* END MPBD-FEATURED-FIX */

/* MPBD-OVERFLOW-GUARD: stop stray horizontal scroll site-wide.
   Use on BODY (not html): overflow-x:clip on <html> fights WordPress's admin-bar
   `html{margin-top:32px}` and produces a 32px white gap + pushes content down.
   On <body> it clips horizontally, keeps the sticky header working, and leaves
   the admin-bar offset intact. */
body { overflow-x: clip; }
.ast-container { min-width: 0; }
.entry-content img, .entry-content iframe, .entry-content video, .entry-content table { max-width: 100%; }
/* END MPBD-OVERFLOW-GUARD */

/* MPBD-BUTTONS (global — used on home + inner pages) */
.mpbd-btn { display: inline-flex; align-items: center; gap: 8px; padding: 12px 24px; border-radius: 8px; font-weight: 700; text-decoration: none; font-size: 15px; transition: .15s; cursor: pointer; border: 0; }
.mpbd-btn-primary { background: var(--mpbd-accent); color: #fff !important; }
.mpbd-btn-primary:hover { filter: brightness(1.06); color: #fff; }
.mpbd-btn-ghost { background: rgba(255,255,255,.14); color: #fff !important; border: 1px solid rgba(255,255,255,.4); }
.mpbd-btn-ghost:hover { background: rgba(255,255,255,.24); }
.mpbd-btn-outline { background: #fff; color: var(--mpbd-primary) !important; border: 1px solid var(--mpbd-primary); }
.mpbd-btn-outline:hover { background: var(--mpbd-primary); color: #fff !important; }
/* END MPBD-BUTTONS */

/* MPBD-BASE */
.mpbd-container { max-width: var(--mpbd-container); margin: 0 auto; padding-left: 16px; padding-right: 16px; }
.mpbd-ico { display: inline-block; vertical-align: middle; flex: none; }
body.mpbd-no-scroll { overflow: hidden; }
img.mpbd-footer-logo, img.mpbd-offcanvas-logo { height: auto; }
/* END MPBD-BASE */

/* MPBD-HEADER */
/* z-index 1000 (> navbar's 999): .mpbd-navbar is a SIBLING of this header, and the
   header's z-index caps every child — the search suggest dropdown could never beat
   the navbar from inside a 998 context, whatever its own z-index. They never overlap
   each other visually, so raising the header is safe. */
.mpbd-header { background: #fff; position: relative; z-index: 1000; box-shadow: 0 1px 0 var(--mpbd-line); }
/* Only the nav/menu bar sticks while scrolling (top bar + logo/search scroll away). */
.mpbd-navbar { position: sticky; top: 0; z-index: 999; }
.mpbd-navbar.is-stuck { box-shadow: 0 8px 22px rgba(15,32,60,.14); }
body.admin-bar .mpbd-navbar { top: 32px; }
@media (max-width: 782px){ body.admin-bar .mpbd-navbar { top: 46px; } }

/* Top bar */
.mpbd-topbar { background: var(--mpbd-primary-dark); color: #dbe4f3; font-size: 13px; }
.mpbd-topbar-inner { display: flex; align-items: center; justify-content: space-between; min-height: 38px; gap: 14px; }
.mpbd-topbar-left { display: flex; align-items: center; gap: 8px; opacity: .95; }
.mpbd-topbar-left .mpbd-ico { color: #9fc1ff; }
.mpbd-topbar-right { display: flex; align-items: center; gap: 18px; }
.mpbd-topbar-right a { color: #dbe4f3; text-decoration: none; display: inline-flex; align-items: center; gap: 6px; }
.mpbd-topbar-right a:hover { color: #fff; }
.mpbd-topbar-phone { font-weight: 600; }

/* Main bar */
.mpbd-mainbar { padding: 14px 0; }
.mpbd-mainbar-inner { display: flex; align-items: center; gap: 22px; }
.mpbd-burger { display: none; background: none; border: 0; color: var(--mpbd-primary); cursor: pointer; padding: 4px; }
.mpbd-logo { flex: none; display: block; }
.mpbd-logo img { height: 46px; width: auto; display: block; }
.mpbd-search-wrap { flex: 1 1 auto; }
.mpbd-search { display: flex; align-items: stretch; border: 1px solid var(--mpbd-line); border-radius: 8px; overflow: hidden; background: #fff; max-width: 720px; }
.mpbd-search:focus-within { border-color: var(--mpbd-primary-light); }
/* !important + radius reset: Astra/Elementor global input+button styles (same
   specificity, later in the combined cascade) re-add a 1px border and a 4px radius
   to the inner controls, making each look like its own box inside the pill. */
.mpbd-search-cat { border: 0 !important; border-radius: 0 !important; box-shadow: none !important; background: var(--mpbd-bg-soft); padding: 0 14px; font-size: 14px; color: var(--mpbd-ink); max-width: 190px; cursor: pointer; border-right: 1px solid var(--mpbd-line) !important; outline: none; }
.mpbd-search-input { border: 0 !important; border-radius: 0 !important; box-shadow: none !important; flex: 1 1 auto; padding: 11px 14px; font-size: 15px; outline: none; min-width: 0; }
.mpbd-search-btn { border: 0 !important; border-radius: 0 !important; box-shadow: none !important; background: var(--mpbd-primary); color: #fff; padding: 0 20px; cursor: pointer; display: flex; align-items: center; }
.mpbd-search-btn:hover { background: var(--mpbd-primary-light); }

.mpbd-hotline { display: flex; align-items: center; gap: 10px; text-decoration: none; color: var(--mpbd-ink); flex: none; }
.mpbd-hotline-ic { width: 42px; height: 42px; border-radius: 50%; background: var(--mpbd-bg-soft); color: var(--mpbd-primary); display: flex; align-items: center; justify-content: center; }
.mpbd-hotline-txt { display: flex; flex-direction: column; line-height: 1.2; }
.mpbd-hotline-txt small { color: var(--mpbd-muted); font-size: 12px; }
.mpbd-hotline-txt b { font-size: 15px; color: var(--mpbd-primary); }

.mpbd-actions { display: flex; align-items: center; gap: 6px; flex: none; }
.mpbd-action { position: relative; display: flex; flex-direction: column; align-items: center; gap: 3px; text-decoration: none; color: var(--mpbd-ink); padding: 6px 10px; border-radius: 8px; font-size: 12px; min-width: 56px; }
.mpbd-action:hover { background: var(--mpbd-bg-soft); color: var(--mpbd-primary); }
.mpbd-action-txt { font-size: 12px; color: var(--mpbd-muted); }
.mpbd-cart-ico { position: relative; display: inline-flex; }
.mpbd-cart-count { position: absolute; top: -8px; right: -10px; background: var(--mpbd-accent); color: #fff; font-size: 11px; font-weight: 700; min-width: 18px; height: 18px; line-height: 18px; text-align: center; border-radius: 10px; padding: 0 4px; }
.mpbd-action-cart .mpbd-cart-amt { color: var(--mpbd-primary); font-weight: 600; }

/* Nav bar */
.mpbd-navbar { background: var(--mpbd-primary); }
.mpbd-navbar-inner { display: flex; align-items: stretch; gap: 18px; }
.mpbd-allcats { position: relative; flex: none; }
.mpbd-allcats-btn { display: flex; align-items: center; gap: 10px; background: var(--mpbd-primary-dark); color: #fff; border: 0; cursor: pointer; padding: 0 20px; height: 100%; min-height: 48px; font-size: 15px; font-weight: 600; min-width: 220px; }
.mpbd-allcats-btn .mpbd-ico-chevdown { margin-left: auto; }
.mpbd-allcats-panel { position: absolute; top: 100%; left: 0; width: 280px; background: #fff; border: 1px solid var(--mpbd-line); border-top: 0; box-shadow: 0 16px 34px rgba(15,32,60,.16); z-index: 1000; opacity: 0; visibility: hidden; transform: translateY(6px); transition: .16s ease; }
.mpbd-allcats:hover .mpbd-allcats-panel,
.mpbd-allcats.is-open .mpbd-allcats-panel { opacity: 1; visibility: visible; transform: translateY(0); }

.mpbd-primary-nav { flex: 1 1 auto; }
.mpbd-nav-menu { list-style: none; margin: 0; padding: 0; display: flex; align-items: center; gap: 4px; height: 100%; }
.mpbd-nav-menu > li { position: relative; }
.mpbd-nav-menu > li > a { display: flex; align-items: center; height: 48px; padding: 0 14px; color: #eaf0fb; text-decoration: none; font-size: 14.5px; font-weight: 500; }
.mpbd-nav-menu > li > a:hover { background: rgba(255,255,255,.12); color: #fff; }
.mpbd-nav-menu .sub-menu { list-style: none; margin: 0; padding: 8px 0; position: absolute; top: 100%; left: 0; min-width: 230px; background: #fff; border: 1px solid var(--mpbd-line); box-shadow: 0 14px 30px rgba(15,32,60,.16); opacity: 0; visibility: hidden; transform: translateY(6px); transition: .15s; z-index: 1000; }
.mpbd-nav-menu > li:hover > .sub-menu { opacity: 1; visibility: visible; transform: translateY(0); }
.mpbd-nav-menu .sub-menu a { display: block; padding: 9px 16px; color: var(--mpbd-ink); text-decoration: none; font-size: 14px; }
.mpbd-nav-menu .sub-menu a:hover { background: var(--mpbd-bg-soft); color: var(--mpbd-primary); }
.mpbd-navbar-right { display: flex; align-items: center; flex: none; }
.mpbd-nav-offer { display: inline-flex; align-items: center; gap: 7px; color: #fff; text-decoration: none; font-weight: 600; font-size: 14px; }
.mpbd-nav-offer:hover { color: #ffd9b3; }
/* END MPBD-HEADER */

/* MPBD-MEGAMENU */
.mpbd-catmenu-list { list-style: none; margin: 0; padding: 6px 0; }
.mpbd-catmenu-item { position: relative; }
.mpbd-catmenu-link { display: flex; align-items: center; gap: 12px; padding: 10px 16px; color: var(--mpbd-ink); text-decoration: none; font-size: 14px; }
.mpbd-catmenu-link:hover { background: var(--mpbd-bg-soft); color: var(--mpbd-primary); }
.mpbd-catmenu-ic { width: 26px; height: 26px; display: inline-flex; align-items: center; justify-content: center; color: var(--mpbd-primary); flex: none; }
.mpbd-catmenu-ic img { width: 26px; height: 26px; object-fit: contain; }
.mpbd-catmenu-label { flex: 1 1 auto; }
.mpbd-catmenu-arrow { color: var(--mpbd-muted); display: inline-flex; }
.mpbd-catmenu-flyout { position: absolute; top: 0; left: 100%; min-width: 480px; max-width: 560px; background: #fff; border: 1px solid var(--mpbd-line); box-shadow: 0 16px 34px rgba(15,32,60,.16); padding: 18px 20px; min-height: 100%; opacity: 0; visibility: hidden; transform: translateX(6px); transition: .15s; z-index: 1001; }
.mpbd-catmenu-item.has-children:hover > .mpbd-catmenu-flyout { opacity: 1; visibility: visible; transform: translateX(0); }
.mpbd-catmenu-flyout-title { margin: 0 0 12px; font-size: 16px; color: var(--mpbd-primary); }
.mpbd-catmenu-flyout-title a { color: inherit; text-decoration: none; }
.mpbd-catmenu-sublist { list-style: none; margin: 0; padding: 0; column-count: 2; column-gap: 24px; }
.mpbd-catmenu-sublist li { break-inside: avoid; margin-bottom: 4px; }
.mpbd-catmenu-sublist a { display: flex; justify-content: space-between; gap: 10px; padding: 5px 0; color: var(--mpbd-ink); text-decoration: none; font-size: 13.5px; }
.mpbd-catmenu-sublist a:hover { color: var(--mpbd-primary); }
.mpbd-catmenu-cnt { color: var(--mpbd-muted); font-size: 12px; }
/* END MPBD-MEGAMENU */

/* MPBD-OFFCANVAS */
.mpbd-offcanvas-overlay { position: fixed; inset: 0; background: rgba(15,23,42,.5); z-index: 1100; opacity: 0; transition: opacity .2s; }
.mpbd-offcanvas-overlay.is-open { opacity: 1; }
.mpbd-offcanvas { position: fixed; top: 0; left: 0; height: 100%; width: 320px; max-width: 86vw; background: #fff; z-index: 1101; transform: translateX(-100%); transition: transform .24s ease; display: flex; flex-direction: column; overflow: hidden; }
.mpbd-offcanvas.is-open { transform: translateX(0); box-shadow: 0 0 40px rgba(0,0,0,.25); }
.mpbd-offcanvas-head { display: flex; align-items: center; justify-content: space-between; padding: 14px 16px; border-bottom: 1px solid var(--mpbd-line); }
.mpbd-offcanvas-logo { height: 38px; width: auto; max-width: 70%; }
.mpbd-offcanvas-close { background: none; border: 0; color: var(--mpbd-ink); cursor: pointer; flex: none; width: 40px; height: 40px; padding: 0; display: flex; align-items: center; justify-content: center; }
.mpbd-offcanvas-body { overflow-y: auto; padding: 8px 0 40px; flex: 1 1 auto; }
.mpbd-offcanvas-title { margin: 14px 16px 4px; font-size: 12px; text-transform: uppercase; letter-spacing: .04em; color: var(--mpbd-muted); }
.mpbd-offcanvas .mpbd-nav-menu { flex-direction: column; align-items: stretch; gap: 0; }
.mpbd-offcanvas .mpbd-nav-menu > li > a { height: auto; padding: 11px 16px; color: var(--mpbd-ink); border-bottom: 1px solid var(--mpbd-line); }
.mpbd-offcanvas .mpbd-nav-menu > li > a:hover { background: var(--mpbd-bg-soft); }
.mpbd-offcanvas .mpbd-catmenu-flyout { position: static; min-width: 0; max-width: none; box-shadow: none; border: 0; border-bottom: 1px solid var(--mpbd-line); padding: 0 16px 10px 40px; display: none; opacity: 1; visibility: visible; transform: none; }
.mpbd-offcanvas .mpbd-catmenu-item.is-open > .mpbd-catmenu-flyout { display: block; }
.mpbd-offcanvas .mpbd-catmenu-sublist { column-count: 1; }
.mpbd-offcanvas .mpbd-catmenu-link { border-bottom: 1px solid var(--mpbd-line); }
/* END MPBD-OFFCANVAS */

/* MPBD-FOOTER */
.mpbd-footer { background: #0f1c33; color: #b9c4d6; margin-top: 50px; }
.mpbd-footer a { color: #c7d2e3; text-decoration: none; }
.mpbd-footer a:hover { color: #fff; }
.mpbd-footer-trust { background: #142544; border-bottom: 1px solid rgba(255,255,255,.06); }
.mpbd-trust-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 20px; padding: 22px 16px; }
.mpbd-trust-item { display: flex; align-items: center; gap: 14px; }
.mpbd-trust-item .mpbd-ico { color: var(--mpbd-accent); }
.mpbd-trust-item b { display: block; color: #fff; font-size: 14.5px; }
.mpbd-trust-item span { font-size: 12.5px; color: #93a2bb; }
.mpbd-footer-main { padding: 42px 0 30px; }
.mpbd-footer-grid { display: grid; grid-template-columns: 1.6fr 1fr 1.2fr 1fr 1fr; gap: 30px; }
.mpbd-footer-logo { height: 44px; margin-bottom: 14px; filter: brightness(0) invert(1); }
.mpbd-footer-about p { font-size: 13.5px; line-height: 1.7; margin: 0 0 14px; }
.mpbd-footer-contact { list-style: none; margin: 0 0 14px; padding: 0; }
.mpbd-footer-contact li { display: flex; gap: 10px; align-items: flex-start; margin-bottom: 9px; font-size: 13.5px; }
.mpbd-footer-contact .mpbd-ico { color: var(--mpbd-accent); margin-top: 2px; flex: none; }
.mpbd-footer-social { display: flex; gap: 10px; }
.mpbd-footer-social a { width: 36px; height: 36px; border-radius: 50%; background: rgba(255,255,255,.08); display: flex; align-items: center; justify-content: center; }
.mpbd-footer-social a:hover { background: var(--mpbd-primary-light); }
.mpbd-footer-title { color: #fff; font-size: 15px; margin: 0 0 16px; position: relative; padding-bottom: 10px; }
.mpbd-footer-title::after { content: ""; position: absolute; left: 0; bottom: 0; width: 36px; height: 2px; background: var(--mpbd-accent); }
.mpbd-footer-list { list-style: none; margin: 0; padding: 0; }
.mpbd-footer-list li { margin-bottom: 9px; font-size: 13.5px; }
.mpbd-footer-callout { font-size: 13.5px; margin: 0 0 12px; }
/* Phone + WhatsApp buttons: flex row that wraps — stacks in the narrow desktop column,
   sits inline as an equal-width pair on mobile's full-width footer column. */
.mpbd-footer-actions { display: flex; flex-wrap: wrap; gap: 10px; }
.mpbd-footer-callbtn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; background: var(--mpbd-accent); color: #fff !important; padding: 10px 16px; border-radius: 8px; font-weight: 700; }
.mpbd-footer-callbtn:hover { filter: brightness(1.05); }
.mpbd-footer-wabtn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; background: #25d366; color: #fff !important; padding: 10px 16px; border-radius: 8px; font-weight: 700; }
.mpbd-footer-actions .mpbd-footer-callbtn,
.mpbd-footer-actions .mpbd-footer-wabtn { flex: 1 1 auto; margin: 0; white-space: nowrap; }
.mpbd-footer-bottom { background: #0a1426; }
.mpbd-footer-bottom-inner { display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 16px; font-size: 13px; color: #8b9ab5; }
/* END MPBD-FOOTER */

/* MPBD-RESPONSIVE */
@media (max-width: 1024px) {
  .mpbd-topbar-left span { display: none; }
  .mpbd-hotline, .mpbd-action-txt, .mpbd-nav-offer { display: none; }
  .mpbd-burger { display: inline-flex; }
  .mpbd-navbar { display: none; }
  .mpbd-mainbar-inner { gap: 14px; }
  .mpbd-action { min-width: 0; padding: 6px; }
  .mpbd-footer-grid { grid-template-columns: 1fr 1fr; gap: 26px; }
  .mpbd-trust-grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 768px) {
  .mpbd-topbar-right a:not(.mpbd-topbar-phone) { display: none; }
  .mpbd-search-cat { display: none; }
  .mpbd-search { max-width: none; }
  .mpbd-hotline { display: none; }
  /* Row 1 = burger + logo + action icons; row 2 = full-width search bar */
  .mpbd-mainbar-inner { flex-wrap: wrap; row-gap: 12px; column-gap: 12px; }
  .mpbd-burger { order: 1; }
  .mpbd-logo { order: 2; }
  .mpbd-actions { order: 3; margin-left: auto; }
  .mpbd-search-wrap { order: 4; flex: 1 0 100%; }
  .mpbd-search-input { padding: 12px 14px; font-size: 15px; }
  .mpbd-search-btn { padding: 0 18px; }
}
@media (max-width: 600px) {
  .mpbd-footer-grid { grid-template-columns: 1fr; }
  .mpbd-trust-grid { grid-template-columns: 1fr; }
  .mpbd-footer-bottom-inner { flex-direction: column; text-align: center; }
  .mpbd-mainbar { padding: 10px 0; }
  /* Cart total takes too much room on a phone — show just the cart icon + count badge */
  .mpbd-cart-amt { display: none; }
  .mpbd-actions { gap: 2px; }
  .mpbd-action { padding: 6px 5px; }
}
/* END MPBD-RESPONSIVE */

/* MPBD-LIGHTEN — lighter theme (boss 2026-07-14): WHITE nav bar + SOFTER footer.
   Navy text accents (prices/headings/links) stay for contrast. Thin navy top bar kept.
   This block intentionally sits last so it overrides the base MPBD-HEADER/FOOTER colors. */

/* --- White nav bar with navy text --- */
.mpbd-navbar { background: #fff; border-top: 1px solid var(--mpbd-line); border-bottom: 1px solid var(--mpbd-line); box-shadow: 0 3px 10px rgba(15,32,60,.05); }
.mpbd-nav-menu > li > a { color: var(--mpbd-ink); }
.mpbd-nav-menu > li > a:hover { background: var(--mpbd-bg-soft); color: var(--mpbd-primary); }
.mpbd-nav-menu > li.current-menu-item > a,
.mpbd-nav-menu > li.current_page_item > a { color: var(--mpbd-primary); }
.mpbd-nav-offer { color: var(--mpbd-primary); }
.mpbd-nav-offer:hover { color: var(--mpbd-accent); }
/* "All Categories" launcher stays navy so it reads as the category button */
.mpbd-allcats-btn { background: var(--mpbd-primary); }
.mpbd-allcats-btn:hover { background: var(--mpbd-primary-dark); }

/* --- Softer, lighter footer (slate-blue instead of near-black navy) --- */
.mpbd-footer { background: #2b4674; }
.mpbd-footer a { color: #cdd8ea; }
.mpbd-footer-trust { background: #34568a; border-bottom-color: rgba(255,255,255,.10); }
.mpbd-footer-trust .mpbd-trust-item span { color: #b7c6de; }
.mpbd-footer-bottom { background: #223a60; }
.mpbd-footer-bottom-inner { color: #a6b6d0; }
.mpbd-footer-about p { color: #c2cee1; }
/* END MPBD-LIGHTEN */

/* MPBD-SCROLLTOP — bigger back-to-top button (Astra default is tiny) */
#ast-scroll-top { width: 46px !important; height: 46px !important; display: flex !important; align-items: center !important; justify-content: center !important; padding: 0 !important; font-size: 22px !important; line-height: 1 !important; border-radius: 10px !important; }
#ast-scroll-top svg { width: 22px !important; height: 22px !important; }
/* Kill the ugly dotted focus outline on mouse click; keep a clean ring for keyboard users */
#ast-scroll-top:focus { outline: none !important; }
#ast-scroll-top:focus-visible { outline: 2px solid var(--mpbd-primary-light) !important; outline-offset: 2px; }
@media (max-width: 921px) {
  #ast-scroll-top { width: 40px !important; height: 40px !important; font-size: 19px !important; }
  #ast-scroll-top svg { width: 19px !important; height: 19px !important; }
}
/* END MPBD-SCROLLTOP */

/* MPBD-CREDIT — footer "Designed by BiswasHost" link */
.mpbd-credit a { color: var(--mpbd-accent); text-decoration: none; font-weight: 600; }
.mpbd-credit a:hover { text-decoration: underline; }
/* END MPBD-CREDIT */

/* MPBD-CART-TOAST: added-to-cart toast (bottom-center) + hide the raw inline
   "View cart" link Woo appends to cards (the toast carries the link instead). */
#mpbd-toast { position: fixed; left: 50%; bottom: 26px; transform: translateX(-50%) translateY(16px); display: flex; align-items: center; gap: 10px; background: var(--mpbd-primary, #12395f); color: #fff; padding: 12px 18px; border-radius: 10px; box-shadow: 0 10px 30px rgba(16,24,40,.28); font-size: 14px; font-weight: 600; line-height: 1.4; z-index: 100000; opacity: 0; visibility: hidden; transition: opacity .25s ease, transform .25s ease, visibility .25s; max-width: calc(100vw - 32px); }
#mpbd-toast.show { opacity: 1; visibility: visible; transform: translateX(-50%) translateY(0); }
.mpbd-toast-ico { display: inline-flex; align-items: center; justify-content: center; width: 22px; height: 22px; border-radius: 50%; background: var(--mpbd-success, #1e9e4a); color: #fff; font-size: 12px; flex: 0 0 22px; }
.mpbd-toast-msg { min-width: 0; }
.mpbd-toast-link { color: #ffd9b3 !important; white-space: nowrap; text-decoration: none; font-weight: 700; }
.mpbd-toast-link:hover { text-decoration: underline; }
.mpbd-pcard-cart .added_to_cart { display: none !important; }
/* END MPBD-CART-TOAST */

/* MPBD-LIVE-SEARCH: auto-suggest dropdown under the header search box */
/* z-index on the ANCHOR (not just the dropdown): the sticky .mpbd-navbar (z-999)
   is a sibling stacking context — the dropdown's own z-index can't beat it unless
   its positioned ancestor outranks the navbar. */
.mpbd-suggest-anchor { position: relative; z-index: 1201; }
.mpbd-suggest { position: absolute; top: calc(100% + 6px); left: 0; right: 0; max-width: 720px; background: #fff; border: 1px solid var(--mpbd-line); border-radius: 10px; box-shadow: 0 14px 40px rgba(16,24,40,.16); z-index: 1200; display: none; max-height: 430px; overflow-y: auto; }
.mpbd-suggest.open { display: block; }
.mpbd-suggest-item { display: flex; align-items: center; gap: 12px; padding: 10px 14px; text-decoration: none; border-bottom: 1px solid var(--mpbd-bg-soft); }
.mpbd-suggest-item:hover, .mpbd-suggest-item.active { background: var(--mpbd-bg-soft); }
.mpbd-suggest-item img, .mpbd-suggest-noimg { width: 42px; height: 42px; flex: 0 0 42px; object-fit: cover; border-radius: 6px; background: var(--mpbd-bg-soft); }
.mpbd-suggest-name { flex: 1 1 auto; min-width: 0; font-size: 14px; color: var(--mpbd-ink); line-height: 1.35; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.mpbd-suggest-name mark { background: none; color: var(--mpbd-primary-light); font-weight: 700; }
.mpbd-suggest-price { flex: none; font-size: 13px; font-weight: 700; color: var(--mpbd-accent); white-space: nowrap; }
.mpbd-suggest-more { display: block; text-align: center; padding: 11px 14px; font-size: 13.5px; font-weight: 700; color: var(--mpbd-primary-light); text-decoration: none; background: #fbfcfe; }
.mpbd-suggest-more:hover, .mpbd-suggest-more.active { background: var(--mpbd-bg-soft); }
.mpbd-suggest-empty { padding: 14px; text-align: center; font-size: 13.5px; color: var(--mpbd-muted); }
/* END MPBD-LIVE-SEARCH */