/* ============================================================
   Tavoron – Product Detail Page (PDP)
   ============================================================ */

/* ── Wrapper ──────────────────────────────────────────────── */
.tavoron-pdp {
    max-width: 1280px;
    margin: 0 auto;
    padding: 0;
}

/* ── Top row: gallery + info + marketing ─────────────────── */
.tavoron-pdp__top {
    display: flex;
    align-items: stretch;
    gap: 32px;
    padding: 16px 20px 16px;
}

.tavoron-pdp__gallery {
    flex: 0 0 420px;
    max-width: 420px;
}

/* WooCommerce gallery fits the column */
.tavoron-pdp__gallery .woocommerce-product-gallery {
    margin: 0 !important;
    float: none !important;
    width: 100% !important;
    max-width: 100% !important;
}

/* ── Product info column ──────────────────────────────────── */
.tavoron-pdp__info {
    flex: 1;
    min-width: 0;
    padding-top: 4px;
    display: flex;
    flex-direction: column;
}

.tavoron-pdp__title,
.tavoron-pdp h1.tavoron-pdp__title {
    font-size: 30px !important;
    font-weight: 700 !important;
    line-height: 1.25 !important;
    color: #183a4b !important;
    margin: 0 0 10px !important;
    padding: 0 !important;
    border: none !important;
}

/* Manufacturer / Series as meta-line links */
.tavoron-pdp__mfg-link,
.tavoron-pdp__series-link {
    color: #1a4ca8 !important;
    font-weight: 500;
    text-decoration: none;
}

.tavoron-pdp__mfg-link:hover,
.tavoron-pdp__series-link:hover {
    text-decoration: underline;
    color: #1a4ca8 !important;
}

/* ── Geographic restriction notice ───────────────────────── */
.tavoron-pdp__geo-notice {
    margin-top: auto;
    border: 1px solid #e5e7eb;
    border-radius: 6px;
    overflow: hidden;
}

.tavoron-pdp__geo-notice-header {
    background: #f9fafb;
    border-bottom: 1px solid #e5e7eb;
    padding: 8px 14px;
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: #374151;
}

.tavoron-pdp__geo-notice-body {
    padding: 10px 14px;
    font-size: 13px;
    color: #6b7280;
    line-height: 1.5;
}

.tavoron-pdp__geo-notice-body p { margin: 0; }

/* ── Marketing content spot ───────────────────────────────── */
.tavoron-pdp__marketing {
    flex: 0 0 240px;
    min-width: 0;
    align-self: stretch;
    display: flex;
    flex-direction: column;
}

.tavoron-pdp__marketing-inner {
    border: 1px dashed #d1d5db;
    border-radius: 8px;
    padding: 20px 16px;
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #fafafa;
    box-sizing: border-box;
}

.tavoron-pdp__marketing {
    position: relative;
}

.tavoron-pdp__marketing-inner {
    position: absolute !important;
    inset: 0 !important;
    overflow: hidden !important;
    padding: 0 !important;
    border: none !important;
    background: none !important;
    border-radius: 8px !important;
}

.tavoron-pdp__marketing-inner a {
    position: absolute;
    inset: 0;
    display: block;
}

.tavoron-pdp__marketing-image {
    position: absolute;
    top: 50%;
    left: 50%;
    max-width: none !important;
    max-height: none !important;
    /* contain (not cover) - the column is a narrow, tall box while these
     * banners are wide landscape images; cover would crop most of the image
     * away without the rotation this used to rely on. Contain shows the
     * full image, letterboxed, instead of cropping it. */
    object-fit: contain;
    object-position: center center;
    transform: translate(-50%, -50%);
}

.tavoron-pdp__marketing-placeholder {
    font-size: 13px;
    color: #9ca3af;
    text-align: center;
    margin: 0;
    font-style: italic;
    line-height: 1.5;
}

.tavoron-pdp__meta-line {
    font-size: 14px;
    color: #374151;
    margin: 0 0 6px;
    display: flex;
    gap: 8px;
}

.tavoron-pdp__meta-label {
    color: #6b7280;
    min-width: 110px;
    flex-shrink: 0;
}

