/* Modern Aesthetic Adjustments */
    .modern-card {
        background-color: #ffffff;
        border-radius: 12px;
        box-shadow: 0 4px 15px rgba(0, 0, 0, 0.05);
        border: 1px solid rgba(0,0,0,0.03);
    }
    .gallery-main-img-container {
        border-radius: 12px;
        overflow: hidden;
        background-color: #f8f9fa;
        display: flex;
        align-items: center;
        justify-content: center;
        min-height: 400px;
        position: relative;
    }
    .gallery-main-img {
        max-height: 400px;
        object-fit: contain;
        transition: opacity 0.3s ease;
    }
    .gallery-thumbnail {
        width: 70px;
        height: 70px;
        object-fit: cover;
        border-radius: 8px;
        cursor: pointer;
        border: 2px solid transparent;
        transition: all 0.2s ease;
        opacity: 0.6;
    }
    .gallery-thumbnail:hover {
        opacity: 1;
    }
    .gallery-thumbnail.active {
        border-color: #ff6f00; /* Primary color */
        opacity: 1;
        box-shadow: 0 2px 8px rgba(255, 111, 0, 0.3);
    }

    /* ── Amazon/Alibaba standard gallery zoom ───────────────────── */
    .pd-gallery-card { position: relative; display: flex; flex-direction: column; }
    .pd-gallery-card .pd-zoom-wrap { flex-shrink: 0; }
    .pd-gallery-card .pd-thumb-strip { flex-shrink: 0; gap: 12px; }
    @media (min-width: 992px) {
        .pd-gallery-card { min-height: 100%; }
    }
    .pd-zoom-wrap { position: relative; }
    .pd-zoom-container {
        cursor: zoom-in;
        cursor: -webkit-zoom-in;
        user-select: none;
        -webkit-user-select: none;
    }
    .pd-zoom-lens {
        position: absolute;
        width: 168px;
        height: 168px;
        border: 1px solid rgba(0,0,0,.18);
        background: rgba(255,255,255,.26);
        backdrop-filter: blur(1px);
        border-radius: 6px;
        box-shadow: 0 6px 22px rgba(0,0,0,.20), inset 0 0 0 1px rgba(255,255,255,.65);
        pointer-events: none;
        opacity: 0;
        visibility: hidden;
        transition: opacity .18s ease, visibility .18s ease;
        z-index: 3;
        will-change: left, top;
    }
    @media (min-width: 992px) and (max-width: 1199.98px) {
        .pd-zoom-lens { width: 155px; height: 155px; }
    }
    @media (min-width: 1200px) and (max-width: 1399.98px) {
        .pd-zoom-lens { width: 175px; height: 175px; }
    }
    @media (min-width: 1400px) {
        .pd-zoom-lens { width: 190px; height: 190px; }
    }
    .pd-zoom-lens.is-visible {
        opacity: 1;
        visibility: visible;
    }
    .pd-zoom-pane {
        position: absolute;
        top: 50%;
        left: calc(100% + 22px);
        width: 620px;
        height: 620px;
        max-height: 86vh;
        max-width: min(620px, calc(100vw - 100% - 40px));
        background-color: #fff;
        background-repeat: no-repeat;
        background-position: 0 0;
        border: 1px solid #e5e7eb;
        border-radius: 14px;
        box-shadow: 0 22px 56px rgba(0,0,0,.22), 0 6px 20px rgba(0,0,0,.10);
        overflow: hidden;
        opacity: 0;
        visibility: hidden;
        transform: translateY(-50%) translateY(8px) scale(.98);
        transition: opacity .22s ease, transform .22s cubic-bezier(.2,.8,.2,1), visibility .22s ease;
        z-index: 1050;
        pointer-events: none;
        will-change: transform, opacity;
    }
    .pd-zoom-pane.is-visible {
        opacity: 1;
        visibility: visible;
        transform: translateY(-50%) translateY(0) scale(1);
    }
    /* Responsive pane sizing — larger on wide screens (standard Amazon/Alibaba) */
    @media (min-width: 992px) and (max-width: 1199.98px) {
        .pd-zoom-pane { width: 480px; height: 480px; }
    }
    @media (min-width: 1200px) and (max-width: 1399.98px) {
        .pd-zoom-pane { width: 600px; height: 600px; }
    }
    @media (min-width: 1400px) {
        .pd-zoom-pane { width: 680px; height: 680px; }
    }
    /* Keep pane fully inside viewport when column is near right edge */
    @media (min-width: 992px) {
        .pd-zoom-pane {
            max-width: calc(100vw - 100% - 44px);
        }
    }
    .pd-zoom-pane.is-loading::after {
        content: "";
        position: absolute;
        inset: 0;
        background: linear-gradient(90deg, #f3f4f6 25%, #e5e7eb 37%, #f3f4f6 63%);
        background-size: 400% 100%;
        animation: pd-shimmer 1.2s ease-in-out infinite;
    }
    .pd-zoom-hint {
        position: absolute;
        right: 10px;
        bottom: 10px;
        z-index: 3;
        display: inline-flex;
        align-items: center;
        gap: 6px;
        padding: 6px 10px;
        font-size: .75rem;
        font-weight: 600;
        color: #374151;
        background: rgba(255,255,255,.92);
        border: 1px solid rgba(0,0,0,.06);
        border-radius: 20px;
        box-shadow: 0 2px 10px rgba(0,0,0,.08);
        backdrop-filter: blur(6px);
        cursor: pointer;
        transition: transform .15s ease, box-shadow .15s ease;
    }
    .pd-zoom-hint:hover { transform: translateY(-1px); box-shadow: 0 4px 14px rgba(0,0,0,.12); }
    .pd-zoom-hint-text { white-space: nowrap; }
    @media (max-width: 991.98px) {
        .pd-zoom-pane { display: none !important; }
        .pd-zoom-lens { display: none !important; }
        .pd-zoom-hint { font-size: .72rem; padding: 5px 9px; }
    }
    @media (max-width: 575.98px) {
        .pd-zoom-hint-text { display: none; }
    }
    /* Keep main image above lens background but below lens border */
    .gallery-main-img { position: relative; z-index: 1; }
    [data-theme="dark"] .pd-zoom-pane { background-color: var(--theme-surface, #1a1a2e); border-color: #2d3748; box-shadow: 0 18px 42px rgba(0,0,0,.45); }
    [data-theme="dark"] .pd-zoom-hint { background: rgba(26,26,46,.92); color: #e5e7eb; border-color: rgba(255,255,255,.08); }
    [data-theme="dark"] .pd-zoom-lens { border-color: rgba(255,255,255,.18); background: rgba(255,255,255,.08); box-shadow: 0 4px 18px rgba(0,0,0,.35); }
    @media (prefers-reduced-motion: reduce) {
        .pd-zoom-lens, .pd-zoom-pane, .pd-zoom-hint { transition: none !important; }
    }

    /* ── Below-image fill: trust + delivery + safe checkout ───────── */
    .pd-gallery-extras {
        margin-top: 18px;
        padding-top: 18px;
        border-top: 1px solid #eef0f3;
        display: flex;
        flex-direction: column;
        gap: 16px;
        flex: 1 1 auto;
    }
    .pd-extra-benefits {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 12px;
    }
    .pd-benefit {
        display: flex;
        align-items: center;
        gap: 10px;
        padding: 10px 12px;
        background: #f8f9fb;
        border: 1px solid #eef0f3;
        border-radius: 10px;
        transition: border-color .15s ease, transform .15s ease, background .15s ease;
    }
    .pd-benefit:hover { border-color: #e0e6ef; background: #f3f6fb; transform: translateY(-1px); }
    .pd-benefit-icon {
        width: 36px;
        height: 36px;
        border-radius: 50%;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        font-size: .92rem;
        flex-shrink: 0;
        color: #fff;
    }
    .pd-benefit-icon--truck { background: linear-gradient(135deg, #ff6f00, #ff9100); }
    .pd-benefit-icon--return { background: linear-gradient(135deg, #1f2b6c, #3f5aa9); }
    .pd-benefit-icon--secure { background: linear-gradient(135deg, #0ea5a5, #14b8a6); }
    .pd-benefit-icon--auth { background: linear-gradient(135deg, #7c3aed, #a78bfa); }
    .pd-benefit-text { display: flex; flex-direction: column; line-height: 1.2; min-width: 0; }
    .pd-benefit-text strong { font-size: .82rem; font-weight: 700; color: #1f2937; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
    .pd-benefit-text small { font-size: .72rem; color: #6b7280; margin-top: 2px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

    .pd-extra-delivery {
        display: flex;
        align-items: flex-start;
        gap: 12px;
        padding: 12px 14px;
        background: linear-gradient(145deg, #fff, #f8fafc);
        border: 1px solid #e5e7eb;
        border-radius: 10px;
    }
    .pd-delivery-icon {
        width: 32px;
        height: 32px;
        border-radius: 50%;
        background: #eef2ff;
        color: #4f46e5;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        font-size: .88rem;
        flex-shrink: 0;
        margin-top: 2px;
    }
    .pd-delivery-text { font-size: .84rem; color: #374151; line-height: 1.45; flex: 1 1 auto; min-width: 0; }
    .pd-delivery-text strong { color: #111827; }
    .pd-delivery-change { margin-left: 6px; font-weight: 600; color: #2563eb; text-decoration: none; font-size: .78rem; }
    .pd-delivery-change:hover { text-decoration: underline; }
    .pd-delivery-sep { margin: 0 6px; color: #d1d5db; }
    .pd-delivery-badge {
        white-space: nowrap;
        padding: 6px 10px;
        font-size: .74rem;
        font-weight: 700;
        color: #065f46;
        background: #d1fae5;
        border: 1px solid #a7f3d0;
        border-radius: 20px;
        display: inline-flex;
        align-items: center;
        gap: 5px;
        flex-shrink: 0;
    }
    .pd-extra-payments {
        padding: 12px 14px;
        background: #f8f9fb;
        border: 1px dashed #e5e7eb;
        border-radius: 10px;
    }
    .pd-pay-title {
        display: flex;
        align-items: center;
        gap: 8px;
        font-size: .78rem;
        font-weight: 700;
        color: #374151;
        letter-spacing: .01em;
    }
    .pd-pay-cod {
        margin-left: auto;
        font-size: .72rem;
        font-weight: 600;
        color: #15803d;
        background: #dcfce7;
        border: 1px solid #bbf7d0;
        padding: 3px 8px;
        border-radius: 20px;
        white-space: nowrap;
    }
    .pd-pay-icons {
        display: flex;
        flex-wrap: wrap;
        gap: 7px;
        margin-top: 10px;
    }
    .pd-pay-icon {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 4px;
        min-width: 54px;
        height: 28px;
        padding: 0 8px;
        font-size: .72rem;
        font-weight: 700;
        color: #374151;
        background: #fff;
        border: 1px solid #e5e7eb;
        border-radius: 6px;
        box-shadow: 0 1px 4px rgba(0,0,0,.04);
        letter-spacing: .02em;
    }
    .pd-pay-icon i { font-size: .88rem; }
    .pd-pay-help {
        display: inline-flex;
        align-items: center;
        margin-top: 10px;
        font-size: .76rem;
        font-weight: 600;
        color: #6b7280;
        text-decoration: none;
    }
    .pd-pay-help:hover { color: #374151; text-decoration: underline; }

    @media (max-width: 575.98px) {
        .pd-extra-benefits { grid-template-columns: 1fr 1fr; gap: 8px; }
        .pd-benefit { padding: 9px 10px; }
        .pd-benefit-icon { width: 32px; height: 32px; font-size: .84rem; }
        .pd-benefit-text strong { font-size: .78rem; }
        .pd-extra-delivery { padding: 10px 12px; }
        .pd-extra-payments { padding: 10px 12px; }
    }
    @media (max-width: 374.98px) {
        .pd-extra-benefits { grid-template-columns: 1fr; gap: 6px; }
        .pd-benefit { padding: 8px; gap: 8px; }
        .pd-benefit-icon { width: 28px; height: 28px; font-size: .78rem; }
        .pd-pay-icons { gap: 5px; }
        .pd-pay-icon { min-width: 46px; height: 24px; font-size: .66rem; }
    }
    [data-theme="dark"] .pd-gallery-extras { border-top-color: #2d3748; }
    [data-theme="dark"] .pd-benefit { background: rgba(255,255,255,.05); border-color: #2d3748; }
    [data-theme="dark"] .pd-benefit:hover { background: rgba(255,255,255,.07); border-color: #3a4558; }
    [data-theme="dark"] .pd-benefit-text strong { color: #f1f5f9; }
    [data-theme="dark"] .pd-benefit-text small { color: #cbd5e1; }
    [data-theme="dark"] .pd-benefit-icon { border: 1px solid rgba(255,255,255,.14); box-shadow: 0 4px 12px rgba(0,0,0,.40); filter: none; }
    /* High-contrast in dark: white circle with colored icon (was gradient+white, low contrast on dark card) */
    [data-theme="dark"] .pd-benefit-icon { background: #ffffff !important; color: #1f2937 !important; }
    [data-theme="dark"] .pd-benefit-icon--truck { color: #ff6f00 !important; }
    [data-theme="dark"] .pd-benefit-icon--return { color: #1f2b6c !important; }
    [data-theme="dark"] .pd-benefit-icon--secure { color: #0e9f9f !important; }
    [data-theme="dark"] .pd-benefit-icon--auth { color: #7c3aed !important; }
    [data-theme="dark"] .pd-benefit-icon .fa,
    [data-theme="dark"] .pd-benefit-icon .fas { color: inherit !important; }
    [data-theme="dark"] .pd-extra-delivery { background: #1e2432 !important; border-color: #334155; }
    [data-theme="dark"] .pd-delivery-icon { background: #ffffff !important; color: #4f46e5 !important; border: 1px solid #e2e8f0; box-shadow: 0 2px 8px rgba(0,0,0,.20); }
    [data-theme="dark"] .pd-delivery-icon .fa,
    [data-theme="dark"] .pd-delivery-icon .fas { color: #4f46e5 !important; }
    [data-theme="dark"] .pd-delivery-text { color: #e2e8f0; }
    [data-theme="dark"] .pd-delivery-text strong { color: #fff; }
    [data-theme="dark"] .pd-delivery-badge { background: rgba(16,185,129,.18); color: #6ee7b7; border-color: rgba(110,231,183,.32); }
    [data-theme="dark"] .pd-extra-payments { background: #1e2432 !important; border-color: #334155; }
    [data-theme="dark"] .pd-pay-title { color: #f1f5f9; }
    [data-theme="dark"] .pd-pay-icon { background: #ffffff !important; color: #1e293b !important; border-color: #cbd5e1 !important; box-shadow: 0 2px 8px rgba(0,0,0,.20); }
    [data-theme="dark"] .pd-pay-icon i,
    [data-theme="dark"] .pd-pay-icon .fab { color: #1e293b !important; }
    [data-theme="dark"] .pd-pay-icon .fa-cc-visa { color: #1a1f71 !important; }
    [data-theme="dark"] .pd-pay-icon .fa-cc-mastercard { color: #eb001b !important; }
    [data-theme="dark"] .pd-pay-help { color: #cbd5e1; }
    [data-theme="dark"] .pd-pay-cod { background: rgba(16,185,129,.18); color: #6ee7b7; border-color: rgba(110,231,183,.32); }
    [data-theme="dark"] .pd-pay-help:hover { color: #f1f5f9 !important; }
    [data-theme="dark"] .modern-card .fa,
    [data-theme="dark"] .modern-card .fas,
    [data-theme="dark"] .modern-card .far { color: #cbd5e1; }
    [data-theme="dark"] .modern-card .text-primary .fa,
    [data-theme="dark"] .modern-card .text-primary .fas { color: #a5b4fc !important; }
    [data-theme="dark"] .modern-card .fa-star,
    [data-theme="dark"] .modern-card .fa-star-half-alt { color: #fbbf24 !important; }
    [data-theme="dark"] .modern-card .fa-shopping-bag,
    [data-theme="dark"] .modern-card .fa-tag,
    [data-theme="dark"] .modern-card .fa-store,
    [data-theme="dark"] .modern-card .fa-barcode,
    [data-theme="dark"] .modern-card .fa-cubes { color: #a5b4fc !important; }
    [data-theme="dark"] .pd-share-btn { box-shadow: 0 3px 10px rgba(0,0,0,.35); border: 1px solid rgba(255,255,255,.08); }
    [data-theme="dark"] .pd-sp-item .fa,
    [data-theme="dark"] .pd-sp-item .fas { color: inherit; }
    [data-theme="dark"] .gallery-thumbnail { border-color: transparent; opacity: .72; }
    [data-theme="dark"] .gallery-thumbnail.active { border-color: #ff6f00 !important; opacity: 1; }

    /* ── Fullscreen lightbox (Alibaba swipe + pinch) ─────────────── */
    .pd-lightbox {
        position: fixed;
        inset: 0;
        z-index: 10800;
        display: flex;
        flex-direction: column;
        background: rgba(12,14,20,.92);
        backdrop-filter: blur(8px) saturate(1.05);
        opacity: 0;
        visibility: hidden;
        pointer-events: none;
        transition: opacity .22s ease, visibility .22s ease;
    }
    .pd-lightbox.is-open {
        opacity: 1;
        visibility: visible;
        pointer-events: auto;
    }
    .pd-lb-stage {
        flex: 1;
        display: flex;
        align-items: center;
        justify-content: center;
        position: relative;
        overflow: hidden;
        padding: 56px 64px 18px;
        cursor: grab;
        touch-action: none;
        user-select: none;
    }
    .pd-lb-stage.is-dragging { cursor: grabbing; }
    .pd-lb-stage.is-zoomed { cursor: grab; }
    .pd-lb-image {
        max-width: min(92vw, 1100px);
        max-height: calc(100vh - 160px);
        width: auto;
        height: auto;
        object-fit: contain;
        border-radius: 10px;
        box-shadow: 0 18px 48px rgba(0,0,0,.45);
        background: #fff;
        transform-origin: center center;
        transition: transform .22s cubic-bezier(.2,.8,.2,1);
        will-change: transform;
        display: block;
    }
    .pd-lb-image.is-panning { transition: none; }
    .pd-lightbox.is-zoomed .pd-lb-image { cursor: zoom-out; }
    .pd-lb-close {
        position: absolute;
        top: 14px;
        right: 14px;
        width: 40px;
        height: 40px;
        border-radius: 50%;
        border: 1px solid rgba(255,255,255,.14);
        background: rgba(255,255,255,.08);
        color: #fff;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        cursor: pointer;
        z-index: 2;
        transition: background .15s ease, transform .15s ease;
    }
    .pd-lb-close:hover { background: rgba(255,255,255,.14); transform: scale(1.04); }
    .pd-lb-nav {
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
        width: 44px;
        height: 44px;
        border-radius: 50%;
        border: 1px solid rgba(255,255,255,.14);
        background: rgba(255,255,255,.08);
        color: #fff;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        cursor: pointer;
        z-index: 2;
        transition: background .15s ease, opacity .15s ease;
    }
    .pd-lb-nav:hover { background: rgba(255,255,255,.14); }
    .pd-lb-nav:disabled { opacity: .35; pointer-events: none; }
    .pd-lb-prev { left: 14px; }
    .pd-lb-next { right: 14px; }
    @media (max-width: 767.98px) {
        .pd-lb-stage { padding: 52px 12px 12px; }
        .pd-lb-nav { width: 38px; height: 38px; }
        .pd-lb-prev { left: 8px; }
        .pd-lb-next { right: 8px; }
        .pd-lb-image { max-width: 96vw; max-height: calc(100vh - 140px); }
    }
    .pd-lb-footer {
        padding: 10px 14px 14px;
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 10px;
        border-top: 1px solid rgba(255,255,255,.08);
        background: rgba(0,0,0,.18);
    }
    .pd-lb-counter {
        color: rgba(255,255,255,.78);
        font-size: .82rem;
        font-weight: 600;
        letter-spacing: .02em;
    }
    .pd-lb-dots {
        display: flex;
        align-items: center;
        gap: 7px;
    }
    .pd-lb-dot {
        width: 7px;
        height: 7px;
        border-radius: 50%;
        background: rgba(255,255,255,.28);
        border: none;
        padding: 0;
        cursor: pointer;
        transition: transform .16s ease, background .16s ease, width .16s ease;
    }
    .pd-lb-dot.is-active {
        width: 18px;
        border-radius: 999px;
        background: #fff;
        transform: none;
    }
    .pd-lb-thumbs {
        display: flex;
        gap: 8px;
        overflow-x: auto;
        max-width: 100%;
        padding: 2px 4px 4px;
        scrollbar-width: thin;
        scrollbar-color: rgba(255,255,255,.2) transparent;
    }
    .pd-lb-thumbs::-webkit-scrollbar { height: 6px; }
    .pd-lb-thumbs::-webkit-scrollbar-thumb { background: rgba(255,255,255,.2); border-radius: 999px; }
    .pd-lb-thumb {
        width: 56px;
        height: 56px;
        border-radius: 8px;
        object-fit: cover;
        border: 2px solid transparent;
        opacity: .66;
        cursor: pointer;
        flex-shrink: 0;
        background: #fff;
        transition: opacity .15s ease, border-color .15s ease, transform .15s ease;
    }
    .pd-lb-thumb:hover { opacity: .9; transform: translateY(-1px); }
    .pd-lb-thumb.is-active { opacity: 1; border-color: #ff6f00; box-shadow: 0 2px 10px rgba(255,111,0,.35); }
    @keyframes pd-shimmer { 0%{background-position:100% 0} 100%{background-position:-100% 0} }

    .price-tag {
        color: #ff6f00;
        font-weight: 700;
        font-size: 2.2rem;
    }
    
    /* Variant Pills */
    .variant-pills-group {
        display: flex;
        flex-wrap: wrap;
        gap: 10px;
    }
    .variant-pill-input {
        display: none;
    }
    .variant-pill-label {
        padding: 10px 20px;
        border: 1px solid #dee2e6;
        border-radius: 30px;
        cursor: pointer;
        font-size: 0.95rem;
        font-weight: 500;
        color: #495057;
        background-color: #fff;
        transition: all 0.2s ease;
        margin-bottom: 0;
    }
    .variant-pill-label:hover {
        border-color: #adb5bd;
        background-color: #f8f9fa;
    }
    .variant-pill-input:checked + .variant-pill-label {
        background-color: #ff6f00;
        color: #fff;
        border-color: #ff6f00;
        box-shadow: 0 4px 10px rgba(255, 111, 0, 0.3);
    }
    .var-sold-count {
        display: inline-block;
        font-size: 0.75rem;
        font-weight: 600;
        color: #6b7280;
        background: #f3f4f6;
        padding: 1px 7px;
        border-radius: 10px;
        white-space: nowrap;
    }
    .variant-pill-input:checked + .variant-pill-label .var-sold-count {
        color: #fff;
        background: rgba(255, 255, 255, 0.2);
    }
    
    /* Action Buttons */
    .btn-add-to-cart {
        background-color: #ff6f00;
        border-color: #ff6f00;
        color: #fff;
        font-weight: 600;
        padding: 14px 28px;
        border-radius: 8px;
        transition: all 0.3s ease;
        text-transform: uppercase;
        letter-spacing: 0.5px;
        font-size: 1.1rem;
    }
    .btn-add-to-cart:hover {
        background-color: #e66400;
        border-color: #e66400;
        transform: translateY(-2px);
        box-shadow: 0 6px 15px rgba(255, 111, 0, 0.3);
    }
    
    .btn-secondary-action {
        border-radius: 8px;
        font-weight: 500;
        padding: 12px 20px;
        transition: all 0.3s ease;
        border-width: 2px;
    }
    
    /* Review Styles */
    .review-snapshot {
        background: linear-gradient(145deg, #ffffff, #f8f9fa);
        border-radius: 12px;
    }
    .progress-bar-custom {
        background-color: #ffc107;
        border-radius: 4px;
    }
    .progress-custom {
        border-radius: 4px;
        background-color: #e9ecef;
        height: 10px;
    }

    /* Dark mode overrides for the page-specific components above */
    [data-theme="dark"] .modern-card {
        background-color: var(--theme-surface) !important;
        border-color: var(--theme-border) !important;
        box-shadow: 0 4px 15px rgba(0, 0, 0, 0.35);
    }
    [data-theme="dark"] .review-snapshot {
        background: linear-gradient(145deg, var(--theme-surface), var(--theme-surface-muted)) !important;
    }
    [data-theme="dark"] .variant-pill-label {
        color: var(--theme-text);
        background-color: var(--theme-surface-raised);
        border-color: var(--theme-border);
    }
    [data-theme="dark"] .variant-pill-label:hover {
        border-color: var(--theme-border-strong);
        background-color: var(--theme-surface-muted);
    }
    [data-theme="dark"] .var-sold-count {
        color: var(--theme-text-muted);
        background: var(--theme-surface-muted);
    }
    [data-theme="dark"] .progress-custom {
        background-color: var(--theme-surface-muted);
    }

    /* COD Badge */
    .pd-cod-badge {
        background: linear-gradient(135deg, #f0fdf4, #dcfce7);
        border: 1px solid #bbf7d0;
        border-radius: 12px;
        padding: 14px 18px;
    }
    .pd-cod-badge-inner {
        display: flex;
        align-items: center;
        gap: 14px;
    }
    .pd-cod-badge-icon {
        width: 44px;
        height: 44px;
        border-radius: 50%;
        background: #16a34a;
        color: #fff;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 1.1rem;
        flex-shrink: 0;
    }
    .pd-cod-badge-text {
        display: flex;
        flex-direction: column;
    }
    .pd-cod-badge-title {
        font-weight: 700;
        color: #15803d;
        font-size: 0.95rem;
    }
    .pd-cod-badge-sub {
        font-size: 0.82rem;
        color: #4ade80;
        margin-top: 2px;
    }
    [data-theme="dark"] .pd-cod-badge {
        background: linear-gradient(135deg, rgba(22, 163, 74, 0.12), rgba(22, 163, 74, 0.06));
        border: 1px solid rgba(74, 222, 128, 0.25);
    }
    [data-theme="dark"] .pd-cod-badge-title {
        color: #4ade80;
    }
    [data-theme="dark"] .pd-cod-badge-sub {
        color: #86efac;
    }
    [data-theme="dark"] .pd-cod-badge-icon {
        background: rgba(22, 163, 74, 0.25);
        color: #4ade80;
    }

    /* Vendor Card */
    .vendor-card-wrap {
        background: linear-gradient(145deg, #f8f9fa, #ffffff);
        border: 1px solid #e9ecef;
        border-radius: 12px;
        padding: 18px;
    }
    .vendor-card-avatar {
        width: 56px;
        height: 56px;
        border-radius: 50%;
        overflow: hidden;
        flex-shrink: 0;
        border: 2px solid #e9ecef;
        background: #f3f4f6;
        box-shadow: 0 2px 8px rgba(31, 43, 108, 0.1);
    }
    .vendor-card-avatar img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        display: block;
    }
    .vendor-card-avatar-placeholder {
        width: 100%;
        height: 100%;
        display: flex;
        align-items: center;
        justify-content: center;
        background: linear-gradient(135deg, #1f2b6c, #3f5aa9);
        color: rgba(255, 255, 255, 0.9);
        font-size: 1.2rem;
    }
    .vendor-card-name a {
        color: #212529;
        text-decoration: none;
        transition: color 0.15s;
    }
    .vendor-card-name a:hover {
        color: #1f2b6c;
    }
    .vendor-card-visit {
        border-radius: 8px;
        font-weight: 600;
        font-size: 0.82rem;
        white-space: nowrap;
    }
    .vendor-card-desc {
        line-height: 1.5;
    }
    .vendor-card-stat {
        font-size: 0.88rem;
    }
    [data-theme="dark"] .vendor-card-wrap {
        background: linear-gradient(145deg, var(--theme-surface), var(--theme-surface-muted));
        border-color: var(--theme-border);
    }
    [data-theme="dark"] .vendor-card-avatar {
        border-color: var(--theme-border);
        background: var(--theme-surface-muted);
    }
    [data-theme="dark"] .vendor-card-name a {
        color: var(--theme-text);
    }
    [data-theme="dark"] .vendor-card-name a:hover {
        color: #748ffc;
    }
    [data-theme="dark"] .vendor-card-desc {
        color: var(--theme-text-muted);
    }
    [data-theme="dark"] .vendor-card-stat .text-dark {
        color: var(--theme-text) !important;
    }
    [data-theme="dark"] .vendor-card-avatar-placeholder {
        background: linear-gradient(135deg, #3b4cca, #5a6fe0);
    }
    /* Sticky Mobile CTA Bar */
    .pd-sticky-cta {
        position: fixed;
        bottom: 0;
        left: 0;
        right: 0;
        z-index: 10470;
        transform: translateY(100%);
        transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
        background: #ffffff;
        border-top: 1px solid #e5e7eb;
        box-shadow: 0 -4px 20px rgba(0, 0, 0, 0.1);
        padding: 10px 16px;
        padding-bottom: max(10px, env(safe-area-inset-bottom));
    }
    .pd-sticky-cta.is-visible {
        transform: translateY(0);
    }
    .pd-sticky-cta-inner {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 12px;
        max-width: 1200px;
        margin: 0 auto;
    }
    .pd-sticky-cta-left {
        display: flex;
        align-items: center;
        gap: 10px;
        min-width: 0;
        flex: 1;
    }
    .pd-sticky-cta-thumb {
        width: 44px;
        height: 44px;
        border-radius: 8px;
        object-fit: cover;
        border: 1px solid #e5e7eb;
        flex-shrink: 0;
    }
    .pd-sticky-cta-info {
        display: flex;
        flex-direction: column;
        min-width: 0;
    }
    .pd-sticky-cta-price {
        font-weight: 800;
        font-size: 1.1rem;
        color: #ff6f00;
        white-space: nowrap;
    }
    .pd-sticky-cta-name {
        font-size: 0.78rem;
        color: #6b7280;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        max-width: 180px;
    }
    .pd-sticky-cta-actions {
        display: flex;
        gap: 8px;
        flex-shrink: 0;
    }
    .pd-sticky-cta-buy,
    .pd-sticky-cta-cart {
        padding: 8px 14px;
        border-radius: 8px;
        font-weight: 700;
        font-size: 0.82rem;
        white-space: nowrap;
        border: none;
        cursor: pointer;
    }
    .pd-sticky-cta-cart {
        background: linear-gradient(135deg, #ff6f00, #ff9100);
        color: #fff;
    }
    .pd-sticky-cta-cart:hover {
        background: linear-gradient(135deg, #e65100, #ff6f00);
    }
    .pd-sticky-cta-buy {
        background: linear-gradient(135deg, #1a1a2e, #16213e);
        color: #fff;
    }
    .pd-sticky-cta-buy:hover {
        background: linear-gradient(135deg, #0f3460, #1a1a2e);
    }
    @media (min-width: 768px) {
        .pd-sticky-cta {
            display: none !important;
        }
    }
    [data-theme="dark"] .pd-sticky-cta {
        background: #1a1a2e;
        border-top-color: #2d3748;
        box-shadow: 0 -4px 20px rgba(0, 0, 0, 0.4);
    }
    [data-theme="dark"] .pd-sticky-cta-thumb {
        border-color: #374151;
    }
    [data-theme="dark"] .pd-sticky-cta-name {
        color: #9ca3af;
    }
    [data-theme="dark"] .pd-sticky-cta-cart {
        background: linear-gradient(135deg, #ff6f00, #ff9100);
    }
    [data-theme="dark"] .pd-sticky-cta-buy {
        background: linear-gradient(135deg, #0f3460, #1a1a2e);
    }

    /* Share Buttons */
    .pd-share-row {
        display: flex;
        align-items: center;
        gap: 8px;
        margin-bottom: 16px;
    }
    .pd-share-btn {
        width: 36px;
        height: 36px;
        border-radius: 50%;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        font-size: 0.9rem;
        color: #fff;
        text-decoration: none;
        border: none;
        cursor: pointer;
        transition: transform 0.2s, box-shadow 0.2s;
    }
    .pd-share-btn:hover {
        transform: scale(1.1);
        box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
        color: #fff;
        text-decoration: none;
    }
    .pd-share-whatsapp { background: #25d366; }
    .pd-share-facebook { background: #1877f2; }
    .pd-share-twitter { background: #1da1f2; }
    .pd-share-copy { background: #6b7280; }
    .pd-share-copied {
        font-size: 0.78rem;
        font-weight: 600;
        color: #16a34a;
        opacity: 0;
        transition: opacity 0.3s;
        pointer-events: none;
    }
    .pd-share-copied.is-showing {
        opacity: 1;
    }
    [data-theme="dark"] .pd-share-btn:hover {
        box-shadow: 0 4px 12px rgba(0, 0, 0, 0.5);
    }
/* Social Proof Ticker */
.pd-social-proof {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin: 12px 0 16px;
}
.pd-sp-item {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 14px;
    border-radius: 20px;
    font-size: 0.82rem;
    font-weight: 600;
    background: var(--theme-surface-muted, #f3f4f6);
    color: var(--theme-text-muted, #6b7280);
    border: 1px solid var(--theme-border, #e5e7eb);
}
.pd-sp-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    flex-shrink: 0;
}
.pd-sp-dot--live {
    background: #22c55e;
    animation: pd-sp-pulse 2s ease-in-out infinite;
}
@keyframes pd-sp-pulse {
    0%, 100% { opacity: 1; box-shadow: 0 0 0 0 rgba(34,197,94,.5); }
    50% { opacity: .7; box-shadow: 0 0 0 4px rgba(34,197,94,0); }
}
.pd-sp-viewers {
    background: rgba(34,197,94,.08);
    border-color: rgba(34,197,94,.2);
    color: #16a34a;
}
.pd-sp-bought i {
    color: #ef4444;
    font-size: 0.78rem;
}
.pd-sp-bought {
    background: rgba(239,68,68,.06);
    border-color: rgba(239,68,68,.15);
    color: #dc2626;
}
[data-theme="dark"] .pd-sp-viewers {
    background: rgba(34,197,94,.12);
    border-color: rgba(34,197,94,.25);
    color: #4ade80;
}
[data-theme="dark"] .pd-sp-bought {
    background: rgba(239,68,68,.1);
    border-color: rgba(239,68,68,.2);
    color: #f87171;
}
@media (max-width: 575.98px) {
    .pd-social-proof { gap: 8px; }
    .pd-sp-item { font-size: 0.76rem; padding: 5px 10px; }
}

/* ── Product detail comprehensive dark mode ────────────────────── */
[data-theme="dark"] .gallery-main-img-container { background: #232733 !important; }
[data-theme="dark"] .breadcrumb.bg-transparent .breadcrumb-item,
[data-theme="dark"] .breadcrumb.bg-transparent .breadcrumb-item a { color: #9ca3af !important; }
[data-theme="dark"] .breadcrumb.bg-transparent .breadcrumb-item.active { color: #e5e7eb !important; }
[data-theme="dark"] .breadcrumb.bg-transparent .breadcrumb-item + .breadcrumb-item::before { color: #6b7280 !important; }
[data-theme="dark"] .modern-card h2[style*="#212529"],
[data-theme="dark"] .modern-card h3,
[data-theme="dark"] .modern-card h5 { color: #f1f5f9 !important; }
[data-theme="dark"] .modern-card .text-dark,
[data-theme="dark"] .modern-card strong.text-dark,
[data-theme="dark"] .modern-card .font-weight-bold.text-dark { color: #e5e7eb !important; }
[data-theme="dark"] .modern-card .text-muted { color: #9ca3af !important; }
[data-theme="dark"] .modern-card .text-warning { color: #fbbf24 !important; }
[data-theme="dark"] .modern-card hr { border-color: #2d3748 !important; }
[data-theme="dark"] .modern-card .bg-light { background: #232733 !important; border-color: #2d3748 !important; }
[data-theme="dark"] .modern-card .bg-light .text-dark { color: #e5e7eb !important; }
[data-theme="dark"] .modern-card .bg-light .text-muted { color: #9ca3af !important; }
[data-theme="dark"] .modern-card .breadcrumb { background: transparent !important; }
[data-theme="dark"] .modern-card .breadcrumb .breadcrumb-item,
[data-theme="dark"] .modern-card .breadcrumb .breadcrumb-item a { color: #9ca3af !important; }
[data-theme="dark"] .modern-card .breadcrumb .breadcrumb-item.active { color: #e5e7eb !important; }
[data-theme="dark"] .pd-price-wrap .price-tag { color: #ff8c42 !important; }
[data-theme="dark"] .pd-price-wrap .pd-original-price { color: #6b7280 !important; }
[data-theme="dark"] .stock-urgency-bar { background: rgba(239,68,68,.12) !important; border-color: rgba(239,68,68,.22) !important; }
[data-theme="dark"] .stock-urgency-text { color: #fca5a5 !important; }
[data-theme="dark"] .pd-social-proof .pd-sp-item { border-color: #2d3748 !important; }
[data-theme="dark"] #selected-variant-container .badge-info { background: #1e40af !important; color: #dbeafe !important; }
[data-theme="dark"] .modern-card .form-control { background: #1f2430 !important; color: #e5e7eb !important; border-color: #2d3748 !important; }
[data-theme="dark"] .modern-card .form-control::placeholder { color: #6b7280 !important; }
[data-theme="dark"] .modern-card .input-group .form-control { background: #232733 !important; }
[data-theme="dark"] .modern-card .btn-outline-dark { color: #cbd5e1 !important; border-color: #3a4558 !important; }
[data-theme="dark"] .modern-card .btn-outline-dark:hover { background: #2d3748 !important; color: #fff !important; }
[data-theme="dark"] .modern-card .progress-custom { background: #2d3748 !important; }
[data-theme="dark"] .modern-card .review-snapshot .display-3 { color: #f1f5f9 !important; }
[data-theme="dark"] .modern-card .border-bottom { border-color: #2d3748 !important; }
[data-theme="dark"] .modern-card .bg-light.border { border-color: #2d3748 !important; }
[data-theme="dark"] .modern-card .owl-carousel .owl-stage-outer { background: transparent !important; }

/* ══════════════════════════════════════════════════════════════════
   RESPONSIVE FIXES — Product Detail Page
   ══════════════════════════════════════════════════════════════════ */

/* ── Action Row: Quantity + Buttons ──────────────────────────── */
.pd-action-row {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    gap: 16px;
}
.pd-action-qty {
    flex-shrink: 0;
}
.pd-action-btn {
    flex: 1 1 0;
    min-width: 0;
}
.pd-qty-input {
    height: 52px;
    border-radius: 8px;
    border: 1px solid #ddd;
    font-size: 1.2rem;
    width: 140px;
}
@media (max-width: 575.98px) {
    .pd-action-row {
        gap: 12px;
    }
    .pd-action-qty {
        width: 100%;
    }
    .pd-action-qty .input-group {
        max-width: 160px;
    }
    .pd-qty-input {
        width: 100%;
    }
    .pd-action-btn {
        flex: 1 1 calc(50% - 6px);
        min-width: 0;
    }
    .pd-action-btn .btn {
        padding: 12px 8px;
        font-size: 0.92rem;
        height: 48px !important;
    }
}

/* ── Gallery Thumbnails ──────────────────────────────────────── */
@media (max-width: 575.98px) {
    .gallery-thumbnail {
        width: 54px;
        height: 54px;
    }
    .pd-thumb-strip {
        gap: 8px !important;
    }
}
@media (max-width: 374.98px) {
    .gallery-thumbnail {
        width: 46px;
        height: 46px;
    }
}

/* ── Main Image Container ────────────────────────────────────── */
@media (max-width: 575.98px) {
    .gallery-main-img-container {
        min-height: 280px;
    }
    .gallery-main-img {
        max-height: 280px;
    }
}
@media (min-width: 576px) and (max-width: 991.98px) {
    .gallery-main-img-container {
        min-height: 340px;
    }
    .gallery-main-img {
        max-height: 340px;
    }
}

/* ── Price Tag ───────────────────────────────────────────────── */
@media (max-width: 575.98px) {
    .price-tag {
        font-size: 1.65rem;
    }
    .pd-price-wrap .pd-original-price {
        font-size: 1rem;
    }
}

/* ── Benefit Text: allow wrapping on narrow screens ──────────── */
@media (max-width: 767.98px) {
    .pd-benefit-text strong,
    .pd-benefit-text small {
        white-space: normal;
    }
}

/* ── Variant Pills ───────────────────────────────────────────── */
@media (max-width: 575.98px) {
    .variant-pills-group {
        gap: 8px;
    }
    .variant-pill-label {
        padding: 8px 14px;
        font-size: 0.85rem;
    }
}

/* ── Wishlist / Review Buttons ───────────────────────────────── */
@media (max-width: 575.98px) {
    .btn-secondary-action {
        padding: 10px 12px;
        font-size: 0.88rem;
    }
}

/* ── Sticky CTA Bar ──────────────────────────────────────────── */
@media (max-width: 575.98px) {
    .pd-sticky-cta {
        padding: 8px 12px;
    }
    .pd-sticky-cta-actions {
        gap: 6px;
    }
    .pd-sticky-cta-buy,
    .pd-sticky-cta-cart {
        padding: 7px 10px;
        font-size: 0.76rem;
    }
    .pd-sticky-cta-name {
        max-width: 110px;
        font-size: 0.72rem;
    }
    .pd-sticky-cta-price {
        font-size: 0.95rem;
    }
    .pd-sticky-cta-thumb {
        width: 38px;
        height: 38px;
    }
}

/* ── Review Snapshot Progress Bars ───────────────────────────── */
@media (max-width: 575.98px) {
    .review-snapshot .display-3 {
        font-size: 2rem;
    }
}

/* ── Review Filter Form ──────────────────────────────────────── */
@media (max-width: 767.98px) {
    .review-filter-row {
        flex-direction: column;
    }
    .review-filter-row .col-md-4 {
        width: 100%;
        margin-bottom: 8px;
    }
    .review-filter-row .col-md-4.d-flex {
        flex-direction: row;
        gap: 8px;
    }
}

/* ── Vendor Card ─────────────────────────────────────────────── */
@media (max-width: 575.98px) {
    .vendor-card-wrap {
        padding: 14px;
    }
    .vendor-card-avatar {
        width: 44px;
        height: 44px;
    }
    .vendor-card-name {
        font-size: 0.95rem;
    }
    .vendor-card-visit {
        font-size: 0.76rem;
        padding: 4px 10px;
    }
    .vendor-card-stats {
        gap: 10px !important;
    }
    .vendor-card-stat {
        font-size: 0.82rem;
    }
}

/* ── COD Badge ───────────────────────────────────────────────── */
@media (max-width: 575.98px) {
    .pd-cod-badge {
        padding: 10px 14px;
    }
    .pd-cod-badge-icon {
        width: 38px;
        height: 38px;
        font-size: 0.95rem;
    }
    .pd-cod-badge-title {
        font-size: 0.88rem;
    }
    .pd-cod-badge-sub {
        font-size: 0.76rem;
    }
}

/* ── Product Title ───────────────────────────────────────────── */
@media (max-width: 575.98px) {
    #pdDetailsCard h2 {
        font-size: 1.2rem;
        word-break: break-word;
    }
}

/* ── Description Section ─────────────────────────────────────── */
@media (max-width: 575.98px) {
    .pd-gallery-card .pd-gallery-extras .pd-extra-delivery {
        flex-direction: column;
        gap: 8px;
    }
    .pd-gallery-card .pd-gallery-extras .pd-delivery-sep {
        display: none;
    }
}

/* ── Reviews Section ─────────────────────────────────────────── */
@media (max-width: 575.98px) {
    .review-snapshot {
        padding: 16px !important;
    }
}

/* ── Related Products / Carousel Sections ────────────────────── */
@media (max-width: 575.98px) {
    .owl-carousel-related .owl-item,
    .owl-carousel .owl-item {
        padding: 0 4px;
    }
}

/* ── Mobile: gallery card padding ────────────────────────────── */
@media (max-width: 575.98px) {
    .pd-gallery-card {
        padding: 12px !important;
    }
    #pdDetailsCard {
        padding: 16px !important;
    }
}

/* ── Price Wrap: prevent overflow on narrow screens ──────────── */
@media (max-width: 575.98px) {
    .pd-price-wrap {
        display: flex;
        flex-wrap: wrap;
        align-items: baseline;
        gap: 6px 10px;
    }
    .pd-price-wrap .badge {
        font-size: 0.75rem;
        padding: 4px 10px;
    }
}

/* ── Share Buttons: tighter on mobile ─────────────────────────── */
@media (max-width: 374.98px) {
    .pd-share-row {
        gap: 6px;
    }
    .pd-share-btn {
        width: 32px;
        height: 32px;
        font-size: 0.8rem;
    }
}