/* Dipindah dari shop/partials/sg-cohesion-styles.php (blok #5, id=sg-legacy-surface-wins) */
    /* Final wins — remap legacy pure black/white stacks to cohesion tokens */
    html:not([data-theme="light"]) body,
    html:not([data-theme="light"]) .tg-app {
        background: var(--sg-surface-page) !important;
        background-image: none !important;
        color: #f1f6ff !important;
    }
    html:not([data-theme="light"]) .tg-main {
        background: linear-gradient(180deg, rgba(26, 134, 255, .07) 0, rgba(26, 134, 255, 0) 130px), var(--sg-surface-page) !important;
        background-color: var(--sg-surface-page) !important;
        background-image: linear-gradient(180deg, rgba(26, 134, 255, .07) 0, rgba(26, 134, 255, 0) 130px) !important;
    }
    html:not([data-theme="light"]) .tg-footer,
    html:not([data-theme="light"]) .sg-footer {
        background: var(--sg-surface-subtle) !important;
        background-image: none !important;
    }
    html:not([data-theme="light"]) .card,
    html:not([data-theme="light"]) .hero-card {
        background: var(--sg-surface-elevated) !important;
        background-image: none !important;
        border-color: var(--sg-border) !important;
    }
    html[data-theme="light"] .card.empty,
    html[data-theme="light"] .card.empty-state {
        background: var(--sg-surface-card) !important;
        color: var(--sg-text-secondary) !important;
        text-align: center;
        padding: 28px 20px !important;
    }
    html:not([data-theme="light"]) .card.empty,
    html:not([data-theme="light"]) .card.empty-state {
        background: var(--sg-surface-elevated) !important;
        color: var(--sg-text-muted) !important;
        text-align: center;
        padding: 28px 20px !important;
    }

    html[data-theme="light"] .sg-brand-text strong { color: var(--sg-brand) !important; }
    html[data-theme="light"] .sg-nav-menu-link.is-active {
        color: var(--sg-brand) !important;
        background: var(--sg-surface-tint) !important;
    }
    html[data-theme="light"] .sg-promo-banner-desc { color: var(--sg-text-secondary) !important; }
    html[data-theme="light"] .sg-promo-banner-title { color: #0f172a !important; }

    html[data-theme="light"] h1,
    html[data-theme="light"] h2,
    html[data-theme="light"] h3,
    html[data-theme="light"] h4,
    html[data-theme="light"] h5,
    html[data-theme="light"] h6,
    html[data-theme="light"] strong,
    html[data-theme="light"] b {
        color: #0f172a;
    }
    html:not([data-theme="light"]) h1,
    html:not([data-theme="light"]) h2,
    html:not([data-theme="light"]) h3,
    html:not([data-theme="light"]) h4,
    html:not([data-theme="light"]) h5,
    html:not([data-theme="light"]) h6 {
        color: #f1f6ff;
    }

    /* Track / recent panels on homepage checkout adjacent blocks */
    html[data-theme="light"] .sg-card-track,
    html[data-theme="light"] .sg-card-recent,
    html[data-theme="light"] #trackSection.sg-section-card {
        background: var(--sg-surface-card) !important;
        border: 1px solid var(--sg-border) !important;
        box-shadow: var(--sg-shadow-soft) !important;
    }
    html:not([data-theme="light"]) .sg-card-track,
    html:not([data-theme="light"]) .sg-card-recent,
    html:not([data-theme="light"]) #trackSection.sg-section-card {
        background: var(--sg-surface-elevated) !important;
        border: 1px solid var(--sg-border) !important;
        box-shadow: var(--sg-shadow-brand) !important;
    }