.tavoron-pdp__stock {
    display: inline-block;
    align-self: flex-start;
    margin-top: 10px;
    margin-bottom: 16px;
    font-size: 13px;
    font-weight: 600;
    padding: 4px 12px;
    border-radius: 4px;
}

.tavoron-pdp__stock--instock     { background: #dcfce7; color: #166534; }
.tavoron-pdp__stock--outofstock  { background: #fee2e2; color: #991b1b; }
.tavoron-pdp__stock--onbackorder { background: #fef3c7; color: #92400e; }

/* ── 3-column collapsible panels ─────────────────────────── */
.tavoron-pdp__panels-wrapper {
    padding: 0 20px 0;
}

.tavoron-pdp__content-row {
    display: grid;
    grid-template-columns: 420px 1fr 240px;
    gap: 32px;
    max-height: 290px;
    overflow: hidden;
    transition: max-height 0.4s ease;
    position: relative;
}

.tavoron-pdp__content-row::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 60px;
    background: linear-gradient(to bottom, transparent, #fff);
    pointer-events: none;
    transition: opacity 0.3s;
}

.tavoron-pdp__panels-wrapper.is-expanded .tavoron-pdp__content-row {
    max-height: 3000px;
}

.tavoron-pdp__panels-wrapper.is-expanded .tavoron-pdp__content-row::after {
    opacity: 0;
}

/* Panel expand/collapse toggle button */
.tavoron-pdp__panels-toggle {
    display: flex;
    justify-content: center;
    padding: 12px 0 32px;
}

.tavoron-pdp__panels-toggle-btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 13px;
    font-weight: 600;
    color: #1a4ca8;
    background: none;
    border: 1px solid #1a4ca8;
    border-radius: 20px;
    padding: 7px 20px;
    cursor: pointer;
    transition: background 0.15s, color 0.15s;
}

.tavoron-pdp__panels-toggle-btn:hover {
    background: #1a4ca8;
    color: #fff;
}

.tavoron-pdp__panels-toggle-icon {
    transition: transform 0.3s;
}

.tavoron-pdp__panels-wrapper.is-expanded .tavoron-pdp__panels-toggle-icon {
    transform: rotate(180deg);
}

.tavoron-pdp__panel {
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    overflow: hidden;
    background: #fff;
    display: flex;
    flex-direction: column;
}

.tavoron-pdp__panel-header {
    background: #f9fafb;
    border-bottom: 1px solid #e5e7eb;
    padding: 12px 20px;
}

.tavoron-pdp__panel-title,
.tavoron-pdp__panel h2.tavoron-pdp__panel-title {
    font-size: 12px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.06em !important;
    color: #374151 !important;
    margin: 0 !important;
    padding: 0 !important;
    border: none !important;
}

.tavoron-pdp__panel-body {
    padding: 20px;
    font-size: 14px;
    line-height: 1.7;
    color: #374151;
    flex: 1;
}

.tavoron-pdp__empty {
    color: #9ca3af;
    font-style: italic;
    font-size: 13px;
    margin: 0;
}

/* Specifications – attributes table */
.tavoron-pdp__panel-body table.shop_attributes {
    width: 100%;
    border-collapse: collapse;
}

.tavoron-pdp__panel-body table.shop_attributes tr {
    border-bottom: 1px solid #f3f4f6;
}

.tavoron-pdp__panel-body table.shop_attributes tr:last-child {
    border-bottom: none;
}

.tavoron-pdp__panel-body table.shop_attributes th,
.tavoron-pdp__panel-body table.shop_attributes td {
    padding: 7px 4px;
    font-size: 13px;
    vertical-align: top;
    border: none !important;
    background: transparent !important;
}

.tavoron-pdp__panel-body table.shop_attributes th {
    color: #6b7280;
    width: 62%;
    padding-right: 10px;
    font-weight: 500;
}

.tavoron-pdp__panel-body table.shop_attributes td {
    color: #111827;
    font-weight: 400;
}

.tavoron-pdp__panel-body table.shop_attributes td p {
    margin: 0;
    padding: 0;
}

/* Downloads */
.tavoron-pdp__download {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 11px 0;
    border-bottom: 1px solid #f3f4f6;
    text-decoration: none;
    color: #1a4ca8;
    font-size: 14px;
    font-weight: 500;
    transition: color 0.12s;
}

.tavoron-pdp__download:last-child { border-bottom: none; }

.tavoron-pdp__download:hover {
    color: #163d8a;
    text-decoration: underline;
}

.tavoron-pdp__download svg {
    flex-shrink: 0;
    color: #6b7280;
}

.tavoron-pdp__no-downloads {
    color: #9ca3af;
    font-size: 13px;
    font-style: italic;
    margin: 0;
}

/* ── Related Products ─────────────────────────────────────── */
.tavoron-pdp__related-section {
    padding: 0 20px 48px;
}

/* Astra's "Recently Viewed Products" reuses WooCommerce's default
   .related.products / ul.products grid, which has its own column/gap/padding
   rules independent of the custom Related Products grid above — align them
   so both sections use the same layout at every breakpoint. */
body.single-product section.related.products {
    padding: 0 20px 48px;
}
body.single-product section.related.products > h2 {
    font-size: 19px !important;
    font-weight: 700 !important;
    color: #183a4b !important;
    margin: 0 0 20px !important;
    padding: 0 !important;
    border: none !important;
}
body.single-product section.related.products ul.products {
    grid-template-columns: repeat(5, 1fr) !important;
    gap: 16px !important;
}

.tavoron-pdp__section-title,
.tavoron-pdp__related-section h2.tavoron-pdp__section-title {
    font-size: 19px !important;
    font-weight: 700 !important;
    color: #183a4b !important;
    margin: 0 0 20px !important;
    padding: 0 !important;
    border: none !important;
}

.tavoron-pdp__related-grid {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 16px;
    list-style: none;
    margin: 0;
    padding: 0;
}

.tavoron-pdp__related-item { margin: 0; padding: 0; }

/* Related product card */
.tavoron-related-card {
    display: flex;
    flex-direction: column;
    border-radius: 8px;
    overflow: hidden;
    background: #fff;
    color: inherit;
    height: 100%;
    transition: box-shadow 0.18s, transform 0.18s;
}

.tavoron-related-card:hover {
    box-shadow: 0 4px 16px rgba(0,0,0,0.09);
    transform: translateY(-2px);
}

.tavoron-related-card__image-link {
    display: block;
    text-decoration: none;
}

.tavoron-related-card__title-link {
    display: block;
    text-decoration: none;
    color: inherit;
}

.tavoron-related-card__title-link:hover {
    text-decoration: none;
    color: #183a4b !important;
}

.tavoron-related-card__image-wrap {
    aspect-ratio: 1 / 1;
    background: #fff;
    border-bottom: 1px solid #f3f4f6;
    overflow: hidden;
    position: relative;
}

.tavoron-related-card__image {
    position: absolute !important;
    inset: 8px !important;
    width: calc(100% - 16px) !important;
    height: calc(100% - 16px) !important;
    object-fit: contain !important;
    object-position: center !important;
    transition: transform 0.22s;
}

.tavoron-related-card:hover .tavoron-related-card__image {
    transform: scale(1.04);
}

.tavoron-related-card__body {
    padding: 10px 12px 12px;
    flex: 1;
}

.tavoron-related-card__title,
.tavoron-pdp__related-item h3.tavoron-related-card__title {
    font-size: 13px !important;
    font-weight: 700 !important;
    color: #183a4b !important;
    margin: 0 0 4px !important;
    line-height: 1.35 !important;
    padding: 0 !important;
    border: none !important;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.tavoron-related-card__mfg {
    font-size: 13px;
    color: #1a4ca8;
    margin: 0 0 2px;
    font-weight: 500;
}

.tavoron-related-card__mfg-link {
    color: #1a4ca8 !important;
    font-weight: 500;
    text-decoration: none;
    font-size: 13px;
}

.tavoron-related-card__mfg-link:hover {
    text-decoration: underline;
    color: #1a4ca8 !important;
}

.tavoron-related-card__sku {
    font-size: 11px;
    color: #9ca3af;
    margin: 0;
}

/* ── Recently Viewed Products (Astra addon, WC loop) ─────── */
body.single-product section.related.products {
    max-width: 1280px;
    margin: 0 auto;
    padding: 0 20px 48px;
    box-sizing: border-box;
}

body.single-product section.related.products > h2 {
    font-size: 19px !important;
    font-weight: 700 !important;
    color: #183a4b !important;
    margin: 0 0 20px !important;
    padding: 0 !important;
    border: none !important;
}

body.single-product section.related.products ul.products {
    display: grid !important;
    grid-template-columns: repeat(5, 1fr) !important;
    gap: 16px !important;
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
}

body.single-product section.related.products li.product {
    margin: 0 !important;
    padding: 0 !important;
    float: none !important;
    width: auto !important;
    border: none !important;
    background: #fff !important;
}

body.single-product section.related.products .woocommerce-loop-product__title,
body.single-product section.related.products h2.woocommerce-loop-product__title,
body.single-product section.upsells.products .woocommerce-loop-product__title,
body.single-product section.upsells.products h2.woocommerce-loop-product__title,
body.single-product .woocommerce-loop-product__title {
    font-size: 13px !important;
    font-weight: 700 !important;
    color: #183a4b !important;
    padding: 0 !important;
    margin: 0 0 4px !important;
    border: none !important;
}

body.single-product section.related.products li.product .astra-shop-thumbnail-wrap {
    aspect-ratio: 1 / 1 !important;
    overflow: hidden !important;
    background: #fff !important;
    border-bottom: 1px solid #f3f4f6 !important;
    display: block !important;
}

body.single-product section.related.products li.product .astra-shop-thumbnail-wrap a {
    display: block !important;
    height: 100% !important;
    padding: 8px !important;
    box-sizing: border-box !important;
}

body.single-product section.related.products li.product a img {
    width: 100% !important;
    height: 100% !important;
    object-fit: contain !important;
    object-position: center !important;
    border: none !important;
    background: #fff !important;
    padding: 0 !important;
    box-sizing: border-box !important;
}

body.single-product section.related.products .price { display: none !important; }
body.single-product section.related.products .ast-woo-product-category { display: none !important; }

/* Manufacturer added via hook */
.tavoron-rv-mfg {
    font-size: 13px;
    margin: 2px 0 0;
}

.tavoron-rv-mfg-link {
    color: #1a4ca8 !important;
    font-weight: 500;
    text-decoration: none;
}

.tavoron-rv-mfg-link:hover {
    text-decoration: underline;
    color: #1a4ca8 !important;
}

/* ── Astra single product layout overrides ────────────────── */

/* Prevent #primary's margin-top (below) from collapsing through the empty
   .ast-merged-advanced-header wrapper and dragging the absolutely-positioned
   header down with it — without this, the header floats away from the top
   of the viewport on any width where the header collapses to its single-row
   mobile layout (see the responsive override below). */
body.single-product #page {
    display: flow-root;
}

/* Make the primary content area full-width on PDP */
body.single-product #primary.content-area {
    width: 100% !important;
    max-width: 100% !important;
    float: none !important;
    padding: 0 !important;
    /* Astra calculates margin-top for primary header only (70px → 100px).
       Below-header (nav row, ~62px) is now visible, so push content below full header. */
    margin-top: 162px !important;
}

body.single-product #secondary { display: none !important; }

body.single-product .ast-woocommerce-container,
body.single-product #content > .ast-container {
    max-width: 1400px !important;
    padding: 0 !important;
}

