/* Dipindah dari shop/partials/sg-cohesion-styles.php (blok #4, id=sg-checkout-cohesion) */
    /* Checkout flow — cards, inputs, CTA (wins over legacy pure-black layers) */
    html[data-theme="light"] .tg-card,
    html[data-theme="light"] .tg-card-secondary,
    html[data-theme="light"] .tg-card-checkout,
    html[data-theme="light"] .tg-card-products,
    html[data-theme="light"] .tg-card-category,
    html[data-theme="light"] .tg-card-recent,
    html[data-theme="light"] .tg-card-track,
    html[data-theme="light"] .tg-validation-card,
    html[data-theme="light"] .checkout-direct .tg-embed-body .tg-main > .tg-card {
        background: var(--sg-surface-card) !important;
        background-image: none !important;
        border: 1px solid var(--sg-border) !important;
        box-shadow: var(--sg-shadow-soft) !important;
        backdrop-filter: none !important;
        -webkit-backdrop-filter: none !important;
    }

    html:not([data-theme="light"]) .tg-card,
    html:not([data-theme="light"]) .tg-card-secondary,
    html:not([data-theme="light"]) .tg-card-checkout,
    html:not([data-theme="light"]) .tg-card-products,
    html:not([data-theme="light"]) .tg-card-category,
    html:not([data-theme="light"]) .tg-card-recent,
    html:not([data-theme="light"]) .tg-card-track,
    html:not([data-theme="light"]) .tg-validation-card,
    html:not([data-theme="light"]) .checkout-direct .tg-embed-body .tg-main > .tg-card {
        background: var(--sg-surface-elevated) !important;
        background-image: none !important;
        border: 1px solid var(--sg-border) !important;
        box-shadow: var(--sg-shadow-brand) !important;
        backdrop-filter: none !important;
        -webkit-backdrop-filter: none !important;
    }

    html[data-theme="light"] .tg-card-title,
    html[data-theme="light"] .tg-card-title .tg-title-text {
        color: #0f172a !important;
    }
    html:not([data-theme="light"]) .tg-card-title,
    html:not([data-theme="light"]) .tg-card-title .tg-title-text {
        color: #f1f6ff !important;
    }
    .tg-card-title .tg-title-kicker {
        color: var(--sg-text-muted) !important;
    }

    html[data-theme="light"] .tg-input,
    html[data-theme="light"] input:not([type="checkbox"]):not([type="radio"]),
    html[data-theme="light"] textarea,
    html[data-theme="light"] select {
        background: var(--sg-surface-subtle) !important;
        border: 1px solid var(--sg-border) !important;
        color: #0f172a !important;
    }
    html:not([data-theme="light"]) .tg-input,
    html:not([data-theme="light"]) input:not([type="checkbox"]):not([type="radio"]),
    html:not([data-theme="light"]) textarea,
    html:not([data-theme="light"]) select {
        background: var(--sg-surface-subtle) !important;
        border: 1px solid var(--sg-border) !important;
        color: #f1f6ff !important;
    }
    html[data-theme="light"] .tg-input::placeholder,
    html[data-theme="light"] input::placeholder,
    html[data-theme="light"] textarea::placeholder {
        color: var(--sg-text-muted) !important;
        opacity: 1 !important;
    }
    html:not([data-theme="light"]) .tg-input::placeholder,
    html:not([data-theme="light"]) input::placeholder,
    html:not([data-theme="light"]) textarea::placeholder {
        color: var(--sg-text-muted) !important;
        opacity: 1 !important;
    }
    .tg-input:focus,
    input:not([type="checkbox"]):not([type="radio"]):focus,
    textarea:focus,
    select:focus {
        border-color: var(--sg-border-muted) !important;
        box-shadow: 0 0 0 3px rgba(26, 134, 255, .16) !important;
        outline: none !important;
    }

    .tg-sticky-cta,
    .checkout-direct .tg-embed-body .tg-sticky-cta {
        border-top: 1px solid var(--sg-border) !important;
    }
    html[data-theme="light"] .tg-sticky-cta,
    html[data-theme="light"] .checkout-direct .tg-embed-body .tg-sticky-cta {
        background: rgba(255, 255, 255, .98) !important;
        box-shadow: 0 -8px 24px -8px rgba(15, 30, 60, .12) !important;
    }
    html:not([data-theme="light"]) .tg-sticky-cta,
    html:not([data-theme="light"]) .checkout-direct .tg-embed-body .tg-sticky-cta {
        background: rgba(6, 11, 20, .96) !important;
        box-shadow: 0 -8px 24px -8px rgba(0, 0, 0, .35) !important;
    }

    .tg-sticky-cta-btn:not(:disabled),
    .tg-checkout-submit:not(:disabled),
    .checkout-direct .tg-embed-body .tg-sticky-cta-btn:not(:disabled) {
        background: linear-gradient(135deg, var(--sg-brand-dark), var(--sg-brand)) !important;
        color: #ffffff !important;
        box-shadow: var(--sg-shadow-brand) !important;
    }

    .tg-trust-item {
        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"]) .tg-trust-item {
        box-shadow: none !important;
    }
    .tg-trust-item strong {
        color: inherit !important;
    }
    html[data-theme="light"] .tg-trust-item strong { color: #0f172a !important; }
    html:not([data-theme="light"]) .tg-trust-item strong { color: #f1f6ff !important; }
    .tg-trust-item span { color: var(--sg-text-muted) !important; }

    .tg-pay-badge,
    .checkout-direct .tg-embed-body .tg-pay-badge {
        background: var(--sg-surface-tint) !important;
        color: var(--sg-brand) !important;
        border: 1px solid var(--sg-border) !important;
    }
    html:not([data-theme="light"]) .tg-pay-badge,
    html:not([data-theme="light"]) .checkout-direct .tg-embed-body .tg-pay-badge {
        color: var(--sg-brand-muted) !important;
    }

    .tg-info-box h4 {
        color: inherit !important;
    }
    html[data-theme="light"] .tg-info-box h4 { color: #0f172a !important; }
    html:not([data-theme="light"]) .tg-info-box h4 { color: #f1f6ff !important; }
    .tg-info-box,
    .tg-info-box li,
    .tg-info-box p {
        color: var(--sg-text-secondary) !important;
    }
    html:not([data-theme="light"]) .tg-info-box,
    html:not([data-theme="light"]) .tg-info-box li,
    html:not([data-theme="light"]) .tg-info-box p {
        color: var(--sg-text-muted) !important;
    }
    .tg-info-divider,
    .checkout-direct .tg-embed-body .tg-info-divider {
        background: var(--sg-border) !important;
    }

    /* Product instruction panel — structured KV + description */
    #productInstruction.tg-info-box--product,
    .tg-info-box--product {
        padding: 14px 14px 12px !important;
        border-radius: 14px !important;
        font-size: .82rem !important;
        line-height: 1.5 !important;
    }
    html[data-theme="light"] #productInstruction.tg-info-box--product,
    html[data-theme="light"] .tg-info-box--product {
        background: var(--sg-surface-card) !important;
        border: 1px solid #e2e9f5 !important;
        color: var(--sg-text-secondary) !important;
    }
    html:not([data-theme="light"]) #productInstruction.tg-info-box--product,
    html:not([data-theme="light"]) .tg-info-box--product {
        background: var(--sg-surface-elevated) !important;
        border: 1px solid rgba(26, 134, 255, .16) !important;
        color: var(--sg-text-muted) !important;
    }
    .tg-info-head {
        margin: 0 0 12px;
        padding-bottom: 10px;
        border-bottom: 1px solid var(--sg-border);
    }
    .tg-info-head h3 {
        margin: 0 !important;
        font-size: .92rem !important;
        font-weight: 800 !important;
        letter-spacing: -.01em;
        display: flex;
        align-items: center;
        gap: 8px;
    }
    html[data-theme="light"] .tg-info-head h3 { color: #0f172a !important; }
    html:not([data-theme="light"]) .tg-info-head h3 { color: #f1f6ff !important; }
    .tg-info-head h3 i { color: var(--sg-brand) !important; }
    html:not([data-theme="light"]) .tg-info-head h3 i { color: var(--sg-brand-muted) !important; }
    .tg-info-product-name {
        margin: 6px 0 0 !important;
        font-size: .86rem !important;
        font-weight: 700 !important;
        line-height: 1.35 !important;
        word-break: break-word;
    }
    html[data-theme="light"] .tg-info-product-name { color: #0f172a !important; }
    html:not([data-theme="light"]) .tg-info-product-name { color: #f1f6ff !important; }
    .tg-info-kv {
        margin: 0 0 12px;
        padding: 0;
        display: grid;
        gap: 6px;
    }
    .tg-info-kv-row {
        display: grid;
        grid-template-columns: minmax(72px, 34%) minmax(0, 1fr);
        gap: 8px 10px;
        align-items: start;
        padding: 8px 10px;
        border-radius: 10px;
        background: var(--sg-surface-subtle);
        border: 1px solid var(--sg-border);
    }
    .tg-info-kv-row dt {
        margin: 0;
        font-size: .72rem;
        font-weight: 700;
        letter-spacing: .02em;
        color: var(--sg-text-muted) !important;
        text-transform: uppercase;
    }
    .tg-info-kv-row dd {
        margin: 0;
        font-size: .8rem;
        font-weight: 600;
        line-height: 1.4;
        word-break: break-word;
        text-align: right;
    }
    html[data-theme="light"] .tg-info-kv-row dd { color: #0f172a !important; }
    html:not([data-theme="light"]) .tg-info-kv-row dd { color: #f1f6ff !important; }
    .tg-info-desc-block {
        margin: 0 0 12px;
        padding: 10px 11px;
        border-radius: 10px;
        background: var(--sg-surface-subtle);
        border: 1px solid var(--sg-border);
    }
    .tg-info-desc-label {
        font-size: .72rem;
        font-weight: 700;
        letter-spacing: .02em;
        text-transform: uppercase;
        color: var(--sg-text-muted) !important;
        margin-bottom: 6px;
    }
    .tg-info-desc {
        margin: 0 !important;
        font-size: .8rem !important;
        line-height: 1.55 !important;
        word-break: break-word;
        display: -webkit-box;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 4;
        line-clamp: 4;
        overflow: hidden;
    }
    .tg-info-desc.is-expanded {
        -webkit-line-clamp: unset;
        line-clamp: unset;
        display: block;
        overflow: visible;
    }
    .tg-info-desc-toggle {
        margin-top: 8px;
        padding: 0;
        border: none;
        background: none;
        font-size: .76rem;
        font-weight: 700;
        color: var(--sg-brand) !important;
        cursor: pointer;
        text-decoration: underline;
        text-underline-offset: 2px;
    }
    html:not([data-theme="light"]) .tg-info-desc-toggle {
        color: var(--sg-brand-muted) !important;
    }
    .tg-info-desc-toggle:focus-visible {
        outline: 2px solid var(--sg-brand);
        outline-offset: 2px;
        border-radius: 4px;
    }
    .tg-info-section {
        margin: 0;
    }
    .tg-info-section h4 {
        margin: 0 0 8px !important;
        font-size: .74rem !important;
    }
    .tg-info-section ul {
        margin: 0 !important;
        padding: 0 !important;
        list-style: none;
        display: flex;
        flex-direction: column;
        gap: 6px;
    }
    .tg-info-box--product .tg-info-divider {
        margin: 10px 0 !important;
    }
    @media (max-width: 760px) {
        .tg-info-kv-row {
            grid-template-columns: 1fr;
            gap: 4px;
        }
        .tg-info-kv-row dd {
            text-align: left;
        }
    }

    /* Checkout embed shell — transparent gap between cards */
    .checkout-shell,
    .checkout-direct,
    .checkout-direct .tg-embed-body,
    .checkout-direct .tg-embed-body .tg-app,
    .checkout-direct .tg-embed-body .tg-main,
    .tg-embed-body .tg-main {
        background: transparent !important;
        background-image: none !important;
        border: none !important;
        box-shadow: none !important;
    }
    .checkout-direct .tg-embed-body .tg-main,
    .tg-embed-body .tg-main {
        display: flex;
        flex-direction: column;
        gap: 16px !important;
    }
    .checkout-direct .tg-embed-body .tg-main > .tg-card,
    .tg-embed-body .tg-main > .tg-card {
        margin-bottom: 0 !important;
        border-radius: 16px !important;
    }
    @media (min-width: 761px) {
        .checkout-direct .tg-embed-body .tg-main > .tg-card,
        .tg-embed-body .tg-main > .tg-card {
            padding: 24px 22px !important;
            border-radius: 18px !important;
        }
        .checkout-direct .tg-embed-body .tg-sticky-cta,
        .tg-embed-body .tg-sticky-cta {
            position: sticky !important;
            background: transparent !important;
            border-top: none !important;
            box-shadow: none !important;
            padding-inline: 0 !important;
        }
    }
    @media (max-width: 760px) {
        .checkout-direct .tg-embed-body .tg-main,
        .tg-embed-body .tg-main {
            padding-bottom: calc(68px + var(--sg-bottom-nav-clearance, 0px) + env(safe-area-inset-bottom, 0px)) !important;
        }
        body.has-mobile-checkout-cta .checkout-direct .tg-embed-body .tg-main {
            padding-bottom: calc(16px + var(--sg-sticky-cta-clearance, 80px)) !important;
        }
    }