/*
 * PM Shop Global Purple UI V29
 * Mengganti seluruh aksen biru / indigo / cyan / sky menjadi keluarga ungu.
 * Hanya UI: tidak mengubah route, permission, database, harga, transaksi, atau JavaScript bisnis.
 */

:root {
    --pm29-purple-50: #faf5ff;
    --pm29-purple-100: #f3e8ff;
    --pm29-purple-200: #e9d5ff;
    --pm29-purple-300: #d8b4fe;
    --pm29-purple-400: #c084fc;
    --pm29-purple-500: #a855f7;
    --pm29-purple-600: #9333ea;
    --pm29-purple-700: #7e22ce;
    --pm29-purple-800: #6b21a8;
    --pm29-purple-900: #581c87;
    --pm29-violet: #8b5cf6;
    --pm29-fuchsia: #c026d3;
    --pm29-solid: linear-gradient(135deg, #6d28d9 0%, #9333ea 55%, #c026d3 100%);
    --pm29-solid-hover: linear-gradient(135deg, #5b21b6 0%, #7e22ce 55%, #a21caf 100%);
    --pm29-soft-dark: rgba(147, 51, 234, .16);
    --pm29-soft-light: #f3e8ff;
    --pm29-border-dark: rgba(216, 180, 254, .40);
    --pm29-border-light: #d8b4fe;

    /* Variabel lama yang masih dipakai beberapa halaman. */
    --blue: #a855f7 !important;
    --cyan: #c026d3 !important;
    --pm6-blue: #9333ea !important;
    --pm6-cyan: #c026d3 !important;
    --ss-primary: #9333ea !important;
    --pm-accent: #9333ea !important;
}

html,
body {
    accent-color: var(--pm29-purple-600) !important;
}

html.pm-light body {
    background-image:
        radial-gradient(circle at 20% 12%, rgba(168, 85, 247, .15), transparent 29%),
        radial-gradient(circle at 80% 26%, rgba(192, 38, 211, .09), transparent 27%),
        linear-gradient(180deg, #fbf8ff 0%, #f5efff 46%, #fbf8ff 100%) !important;
}

/* ================================================================
   TAILWIND BLUE / INDIGO / SKY / CYAN -> PURPLE
   ================================================================ */

/* Solid controls yang memakai teks putih. */
:is(button, a, input[type="submit"], input[type="button"])[class*="bg-blue-"][class*="text-white"],
:is(button, a, input[type="submit"], input[type="button"])[class*="bg-indigo-"][class*="text-white"],
:is(button, a, input[type="submit"], input[type="button"])[class*="bg-sky-"][class*="text-white"],
:is(button, a, input[type="submit"], input[type="button"])[class*="bg-cyan-"][class*="text-white"],
:is(button, a)[class*="from-blue-"],
:is(button, a)[class*="from-indigo-"],
:is(button, a)[class*="from-sky-"],
:is(button, a)[class*="from-cyan-"] {
    background-color: var(--pm29-purple-700) !important;
    background-image: var(--pm29-solid) !important;
    border-color: rgba(216, 180, 254, .58) !important;
    color: #fff !important;
    -webkit-text-fill-color: #fff !important;
    box-shadow: 0 12px 30px rgba(147, 51, 234, .30) !important;
}

:is(button, a, input[type="submit"], input[type="button"])[class*="bg-blue-"][class*="text-white"]:hover,
:is(button, a, input[type="submit"], input[type="button"])[class*="bg-indigo-"][class*="text-white"]:hover,
:is(button, a, input[type="submit"], input[type="button"])[class*="bg-sky-"][class*="text-white"]:hover,
:is(button, a, input[type="submit"], input[type="button"])[class*="bg-cyan-"][class*="text-white"]:hover,
:is(button, a)[class*="from-blue-"]:hover,
:is(button, a)[class*="from-indigo-"]:hover,
:is(button, a)[class*="from-sky-"]:hover,
:is(button, a)[class*="from-cyan-"]:hover {
    background-image: var(--pm29-solid-hover) !important;
    border-color: rgba(233, 213, 255, .75) !important;
    box-shadow: 0 16px 36px rgba(147, 51, 234, .38) !important;
}

/* Tinted boxes / badges. */
[class*="bg-blue-"],
[class*="bg-indigo-"],
[class*="bg-sky-"],
[class*="bg-cyan-"] {
    --tw-bg-opacity: 1 !important;
    background-color: rgba(147, 51, 234, .14) !important;
}

html.pm-light [class*="bg-blue-"],
html.pm-light [class*="bg-indigo-"],
html.pm-light [class*="bg-sky-"],
html.pm-light [class*="bg-cyan-"] {
    background-color: #f3e8ff !important;
}

/* Pastikan selector solid menang dari aturan tinted di atas. */
:is(button, a, input[type="submit"], input[type="button"])[class*="bg-blue-"][class*="text-white"],
:is(button, a, input[type="submit"], input[type="button"])[class*="bg-indigo-"][class*="text-white"],
:is(button, a, input[type="submit"], input[type="button"])[class*="bg-sky-"][class*="text-white"],
:is(button, a, input[type="submit"], input[type="button"])[class*="bg-cyan-"][class*="text-white"] {
    background-color: var(--pm29-purple-700) !important;
    background-image: var(--pm29-solid) !important;
}

[class*="text-blue-"],
[class*="text-indigo-"],
[class*="text-sky-"],
[class*="text-cyan-"] {
    color: var(--pm29-purple-300) !important;
    -webkit-text-fill-color: currentColor !important;
}

html.pm-light [class*="text-blue-"],
html.pm-light [class*="text-indigo-"],
html.pm-light [class*="text-sky-"],
html.pm-light [class*="text-cyan-"] {
    color: var(--pm29-purple-700) !important;
}

[class*="border-blue-"],
[class*="border-indigo-"],
[class*="border-sky-"],
[class*="border-cyan-"] {
    border-color: var(--pm29-border-dark) !important;
}

html.pm-light [class*="border-blue-"],
html.pm-light [class*="border-indigo-"],
html.pm-light [class*="border-sky-"],
html.pm-light [class*="border-cyan-"] {
    border-color: var(--pm29-border-light) !important;
}

[class*="ring-blue-"],
[class*="ring-indigo-"],
[class*="ring-sky-"],
[class*="ring-cyan-"],
[class*="focus:ring-blue-"]:focus,
[class*="focus:ring-indigo-"]:focus,
[class*="focus:ring-sky-"]:focus,
[class*="focus:ring-cyan-"]:focus {
    --tw-ring-color: rgba(168, 85, 247, .50) !important;
}

[class*="focus:border-blue-"]:focus,
[class*="focus:border-indigo-"]:focus,
[class*="focus:border-sky-"]:focus,
[class*="focus:border-cyan-"]:focus {
    border-color: var(--pm29-purple-500) !important;
}

[class*="shadow-blue-"],
[class*="shadow-indigo-"],
[class*="shadow-sky-"],
[class*="shadow-cyan-"] {
    --tw-shadow-color: rgba(147, 51, 234, .32) !important;
    --tw-shadow: var(--tw-shadow-colored) !important;
}

[class*="from-blue-"] , [class*="from-indigo-"] , [class*="from-sky-"] , [class*="from-cyan-"] {
    --tw-gradient-from: #7e22ce var(--tw-gradient-from-position) !important;
    --tw-gradient-to: rgba(126, 34, 206, 0) var(--tw-gradient-to-position) !important;
}
[class*="via-blue-"] , [class*="via-indigo-"] , [class*="via-sky-"] , [class*="via-cyan-"] {
    --tw-gradient-to: rgba(147, 51, 234, 0) var(--tw-gradient-to-position) !important;
    --tw-gradient-stops: var(--tw-gradient-from), #9333ea var(--tw-gradient-via-position), var(--tw-gradient-to) !important;
}
[class*="to-blue-"] , [class*="to-indigo-"] , [class*="to-sky-"] , [class*="to-cyan-"] {
    --tw-gradient-to: #c026d3 var(--tw-gradient-to-position) !important;
}

/* Link default Light Mode sebelumnya biru. */
html.pm-light body a:not([class*="bg-"]):not([class*="from-"]):not([class*="text-red-"]):not([class*="text-green-"]):not([class*="text-emerald-"]):not([class*="text-yellow-"]):not([class*="text-orange-"]):not([class*="text-rose-"]) {
    color: var(--pm29-purple-700) !important;
}

/* ================================================================
   KOMPONEN UMUM
   ================================================================ */

.btn-primary,
.primary-cta,
#hero-primary-cta,
.product-action-buy,
.nav-primary,
.cart-btn,
.rw-btn,
.re-btn,
.rv-admin-edit,
.adm-blue,
.mo-submit,
.pm-send,
.settings-page-icon,
.promo-popup-copy,
.auth-brand .brand-fallback,
button[data-primary],
a[data-primary] {
    background-color: var(--pm29-purple-700) !important;
    background-image: var(--pm29-solid) !important;
    border-color: rgba(216, 180, 254, .60) !important;
    color: #fff !important;
    -webkit-text-fill-color: #fff !important;
    box-shadow: 0 12px 30px rgba(147, 51, 234, .28) !important;
}

.btn-primary:hover,
.primary-cta:hover,
#hero-primary-cta:hover,
.product-action-buy:hover,
.nav-primary:hover,
.cart-btn:hover,
.rw-btn:hover,
.re-btn:hover,
.rv-admin-edit:hover,
.adm-blue:hover,
.mo-submit:hover,
.pm-send:hover,
.promo-popup-copy:hover {
    background-image: var(--pm29-solid-hover) !important;
}

.btn-primary *,
.primary-cta *,
#hero-primary-cta *,
.product-action-buy *,
.nav-primary *,
.cart-btn *,
.rw-btn *,
.re-btn *,
.rv-admin-edit *,
.adm-blue *,
.mo-submit *,
.pm-send * {
    color: #fff !important;
    -webkit-text-fill-color: #fff !important;
    stroke: #fff !important;
}

/* Checkbox/radio/switch. */
input[type="checkbox"],
input[type="radio"],
.adm-check input[type="checkbox"] {
    accent-color: var(--pm29-purple-600) !important;
}

/* Logo, navigasi aktif, input focus. */
.auth-brand .brand-accent,
.application-logo .text-indigo-400,
.nav-link-active,
.front-menu-link.active,
.front-menu-link[aria-current="page"] {
    color: var(--pm29-purple-400) !important;
}

input:focus,
textarea:focus,
select:focus {
    border-color: var(--pm29-purple-500) !important;
    --tw-ring-color: rgba(168, 85, 247, .42) !important;
}

/* ================================================================
   KOMPONEN KHUSUS YANG SEBELUMNYA MASIH BIRU
   ================================================================ */

.maintenance-admin-bypass-notice,
[data-maintenance-admin-bypass] {
    background: linear-gradient(90deg, #3b0764, #6b21a8, #3b0764) !important;
    color: #faf5ff !important;
}

.pm-chat-live.status-active {
    background: var(--pm29-purple-600) !important;
    border-color: var(--pm29-purple-300) !important;
    color: #fff !important;
}

.mo-info,
.mo-pay input:checked + label,
.rw-info,
.re-info {
    background: rgba(147, 51, 234, .14) !important;
    border-color: rgba(192, 132, 252, .42) !important;
    color: #e9d5ff !important;
}

html.pm-light .mo-info,
html.pm-light .mo-pay input:checked + label,
html.pm-light .rw-info,
html.pm-light .re-info {
    background: #f3e8ff !important;
    border-color: #d8b4fe !important;
    color: #581c87 !important;
}

.mo-info i,
.mo-info p,
.rw-back,
.re-back,
.auth-brand .brand-accent,
.support-contact-number,
.product-category,
.latest-toast .small-title,
.transparency-card h3,
.settings-page-header [class*="text-sky"],
.settings-page-header [class*="text-cyan"] {
    color: var(--pm29-purple-300) !important;
}

html.pm-light .mo-info i,
html.pm-light .mo-info p,
html.pm-light .rw-back,
html.pm-light .re-back,
html.pm-light .auth-brand .brand-accent,
html.pm-light .support-contact-number,
html.pm-light .product-category,
html.pm-light .latest-toast .small-title,
html.pm-light .transparency-card h3 {
    color: var(--pm29-purple-700) !important;
}

.work-icon,
.service-item i,
.category-icon,
.latest-icon,
.feature-icon[style*="37,99,235"],
.feature-icon[style*="#2563eb"],
.feature-icon[style*="#60a5fa"] {
    background: rgba(147, 51, 234, .16) !important;
    border-color: rgba(192, 132, 252, .42) !important;
    color: var(--pm29-purple-300) !important;
}

html.pm-light .work-icon,
html.pm-light .service-item i,
html.pm-light .category-icon,
html.pm-light .latest-icon,
html.pm-light .feature-icon[style*="37,99,235"],
html.pm-light .feature-icon[style*="#2563eb"],
html.pm-light .feature-icon[style*="#60a5fa"] {
    background: #f3e8ff !important;
    border-color: #d8b4fe !important;
    color: var(--pm29-purple-700) !important;
}

.order-num {
    border-color: var(--pm29-purple-500) !important;
    box-shadow: 0 0 0 7px rgba(168, 85, 247, .14) !important;
}

.latest-toast {
    border-color: rgba(192, 132, 252, .42) !important;
}
.latest-toast::before {
    background: linear-gradient(135deg, rgba(147,51,234,.10), transparent 42%, rgba(192,38,211,.09)) !important;
}

/* Katalog, invoice, tiket, promo popup. */
.catalog-buy-btn,
.catalog-primary-btn,
.invoice-primary-btn,
.ticket-primary-btn,
#addOfficialPartner,
[data-add-partner] {
    background-color: var(--pm29-purple-700) !important;
    background-image: var(--pm29-solid) !important;
    border-color: rgba(216,180,254,.58) !important;
    color: #fff !important;
}

.promo-popup-copy,
.promo-popup-action,
.promo-popup-primary {
    background: var(--pm29-solid) !important;
    color: #fff !important;
}

/* Toast/info yang memang informatif tetapi tadinya cyan/biru. */
.info-blue,
.alert-blue,
.notice-blue,
[class*="blue-info"],
[class*="info-blue"] {
    background: rgba(147, 51, 234, .14) !important;
    border-color: rgba(192, 132, 252, .40) !important;
    color: #e9d5ff !important;
}
html.pm-light .info-blue,
html.pm-light .alert-blue,
html.pm-light .notice-blue,
html.pm-light [class*="blue-info"],
html.pm-light [class*="info-blue"] {
    background: #f3e8ff !important;
    border-color: #d8b4fe !important;
    color: #581c87 !important;
}

/* ================================================================
   HARD-CODED BLUE INLINE/CUSTOM STYLE GUARDS
   ================================================================ */

/* Hanya elemen yang secara eksplisit membawa warna biru lama. */
[style*="#2563eb"],
[style*="#3b82f6"],
[style*="#4f46e5"],
[style*="#6366f1"],
[style*="#0ea5e9"],
[style*="#0284c7"],
[style*="#0891b2"],
[style*="#60a5fa"] {
    border-color: rgba(192, 132, 252, .50) !important;
}

:is(button, a)[style*="#2563eb"],
:is(button, a)[style*="#3b82f6"],
:is(button, a)[style*="#4f46e5"],
:is(button, a)[style*="#6366f1"],
:is(button, a)[style*="#0ea5e9"],
:is(button, a)[style*="#0284c7"],
:is(button, a)[style*="#0891b2"] {
    background-color: var(--pm29-purple-700) !important;
    background-image: var(--pm29-solid) !important;
    color: #fff !important;
    -webkit-text-fill-color: #fff !important;
}

/* Override CSS class tertentu yang memakai !important di halaman. */
html body .adm-blue,
html.pm-light body .adm-blue,
html body .rv-admin-edit,
html body .pm-chat-live.status-active,
html body #addOfficialPartner,
html body .settings-page-icon {
    background-color: var(--pm29-purple-700) !important;
    background-image: var(--pm29-solid) !important;
    border-color: rgba(216, 180, 254, .58) !important;
    color: #fff !important;
}

/* Theme menu dan selection. */
::selection {
    background: rgba(147, 51, 234, .75) !important;
    color: #fff !important;
}
.pm-theme-option-v4[aria-checked="true"] {
    background: var(--pm29-solid) !important;
    color: #fff !important;
}

/* Jangan ubah warna semantik sukses, bahaya, peringatan. */
:is(.text-green-400,.text-green-500,.text-emerald-400,.text-emerald-500,
    .text-red-400,.text-red-500,.text-rose-400,.text-rose-500,
    .text-yellow-400,.text-yellow-500,.text-orange-400,.text-orange-500) {
    -webkit-text-fill-color: currentColor !important;
}


/* ================================================================
   FINAL OVERRIDES: stylesheet ini dimuat paling akhir sebelum </body>.
   ================================================================ */
html body .promo-popup-copy,
html body .promo-popup-action,
html body .promo-popup-primary,
html body .mo-submit,
html body .rw-btn,
html body .re-btn,
html body .rv-admin-edit,
html body .adm-blue,
html body .pm-send,
html body .settings-page-icon,
html body #addOfficialPartner,
html body button[title="Beli Sekarang"],
html body a[title="Beli Sekarang"] {
    background-color: #7e22ce !important;
    background-image: linear-gradient(135deg, #6d28d9 0%, #9333ea 55%, #c026d3 100%) !important;
    border-color: rgba(216, 180, 254, .64) !important;
    color: #fff !important;
    -webkit-text-fill-color: #fff !important;
}

html body button[title="Masukkan Keranjang"],
html body a[title="Masukkan Keranjang"] {
    border-color: #a855f7 !important;
    color: #7e22ce !important;
}
html body button[title="Masukkan Keranjang"] *,
html body a[title="Masukkan Keranjang"] * {
    color: #7e22ce !important;
    -webkit-text-fill-color: #7e22ce !important;
}
html:not(.pm-light) body button[title="Masukkan Keranjang"],
html:not(.pm-light) body a[title="Masukkan Keranjang"] {
    background: rgba(88, 28, 135, .18) !important;
    color: #e9d5ff !important;
}
html:not(.pm-light) body button[title="Masukkan Keranjang"] *,
html:not(.pm-light) body a[title="Masukkan Keranjang"] * {
    color: #e9d5ff !important;
    -webkit-text-fill-color: #e9d5ff !important;
}

html.pm-light body .catalog-readable-card .catalog-soft,
html.pm-light body #catalog-info-process .catalog-info-side-icon,
html.pm-light body .catalog-hero-badge i,
html.pm-light body .catalog-product-card .catalog-soft {
    color: #7e22ce !important;
}
html.pm-light body #catalog-info-process .catalog-info-side-icon,
html.pm-light body .catalog-hero-badge {
    background: #f3e8ff !important;
    border-color: #d8b4fe !important;
}
html.pm-light body .catalog-product-card:hover {
    border-color: #c084fc !important;
}

html body .pm-chat-live.status-active {
    background: #9333ea !important;
    border-color: #d8b4fe !important;
    color: #fff !important;
}

html body .auth-brand .brand-fallback,
html body .application-logo > div,
html body .brand-fallback {
    background-image: linear-gradient(135deg, #6d28d9 0%, #9333ea 55%, #c026d3 100%) !important;
}

html.pm-light body .premium-header,
html.pm-light body .front-side-menu,
html.pm-light body .auth-shell,
html.pm-light body .settings-page-header {
    --pm-blue: #9333ea !important;
    --pm-cyan: #c026d3 !important;
}