/* Hide WC breadcrumb padding / extra spacing injected by Astra */
body.single-product .woocommerce-breadcrumb { padding: 0 32px; }

/* Suppress price — catalog mode (YITH) already removes it, this is a safety net */
body.single-product .price,
body.single-product .woocommerce-variation-price { display: none !important; }

/* ── PDP header — dark navy only when NOT sticky; white on scroll ── */
/* Top row: dark navy only while NOT in sticky-active state.
   When Astra adds ast-sticky-active, let its own sticky CSS turn it white. */
body.single-product #ast-desktop-header .main-header-bar:not(.ast-sticky-active),
body.single-product #ast-desktop-header .ast-primary-header-bar:not(.ast-sticky-active),
body.single-product #ast-desktop-header .main-header-bar-wrap:not(.ast-sticky-active),
body.single-product #ast-mobile-header .main-header-bar:not(.ast-sticky-active),
body.single-product #ast-mobile-header .ast-primary-header-bar:not(.ast-sticky-active),
body.single-product #ast-mobile-header .main-header-bar-wrap:not(.ast-sticky-active) {
    background-color: #183a4b !important;
}
/* Mobile header search/menu-toggle icons: white on the dark top row */
body.single-product #ast-mobile-header .ast-mobile-header-content .astra-search-icon,
body.single-product #ast-mobile-header .ast-mobile-header-content .ast-icon,
body.single-product #ast-mobile-header .menu-toggle-close,
body.single-product #ast-mobile-header .menu-toggle-open {
    color: #fff !important;
    fill: #fff !important;
}
/* Nav row (below-header): white background — non-sticky only so scroll height matches PLP */
body.single-product:not(.ast-primary-sticky-header-active) #ast-desktop-header .ast-below-header-bar,
body.single-product:not(.ast-primary-sticky-header-active) #ast-fixed-header .ast-below-header-bar {
    background-color: #fff !important;
    box-shadow: 0 1px 4px rgba(0,0,0,0.08) !important;
    display: block !important;
    border-bottom: none !important;
}
/* Logo: white logo on dark initial header; dark logo on white sticky header.
   PDP only renders .transparent-custom-logo (no .sticky-custom-logo), so we
   keep it visible when sticky and swap the image to the dark variant. */
