/* SUFFAYA — payment.css — Paiement · Wallet · Revenus vendeur */
.payment-page{max-width:1000px;margin:0 auto;padding:24px 16px 60px}
.payment-header{margin-bottom:24px}
.payment-layout{display:grid;grid-template-columns:1fr 300px;gap:20px;align-items:start}
.payment-main{}
.payment-summary{position:sticky;top:80px}

/* ── Méthodes paiement page dédiée ── */
.payment-methods-full{display:flex;flex-direction:column;gap:8px;margin-bottom:16px}
.payment-option-full{display:flex;align-items:center;gap:14px;background:#0f1623;border:2px solid #1c2a3f;border-radius:12px;padding:14px 16px;cursor:pointer;transition:all .2s}
.payment-option-full:hover{border-color:#6366f1}
.payment-option-full.selected{border-color:#6366f1;background:#1e1b4b}
.payment-option-full.disabled{opacity:.5;cursor:not-allowed}
.pof-icon{font-size:1.5rem;flex-shrink:0;width:36px;text-align:center}
.pof-content{flex:1}
.pof-name{font-size:.9rem;font-weight:700;color:#e2e8f0;margin-bottom:3px}
.pof-desc{font-size:.78rem;color:#64748b}
.pof-check{width:22px;height:22px;border-radius:50%;border:2px solid #1c2a3f;display:flex;align-items:center;justify-content:center;font-size:.75rem;color:#fff;transition:all .2s;flex-shrink:0}
.payment-option-full.selected .pof-check{background:#6366f1;border-color:#6366f1}
.payment-extra{background:#0f1623;border:1px solid #1c2a3f;border-radius:10px;padding:14px;margin-top:-4px;margin-bottom:4px}
.cash-note{background:#1c2a3f;border-radius:10px;padding:12px 14px;font-size:.82rem;color:#94a3b8;display:flex;align-items:flex-start;gap:10px;line-height:1.6;margin-bottom:16px}
.cn-icon{flex-shrink:0;font-size:1rem}

/* ── Wallet ── */
.wallet-balance-card{background:linear-gradient(135deg,#1e1b4b,#312e81);border:1px solid #4f46e5;border-radius:18px;padding:36px;text-align:center;margin-bottom:20px}
.wbc-label{font-size:.82rem;color:#a5b4fc;text-transform:uppercase;letter-spacing:.5px;margin-bottom:10px}
.wbc-amount{font-size:3rem;font-weight:900;color:#fff;line-height:1;margin-bottom:6px}
.wbc-currency{font-size:1.5rem;color:#a5b4fc}
.wbc-sub{font-size:.8rem;color:#818cf8}
.wallet-info-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-bottom:8px}
.wi-card{background:#151e2d;border:1px solid #1c2a3f;border-radius:12px;padding:16px;text-align:center}
.wi-icon{font-size:1.5rem;margin-bottom:8px}
.wi-label{font-size:.7rem;color:#64748b;text-transform:uppercase;letter-spacing:.5px;margin-bottom:4px}
.wi-val{font-size:.82rem;font-weight:600;color:#e2e8f0}
.wallet-tx{display:flex;align-items:center;gap:12px;background:#0f1623;border:1px solid #1c2a3f;border-radius:10px;padding:12px 14px}
.wtx-icon{font-size:1.1rem;flex-shrink:0}
.wtx-info{flex:1}
.wtx-desc{font-size:.82rem;font-weight:600;color:#e2e8f0;margin-bottom:2px}
.wtx-date{font-size:.72rem;color:#64748b}
.wtx-amount{font-size:.9rem;font-weight:700;white-space:nowrap}
.wtx-amount.credit{color:#22c55e}
.wtx-amount.debit{color:#ef4444}
.wtx-balance{font-size:.72rem;color:#475569;white-space:nowrap;margin-left:8px}

/* Responsive */
@media (max-width: 767px){
    .payment-layout{grid-template-columns:1fr}
    .payment-summary{position:static}
    .wallet-info-grid{grid-template-columns:1fr 1fr}
    .wallet-tx{flex-wrap:wrap}
    .wtx-balance{width:100%;margin-left:0;padding-left:32px}
}

/* ============================================================
   SUFFAYA — Revenus vendeur
   ============================================================ */
.earn-kpis{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-bottom:18px}
@media (max-width: 479px){.earn-kpis{grid-template-columns:1fr}}
.earn-kpi{background:var(--pa-card,#111827);border:1px solid var(--pa-brd,#1f2937);border-radius:14px;padding:18px;position:relative;overflow:hidden}
.earn-kpi::before{content:'';position:absolute;top:0;left:0;right:0;height:3px}
.earn-kpi-avail::before{background:linear-gradient(90deg,#22c55e,#4ade80)}
.earn-kpi-pend::before{background:linear-gradient(90deg,#f59e0b,#fbbf24)}
.earn-kpi-total::before{background:linear-gradient(90deg,#6366f1,#818cf8)}
.earn-kpi-label{font-size:.72rem;font-weight:700;color:var(--pa-tx3,#4b5563);text-transform:uppercase;letter-spacing:.06em;margin-bottom:8px}
.earn-kpi-val{font-size:1.5rem;font-weight:900;letter-spacing:-.02em;margin-bottom:3px}
.earn-kpi-sub{font-size:.72rem;color:var(--pa-tx3,#4b5563)}
.earn-chart-wrap{background:var(--pa-card);border:1px solid var(--pa-brd);border-radius:14px;overflow:hidden;margin-bottom:16px}
.earn-chart-head{display:flex;align-items:center;justify-content:space-between;padding:14px 18px;border-bottom:1px solid var(--pa-brd);font-size:.84rem;font-weight:700;color:var(--pa-tx)}
.earn-chart-head svg{width:14px;height:14px;stroke:#22c55e;fill:none;stroke-width:2}
.earn-chart-labels{display:flex;justify-content:space-between;padding:0 18px 10px;font-size:.62rem;color:var(--pa-tx3)}
.earn-row{display:grid;grid-template-columns:1.4fr 2fr 1fr 1fr 1.1fr .8fr .8fr;gap:8px;padding:11px 18px;border-bottom:1px solid var(--pa-brd,#1f2937);align-items:center;font-size:.81rem}
.earn-row:last-child{border-bottom:none}
.earn-row:hover{background:rgba(255,255,255,.02)}
.earn-head{background:rgba(255,255,255,.02);font-size:.7rem;font-weight:700;color:var(--pa-tx3);text-transform:uppercase;letter-spacing:.05em;padding:9px 18px}
.earn-ref{color:#818cf8;font-weight:700;font-size:.8rem}
.earn-prod{font-size:.78rem;color:var(--pa-tx2);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.earn-gross{color:var(--pa-tx2)}
.earn-comm{color:#f87171}
.earn-net{font-weight:800;color:#22c55e}
.earn-badge{display:inline-flex;padding:2px 9px;border-radius:999px;font-size:.68rem;font-weight:700;white-space:nowrap}
.earn-avail{background:rgba(34,197,94,.08);color:#22c55e;border:1px solid rgba(34,197,94,.2)}
.earn-pend{background:rgba(245,158,11,.08);color:#fbbf24;border:1px solid rgba(245,158,11,.2)}
.earn-paid{background:rgba(99,102,241,.08);color:#818cf8;border:1px solid rgba(99,102,241,.2)}
@media (max-width: 767px){.earn-row{grid-template-columns:1fr 1fr;gap:6px;padding:10px 14px}.earn-head{display:none}.earn-gross,.earn-comm{display:none}}
