/* PM Shop V104 - Dark Purple Final Override
   File ini sengaja dimuat paling akhir agar tidak ditimpa stylesheet legacy V29/V32. */

html:not(.pm-light) {
    --pm104-bg: #090411;
    --pm104-bg-2: #10071d;
    --pm104-surface: #160a29;
    --pm104-surface-2: #1c0d34;
    --pm104-surface-3: #241043;
    --pm104-border: rgba(179, 121, 255, .22);
    --pm104-border-gold: rgba(238, 193, 80, .24);
    --pm104-text-muted: #c7b7df;
    --pm104-purple: #a855f7;
    --pm104-gold: #f0c550;
}

html:not(.pm-light) body {
    background:
        radial-gradient(circle at 18% 8%, rgba(130, 61, 215, .16), transparent 29%),
        radial-gradient(circle at 84% 22%, rgba(217, 70, 239, .08), transparent 28%),
        linear-gradient(180deg, var(--pm104-bg) 0%, var(--pm104-bg-2) 48%, #08030f 100%) !important;
    color: #f8f2ff !important;
}

/* Header, footer, side menu */
html:not(.pm-light) body .premium-header,
html:not(.pm-light) body .premium-footer,
html:not(.pm-light) body .front-side-menu {
    background-color: rgba(18, 7, 34, .94) !important;
    border-color: var(--pm104-border) !important;
}
html:not(.pm-light) body .front-menu-link {
    background: linear-gradient(180deg, rgba(31, 13, 55, .96), rgba(16, 7, 30, .98)) !important;
    border-color: var(--pm104-border) !important;
    color: #f8f2ff !important;
}
html:not(.pm-light) body .front-menu-link:hover {
    background: linear-gradient(180deg, rgba(55, 20, 91, .98), rgba(27, 9, 48, .99)) !important;
    border-color: var(--pm104-border-gold) !important;
}

/* Beranda: hilangkan lapisan biru/navy */
html:not(.pm-light) body .eyebrow,
html:not(.pm-light) body .stat-card,
html:not(.pm-light) body .info-card,
html:not(.pm-light) body .work-num,
html:not(.pm-light) body .secondary-cta,
html:not(.pm-light) body .wallet-btn,
html:not(.pm-light) body .category-card,
html:not(.pm-light) body .product-card,
html:not(.pm-light) body .feature-card,
html:not(.pm-light) body .order-card,
html:not(.pm-light) body .review-card,
html:not(.pm-light) body .faq-list details,
html:not(.pm-light) body .partner-badge {
    background-color: var(--pm104-surface) !important;
    background-image: linear-gradient(180deg, rgba(29, 12, 52, .96), rgba(15, 7, 28, .98)) !important;
    border-color: var(--pm104-border) !important;
}

html:not(.pm-light) body .feature-wrap,
html:not(.pm-light) body .review-wrap {
    background-color: #120822 !important;
    background-image:
        radial-gradient(circle at 50% 0%, rgba(126, 34, 206, .14), transparent 38%),
        linear-gradient(180deg, #160a29 0%, #10071d 100%) !important;
    border-top-color: rgba(179, 121, 255, .16) !important;
    border-bottom-color: rgba(179, 121, 255, .16) !important;
}

html:not(.pm-light) body .product-media,
html:not(.pm-light) body .catalog-product-image {
    background-color: #21103a !important;
    background-image: linear-gradient(135deg, #251044 0%, #3a185f 62%, rgba(111, 77, 24, .72) 100%) !important;
}

html:not(.pm-light) body .order-num {
    background: #2a124a !important;
    border-color: #a855f7 !important;
    box-shadow: 0 0 0 7px rgba(168, 85, 247, .14) !important;
}

html:not(.pm-light) body .latest-toast {
    background: linear-gradient(180deg, rgba(30, 13, 53, .98), rgba(14, 7, 27, .98)) !important;
    border-color: var(--pm104-border-gold) !important;
    box-shadow: 0 18px 50px rgba(0, 0, 0, .42), 0 0 34px rgba(126, 34, 206, .12) !important;
}
html:not(.pm-light) body .latest-toast::before {
    background: linear-gradient(135deg, rgba(168,85,247,.12), transparent 42%, rgba(240,197,80,.10)) !important;
}
html:not(.pm-light) body .latest-icon {
    background: radial-gradient(circle at top, rgba(168,85,247,.26), rgba(83,31,132,.16)) !important;
    border-color: rgba(216, 180, 254, .26) !important;
    color: #e9d5ff !important;
}
html:not(.pm-light) body .latest-toast .small-title { color: #f5d46f !important; }

/* Katalog */
html:not(.pm-light) body .catalog-readable-card,
html:not(.pm-light) body .catalog-filter-card,
html:not(.pm-light) body .catalog-mobile-filter,
html:not(.pm-light) body .catalog-product-card,
html:not(.pm-light) body .catalog-empty-card {
    background-color: var(--pm104-surface) !important;
    background-image: linear-gradient(180deg, rgba(28, 12, 50, .97), rgba(14, 7, 27, .98)) !important;
    border-color: var(--pm104-border) !important;
    box-shadow: 0 18px 46px rgba(0, 0, 0, .28) !important;
}
html:not(.pm-light) body .catalog-readable-card.mb-8 {
    background-image:
        radial-gradient(circle at 92% 85%, rgba(240, 197, 80, .30), transparent 28%),
        linear-gradient(135deg, rgba(28,12,50,.98), rgba(45,17,76,.96), rgba(69,46,20,.72)) !important;
    border-color: rgba(216, 180, 254, .30) !important;
}
html:not(.pm-light) body .catalog-hero-wallet {
    background: linear-gradient(135deg, rgba(29,13,52,.92), rgba(75,50,18,.34)) !important;
    border-color: var(--pm104-border-gold) !important;
}
html:not(.pm-light) body .catalog-filter-card input,
html:not(.pm-light) body .catalog-filter-card select,
html:not(.pm-light) body .catalog-filter-card .bg-gray-800\/50 {
    background-color: #1e0e35 !important;
    border-color: rgba(179, 121, 255, .20) !important;
    color: #f8f2ff !important;
}
html:not(.pm-light) body .catalog-product-card:hover,
html:not(.pm-light) body .category-card:hover,
html:not(.pm-light) body .product-card:hover {
    border-color: rgba(240, 197, 80, .40) !important;
}

/* Tailwind legacy navy/slate yang masih dipakai pada frontend. Semantic colors tidak disentuh. */
html:not(.pm-light) body .bg-slate-950,
html:not(.pm-light) body .bg-slate-900,
html:not(.pm-light) body .bg-slate-800,
html:not(.pm-light) body .bg-slate-700,
html:not(.pm-light) body .bg-gray-950,
html:not(.pm-light) body .bg-gray-900,
html:not(.pm-light) body .bg-gray-800,
html:not(.pm-light) body .bg-gray-700 {
    background-color: var(--pm104-surface) !important;
}
html:not(.pm-light) body [class*="bg-slate-950"],
html:not(.pm-light) body [class*="bg-slate-900"],
html:not(.pm-light) body [class*="bg-slate-800"],
html:not(.pm-light) body [class*="bg-gray-950"],
html:not(.pm-light) body [class*="bg-gray-900"],
html:not(.pm-light) body [class*="bg-gray-800"] {
    background-color: var(--pm104-surface) !important;
}
html:not(.pm-light) body .border-slate-700,
html:not(.pm-light) body .border-slate-800,
html:not(.pm-light) body .border-gray-700,
html:not(.pm-light) body .border-gray-800 {
    border-color: var(--pm104-border) !important;
}
html:not(.pm-light) body .text-slate-300,
html:not(.pm-light) body .text-slate-400,
html:not(.pm-light) body .text-slate-500,
html:not(.pm-light) body .text-gray-300,
html:not(.pm-light) body .text-gray-400,
html:not(.pm-light) body .text-gray-500 {
    color: var(--pm104-text-muted) !important;
}

/* Fallback untuk beberapa komponen yang memakai warna navy hard-coded dari versi lama. */
html:not(.pm-light) body .faq-list details,
html:not(.pm-light) body .feature-wrap,
html:not(.pm-light) body .review-wrap,
html:not(.pm-light) body .catalog-filter-card,
html:not(.pm-light) body .catalog-readable-card,
html:not(.pm-light) body .catalog-product-card {
    color-scheme: dark;
}