body.single-product:not(.ast-primary-sticky-header-active) .site-header .site-logo-img .custom-logo-link        { display: inline-flex !important; }
body.single-product:not(.ast-primary-sticky-header-active) .site-header .site-logo-img img.custom-logo           { display: block !important; }
body.single-product:not(.ast-primary-sticky-header-active) .site-header .site-logo-img .transparent-custom-logo  { display: inline-flex !important; }
body.single-product:not(.ast-primary-sticky-header-active) .site-header .site-logo-img .sticky-custom-logo       { display: none !important; }
/* Sticky state: show the transparent-logo link and swap img to dark version.
 * Uses the same file as Astra's own "sticky-header-logo" Customizer setting
 * (259x64 source) — the previous 120x30 file was exactly 1x/non-retina, so
 * it rendered blurry on any high-DPI screen, unlike home/shop which use this
 * same properly-sized file via Astra's native sticky-logo element. */
body.single-product.ast-primary-sticky-header-active .ast-sticky-active .site-logo-img .transparent-custom-logo { display: inline-flex !important; }
body.single-product.ast-primary-sticky-header-active .ast-sticky-active .site-logo-img .transparent-custom-logo img.custom-logo {
    content: url('/wp-content/uploads/2024/05/tavoron-logo.webp') !important;
    height: 30px !important;
    max-height: 30px !important;
    max-width: none !important;
    width: auto !important;
}
/* Search icon: this is Astra's always-visible inline search box
 * (.ast-inline-search) — the submit-button icon sits inside the white
 * .search-field box itself, not directly on the navy header bar. It must
 * stay dark in both the static and sticky/scrolled states, since the white
 * box it sits on never changes; forcing it white made it invisible against
 * its own background. */
