/* Product detail refresh: a single, responsive reading and buying flow. */
body.q-theme { background: #f6f7f5; color: #172a38; }
.qpd-shell { max-width: 1440px; margin: 0 auto; padding: 24px clamp(18px, 3vw, 48px) 100px; }
.qpd-breadcrumb { margin: 0 0 20px; color: #6a7781; font-size: 12px; gap: 8px; }
.qpd-breadcrumb .current { max-width: min(38ch, 50vw); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.qpd-top { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr); grid-template-areas: "gallery info" "gallery buy"; gap: 0 clamp(28px, 4vw, 64px); align-items: start; }
.qpd-gallery { gap: 14px; position: sticky; top: 110px; }
.qpd-stage-wrap { perspective: none; }
.qpd-gallery .qpd-stage, .qpd-stage { aspect-ratio: 1 / .84; background: #fff; border: 1px solid #e4e9eb; border-radius: 24px; box-shadow: 0 12px 42px rgba(17, 38, 50, .045); transform: none !important; }
.qpd-stage:hover { box-shadow: 0 12px 42px rgba(17, 38, 50, .075); }
.qpd-stage-glare { display: none; }
.qpd-slides { transform: none !important; }
.qpd-slide { padding: clamp(24px, 5vw, 70px); }
.qpd-slide img { filter: none; }
.qpd-brand-chip { top: 18px; right: 18px; border: 1px solid #e8ecee; box-shadow: none; border-radius: 12px; }
.qpd-discount-badge { top: 18px; left: 18px; border-radius: 10px; background: #e26942; box-shadow: none; }
.qpd-stage-nav { opacity: 1; box-shadow: 0 3px 12px rgba(17,38,50,.1); }
.qpd-thumbs { gap: 10px; scrollbar-width: thin; }
.qpd-thumb { width: 68px; height: 68px; border-radius: 12px; }
.qpd-thumb.active { border-color: #147c81; box-shadow: 0 0 0 2px rgba(20,124,129,.12); }
.qpd-info { padding: 8px 0 0; animation: none; }
.qpd-title-price-row { gap: 8px; margin-bottom: 14px; }
.qpd-brand-label { color: #147c81; font-size: 12px; font-weight: 800; text-transform: uppercase; letter-spacing: .1em; }
.qpd-title { color: #152a39; font-size: clamp(29px, 2.8vw, 42px); line-height: 1.13; letter-spacing: -.035em; }
.qpd-rating-row { margin: 0 0 14px; }
.qpd-meta-row { gap: 7px 16px; color: #6c7984; font-size: 12px; margin: 0 0 16px; }
.qpd-meta-row span:last-child { display: none; }
.qpd-product-intro { font-size: 14px; line-height: 1.7; color: #4b5e6b; margin: 0 0 18px; }
.qpd-mobile-price-summary, .qpd-highlights { display: none !important; }
.qpd-offers-strip { margin: 14px 0; }
.qpd-offer-pill { border-radius: 12px; }
.qpd-buy-column { margin-top: 8px; max-width: none; border: 1px solid #dce6e6; border-radius: 20px; background: #fff; box-shadow: 0 16px 40px rgba(23, 57, 68, .06); overflow: hidden; }
.qpd-price-panel, .qpd-buy-column .qpd-buy-box, .qpd-buy-trust { background: transparent; border: 0; border-radius: 0; box-shadow: none; }
.qpd-price-panel { padding: 22px 26px 12px; }
.qpd-buy-column .qpd-price-tag .qpd-price-now { color: #152a39; font-size: clamp(31px, 3vw, 42px); letter-spacing: -.04em; }
.qpd-buy-column .qpd-price-tag .qpd-price-status { color: #152a39; font-size: 27px; font-weight: 800; letter-spacing: -.025em; }
.qpd-price-tag .qpd-price-save { color: #a8442d; background: #fff1eb; }
.qpd-buy-column .qpd-status-row { margin: 9px 0 0; }
.qpd-buy-column .qpd-buy-box { padding: 10px 26px 22px; }
.qpd-buy-column .qpd-buy-heading { display: none; }
.qpd-buy-column .qpd-delivery { display: none; }
.qpd-buy-column .qpd-enquire { background: #f3f7f6; border-color: #e1eae8; color: #4c6268; border-radius: 10px; }
.qpd-buy-column .qpd-whatsapp-btn { background: #168a57; color: #fff; border: 1px solid #168a57; min-height: 48px; border-radius: 10px; box-shadow: none; }
.qpd-buy-column .qpd-whatsapp-btn:hover { background: #0e7446; color: #fff; }
.qpd-buy-column .qpd-btn-cart { background: #176f75; border-radius: 10px; min-height: 48px; box-shadow: none; }
.qpd-buy-column .qpd-call-btn { border-radius: 10px; }
.qpd-buy-column .qpd-secondary-actions { margin-top: 16px; padding-top: 16px; border-top: 1px solid #ecf0f0; }
.qpd-action-link { border-radius: 9px; }
.qpd-buy-trust { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; padding: 16px 26px 22px; border-top: 1px solid #ecf0f0; }
.qpd-buy-trust div { margin: 0; line-height: 1.35; color: #667780; }
.qpd-buy-trust i { color: #147c81; }
.qpd-tabs-section { margin-top: clamp(34px, 5vw, 72px); }
.qpd-tabs-nav { gap: 8px; border-bottom: 1px solid #dfe7e7; margin-bottom: 20px; scrollbar-width: thin; }
.qpd-tab-btn { padding: 13px 16px; margin: 0; color: #596b75; font-size: 14px; border-radius: 10px 10px 0 0; }
.qpd-tab-btn.active { color: #126e73; background: #eaf4f2; }
.qpd-tab-btn.active::after { background: #147c81; }
.qpd-specs-wrap, .qpd-description-card { border: 1px solid #e1e8e8; background: #fff; border-radius: 18px; padding: clamp(18px, 3vw, 32px); }
.qpd-specs-wrap h3 { color: #152a39; font-size: 21px; margin-bottom: 20px; }
.qpd-spec-table { border: 0; }
.qpd-spec-table tr, .qpd-spec-table tr:nth-child(even) { background: transparent; }
.qpd-spec-table th, .qpd-spec-table td { padding: 15px 10px; border: 0; border-bottom: 1px solid #e9eeee; background: transparent; vertical-align: top; }
.qpd-spec-table th { color: #60717b; width: 34%; font-weight: 600; }
.qpd-spec-table td { color: #192f3d; font-weight: 650; }
.qpd-specs-toggle { color: #126e73; border-radius: 10px; }
.qpd-related { margin-top: clamp(38px, 5vw, 72px); }
.qpd-related-head h2 { color: #152a39; font-size: clamp(23px, 2.4vw, 30px); }
.qpd-related-head h2::before { background: #147c81; }
.qpd-related-card { border-color: #e1e8e8; border-radius: 16px; box-shadow: none; }
.qpd-related-card:hover { box-shadow: 0 10px 28px rgba(17, 38, 50, .1); }
.qpd-sticky-bar { border-color: #dce6e6; }
:where(.qpd-tab-btn, .qpd-thumb, .qpd-stage-nav, .qpd-btn-cart, .qpd-whatsapp-btn, .qpd-action-link, .qpd-related-card a):focus-visible { outline: 3px solid #e79b52; outline-offset: 3px; }
@media (max-width: 1050px) {
  .qpd-top { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); grid-template-areas: "gallery info" "gallery buy"; gap: 0 24px; }
  .qpd-gallery { position: static; }
  .qpd-gallery .qpd-stage { aspect-ratio: 1 / 1; }
  .qpd-title { font-size: clamp(26px, 3.5vw, 36px); }
}
@media (max-width: 720px) {
  .qpd-shell { padding: 16px 16px 100px; }
  .qpd-breadcrumb { margin-bottom: 14px; overflow: hidden; flex-wrap: nowrap; white-space: nowrap; }
  .qpd-breadcrumb a:not(:first-child), .qpd-breadcrumb a:not(:first-child) + .sep { display: none; }
  .qpd-breadcrumb .current { max-width: calc(100vw - 100px); }
  .qpd-top { display: flex; flex-direction: column; gap: 0; }
  .qpd-gallery, .qpd-info, .qpd-buy-column { width: 100%; }
  .qpd-gallery .qpd-stage { aspect-ratio: 1 / .82; border-radius: 16px; }
  .qpd-info { padding: 22px 0 0; }
  .qpd-title { font-size: clamp(26px, 7vw, 34px); }
  .qpd-meta-row { margin-bottom: 12px; }
  .qpd-buy-column { margin-top: 18px; border-radius: 16px; }
  .qpd-price-panel { padding: 19px 20px 10px; }
  .qpd-buy-column .qpd-buy-box { padding: 10px 20px 20px; }
  .qpd-buy-trust { padding: 16px 20px 20px; }
  .qpd-tabs-section { margin-top: 36px; }
  .qpd-tabs-nav { margin-right: -16px; padding-right: 16px; }
  .qpd-tab-btn { min-height: 46px; padding: 12px 14px; }
  .qpd-specs-wrap, .qpd-description-card { padding: 18px; }
  .qpd-spec-table th { width: 42%; }
  .qpd-spec-table th, .qpd-spec-table td { padding: 13px 6px; font-size: 13px; overflow-wrap: anywhere; }
  .qpd-related-card { width: 190px; }
  .qpd-sticky-bar { display: none !important; }
  body.q-theme { padding-bottom: 0; }
}
@media (max-width: 380px) {
  .qpd-buy-trust { grid-template-columns: 1fr; }
  .qpd-meta-row span:last-child { display: none; }
}

/* This file was built as a light-only redesign (every color above is a hardcoded hex,
   not a --q-* variable), so it silently broke dark mode: the toggle still sets
   html[data-store-theme="dark"] and the dark --q-text/--q-bg variables are right, but
   these later, more specific rules override them with dark-navy text on the still-dark
   background — exactly the "barely visible" bug reported on the title, spec headings,
   tab labels, and the "You May Also Like" heading. Mirrors store-appearance.css's own
   dark palette instead of inventing a second one. */
html[data-store-theme="dark"] body.q-theme { background: var(--q-bg); color: var(--q-text); }
html[data-store-theme="dark"] .qpd-breadcrumb { color: var(--q-text-muted); }
html[data-store-theme="dark"] .qpd-gallery .qpd-stage,
html[data-store-theme="dark"] .qpd-stage { background: var(--q-surface); border-color: var(--q-border); }
html[data-store-theme="dark"] .qpd-brand-chip { border-color: var(--q-border); background: var(--q-surface); }
html[data-store-theme="dark"] .qpd-title { color: var(--q-text); }
html[data-store-theme="dark"] .qpd-meta-row { color: var(--q-text-muted); }
html[data-store-theme="dark"] .qpd-product-intro { color: var(--q-text-muted); }
html[data-store-theme="dark"] .qpd-buy-column { background: var(--q-surface); border-color: var(--q-border); }
html[data-store-theme="dark"] .qpd-buy-column .qpd-price-tag .qpd-price-now,
html[data-store-theme="dark"] .qpd-buy-column .qpd-price-tag .qpd-price-status { color: var(--q-text); }
html[data-store-theme="dark"] .qpd-buy-column .qpd-enquire { background: var(--q-bg-secondary); border-color: var(--q-border); color: var(--q-text-muted); }
html[data-store-theme="dark"] .qpd-buy-column .qpd-secondary-actions { border-top-color: var(--q-border); }
html[data-store-theme="dark"] .qpd-buy-trust { border-top-color: var(--q-border); }
html[data-store-theme="dark"] .qpd-buy-trust div { color: var(--q-text-muted); }
html[data-store-theme="dark"] .qpd-tabs-nav { border-bottom-color: var(--q-border); }
html[data-store-theme="dark"] .qpd-tab-btn { color: var(--q-text-muted); }
html[data-store-theme="dark"] .qpd-tab-btn.active { color: var(--q-primary); background: var(--q-primary-tint); }
html[data-store-theme="dark"] .qpd-specs-wrap,
html[data-store-theme="dark"] .qpd-description-card { background: var(--q-surface); border-color: var(--q-border); }
html[data-store-theme="dark"] .qpd-specs-wrap h3 { color: var(--q-text); }
html[data-store-theme="dark"] .qpd-spec-table th, .qpd-spec-table td { border-bottom-color: var(--q-border); }
html[data-store-theme="dark"] .qpd-spec-table th { color: var(--q-text-muted); }
html[data-store-theme="dark"] .qpd-spec-table td { color: var(--q-text); }
html[data-store-theme="dark"] .qpd-specs-toggle { color: var(--q-primary); }
html[data-store-theme="dark"] .qpd-related-head h2 { color: var(--q-text); }
html[data-store-theme="dark"] .qpd-related-card { border-color: var(--q-border); background: var(--q-surface); }
html[data-store-theme="dark"] .qpd-sticky-bar { border-color: var(--q-border); background: var(--q-surface); }