.paykka-checkout-fields {
    margin: 0.75em 0 0;
}

/* 钱包容器只有在 JS 把宿主节点搬进来后才显示 */
.paykka-wallet-container {
    display: none;
    margin: 0 0 0.65em;
}

.paykka-wallet-container.paykka-has-content {
    display: block;
}

.paykka-wallet-container.paykka-has-content:empty {
    display: none;
}

.paykka-host {
    display: block;
}

.paykka-card-container {
    min-height: 72px;
    margin: 0.5em 0;
}

.paykka-card-status,
.paykka-card-hint {
    margin: 0.35em 0;
    font-size: 0.92em;
    color: #555;
}

.paykka-card-error {
    margin: 0.35em 0;
    color: #b32d2e;
    font-size: 0.92em;
}

.paykka-card-status[hidden],
.paykka-card-error[hidden] {
    display: none !important;
}

/* 沙箱自检：仅在 Payments 迟迟不就绪或报错时出现 */
.paykka-card-diagnostics {
    margin: 0.75em 0 0;
    padding: 0.75em 0.9em;
    border: 1px solid #d7d7d7;
    border-radius: 4px;
    background: #fbfbfb;
    font-size: 0.85em;
    line-height: 1.5;
}

.paykka-diag-title {
    margin: 0 0 0.5em;
    font-weight: 600;
    color: #1d2327;
}

.paykka-diag-list {
    margin: 0;
    padding: 0;
    list-style: none;
}

.paykka-diag-item {
    display: grid;
    grid-template-columns: 1.2em minmax(8em, max-content) 1fr;
    gap: 0 0.5em;
    align-items: start;
    margin: 0 0 0.3em;
}

.paykka-diag-mark {
    font-weight: 700;
    text-align: center;
}

.paykka-diag-item.is-ok .paykka-diag-mark {
    color: #1a7f37;
}

.paykka-diag-item.is-warn .paykka-diag-mark {
    color: #bf8700;
}

.paykka-diag-item.is-fail .paykka-diag-mark {
    color: #b32d2e;
}

.paykka-diag-item.is-pending .paykka-diag-mark {
    color: #777;
}

.paykka-diag-label {
    color: #1d2327;
}

.paykka-diag-detail {
    color: #555;
    word-break: break-word;
}

.paykka-diag-item.is-fail .paykka-diag-detail {
    color: #b32d2e;
}

.paykka-diag-hint {
    margin: 0.6em 0 0;
    color: #777;
}

@media (max-width: 480px) {
    .paykka-diag-item {
        grid-template-columns: 1.2em 1fr;
    }

    .paykka-diag-detail {
        grid-column: 2;
    }
}

/* order-pay：就绪后只保留卡组件，容器不额外留白 */
.paykka-order-pay-card {
    margin: 0;
}

.paykka-order-pay-card .paykka-card-container {
    min-height: 0;
    margin: 0;
}