body.single-product #ast-desktop-header .ast-search-menu-icon a,
body.single-product #ast-desktop-header .ast-search-menu-icon svg,
body.single-product #ast-fixed-header .ast-search-menu-icon a,
body.single-product #ast-fixed-header .ast-search-menu-icon svg {
    color: #111827 !important;
    fill: #111827 !important;
}
/* Search input — white box when expanded (same as shop/search pages).
 * Astra's transparent-header text-color setting is white, correct for the
 * "Search..." label sitting directly on the navy bar but not for the
 * input's own box, which is a solid white field - without this override
 * the placeholder inherits that same white and disappears against it. */
body.single-product #ast-desktop-header .ast-search-menu-icon .search-field,
body.single-product #ast-desktop-header .ast-search-menu-icon input[type="search"],
body.single-product #ast-fixed-header .ast-search-menu-icon .search-field,
body.single-product #ast-fixed-header .ast-search-menu-icon input[type="search"] {
    background: #fff !important;
    color: #111827 !important;
    border-color: rgba(255,255,255,0.3) !important;
}
body.single-product #ast-desktop-header .ast-search-menu-icon .search-field::placeholder,
body.single-product #ast-desktop-header .ast-search-menu-icon input[type="search"]::placeholder,
body.single-product #ast-fixed-header .ast-search-menu-icon .search-field::placeholder,
body.single-product #ast-fixed-header .ast-search-menu-icon input[type="search"]::placeholder {
    color: #9ca3af !important;
}
/* Nav links: dark navy, yellow on hover */
body.single-product #ast-desktop-header .ast-below-header-bar .main-header-menu > .menu-item > .menu-link,
body.single-product #ast-desktop-header .ast-below-header-bar .main-header-menu > .menu-item > .menu-link .menu-text,
body.single-product #ast-fixed-header .ast-below-header-bar .menu-item > a {
    color: #183a4b !important;
}
/* Astra core's own dynamic CSS independently colors .current-menu-ancestor
 * using its own "active menu color" setting (currently yellow) - re-asserting
 * navy here neutralizes that so Products reads the same normal navy as any
 * other state while on a product page; yellow stays a transient hover-only
 * cue below, not an "active/selected" indicator. */
