/* ==========================================================================
   Crypto Payment Gateway — Public payment form
   ========================================================================== */
.cpg-pay {
    --cpg-bg: #0f1420; --cpg-panel: #171d2e; --cpg-panel-2: #1f2740;
    --cpg-border: #2a3450; --cpg-text: #e8edf7; --cpg-muted: #8b98b3;
    --cpg-primary: #5b7cfa; --cpg-primary-2: #7c5bfa;
    --cpg-success: #2fd48a; --cpg-danger: #f65b6b; --cpg-warning: #f7b955;
    max-width: 460px; margin: 24px auto; color: var(--cpg-text);
    font-family: -apple-system, "Segoe UI", Tahoma, "Vazirmatn", sans-serif;
}
.cpg-pay * { box-sizing: border-box; }
.cpg-pay-card {
    background: #171d2e; border: 1px solid #2a3450; border-radius: 18px;
    padding: 24px; box-shadow: 0 20px 60px rgba(0,0,0,.25);
}
.cpg-pay-header { display: flex; align-items: center; gap: 10px; margin-bottom: 20px; }
.cpg-pay-logo {
    width: 38px; height: 38px; display: grid; place-items: center; border-radius: 10px; color: #fff;
    background: linear-gradient(135deg, #5b7cfa, #7c5bfa); font-size: 18px;
}
.cpg-pay-title { font-weight: 700; font-size: 16px; flex: 1; }
.cpg-pay-sb { font-size: 11px; background: rgba(247,185,85,.16); color: #f7b955; padding: 3px 9px; border-radius: 100px; }

.cpg-pay .cpg-field { display: flex; flex-direction: column; gap: 7px; margin-bottom: 16px; }
.cpg-pay .cpg-field > label { font-size: 13px; color: var(--cpg-muted); font-weight: 600; }
.cpg-pay .cpg-input {
    width: 100%; background: #1f2740; border: 1px solid #2a3450; color: #e8edf7;
    padding: 11px 13px; border-radius: 11px; font-size: 14px; outline: none;
}
.cpg-pay .cpg-input:focus { border-color: #5b7cfa; }
.cpg-mono { font-family: ui-monospace, "SF Mono", Menlo, Consolas, monospace; }

.cpg-btn-pay {
    width: 100%; border: none; cursor: pointer; color: #fff; font-weight: 700; font-size: 15px;
    padding: 13px; border-radius: 12px; background: linear-gradient(135deg, #5b7cfa, #7c5bfa);
    transition: opacity .15s ease;
}
.cpg-btn-pay:hover { opacity: .92; }
.cpg-btn-pay:disabled { opacity: .55; cursor: not-allowed; }

.cpg-pay-summary {
    background: #1f2740; border: 1px solid #2a3450; border-radius: 12px; padding: 16px; margin-bottom: 16px; text-align: center;
}
.cpg-pay-amount { font-size: 26px; font-weight: 800; }
.cpg-pay-net { font-size: 12px; color: var(--cpg-muted); margin-top: 4px; }

.cpg-qr { display: flex; justify-content: center; margin: 0 auto 16px; }
.cpg-qr canvas, .cpg-qr img { border-radius: 12px; background: #fff; padding: 10px; }

.cpg-copy-row { display: flex; gap: 8px; }
.cpg-copy-row .cpg-input { flex: 1; }
.cpg-copy {
    background: #1f2740; border: 1px solid #2a3450; color: #e8edf7; border-radius: 11px;
    padding: 0 16px; cursor: pointer; font-size: 13px; font-weight: 600; white-space: nowrap;
}
.cpg-copy:hover { border-color: #5b7cfa; }

.cpg-ref { font-size: 11px; text-align: center; margin-top: 12px; }
.cpg-muted { color: var(--cpg-muted); }

.cpg-result { padding: 20px; border-radius: 14px; text-align: center; font-size: 15px; font-weight: 600; }
.cpg-result.confirmed { background: rgba(47,212,138,.12); color: var(--cpg-success); border: 1px solid rgba(47,212,138,.3); }
.cpg-result.pending, .cpg-result.manual_review { background: rgba(247,185,85,.12); color: var(--cpg-warning); border: 1px solid rgba(247,185,85,.3); }
.cpg-result.failed, .cpg-result.duplicate, .cpg-result.error { background: rgba(246,91,107,.12); color: var(--cpg-danger); border: 1px solid rgba(246,91,107,.3); }
.cpg-result-icon { font-size: 40px; display: block; margin-bottom: 10px; }
.cpg-spinner {
    display: inline-block; width: 16px; height: 16px; border: 2px solid rgba(255,255,255,.3);
    border-top-color: #fff; border-radius: 50%; animation: cpg-spin .7s linear infinite; vertical-align: middle;
}
@keyframes cpg-spin { to { transform: rotate(360deg); } }