body.single-product #ast-desktop-header .ast-below-header-bar .main-header-menu > .menu-item.current-menu-ancestor > .menu-link,
body.single-product #ast-desktop-header .ast-below-header-bar .main-header-menu > .menu-item.current-menu-ancestor > .menu-link .menu-text {
    color: #183a4b !important;
    background: transparent !important;
}
body.single-product #ast-desktop-header .ast-below-header-bar .main-header-menu > .menu-item > .menu-link:hover,
body.single-product #ast-desktop-header .ast-below-header-bar .main-header-menu > .menu-item > .menu-link:hover .menu-text {
    color: #f6be00 !important;
}
/* Shop no longer has its own navy pill background (removed - it now reads
 * as a plain nav item like Products/Services), so it no longer needs a
 * white-text override here either - the generic "Nav links" rule above
 * already covers it (Shop's <ul> carries .main-header-menu same as the
 * other menus), giving navy text + yellow hover matching its siblings.
 * A leftover white-forcing override here previously left "Shop" invisible
 * (white-on-white) on this page. */
/* Submenu dropdown */
body.single-product #ast-desktop-header .ast-below-header-bar .sub-menu {
    background-color: #fff !important;
    /* No shadow, matching home/shop pages - the Shop mega menu (which also
     * carries class .sub-menu at every level) already handles its own
     * shadow-free look in mega-menu.css; this generic rule was overriding
     * it back on with a higher-specificity #ast-desktop-header selector. */
    box-shadow: none !important;
}
body.single-product #ast-desktop-header .ast-below-header-bar .sub-menu .menu-link,
body.single-product #ast-desktop-header .ast-below-header-bar .sub-menu .menu-link .menu-text {
    color: #183a4b !important;
}
body.single-product #ast-desktop-header .ast-below-header-bar .sub-menu .menu-link:hover,
body.single-product #ast-desktop-header .ast-below-header-bar .sub-menu .menu-link:hover .menu-text {
    color: #f6be00 !important;
    background-color: #f8f9fa !important;
}

/* ── Breadcrumb: fix white-on-white from Astra transparent header ── */
body.single-product .entry-header {
    max-width: 1280px !important;
    margin: 0 auto !important;
    padding: 10px 20px 0 !important;
    background: transparent !important;
}

body.single-product .ast-breadcrumbs-wrapper,
body.single-product .ast-breadcrumbs-wrapper div,
body.single-product .ast-breadcrumbs-wrapper nav,
body.single-product .ast-breadcrumbs-wrapper ul,
body.single-product .ast-breadcrumbs-wrapper li,
body.single-product .ast-breadcrumbs-wrapper span {
    color: #6b7280 !important;
    font-size: 11.9px !important; /* 30% smaller than Astra's default 17px */
}

body.single-product .ast-breadcrumbs-wrapper a,
body.single-product .ast-breadcrumbs-wrapper a span {
    color: #374151 !important;
    text-decoration: none !important;
    font-weight: 500 !important;
}

body.single-product .ast-breadcrumbs-wrapper a:hover,
body.single-product .ast-breadcrumbs-wrapper a:hover span {
    color: #1a4ca8 !important;
    text-decoration: underline !important;
}

/* Hide the duplicate Astra page title — our template has its own h1 */
body.single-product .entry-header h1.entry-title {
    display: none !important;
}

/* ── Responsive ───────────────────────────────────────────── */

/* Below Astra's header breakpoint (1024px) the header collapses to a single
   ~70px row instead of the two-row ~162px desktop header, so the fixed
   162px content offset above leaves a large blank gap. */
@media (max-width: 1024px) {
    body.single-product #primary.content-area {
        margin-top: 78px !important;
    }

    /* Gap between the collapsed mobile header and the breadcrumb, roughly
       the height of the (now 30%-smaller) breadcrumb font. */
    body.single-product .entry-header {
        padding-top: 22px !important;
    }
}

@media (max-width: 1200px) {
    .tavoron-pdp__marketing { flex: 0 0 200px; }
    .tavoron-pdp__gallery { flex: 0 0 360px; max-width: 360px; }
    .tavoron-pdp__content-row { grid-template-columns: 360px 1fr 200px; gap: 32px; }
    .tavoron-pdp__related-grid { grid-template-columns: repeat(4, 1fr); }
    body.single-product section.related.products ul.products { grid-template-columns: repeat(4, 1fr) !important; }
}

/* Mobile PDP banner — hidden on desktop, visible below info on mobile */
.tavoron-pdp__mobile-banner { display: none; }
.tavoron-pdp__mobile-banner-img { display: block; width: 100%; height: auto; }

@media (max-width: 1000px) {
    .tavoron-pdp__marketing { display: none; }
    .tavoron-pdp__gallery { flex: 0 0 340px; max-width: 340px; }
    .tavoron-pdp__content-row { grid-template-columns: 340px 1fr 180px; gap: 24px; }
    .tavoron-pdp__mobile-banner { display: block; padding: 0 20px; margin-bottom: 24px; }
}

@media (max-width: 900px) {
    .tavoron-pdp__top {
        flex-direction: column;
        padding: 16px 20px 12px;
        gap: 16px;
    }
    .tavoron-pdp__gallery {
        flex: none;
        width: 100%;
        max-width: 100%;
    }
    .tavoron-pdp__panels-wrapper { padding: 0 20px 0; }
    .tavoron-pdp__content-row {
        grid-template-columns: 1fr;
        gap: 16px;
    }
    .tavoron-pdp__related-section { padding: 0 20px 36px; }
    .tavoron-pdp__related-grid { grid-template-columns: repeat(3, 1fr); }
    body.single-product .woocommerce-breadcrumb { padding: 0 20px; }
    body.single-product section.related.products { padding: 0 20px 36px; }
    body.single-product section.related.products ul.products { grid-template-columns: repeat(3, 1fr) !important; }
}

@media (max-width: 600px) {
    .tavoron-pdp__top { padding: 12px 16px 10px; }
    .tavoron-pdp__panels-wrapper { padding: 0 16px 0; }
    .tavoron-pdp__related-section { padding: 0 16px 28px; }
    .tavoron-pdp__related-grid { grid-template-columns: repeat(2, 1fr); gap: 10px; }
    .tavoron-pdp__title { font-size: 1.2rem; }
    body.single-product .woocommerce-breadcrumb { padding: 0 16px; }
    body.single-product section.related.products { padding: 0 16px 28px; }
    body.single-product section.related.products ul.products { grid-template-columns: repeat(2, 1fr) !important; gap: 10px !important; }

    /* Mobile shows 4 products (2x2) instead of desktop's 5 — hide the 5th card. */
    .tavoron-pdp__related-item:nth-child(n+5) { display: none; }
    body.single-product section.related.products li.product:nth-child(n+5) { display: none !important; }
}

/* Related and Recently Viewed deliberately stay two-up all the way down.
   These used to collapse to a single column below 380px, which caught the
   375px-wide phones (iPhone SE, 12/13 mini and plenty of Android) and turned
   the strip into one oversized card per screen — several screens of scrolling
   to get past five products. Two 160px-ish cards still read fine at that
   width, and the gap below keeps them from touching. */
@media (max-width: 380px) {
    .tavoron-pdp__related-grid,
    body.single-product section.related.products ul.products { gap: 8px; }
    body.single-product section.related.products ul.products { gap: 8px !important; }
}
