/**
 * Portal Cloud 9 - Reward Points CSS
 * Mobile-first, iPhone-friendly, glassmorphic design
 */

/* ------------------------------------------------------------------ */
/* Container */
/* ------------------------------------------------------------------ */
.p9-rewards-wrap {
    padding: 0 0 40px;
    max-width: 100%;
    box-sizing: border-box;
}

/* ------------------------------------------------------------------ */
/* Role Badge */
/* ------------------------------------------------------------------ */
.p9-rewards-role-badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 5px 14px;
    border-radius: 20px;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.4px;
    text-transform: uppercase;
    margin-bottom: 16px;
    background: rgba(30, 144, 255, 0.12);
    color: #1e90ff;
    border: 1px solid rgba(30, 144, 255, 0.25);
}
.p9-rewards-role-badge.admin  { background: rgba(234, 88, 12, 0.12); color: #ea580c; border-color: rgba(234, 88, 12, 0.25); }
.p9-rewards-role-badge.mgr    { background: rgba(124, 58, 237, 0.12); color: #7c3aed; border-color: rgba(124, 58, 237, 0.25); }

/* ------------------------------------------------------------------ */
/* Stat Cards */
/* ------------------------------------------------------------------ */
.p9-rewards-stats {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 12px;
    margin-bottom: 20px;
}
@media (min-width: 600px) {
    .p9-rewards-stats { grid-template-columns: repeat(4, 1fr); }
}

.p9-rewards-stat-card {
    background: rgba(255,255,255,0.06);
    border: 1px solid rgba(255,255,255,0.12);
    border-radius: 16px;
    padding: 16px 14px;
    display: flex;
    flex-direction: column;
    gap: 4px;
    position: relative;
    overflow: hidden;
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    cursor: default;
    transition: transform 0.2s, box-shadow 0.2s;
}
.p9-rewards-stat-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 24px rgba(0,0,0,0.18);
}
.p9-rewards-stat-card::before {
    content: '';
    position: absolute;
    top: 0; left: 0; right: 0;
    height: 3px;
    background: linear-gradient(90deg, #1e90ff, #00c9a7);
    border-radius: 16px 16px 0 0;
}
.p9-rewards-stat-card.gold::before { background: linear-gradient(90deg, #f59e0b, #ef4444); }
.p9-rewards-stat-card.purple::before { background: linear-gradient(90deg, #7c3aed, #ec4899); }
.p9-rewards-stat-card.green::before { background: linear-gradient(90deg, #10b981, #3b82f6); }

.p9-rsc-icon {
    font-size: 22px;
    line-height: 1;
    margin-bottom: 4px;
}
.p9-rsc-value {
    font-size: 24px;
    font-weight: 700;
    color: #f1f5f9;
    line-height: 1;
}
.p9-rsc-label {
    font-size: 11px;
    color: #94a3b8;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin-top: 2px;
}
.p9-rsc-tooltip {
    position: absolute;
    bottom: 100%;
    left: 50%;
    transform: translateX(-50%);
    background: rgba(15,23,42,0.95);
    color: #f1f5f9;
    font-size: 11px;
    padding: 6px 10px;
    border-radius: 8px;
    white-space: nowrap;
    pointer-events: none;
    opacity: 0;
    transition: opacity 0.2s;
    z-index: 10;
    border: 1px solid rgba(255,255,255,0.1);
    max-width: 200px;
    white-space: normal;
    text-align: center;
    width: 160px;
}
.p9-rewards-stat-card:hover .p9-rsc-tooltip { opacity: 1; }

/* ------------------------------------------------------------------ */
/* Section Panels */
/* ------------------------------------------------------------------ */
.p9-rewards-panel {
    background: rgba(255,255,255,0.04);
    border: 1px solid rgba(255,255,255,0.1);
    border-radius: 18px;
    padding: 20px 16px;
    margin-bottom: 16px;
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    overflow: hidden;
}
.p9-rewards-panel-title {
    font-size: 14px;
    font-weight: 600;
    color: #e2e8f0;
    margin: 0 0 14px;
    display: flex;
    align-items: center;
    gap: 8px;
}
.p9-rewards-panel-title .p9-rl-info {
    margin-left: auto;
    font-size: 11px;
    color: #94a3b8;
    cursor: pointer;
    border: 1px solid rgba(255,255,255,0.1);
    border-radius: 50%;
    width: 18px; height: 18px;
    display: flex; align-items: center; justify-content: center;
    position: relative;
}

/* ------------------------------------------------------------------ */
/* Points Balance Display */
/* ------------------------------------------------------------------ */
.p9-rewards-balance-hero {
    text-align: center;
    padding: 24px 16px;
    border-radius: 16px;
    background: linear-gradient(135deg, rgba(30,144,255,0.15) 0%, rgba(0,201,167,0.1) 100%);
    border: 1px solid rgba(30,144,255,0.2);
    margin-bottom: 20px;
}
.p9-rb-points {
    font-size: 52px;
    font-weight: 800;
    background: linear-gradient(135deg, #1e90ff, #00c9a7);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    line-height: 1;
    margin-bottom: 4px;
}
.p9-rb-label { font-size: 13px; color: #94a3b8; margin-bottom: 6px; }
.p9-rb-equiv { font-size: 12px; color: #64748b; }

/* ------------------------------------------------------------------ */
/* Tabs inside Rewards */
/* ------------------------------------------------------------------ */
.p9-rewards-tabs {
    display: flex;
    gap: 6px;
    margin-bottom: 16px;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    padding-bottom: 4px;
}
.p9-rewards-tabs::-webkit-scrollbar { display: none; }

.p9-rtab-btn {
    flex-shrink: 0;
    padding: 8px 14px;
    border-radius: 20px;
    font-size: 12px;
    font-weight: 600;
    border: 1px solid rgba(255,255,255,0.12);
    background: transparent;
    color: #94a3b8;
    cursor: pointer;
    transition: all 0.2s;
    white-space: nowrap;
}
.p9-rtab-btn:hover { color: #e2e8f0; border-color: rgba(30,144,255,0.3); }
.p9-rtab-btn.active { background: rgba(30,144,255,0.18); color: #1e90ff; border-color: rgba(30,144,255,0.35); }

.p9-rtab-panel { display: none; }
.p9-rtab-panel.active { display: block; }

/* ------------------------------------------------------------------ */
/* Action Buttons */
/* ------------------------------------------------------------------ */
.p9-rewards-action-row {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
    margin-bottom: 16px;
}
.p9-rwds-btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 10px 18px;
    border-radius: 22px;
    font-size: 13px;
    font-weight: 600;
    border: none;
    cursor: pointer;
    transition: all 0.2s;
    white-space: nowrap;
}
.p9-rwds-btn:hover { transform: translateY(-1px); box-shadow: 0 4px 16px rgba(0,0,0,0.2); }
.p9-rwds-btn:active { transform: translateY(0); }
.p9-rwds-btn:disabled { opacity: 0.5; cursor: not-allowed; transform: none; }
.p9-rwds-btn.primary { background: linear-gradient(135deg, #1e90ff, #0066dd); color: #fff; }
.p9-rwds-btn.gold    { background: linear-gradient(135deg, #f59e0b, #d97706); color: #fff; }
.p9-rwds-btn.purple  { background: linear-gradient(135deg, #7c3aed, #6d28d9); color: #fff; }
.p9-rwds-btn.danger  { background: linear-gradient(135deg, #ef4444, #dc2626); color: #fff; }
.p9-rwds-btn.ghost   { background: transparent; color: #94a3b8; border: 1px solid rgba(255,255,255,0.12); }

/* ------------------------------------------------------------------ */
/* Coupon Redemption */
/* ------------------------------------------------------------------ */
.p9-rewards-redeem-box {
    background: rgba(30,144,255,0.07);
    border: 1px dashed rgba(30,144,255,0.3);
    border-radius: 14px;
    padding: 18px;
    margin-bottom: 16px;
}
.p9-redeem-title { font-size: 13px; font-weight: 600; color: #e2e8f0; margin-bottom: 10px; }
.p9-redeem-input-row { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; }
.p9-redeem-input-row input[type="number"] {
    flex: 1;
    min-width: 120px;
    max-width: 180px;
    padding: 10px 14px;
    border-radius: 10px;
    border: 1px solid rgba(255,255,255,0.15);
    background: rgba(255,255,255,0.05);
    color: #f1f5f9;
    font-size: 14px;
    font-weight: 600;
    outline: none;
    -webkit-appearance: none;
}
.p9-redeem-input-row input:focus { border-color: rgba(30,144,255,0.5); }
.p9-redeem-preview {
    font-size: 12px;
    color: #94a3b8;
    margin-top: 8px;
}
.p9-coupon-result {
    display: none;
    margin-top: 12px;
    padding: 14px;
    border-radius: 12px;
    background: rgba(16,185,129,0.1);
    border: 1px solid rgba(16,185,129,0.25);
}
.p9-coupon-code {
    font-size: 20px;
    font-weight: 800;
    color: #10b981;
    letter-spacing: 2px;
    display: flex; align-items: center; gap: 8px;
}
.p9-copy-btn { cursor: pointer; font-size: 14px; opacity: 0.7; transition: opacity 0.2s; }
.p9-copy-btn:hover { opacity: 1; }

/* ------------------------------------------------------------------ */
/* Withdrawal Box */
/* ------------------------------------------------------------------ */
.p9-rewards-withdraw-box {
    background: rgba(124,58,237,0.07);
    border: 1px dashed rgba(124,58,237,0.3);
    border-radius: 14px;
    padding: 18px;
    margin-bottom: 16px;
}
.p9-withdraw-form { display: flex; flex-direction: column; gap: 12px; }
.p9-wf-row { display: flex; flex-direction: column; gap: 5px; }
.p9-wf-label { font-size: 12px; color: #94a3b8; font-weight: 500; display: flex; align-items: center; gap: 5px; }
.p9-wf-input, .p9-wf-select, .p9-wf-textarea {
    padding: 10px 14px;
    border-radius: 10px;
    border: 1px solid rgba(255,255,255,0.15);
    background: rgba(255,255,255,0.05);
    color: #f1f5f9;
    font-size: 13px;
    width: 100%;
    box-sizing: border-box;
    outline: none;
}
.p9-wf-select option { background: #1a2332; color: #f1f5f9; }
.p9-wf-textarea { resize: vertical; min-height: 70px; }
.p9-wf-input:focus, .p9-wf-select:focus, .p9-wf-textarea:focus {
    border-color: rgba(124,58,237,0.5);
}
.p9-cash-preview {
    font-size: 13px;
    color: #7c3aed;
    font-weight: 700;
    padding: 8px 12px;
    background: rgba(124,58,237,0.1);
    border-radius: 8px;
    display: inline-block;
}

/* ------------------------------------------------------------------ */
/* Transaction Log */
/* ------------------------------------------------------------------ */
.p9-rewards-log { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 8px; }
.p9-rewards-log-item {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 14px;
    border-radius: 12px;
    background: rgba(255,255,255,0.03);
    border: 1px solid rgba(255,255,255,0.07);
    transition: background 0.2s;
}
.p9-rewards-log-item:hover { background: rgba(255,255,255,0.06); }
.p9-rli-icon {
    width: 36px; height: 36px;
    border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    font-size: 16px;
    flex-shrink: 0;
}
.p9-rli-icon.earn    { background: rgba(16,185,129,0.15); }
.p9-rli-icon.redeem  { background: rgba(239,68,68,0.15); }
.p9-rli-icon.adjust  { background: rgba(30,144,255,0.15); }
.p9-rli-icon.deduct  { background: rgba(239,68,68,0.15); }
.p9-rli-icon.withdrawal { background: rgba(124,58,237,0.15); }
.p9-rli-icon.refund  { background: rgba(245,158,11,0.15); }

.p9-rli-body { flex: 1; min-width: 0; }
.p9-rli-note { font-size: 13px; color: #e2e8f0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.p9-rli-meta { font-size: 11px; color: #64748b; margin-top: 2px; }
.p9-rli-pts  {
    font-size: 14px; font-weight: 700; flex-shrink: 0;
    color: #10b981;
}
.p9-rli-pts.negative { color: #ef4444; }

/* ------------------------------------------------------------------ */
/* Admin User Search */
/* ------------------------------------------------------------------ */
.p9-rewards-user-search {
    display: flex;
    gap: 8px;
    margin-bottom: 14px;
    flex-wrap: wrap;
}
.p9-rewards-search-input {
    flex: 1;
    min-width: 160px;
    padding: 10px 14px;
    border-radius: 10px;
    border: 1px solid rgba(255,255,255,0.15);
    background: rgba(255,255,255,0.05);
    color: #f1f5f9;
    font-size: 13px;
    outline: none;
}
.p9-rewards-search-input:focus { border-color: rgba(30,144,255,0.5); }

/* ------------------------------------------------------------------ */
/* User List (admin manage) */
/* ------------------------------------------------------------------ */
.p9-rewards-user-list { display: flex; flex-direction: column; gap: 8px; }
.p9-rewards-user-row {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 14px;
    border-radius: 12px;
    background: rgba(255,255,255,0.03);
    border: 1px solid rgba(255,255,255,0.08);
    flex-wrap: wrap;
}
.p9-rur-avatar {
    width: 38px; height: 38px;
    border-radius: 50%;
    background: linear-gradient(135deg, #1e90ff, #7c3aed);
    display: flex; align-items: center; justify-content: center;
    font-size: 16px; font-weight: 700; color: #fff; flex-shrink: 0;
}
.p9-rur-info { flex: 1; min-width: 100px; }
.p9-rur-name { font-size: 13px; font-weight: 600; color: #e2e8f0; }
.p9-rur-email { font-size: 11px; color: #64748b; }
.p9-rur-pts {
    font-size: 18px; font-weight: 800; color: #f59e0b;
    min-width: 60px; text-align: right;
}
.p9-rur-pts span { font-size: 10px; font-weight: 400; color: #94a3b8; display: block; }
.p9-rur-actions { display: flex; gap: 6px; }
.p9-rur-btn {
    padding: 6px 12px;
    border-radius: 8px;
    font-size: 11px;
    font-weight: 600;
    border: none; cursor: pointer;
    transition: all 0.2s;
}
.p9-rur-btn.add { background: rgba(16,185,129,0.15); color: #10b981; }
.p9-rur-btn.sub { background: rgba(239,68,68,0.15); color: #ef4444; }
.p9-rur-btn:hover { filter: brightness(1.2); transform: scale(1.05); }

/* ------------------------------------------------------------------ */
/* Top Earners / Products */
/* ------------------------------------------------------------------ */
.p9-rewards-top-list { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 8px; }
.p9-rtl-item {
    display: flex; align-items: center; gap: 10px;
    padding: 10px 12px;
    border-radius: 10px;
    background: rgba(255,255,255,0.03);
    border: 1px solid rgba(255,255,255,0.07);
}
.p9-rtl-rank {
    width: 22px; height: 22px;
    border-radius: 50%;
    background: rgba(30,144,255,0.15);
    color: #1e90ff;
    font-size: 10px; font-weight: 800;
    display: flex; align-items: center; justify-content: center;
    flex-shrink: 0;
}
.p9-rtl-rank.gold-rank   { background: rgba(245,158,11,0.2); color: #f59e0b; }
.p9-rtl-rank.silver-rank { background: rgba(148,163,184,0.2); color: #94a3b8; }
.p9-rtl-rank.bronze-rank { background: rgba(180,83,9,0.2);   color: #b45309; }
.p9-rtl-name { flex: 1; font-size: 13px; color: #e2e8f0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.p9-rtl-val  { font-size: 13px; font-weight: 700; color: #f59e0b; flex-shrink: 0; }

/* ------------------------------------------------------------------ */
/* Withdrawal Requests (admin) */
/* ------------------------------------------------------------------ */
.p9-wd-item {
    padding: 14px;
    border-radius: 12px;
    background: rgba(124,58,237,0.05);
    border: 1px solid rgba(124,58,237,0.15);
    margin-bottom: 10px;
}
.p9-wd-header { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-bottom: 8px; }
.p9-wd-user   { font-size: 13px; font-weight: 600; color: #e2e8f0; }
.p9-wd-cash   { font-size: 18px; font-weight: 800; color: #7c3aed; margin-left: auto; }
.p9-wd-details { font-size: 12px; color: #64748b; margin-bottom: 10px; }
.p9-wd-actions { display: flex; gap: 8px; }
.p9-status-badge {
    display: inline-flex; align-items: center; gap: 4px;
    padding: 3px 10px;
    border-radius: 20px;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.3px;
    text-transform: uppercase;
}
.p9-status-badge.pending  { background: rgba(245,158,11,0.15); color: #f59e0b; }
.p9-status-badge.approved { background: rgba(16,185,129,0.15); color: #10b981; }
.p9-status-badge.rejected { background: rgba(239,68,68,0.15);  color: #ef4444; }

/* ------------------------------------------------------------------ */
/* Settings Form */
/* ------------------------------------------------------------------ */
.p9-rewards-settings-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 12px;
}
@media (min-width: 600px) {
    .p9-rewards-settings-grid { grid-template-columns: 1fr 1fr; }
}
.p9-rs-field { display: flex; flex-direction: column; gap: 5px; }
.p9-rs-label {
    font-size: 12px;
    color: #94a3b8;
    font-weight: 500;
    display: flex; align-items: center; gap: 5px;
}
.p9-rs-label .tip {
    cursor: help;
    opacity: 0.6;
    font-size: 11px;
    border: 1px solid rgba(255,255,255,0.15);
    border-radius: 50%;
    width: 15px; height: 15px;
    display: inline-flex; align-items: center; justify-content: center;
    position: relative;
}
.p9-rs-label .tip::after {
    content: attr(data-tip);
    position: absolute;
    bottom: calc(100% + 6px);
    left: 50%;
    transform: translateX(-50%);
    background: rgba(15,23,42,0.97);
    color: #f1f5f9;
    font-size: 11px;
    padding: 6px 10px;
    border-radius: 8px;
    white-space: nowrap;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.2s;
    z-index: 20;
    max-width: 200px;
    white-space: normal;
    width: 180px;
    text-align: center;
    border: 1px solid rgba(255,255,255,0.1);
}
.p9-rs-label .tip:hover::after { opacity: 1; }
.p9-rs-input {
    padding: 10px 14px;
    border-radius: 10px;
    border: 1px solid rgba(255,255,255,0.15);
    background: rgba(255,255,255,0.05);
    color: #f1f5f9;
    font-size: 14px;
    outline: none;
    -webkit-appearance: none;
}
.p9-rs-input:focus { border-color: rgba(30,144,255,0.5); }
.p9-rs-toggle {
    display: flex; align-items: center; gap: 10px;
    padding: 12px 14px;
    border-radius: 10px;
    background: rgba(255,255,255,0.03);
    border: 1px solid rgba(255,255,255,0.08);
    grid-column: 1 / -1;
}
.p9-rs-toggle label { font-size: 13px; color: #e2e8f0; cursor: pointer; user-select: none; }
.p9-toggle-switch {
    position: relative; width: 40px; height: 22px; flex-shrink: 0;
}
.p9-toggle-switch input { opacity: 0; width: 0; height: 0; }
.p9-toggle-track {
    position: absolute; top: 0; left: 0; right: 0; bottom: 0;
    border-radius: 22px;
    background: rgba(255,255,255,0.1);
    border: 1px solid rgba(255,255,255,0.15);
    transition: background 0.2s;
    cursor: pointer;
}
.p9-toggle-track::after {
    content: '';
    position: absolute;
    width: 16px; height: 16px;
    border-radius: 50%;
    background: #94a3b8;
    top: 2px; left: 2px;
    transition: transform 0.2s, background 0.2s;
}
.p9-toggle-switch input:checked + .p9-toggle-track { background: rgba(30,144,255,0.4); border-color: rgba(30,144,255,0.5); }
.p9-toggle-switch input:checked + .p9-toggle-track::after { transform: translateX(18px); background: #1e90ff; }

/* ------------------------------------------------------------------ */
/* Modal overlay for adjust points */
/* ------------------------------------------------------------------ */
.p9-rewards-modal-overlay {
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,0.75);
    z-index: 9999;
    display: none;
    align-items: center;
    justify-content: center;
    padding: 16px;
    box-sizing: border-box;
    -webkit-overflow-scrolling: touch;
}
.p9-rewards-modal-overlay.open { display: flex; }
.p9-rewards-modal {
    background: #0f1c2e;
    border: 1px solid rgba(255,255,255,0.12);
    border-radius: 20px;
    padding: 24px 20px;
    width: 100%;
    max-width: 400px;
    box-shadow: 0 24px 60px rgba(0,0,0,0.5);
    animation: p9RwdModal 0.25s cubic-bezier(0.22,1,0.36,1);
}
@keyframes p9RwdModal {
    from { opacity: 0; transform: scale(0.92) translateY(12px); }
    to   { opacity: 1; transform: scale(1)    translateY(0); }
}
.p9-rwdm-title { font-size: 16px; font-weight: 700; color: #f1f5f9; margin-bottom: 16px; }
.p9-rwdm-row { display: flex; flex-direction: column; gap: 5px; margin-bottom: 12px; }
.p9-rwdm-label { font-size: 12px; color: #94a3b8; font-weight: 500; }
.p9-rwdm-input, .p9-rwdm-select {
    padding: 10px 14px;
    border-radius: 10px;
    border: 1px solid rgba(255,255,255,0.15);
    background: rgba(255,255,255,0.05);
    color: #f1f5f9;
    font-size: 14px;
    outline: none;
    -webkit-appearance: none;
}
.p9-rwdm-select option { background: #0f1c2e; color: #f1f5f9; }
.p9-rwdm-input:focus, .p9-rwdm-select:focus { border-color: rgba(30,144,255,0.5); }
.p9-rwdm-footer { display: flex; gap: 8px; justify-content: flex-end; margin-top: 16px; }

/* ------------------------------------------------------------------ */
/* Empty state */
/* ------------------------------------------------------------------ */
.p9-rewards-empty {
    text-align: center;
    padding: 40px 20px;
    color: #64748b;
}
.p9-rewards-empty span { font-size: 40px; display: block; margin-bottom: 10px; }
.p9-rewards-empty p { font-size: 13px; margin: 0; }

/* ------------------------------------------------------------------ */
/* Loading spinner */
/* ------------------------------------------------------------------ */
.p9-rewards-loading {
    display: flex; align-items: center; justify-content: center;
    padding: 40px;
    color: #64748b;
    gap: 10px;
    font-size: 13px;
}
.p9-rewards-spinner {
    width: 20px; height: 20px;
    border: 2px solid rgba(30,144,255,0.2);
    border-top-color: #1e90ff;
    border-radius: 50%;
    animation: p9Spin 0.7s linear infinite;
}
@keyframes p9Spin { to { transform: rotate(360deg); } }

/* ------------------------------------------------------------------ */
/* Toast notification */
/* ------------------------------------------------------------------ */
.p9-rewards-toast {
    position: fixed;
    bottom: 24px;
    left: 50%;
    transform: translateX(-50%) translateY(20px);
    background: rgba(15,23,42,0.95);
    color: #f1f5f9;
    padding: 12px 20px;
    border-radius: 12px;
    font-size: 13px;
    font-weight: 500;
    z-index: 99999;
    opacity: 0;
    transition: all 0.3s cubic-bezier(0.22,1,0.36,1);
    border: 1px solid rgba(255,255,255,0.1);
    pointer-events: none;
    max-width: calc(100vw - 40px);
    text-align: center;
}
.p9-rewards-toast.show { opacity: 1; transform: translateX(-50%) translateY(0); }
.p9-rewards-toast.success { border-color: rgba(16,185,129,0.3); }
.p9-rewards-toast.error   { border-color: rgba(239,68,68,0.3); }

/* ------------------------------------------------------------------ */
/* Chart area */
/* ------------------------------------------------------------------ */
.p9-rewards-chart-wrap {
    border-radius: 14px;
    background: rgba(255,255,255,0.02);
    border: 1px solid rgba(255,255,255,0.06);
    padding: 16px;
    margin-bottom: 16px;
    min-height: 160px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.p9-rewards-chart-inner { width: 100%; }

/* ------------------------------------------------------------------ */
/* Upgrade notice (free plugin only) */
/* ------------------------------------------------------------------ */
.p9-rewards-upgrade-notice {
    border-radius: 16px;
    background: linear-gradient(135deg, rgba(245,158,11,0.12) 0%, rgba(234,88,12,0.08) 100%);
    border: 1px solid rgba(245,158,11,0.25);
    padding: 20px;
    margin-bottom: 20px;
    display: flex;
    align-items: flex-start;
    gap: 14px;
    flex-wrap: wrap;
}
.p9-run-icon { font-size: 28px; flex-shrink: 0; }
.p9-run-body { flex: 1; min-width: 180px; }
.p9-run-title { font-size: 14px; font-weight: 700; color: #f59e0b; margin-bottom: 4px; }
.p9-run-desc  { font-size: 12px; color: #94a3b8; line-height: 1.5; }
.p9-run-cta   {
    display: inline-flex; align-items: center; gap: 6px;
    padding: 10px 18px;
    border-radius: 20px;
    background: linear-gradient(135deg, #f59e0b, #ea580c);
    color: #fff;
    font-size: 12px;
    font-weight: 700;
    text-decoration: none;
    transition: all 0.2s;
    flex-shrink: 0;
    margin-top: 8px;
}
.p9-run-cta:hover { transform: translateY(-1px); box-shadow: 0 6px 20px rgba(245,158,11,0.3); }

/* ------------------------------------------------------------------ */
/* Responsive tweaks */
/* ------------------------------------------------------------------ */
@media (max-width: 390px) {
    .p9-rewards-action-row { gap: 8px; }
    .p9-rwds-btn { padding: 8px 14px; font-size: 12px; }
    .p9-rb-points { font-size: 44px; }
    .p9-rewards-stat-card { padding: 12px 10px; }
    .p9-rsc-value { font-size: 20px; }
}


/* ================================================================== */
/* p9rw-* — Redesigned Rewards UI                                     */
/* ================================================================== */

/* ── Tokens ─────────────────────────────────────────────────────── */
.p9rw-wrap {
    --p9-sky:     #38bdf8;
    --p9-violet:  #a78bfa;
    --p9-emerald: #34d399;
    --p9-amber:   #fbbf24;
    --p9-rose:    #fb7185;
    --p9-indigo:  #818cf8;
    --p9-text:    #f1f5f9;
    --p9-muted:   #94a3b8;
    --p9-dim:     #475569;
    --p9-glass:   rgba(255,255,255,0.04);
    --p9-border:  rgba(255,255,255,0.08);
    padding: 0 0 40px;
    max-width: 100%;
    box-sizing: border-box;
}

/* ── Light mode token overrides ─────────────────────────────── */
body:not(.portalcloud9-dark) .p9rw-wrap {
    --p9-text:   #1e293b;
    --p9-muted:  #475569;
    --p9-dim:    #94a3b8;
    --p9-amber:  #d97706;
    --p9-glass:  rgba(255,255,255,0.80);
    --p9-border: rgba(0,0,0,0.08);
}

/* ── Role pill ──────────────────────────────────────────────────── */
.p9rw-role-pill {
    display: inline-flex; align-items: center; gap: 6px;
    padding: 6px 16px; border-radius: 30px;
    font-size: 11px; font-weight: 700; letter-spacing: .6px;
    text-transform: uppercase; margin-bottom: 18px;
    background: rgba(56,189,248,.12); color: var(--p9-sky);
    border: 1px solid rgba(56,189,248,.25);
}
.p9rw-role-pill.admin  { background: rgba(251,191,36,.12); color: var(--p9-amber); border-color: rgba(251,191,36,.25); }
.p9rw-role-pill.mgr    { background: rgba(167,139,250,.12); color: var(--p9-violet); border-color: rgba(167,139,250,.25); }

/* ── Wallet card ─────────────────────────────────────────────────── */
.p9rw-wallet {
    position: relative; border-radius: 24px; padding: 24px 22px 20px;
    margin-bottom: 16px; overflow: hidden;
    background: linear-gradient(135deg, #0c1829 0%, #131e35 60%, #0c1829 100%);
    border: 1px solid rgba(56,189,248,.2);
}
.p9rw-wallet.mgr  { background: linear-gradient(135deg,#100c24,#1a1240,#100c24); border-color: rgba(167,139,250,.25); }
.p9rw-wallet.cust { background: linear-gradient(135deg,#071425,#0e1e38,#071425); border-color: rgba(56,189,248,.2); }
.p9rw-wallet-glow {
    position: absolute; top: -60px; right: -60px;
    width: 220px; height: 220px; border-radius: 50%;
    background: radial-gradient(circle, rgba(56,189,248,.22), transparent 70%);
    pointer-events: none;
}
.p9rw-wallet-glow.cust { background: radial-gradient(circle,rgba(99,102,241,.2),transparent 70%); }
.p9rw-wallet.mgr .p9rw-wallet-glow { background: radial-gradient(circle,rgba(167,139,250,.22),transparent 70%); }
.p9rw-wallet-top { display: flex; align-items: flex-start; justify-content: space-between; margin-bottom: 16px; }
.p9rw-wallet-label { font-size: 12px; color: var(--p9-muted); margin-bottom: 4px; letter-spacing: .3px; }
.p9rw-wallet-num {
    font-size: 48px; font-weight: 900; line-height: 1; letter-spacing: -2px;
    background: linear-gradient(135deg, #e0f2fe, #7dd3fc, #38bdf8);
    -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text;
}
.p9rw-wallet.mgr .p9rw-wallet-num  { background: linear-gradient(135deg,#ede9fe,#c4b5fd,#a78bfa); -webkit-background-clip:text; background-clip:text; }
.p9rw-wallet-coin { font-size: 40px; opacity: .85; flex-shrink: 0; }
.p9rw-wallet-bottom { display: flex; gap: 20px; flex-wrap: wrap; }
.p9rw-wallet-meta { display: flex; flex-direction: column; gap: 2px; }
.p9rw-wallet-meta span  { font-size: 11px; color: var(--p9-dim); letter-spacing: .3px; }
.p9rw-wallet-meta strong { font-size: 14px; font-weight: 700; color: var(--p9-text); }
.p9rw-wallet-progress { margin-top: 16px; }
.p9rw-wp-track { height: 6px; border-radius: 6px; background: rgba(255,255,255,.08); overflow: hidden; margin-bottom: 6px; }
.p9rw-wp-fill  { height: 100%; border-radius: 6px; background: linear-gradient(90deg,#38bdf8,#818cf8); transition: width .6s cubic-bezier(.22,1,.36,1); }
.p9rw-wp-lbl   { font-size: 11px; color: var(--p9-dim); }

/* ── Mini stats row ─────────────────────────────────────────────── */
.p9rw-mini-stats { display: grid; grid-template-columns: repeat(4,1fr); gap: 8px; margin-bottom: 18px; }
@media (max-width: 480px) { .p9rw-mini-stats { grid-template-columns: repeat(2,1fr); } }
.p9rw-ms-card {
    border-radius: 16px; padding: 14px 10px;
    display: flex; flex-direction: column; align-items: center; gap: 4px;
    background: var(--p9-glass); border: 1px solid var(--p9-border);
    backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px);
    transition: transform .2s, box-shadow .2s;
    text-align: center;
}
.p9rw-ms-card:hover { transform: translateY(-2px); box-shadow: 0 6px 20px rgba(0,0,0,.2); }
.p9rw-ms-card span  { font-size: 22px; font-weight: 800; color: var(--p9-text); line-height: 1; }
.p9rw-ms-card label { font-size: 10px; color: var(--p9-muted); text-transform: uppercase; letter-spacing: .5px; cursor: default; }
.p9rw-ms-card.sky     { border-color: rgba(56,189,248,.2);  } .p9rw-ms-card.sky span    { color: var(--p9-sky); }
.p9rw-ms-card.violet  { border-color: rgba(167,139,250,.2); } .p9rw-ms-card.violet span { color: var(--p9-violet); }
.p9rw-ms-card.emerald { border-color: rgba(52,211,153,.2);  } .p9rw-ms-card.emerald span{ color: var(--p9-emerald); }
.p9rw-ms-card.amber   { border-color: rgba(251,191,36,.2);  } .p9rw-ms-card.amber span  { color: var(--p9-amber); }

/* ── Admin hero strip ───────────────────────────────────────────── */
.p9rw-admin-hero {
    position: relative; display: flex; align-items: center; justify-content: center;
    gap: 0; border-radius: 20px; padding: 24px 20px; margin-bottom: 18px;
    background: linear-gradient(135deg,#0c1829,#131e35,#0c1829);
    border: 1px solid rgba(251,191,36,.15); overflow: hidden; flex-wrap: wrap;
}
.p9rw-admin-hero-orb {
    position: absolute; top: -50%; left: 50%; transform: translateX(-50%);
    width: 300px; height: 300px; border-radius: 50%;
    background: radial-gradient(circle,rgba(251,191,36,.12),transparent 65%);
    pointer-events: none;
}
.p9rw-ah-col { text-align: center; flex: 1; min-width: 90px; padding: 8px 12px; }
.p9rw-ah-num { font-size: 34px; font-weight: 900; color: var(--p9-text); letter-spacing: -1px; }
.p9rw-ah-num.pending-col { color: var(--p9-amber); }
.p9rw-ah-num.active-col  { color: var(--p9-emerald); }
.p9rw-ah-lbl { font-size: 11px; color: var(--p9-muted); text-transform: uppercase; letter-spacing: .4px; margin-top: 4px; }
.p9rw-ah-divider { width: 1px; height: 48px; background: var(--p9-border); flex-shrink: 0; }
@media (max-width: 400px) { .p9rw-ah-divider { display: none; } .p9rw-ah-col { min-width: 45%; } }

/* ── Tabs ───────────────────────────────────────────────────────── */
.p9rw-tabs {
    display: flex; gap: 6px; margin-bottom: 16px;
    overflow-x: auto; -webkit-overflow-scrolling: touch;
    scrollbar-width: none; padding-bottom: 2px;
}
.p9rw-tabs::-webkit-scrollbar { display: none; }
.p9rw-tab {
    flex-shrink: 0; padding: 9px 16px; border-radius: 22px;
    font-size: 12px; font-weight: 600; letter-spacing: .2px;
    border: 1px solid var(--p9-border); background: transparent;
    color: var(--p9-muted); cursor: pointer; transition: all .18s;
    white-space: nowrap; font-family: inherit;
}
.p9rw-tab:hover  { color: var(--p9-text); border-color: rgba(129,140,248,.3); background: rgba(129,140,248,.06); }
.p9rw-tab.active { background: rgba(129,140,248,.15); color: var(--p9-indigo); border-color: rgba(129,140,248,.4); }
.p9rw-badge { display: inline-flex; align-items: center; justify-content: center; width: 16px; height: 16px; background: var(--p9-rose); color: #fff; border-radius: 50%; font-size: 9px; font-weight: 800; margin-left: 4px; vertical-align: middle; }

.p9rw-panel { display: none; }
.p9rw-panel.active { display: block; }

/* ── Shared field ───────────────────────────────────────────────── */
.p9rw-field {
    width: 100%; box-sizing: border-box;
    padding: 10px 14px; border-radius: 12px;
    border: 1px solid var(--p9-border);
    background: rgba(255,255,255,.04);
    color: var(--p9-text); font-size: 13px; outline: none;
    -webkit-appearance: none; font-family: inherit;
    transition: border-color .18s;
}
.p9rw-field:focus { border-color: rgba(129,140,248,.5); background: rgba(129,140,248,.06); }
.p9rw-field[type="number"] { -moz-appearance: textfield; }
.p9rw-field[type="number"]::-webkit-outer-spin-button,
.p9rw-field[type="number"]::-webkit-inner-spin-button { -webkit-appearance: none; }
select.p9rw-field option { background: #0f1c2e; }
textarea.p9rw-field { resize: vertical; min-height: 66px; }

/* ── Buttons ─────────────────────────────────────────────────────── */
.p9rw-btn {
    display: inline-flex; align-items: center; justify-content: center; gap: 6px;
    padding: 11px 20px; border-radius: 22px;
    font-size: 13px; font-weight: 700; border: none; cursor: pointer;
    transition: all .18s; white-space: nowrap; font-family: inherit;
    letter-spacing: .2px;
}
.p9rw-btn:hover  { transform: translateY(-1px); box-shadow: 0 6px 20px rgba(0,0,0,.25); }
.p9rw-btn:active { transform: translateY(0); }
.p9rw-btn:disabled { opacity: .5; cursor: not-allowed; transform: none; box-shadow: none; }
.p9rw-btn.primary { background: linear-gradient(135deg,#6366f1,#4f46e5); color: #fff; }
.p9rw-btn.violet  { background: linear-gradient(135deg,#7c3aed,#6d28d9); color: #fff; }
.p9rw-btn.emerald { background: linear-gradient(135deg,#059669,#047857); color: #fff; }
.p9rw-btn.danger  { background: linear-gradient(135deg,#ef4444,#dc2626); color: #fff; }
.p9rw-btn.ghost   { background: transparent; color: var(--p9-muted); border: 1px solid var(--p9-border); }
.p9rw-btn.w100    { width: 100%; margin-top: 14px; padding: 13px; font-size: 14px; }

/* ── Form card ───────────────────────────────────────────────────── */
.p9rw-form-card {
    background: var(--p9-glass); border: 1px solid var(--p9-border);
    border-radius: 20px; padding: 20px 18px; margin-bottom: 16px;
}
.p9rw-form-title { font-size: 14px; font-weight: 700; color: var(--p9-text); margin-bottom: 16px; }
.p9rw-form-grid  { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
@media (max-width: 480px) { .p9rw-form-grid { grid-template-columns: 1fr; } }
.p9rw-sf { display: flex; flex-direction: column; gap: 6px; }
.p9rw-sf-full { grid-column: 1 / -1; }
.p9rw-sf-lbl { font-size: 11px; color: var(--p9-muted); font-weight: 600; text-transform: uppercase; letter-spacing: .4px; }

/* ── Live preview ────────────────────────────────────────────────── */
.p9rw-live-preview {
    font-size: 12px; font-weight: 700; color: var(--p9-violet);
    background: rgba(167,139,250,.1); border-radius: 8px;
    padding: 6px 10px; display: inline-block; margin-top: 4px;
}

/* ── Redeem row — pill calculator ────────────────────────────────── */
.p9rw-redeem-row {
    display: flex;
    align-items: center;
    background: rgba(255,255,255,.55);
    border: 1.5px solid rgba(99,102,241,.2);
    border-radius: 9999px;
    padding: 6px 6px 6px 20px;
    gap: 10px;
    margin-bottom: 16px;
    box-shadow: 0 2px 8px rgba(0,0,0,.06);
    flex-wrap: nowrap;
    transition: border-color .18s, box-shadow .18s;
}
.p9rw-redeem-row:focus-within {
    border-color: rgba(99,102,241,.5);
    box-shadow: 0 0 0 3px rgba(99,102,241,.1);
}
.p9rw-redeem-pts-wrap {
    display: flex;
    align-items: center;
    gap: 6px;
    flex: 1;
    min-width: 0;
}
.p9rw-pts-input {
    background: transparent !important;
    border: none !important;
    outline: none !important;
    box-shadow: none !important;
    padding: 8px 0 !important;
    font-size: 22px !important;
    font-weight: 800 !important;
    color: #4f46e5 !important;
    text-align: left !important;
    width: 100%;
    min-width: 0;
    -moz-appearance: textfield !important;
    border-radius: 0 !important;
}
.p9rw-pts-input::-webkit-outer-spin-button,
.p9rw-pts-input::-webkit-inner-spin-button { -webkit-appearance: none !important; }
.p9rw-pts-label {
    font-size: 12px;
    font-weight: 700;
    color: #94a3b8;
    text-transform: uppercase;
    letter-spacing: .4px;
    flex-shrink: 0;
}
.p9rw-redeem-eq {
    font-size: 18px;
    color: #cbd5e1;
    font-weight: 300;
    flex-shrink: 0;
}
.p9rw-redeem-value {
    font-size: 22px;
    font-weight: 900;
    color: #059669;
    flex-shrink: 0;
    white-space: nowrap;
}

/* ── Coupon reveal ───────────────────────────────────────────────── */
.p9rw-coupon-reveal {
    margin-top: 16px; padding: 18px; border-radius: 16px;
    background: linear-gradient(135deg,rgba(52,211,153,.08),rgba(129,140,248,.06));
    border: 1px solid rgba(52,211,153,.25);
    animation: p9rwFadeIn .4s cubic-bezier(.22,1,.36,1);
}
.p9rw-coupon-reveal.p9rw-reveal-pulse {
    animation: p9rwFadeIn .4s cubic-bezier(.22,1,.36,1), p9rwPulseGreen .7s ease;
}
@keyframes p9rwPulseGreen {
    0%   { box-shadow: 0 0 0 0 rgba(5,150,105,.5); }
    60%  { box-shadow: 0 0 0 10px rgba(5,150,105,0); }
    100% { box-shadow: 0 0 0 0 rgba(5,150,105,0); }
}
@keyframes p9rwFadeIn { from { opacity:0; transform:translateY(8px); } to { opacity:1; transform:translateY(0); } }
.p9rw-coupon-label   { font-size: 12px; color: var(--p9-muted); margin-bottom: 8px; }
.p9rw-coupon-code-box { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.p9rw-coupon-code    { font-size: 24px; font-weight: 900; color: var(--p9-emerald); letter-spacing: 3px; word-break: break-all; }
.p9rw-copy-btn       { background: rgba(52,211,153,.15); border: none; border-radius: 8px; padding: 6px 10px; cursor: pointer; font-size: 14px; transition: all .18s; }
.p9rw-copy-btn:hover { background: rgba(52,211,153,.25); transform: scale(1.1); }
.p9rw-coupon-hint    { font-size: 11px; color: var(--p9-dim); margin-top: 8px; }

/* ── Locked card ─────────────────────────────────────────────────── */
.p9rw-locked-card {
    text-align: center; padding: 40px 24px 32px;
    border-radius: 20px; background: var(--p9-glass); border: 1px solid var(--p9-border);
}
.p9rw-locked-icon  { font-size: 48px; margin-bottom: 14px; display: block; }
.p9rw-locked-title { font-size: 18px; font-weight: 800; color: var(--p9-text); margin-bottom: 8px; }
.p9rw-locked-sub   { font-size: 13px; color: var(--p9-muted); line-height: 1.7; margin-bottom: 24px; max-width: 280px; margin-left: auto; margin-right: auto; }

/* Two-stat row */
.p9rw-locked-stats {
    display: flex; align-items: center; justify-content: center;
    gap: 0; margin: 0 auto 24px; max-width: 300px;
    background: rgba(99,102,241,0.06); border: 1px solid rgba(99,102,241,0.15);
    border-radius: 14px; overflow: hidden;
}
.p9rw-locked-stat {
    flex: 1; padding: 14px 16px; display: flex; flex-direction: column;
    align-items: center; gap: 4px;
}
.p9rw-locked-stat-value {
    font-size: 22px; font-weight: 800; color: var(--p9-amber);
    line-height: 1;
}
.p9rw-locked-stat-label {
    font-size: 11px; font-weight: 500; color: var(--p9-muted);
    text-transform: uppercase; letter-spacing: 0.04em; line-height: 1.3;
}
.p9rw-locked-stat-divider {
    width: 1px; height: 44px; background: rgba(99,102,241,0.15); flex-shrink: 0;
}

.p9rw-locked-progress { height: 8px; border-radius: 8px; background: rgba(255,255,255,.06); overflow: hidden; margin: 0 auto 8px; max-width: 260px; }
.p9rw-locked-bar   { height: 100%; border-radius: 8px; background: linear-gradient(90deg,var(--p9-sky),var(--p9-indigo)); transition: width .6s cubic-bezier(.22,1,.36,1); }
.p9rw-locked-prog-lbl { font-size: 12px; font-weight: 600; color: var(--p9-dim); letter-spacing: 0.03em; }

/* ── How to earn grid ────────────────────────────────────────────── */
.p9rw-how-to-earn { margin-top: 18px; }
.p9rw-earn-grid   { display: grid; grid-template-columns: repeat(2,1fr); gap: 10px; }
@media (min-width: 600px) { .p9rw-earn-grid { grid-template-columns: repeat(4,1fr); } }
.p9rw-earn-card {
    display: flex; flex-direction: column; align-items: center; text-align: center; gap: 6px;
    padding: 16px 10px; border-radius: 16px;
    background: var(--p9-glass); border: 1px solid var(--p9-border);
    font-size: 26px; transition: transform .2s;
}
.p9rw-earn-card:hover { transform: translateY(-2px); }
.p9rw-earn-card span { font-size: 12px; font-weight: 600; color: var(--p9-text); }
.p9rw-earn-card em   { font-size: 11px; color: var(--p9-sky); font-style: normal; font-weight: 700; }

/* ── Search row ─────────────────────────────────────────────────── */
.p9rw-search-row { display: flex; gap: 8px; margin-bottom: 14px; flex-wrap: wrap; }
.p9rw-search-row .p9rw-field { flex: 1; min-width: 160px; }

/* ── User card grid ──────────────────────────────────────────────── */
.p9rw-user-grid { display: flex; flex-direction: column; gap: 8px; }
.p9rw-ucard {
    display: flex; align-items: center; gap: 12px;
    padding: 12px 14px; border-radius: 14px;
    background: var(--p9-glass); border: 1px solid var(--p9-border);
    transition: background .18s, box-shadow .18s; flex-wrap: wrap;
}
.p9rw-ucard:hover { background: rgba(255,255,255,.06); box-shadow: 0 4px 16px rgba(0,0,0,.15); }
.p9rw-ucard-av {
    width: 40px; height: 40px; border-radius: 50%; flex-shrink: 0;
    display: flex; align-items: center; justify-content: center;
    font-size: 17px; font-weight: 800; color: #fff;
    background: linear-gradient(135deg, hsl(var(--av-hue),65%,55%), hsl(calc(var(--av-hue) + 40),65%,45%));
}
.p9rw-ucard-info  { flex: 1; min-width: 100px; }
.p9rw-ucard-name  { font-size: 13px; font-weight: 600; color: var(--p9-text); }
.p9rw-ucard-pts   { font-size: 12px; color: var(--p9-muted); margin-top: 2px; }
.p9rw-pts-glow    { font-weight: 800; color: var(--p9-amber); }
.p9rw-ucard-actions { display: flex; gap: 6px; }
.p9rw-micro-btn {
    width: 32px; height: 32px; border-radius: 50%;
    font-size: 16px; font-weight: 700; border: none; cursor: pointer;
    display: flex; align-items: center; justify-content: center;
    transition: all .18s; font-family: inherit;
}
.p9rw-micro-btn.add { background: rgba(52,211,153,.15); color: var(--p9-emerald); }
.p9rw-micro-btn.sub { background: rgba(251,113,133,.15); color: var(--p9-rose); }
.p9rw-micro-btn:hover { transform: scale(1.15); filter: brightness(1.2); }

/* ── Leaderboard ─────────────────────────────────────────────────── */
.p9rw-leaderboard { display: flex; flex-direction: column; gap: 6px; }
.p9rw-lb-row {
    display: flex; align-items: center; gap: 10px;
    padding: 10px 12px; border-radius: 12px;
    background: var(--p9-glass); border: 1px solid var(--p9-border);
    transition: background .18s;
}
.p9rw-lb-row:hover { background: rgba(255,255,255,.06); }
.p9rw-lb-row.gold   { border-color: rgba(251,191,36,.25); }
.p9rw-lb-row.silver { border-color: rgba(148,163,184,.2); }
.p9rw-lb-row.bronze { border-color: rgba(180,83,9,.2); }
.p9rw-lb-rank { font-size: 18px; flex-shrink: 0; width: 26px; text-align: center; }
.p9rw-lb-name { flex: 1; font-size: 13px; color: var(--p9-text); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.p9rw-lb-bar  { flex: 2; height: 6px; border-radius: 6px; background: rgba(255,255,255,.06); overflow: hidden; min-width: 40px; max-width: 120px; }
.p9rw-lb-fill { height: 100%; border-radius: 6px; background: linear-gradient(90deg,var(--p9-indigo),var(--p9-violet)); }
.p9rw-lb-row.gold   .p9rw-lb-fill { background: linear-gradient(90deg,#f59e0b,#f97316); }
.p9rw-lb-row.silver .p9rw-lb-fill { background: linear-gradient(90deg,#94a3b8,#cbd5e1); }
.p9rw-lb-row.bronze .p9rw-lb-fill { background: linear-gradient(90deg,#b45309,#d97706); }
.p9rw-lb-val  { font-size: 12px; font-weight: 700; color: var(--p9-amber); flex-shrink: 0; min-width: 56px; text-align: right; }

/* ── Withdrawal card ─────────────────────────────────────────────── */
.p9rw-wd-card {
    padding: 16px; border-radius: 16px; margin-bottom: 10px;
    background: rgba(124,58,237,.05); border: 1px solid rgba(124,58,237,.14);
}
.p9rw-wd-top    { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-bottom: 8px; }
.p9rw-wd-who    { display: flex; align-items: center; gap: 8px; flex: 1; min-width: 120px; }
.p9rw-wd-name   { font-size: 13px; font-weight: 600; color: var(--p9-text); }
.p9rw-wd-amount { font-size: 20px; font-weight: 900; color: var(--p9-violet); }
.p9rw-wd-meta   { font-size: 12px; color: var(--p9-muted); margin-bottom: 4px; word-break: break-all; }
.p9rw-wd-date   { font-size: 11px; color: var(--p9-dim); margin-bottom: 10px; }
.p9rw-wd-actions { display: flex; gap: 8px; flex-wrap: wrap; }

/* ── Pills / status badges ───────────────────────────────────────── */
.p9rw-pill {
    display: inline-flex; align-items: center; gap: 4px;
    padding: 3px 10px; border-radius: 20px;
    font-size: 10px; font-weight: 800; letter-spacing: .4px; text-transform: uppercase;
}
.p9rw-pill.pending  { background: rgba(251,191,36,.15);  color: var(--p9-amber); }
.p9rw-pill.approved { background: rgba(52,211,153,.15);  color: var(--p9-emerald); }
.p9rw-pill.rejected { background: rgba(251,113,133,.15); color: var(--p9-rose); }

/* ── Transaction log ─────────────────────────────────────────────── */
.p9rw-log { display: flex; flex-direction: column; gap: 6px; }
.p9rw-log-row {
    display: flex; align-items: center; gap: 12px;
    padding: 11px 14px; border-radius: 14px;
    background: var(--p9-glass); border: 1px solid var(--p9-border);
    transition: background .18s;
}
.p9rw-log-row:hover { background: rgba(255,255,255,.06); }
.p9rw-log-dot {
    width: 36px; height: 36px; border-radius: 50%; flex-shrink: 0;
    display: flex; align-items: center; justify-content: center; font-size: 16px;
    background: rgba(129,140,248,.1);
}
.p9rw-log-dot.emerald { background: rgba(52,211,153,.12); }
.p9rw-log-dot.rose    { background: rgba(251,113,133,.12); }
.p9rw-log-dot.sky     { background: rgba(56,189,248,.12); }
.p9rw-log-dot.amber   { background: rgba(251,191,36,.12); }
.p9rw-log-dot.violet  { background: rgba(167,139,250,.12); }
.p9rw-log-body { flex: 1; min-width: 0; }
.p9rw-log-note { font-size: 13px; color: var(--p9-text); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.p9rw-log-time { font-size: 11px; color: var(--p9-dim); margin-top: 2px; }
.p9rw-log-pts     { font-size: 14px; font-weight: 800; flex-shrink: 0; color: var(--p9-emerald); }
.p9rw-log-pts.neg { color: var(--p9-rose); }

/* ── Settings grid ───────────────────────────────────────────────── */
.p9rw-settings-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
@media (max-width: 480px) { .p9rw-settings-grid { grid-template-columns: 1fr; } }
.p9rw-toggle-wrap { display: flex; align-items: center; gap: 12px; padding: 12px 14px; border-radius: 12px; background: var(--p9-glass); border: 1px solid var(--p9-border); cursor: pointer; user-select: none; }
.p9rw-tog-lbl { font-size: 13px; color: var(--p9-text); font-weight: 600; }
.p9rw-tog { position: relative; width: 40px; height: 22px; flex-shrink: 0; }
.p9rw-tog input { opacity:0; width:0; height:0; }
.p9rw-tog-track { position: absolute; inset:0; border-radius:22px; background: rgba(255,255,255,.1); border:1px solid var(--p9-border); transition: background .2s; cursor: pointer; }
.p9rw-tog-track::after { content:''; position:absolute; width:16px; height:16px; border-radius:50%; background:var(--p9-muted); top:2px; left:2px; transition: transform .2s, background .2s; }
.p9rw-tog input:checked + .p9rw-tog-track { background:rgba(99,102,241,.4); border-color:rgba(99,102,241,.5); }
.p9rw-tog input:checked + .p9rw-tog-track::after { transform:translateX(18px); background:var(--p9-indigo); }

/* ── Admin modal ─────────────────────────────────────────────────── */
.p9rw-overlay { position:fixed; inset:0; background:rgba(0,0,0,.78); z-index:9999; display:none; align-items:center; justify-content:center; padding:16px; box-sizing:border-box; }
.p9rw-overlay.open { display:flex; }
.p9rw-modal { background:#0b1727; border:1px solid rgba(255,255,255,.1); border-radius:22px; padding:26px 22px; width:100%; max-width:400px; box-shadow:0 28px 70px rgba(0,0,0,.6); animation:p9rwSlide .25s cubic-bezier(.22,1,.36,1); }
@keyframes p9rwSlide { from { opacity:0; transform:scale(.9) translateY(16px); } to { opacity:1; transform:scale(1) translateY(0); } }
.p9rw-modal-title { font-size:16px; font-weight:800; color:var(--p9-text); margin-bottom:18px; }
.p9rw-mf { display:flex; flex-direction:column; gap:6px; margin-bottom:12px; }
.p9rw-modal-foot { display:flex; gap:8px; justify-content:flex-end; margin-top:18px; }

/* ── Section head ────────────────────────────────────────────────── */
.p9rw-section-head { font-size:13px; font-weight:700; color:var(--p9-text); margin:0 0 12px; display:flex; align-items:center; gap:6px; }

/* ── Empty state ─────────────────────────────────────────────────── */
.p9rw-empty { text-align:center; padding:36px 20px; color:var(--p9-muted); }
.p9rw-empty-icon { font-size:40px; margin-bottom:10px; }
.p9rw-empty p { font-size:13px; margin:0; line-height:1.7; }

/* ── Toast ───────────────────────────────────────────────────────── */
.p9rw-toast {
    position: fixed;
    bottom: 24px;
    left: 50%;
    transform: translateX(-50%) translateY(16px);
    background: #1e293b;
    color: #ffffff;
    padding: 12px 24px;
    border-radius: 9999px;
    font-size: 13px;
    font-weight: 600;
    z-index: 99999;
    opacity: 0;
    transition: all .3s cubic-bezier(.22,1,.36,1);
    border: 1px solid rgba(255,255,255,.12);
    pointer-events: none;
    max-width: calc(100vw - 40px);
    text-align: center;
    box-shadow: 0 8px 32px rgba(0,0,0,.35);
    white-space: nowrap;
}
.p9rw-toast.show    { opacity: 1; transform: translateX(-50%) translateY(0); }
.p9rw-toast.success { background: #059669; border-color: #047857; color: #ffffff; }
.p9rw-toast.error   { background: #dc2626; border-color: #b91c1c; color: #ffffff; }

@media (max-width:380px) {
    .p9rw-wallet-num { font-size:38px; }
    .p9rw-redeem-value { font-size:22px; }
    .p9rw-btn.w100 { font-size:13px; }
}

/* ── Filter row ─────────────────────────────────────────────────── */
.p9rw-filter-row { display:flex; gap:6px; flex-wrap:wrap; margin-bottom:12px; }
.p9rw-filter-btn {
    display:inline-flex; align-items:center; gap:6px;
    padding:7px 14px; border-radius:20px; font-size:12px; font-weight:600;
    border:1px solid var(--p9-border); background:transparent; color:var(--p9-muted);
    cursor:pointer; transition:all .18s; font-family:inherit; white-space:nowrap;
}
.p9rw-filter-btn:hover  { color:var(--p9-text); border-color:rgba(129,140,248,.3); }
.p9rw-filter-btn.active { background:rgba(129,140,248,.15); color:var(--p9-indigo); border-color:rgba(129,140,248,.4); }
.p9rw-fc { background:rgba(255,255,255,.12); border-radius:20px; padding:1px 7px; font-size:10px; font-weight:800; }

/* ── Admin user card grid ───────────────────────────────────────── */
.p9rw-acard-grid { display:grid; grid-template-columns:1fr; gap:12px; }
@media (min-width:640px) { .p9rw-acard-grid { grid-template-columns:1fr 1fr; } }

.p9rw-acard {
    border-radius:18px; padding:16px 16px 14px;
    background:var(--p9-glass); border:1px solid var(--p9-border);
    transition:box-shadow .2s, border-color .2s;
    position:relative; overflow:hidden;
}
.p9rw-acard::before {
    content:''; position:absolute; top:0; left:0; right:0; height:2px;
    background:linear-gradient(90deg,var(--p9-indigo),var(--p9-violet));
    border-radius:18px 18px 0 0;
}
.p9rw-acard:hover  { box-shadow:0 8px 28px rgba(0,0,0,.2); border-color:rgba(129,140,248,.25); }
.p9rw-acard.compact::before { display:none; }

/* Card top row */
.p9rw-acard-top { display:flex; align-items:center; gap:12px; margin-bottom:12px; flex-wrap:nowrap; }
.p9rw-acard-av {
    width:42px; height:42px; border-radius:50%; flex-shrink:0;
    display:flex; align-items:center; justify-content:center;
    font-size:18px; font-weight:800; color:#fff;
    background:linear-gradient(135deg, hsl(var(--av-hue),60%,52%), hsl(calc(var(--av-hue) + 45),60%,40%));
}
.p9rw-acard-meta { flex:1; min-width:0; }
.p9rw-acard-name  { font-size:13px; font-weight:700; color:var(--p9-text); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.p9rw-acard-email { font-size:11px; color:var(--p9-dim); margin-top:2px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.p9rw-acard-balance { text-align:right; flex-shrink:0; }
.p9rw-acard-bal-num { font-size:22px; font-weight:900; color:var(--p9-amber); line-height:1; }
.p9rw-acard-bal-lbl { font-size:10px; color:var(--p9-dim); text-transform:uppercase; letter-spacing:.4px; }

/* Role tag on cards */
.p9rw-role-tag {
    display:inline-flex; align-items:center;
    padding:2px 8px; border-radius:12px; margin-top:4px;
    font-size:10px; font-weight:700; text-transform:uppercase; letter-spacing:.4px;
    background:rgba(56,189,248,.12); color:var(--p9-sky); border:1px solid rgba(56,189,248,.2);
}
.p9rw-role-tag.mgr  { background:rgba(167,139,250,.12); color:var(--p9-violet); border-color:rgba(167,139,250,.25); }
.p9rw-role-tag.cust { background:rgba(52,211,153,.12);  color:var(--p9-emerald); border-color:rgba(52,211,153,.2); }
.p9rw-role-tag.sm   { font-size:9px; padding:1px 6px; margin-top:2px; }

/* Card stats strip */
.p9rw-acard-stats {
    display:flex; gap:0; margin-bottom:14px;
    background:rgba(255,255,255,.03); border-radius:12px;
    border:1px solid var(--p9-border); overflow:hidden;
}
.p9rw-acard-stat {
    flex:1; padding:10px 8px; text-align:center; position:relative;
    display:flex; flex-direction:column; gap:3px;
}
.p9rw-acard-stat+.p9rw-acard-stat::before { content:''; position:absolute; left:0; top:20%; bottom:20%; width:1px; background:var(--p9-border); }
.p9rw-acard-stat span  { font-size:15px; font-weight:800; color:var(--p9-text); }
.p9rw-acard-stat label { font-size:9px; color:var(--p9-muted); text-transform:uppercase; letter-spacing:.4px; cursor:default; }

/* Card action buttons */
.p9rw-acard-actions { display:flex; gap:6px; flex-wrap:wrap; }
.p9rw-action-btn {
    flex:1; min-width:0; padding:8px 10px; border-radius:10px;
    font-size:11px; font-weight:700; border:none; cursor:pointer;
    transition:all .18s; white-space:nowrap; text-align:center;
    font-family:inherit; letter-spacing:.2px;
}
.p9rw-action-btn:hover { transform:translateY(-1px); filter:brightness(1.15); }
.p9rw-action-btn.add  { background:rgba(52,211,153,.15); color:var(--p9-emerald); border:1px solid rgba(52,211,153,.2); }
.p9rw-action-btn.sub  { background:rgba(251,113,133,.12); color:var(--p9-rose);    border:1px solid rgba(251,113,133,.2); }
.p9rw-action-btn.set  { background:rgba(56,189,248,.12);  color:var(--p9-sky);    border:1px solid rgba(56,189,248,.2); }
.p9rw-action-btn.hist { background:rgba(167,139,250,.12); color:var(--p9-violet); border:1px solid rgba(167,139,250,.2); }

/* ── Enhanced modal header ──────────────────────────────────────── */
.p9rw-modal-hdr { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:18px; }
.p9rw-modal-user { display:flex; align-items:center; gap:10px; flex:1; min-width:0; }
.p9rw-modal-av {
    width:40px; height:40px; border-radius:50%; flex-shrink:0;
    display:flex; align-items:center; justify-content:center;
    font-size:17px; font-weight:800; color:#fff;
    background:linear-gradient(135deg, hsl(var(--av-hue),60%,52%), hsl(calc(var(--av-hue) + 45),60%,40%));
}
.p9rw-modal-title    { font-size:15px; font-weight:800; color:var(--p9-text); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.p9rw-modal-role-tag { font-size:10px; color:var(--p9-muted); margin-top:2px; }
.p9rw-modal-bal-box  { text-align:right; flex-shrink:0; }
.p9rw-modal-cur-pts  { font-size:24px; font-weight:900; color:var(--p9-amber); line-height:1; }
.p9rw-modal-cur-lbl  { font-size:10px; color:var(--p9-dim); text-transform:uppercase; letter-spacing:.4px; }

/* Action pills inside modal */
.p9rw-action-pills { display:flex; gap:6px; flex-wrap:wrap; }
.p9rw-apill {
    padding:7px 13px; border-radius:18px; font-size:12px; font-weight:600;
    border:1px solid var(--p9-border); background:transparent;
    color:var(--p9-muted); cursor:pointer; transition:all .18s; font-family:inherit;
    white-space:nowrap;
}
.p9rw-apill:hover  { color:var(--p9-text); border-color:rgba(129,140,248,.3); }
.p9rw-apill.active { background:rgba(129,140,248,.18); color:var(--p9-indigo); border-color:rgba(129,140,248,.4); }
.p9rw-apill.danger.active { background:rgba(239,68,68,.15); color:var(--p9-rose); border-color:rgba(239,68,68,.3); }

/* Preset quick-amount buttons */
.p9rw-presets { display:flex; gap:6px; flex-wrap:wrap; }
.p9rw-preset {
    padding:6px 14px; border-radius:16px; font-size:12px; font-weight:700;
    background:rgba(255,255,255,.05); border:1px solid var(--p9-border);
    color:var(--p9-muted); cursor:pointer; transition:all .18s; font-family:inherit;
}
.p9rw-preset:hover { background:rgba(129,140,248,.15); color:var(--p9-indigo); border-color:rgba(129,140,248,.35); }

/* Modal balance preview */
.p9rw-modal-preview {
    padding:10px 14px; border-radius:10px; margin-bottom:4px;
    background:rgba(52,211,153,.07); border:1px solid rgba(52,211,153,.18);
    font-size:12px; color:var(--p9-muted);
}
.p9rw-modal-preview strong { color:var(--p9-emerald); font-size:14px; font-weight:800; }

/* Leaderboard lb-info sub-row */
.p9rw-lb-info { flex:1; min-width:0; display:flex; flex-direction:column; gap:2px; }

/* Mgr-col colour in hero */
.p9rw-ah-num.mgr-col { color:var(--p9-violet); }


/* ── Search + filter inline row ─────────────────────────────────── */
.p9rw-search-filter-row {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 14px;
    flex-wrap: wrap;
}
/* Search takes up remaining space, filters stay compact on right */
.p9rw-search-filter-row .p9rw-pill-search { flex: 1; min-width: 200px; margin-bottom: 0; }
.p9rw-search-filter-row .p9rw-filter-row  { flex-shrink: 0; margin-bottom: 0; flex-wrap: nowrap; }

/* ── Pill search bar ────────────────────────────────────────────── */
.p9rw-pill-search { display:flex; gap:10px; align-items:center; flex-wrap:nowrap; }
.p9rw-pill-search-wrap {
    flex: 1;
    display: flex; align-items: center; gap: 8px;
    background: rgba(255,255,255,.55);
    border: none;
    border-radius: 50px;
    padding: 0 16px;
    box-shadow: 0 0 0 1.5px rgba(99,102,241,.3), 0 1px 4px rgba(0,0,0,.06);
    transition: box-shadow .18s, background .18s;
    min-width: 0;
}
.p9rw-pill-search-wrap:focus-within {
    box-shadow: 0 0 0 2.5px rgba(99,102,241,.65), 0 2px 8px rgba(99,102,241,.12);
    background: rgba(255,255,255,.85);
}
.p9rw-pill-search-icon { font-size: 15px; flex-shrink: 0; opacity: .5; user-select: none; }
.p9rw-pill-input {
    flex: 1; background: transparent;
    border: none; outline: none; -webkit-appearance: none; appearance: none;
    box-shadow: none; /* kill any browser default */
    color: #1e293b; font-size: 13px; padding: 11px 0;
    font-family: inherit; min-width: 0;
}
.p9rw-pill-input::placeholder { color: #94a3b8; opacity: 1; }
.p9rw-pill-clear {
    background: none; border: none; cursor: pointer;
    color: #94a3b8; font-size: 13px; padding: 2px 4px;
    border-radius: 50%; transition: all .15s; line-height: 1; flex-shrink: 0;
    box-shadow: none;
}
.p9rw-pill-clear:hover { color: #334155; background: rgba(0,0,0,.06); }
.p9rw-pill-search-btn {
    flex-shrink: 0; padding: 10px 20px; border-radius: 50px;
    background: linear-gradient(135deg,#6366f1,#4f46e5); color: #fff;
    font-size: 13px; font-weight: 700; border: none; cursor: pointer;
    transition: all .18s; font-family: inherit; white-space: nowrap;
    box-shadow: 0 2px 8px rgba(99,102,241,.3);
}
.p9rw-pill-search-btn:hover { transform: translateY(-1px); box-shadow: 0 4px 16px rgba(99,102,241,.4); }
.p9rw-pill-search-btn:active { transform: translateY(0); }

/* ── Search status bar ──────────────────────────────────────────── */
.p9rw-search-status {
    display:flex; align-items:center; justify-content:space-between; gap:10px;
    padding:8px 14px; border-radius:10px; margin-bottom:12px;
    background:rgba(99,102,241,.08); border:1px solid rgba(99,102,241,.18);
    font-size:12px; color:var(--p9-muted); flex-wrap:wrap;
}
.p9rw-status-reset {
    background:none; border:none; cursor:pointer;
    color:var(--p9-indigo); font-size:12px; font-weight:600;
    font-family:inherit; padding:0; text-decoration:underline; text-underline-offset:2px;
}

/* ── Search loading spinner ─────────────────────────────────────── */
.p9rw-search-spin {
    display:inline-block; width:16px; height:16px; vertical-align:middle; margin-right:6px;
    border:2px solid rgba(129,140,248,.2); border-top-color:var(--p9-indigo);
    border-radius:50%; animation:p9rwSpin .6s linear infinite;
}
@keyframes p9rwSpin { to { transform:rotate(360deg); } }

/* ── Zero-points card ───────────────────────────────────────────── */
.p9rw-acard.zero-pts { border-style:dashed; border-color:rgba(255,255,255,.06); opacity:.85; }
.p9rw-acard.zero-pts::before { background:linear-gradient(90deg,var(--p9-dim),rgba(255,255,255,.1)); }
.p9rw-acard-bal-num.zero { color:var(--p9-dim); font-size:18px; }
.p9rw-role-tag.admin { background:rgba(251,191,36,.12); color:var(--p9-amber); border-color:rgba(251,191,36,.25); }

/* ================================================================
   OVERRIDES — Pill shapes · Slate-grey fonts · Clean search bar
   ================================================================ */

/* ── CSS variable patch: slate-grey text ────────────────────────── */
.p9rw-wrap {
    --p9-text:  #64748b;   /* slate-500 — general labels & body copy  */
    --p9-muted: #94a3b8;   /* slate-400 — secondary/helper text        */
}

/* ── Restore white text where background is explicitly dark ─────── */
.p9rw-wallet,
.p9rw-wallet *,
.p9rw-admin-hero,
.p9rw-admin-hero *,
.p9rw-locked-card,
.p9rw-locked-card *,
.p9rw-overlay .p9rw-modal,
.p9rw-overlay .p9rw-modal * { color: inherit; }

.p9rw-wallet             { color: #f1f5f9; }
.p9rw-admin-hero         { color: #f1f5f9; }
.p9rw-locked-card        { color: #f1f5f9; }
.p9rw-overlay .p9rw-modal { color: #f1f5f9; }

/* acard names and emails sit on dark glass */
.p9rw-acard-name  { color: #f1f5f9; }
.p9rw-acard-email { color: #94a3b8; }

/* wallet numbers are already hardcoded white — keep them */
.p9rw-wallet-num,
.p9rw-wallet-label,
.p9rw-wallet-meta,
.p9rw-wallet-meta span,
.p9rw-wallet-meta strong { color: inherit; }

/* ── Pill-shaped inputs (all .p9rw-field except textarea) ───────── */
input.p9rw-field,
select.p9rw-field {
    border-radius: 9999px;
    padding-left: 18px;
    padding-right: 18px;
    color: #334155;
}

/* textarea keeps a generous radius but can't be a pill */
textarea.p9rw-field {
    border-radius: 16px;
    color: #334155;
}

/* ── Pill buttons ───────────────────────────────────────────────── */
.p9rw-btn         { border-radius: 9999px; }
.p9rw-action-btn  { border-radius: 9999px; }
.p9rw-filter-btn  { border-radius: 9999px; }
.p9rw-apill       { border-radius: 9999px; }
.p9rw-preset      { border-radius: 9999px; }
.p9rw-tab         { border-radius: 9999px; }

/* ── Button text stays white on coloured/dark backgrounds ───────── */
.p9rw-btn.primary,
.p9rw-btn.violet,
.p9rw-btn.emerald,
.p9rw-btn.danger  { color: #fff; }

.p9rw-action-btn.add  { color: var(--p9-emerald); }
.p9rw-action-btn.sub  { color: var(--p9-rose); }
.p9rw-action-btn.set  { color: var(--p9-sky); }
.p9rw-action-btn.hist { color: var(--p9-violet); }

/* ── Remove border/ring from the pill search bar ────────────────── */
.p9rw-pill-search-wrap {
    box-shadow: 0 1px 5px rgba(0,0,0,.08);
    border: 1px solid rgba(99,102,241,.15);
}
.p9rw-pill-search-wrap:focus-within {
    box-shadow: 0 2px 8px rgba(99,102,241,.12);
    border-color: rgba(99,102,241,.4);
}
.p9rw-pill-input {
    border: none !important;
    outline: none !important;
    box-shadow: none !important;
}

/* ================================================================
   ANALYTICS — two-card side-by-side layout
   ================================================================ */
.p9rw-analytics-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
    align-items: start;
}
@media (max-width: 700px) {
    .p9rw-analytics-grid { grid-template-columns: 1fr; }
}

.p9rw-analytics-card {
    background: var(--p9-glass);
    border: 1px solid var(--p9-border);
    border-radius: 20px;
    padding: 18px 16px;
    min-width: 0;
}

.p9rw-analytics-card-head {
    font-size: 13px;
    font-weight: 700;
    color: #f1f5f9;
    margin-bottom: 14px;
    display: flex;
    align-items: center;
    gap: 6px;
    padding-bottom: 10px;
    border-bottom: 1px solid var(--p9-border);
}

/* Keep leaderboard rows compact inside cards */
.p9rw-analytics-card .p9rw-leaderboard { gap: 4px; }
.p9rw-analytics-card .p9rw-lb-row { padding: 8px 10px; }
.p9rw-analytics-card .p9rw-lb-bar  { max-width: 80px; }

/* Keep log compact inside card */
.p9rw-analytics-card .p9rw-log { max-height: 420px; overflow-y: auto; }
.p9rw-analytics-card .p9rw-log::-webkit-scrollbar { width: 4px; }
.p9rw-analytics-card .p9rw-log::-webkit-scrollbar-track { background: transparent; }
.p9rw-analytics-card .p9rw-log::-webkit-scrollbar-thumb { background: rgba(255,255,255,.1); border-radius: 4px; }

/* ================================================================
   SETTINGS — grouped cards with hints and pill inputs
   ================================================================ */
.p9rw-settings-group {
    background: var(--p9-glass);
    border: 1px solid var(--p9-border);
    border-radius: 20px;
    padding: 20px 18px;
    margin-bottom: 14px;
}

.p9rw-settings-group-title {
    font-size: 13px;
    font-weight: 700;
    color: #f1f5f9;
    margin-bottom: 16px;
    padding-bottom: 10px;
    border-bottom: 1px solid var(--p9-border);
    display: flex;
    align-items: center;
    gap: 6px;
}

/* Individual setting card */
.p9rw-sf-card {
    background: rgba(255,255,255,.03);
    border: 1px solid var(--p9-border);
    border-radius: 14px;
    padding: 12px 14px;
    gap: 8px;
    transition: border-color .18s;
}
.p9rw-sf-card:hover { border-color: rgba(129,140,248,.25); }
.p9rw-sf-card:focus-within { border-color: rgba(129,140,248,.45); }

/* Hint text below each input */
.p9rw-sf-hint {
    font-size: 11px;
    color: var(--p9-muted);
    line-height: 1.4;
    margin-top: 2px;
}

/* Footer row: toggle left, save button right */
.p9rw-settings-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 12px;
    padding: 16px 18px;
}

/* ================================================================
   SETTINGS PANEL — light-mode card styling + high-specificity
   input pill override that beats dashboard and theme CSS
   ================================================================ */

/* Group card — light background visible on the white dashboard */
.p9rw-wrap .p9rw-settings-group {
    background: #f8fafc !important;
    border: 1.5px solid #e2e8f0 !important;
    border-radius: 20px !important;
}
.p9rw-wrap .p9rw-settings-group-title {
    color: #334155 !important;
    border-bottom-color: #e2e8f0 !important;
}

/* Individual field card */
.p9rw-wrap .p9rw-sf-card {
    background: #ffffff !important;
    border: 1.5px solid #e2e8f0 !important;
    border-radius: 14px !important;
}
.p9rw-wrap .p9rw-sf-card:hover        { border-color: rgba(99,102,241,.35) !important; }
.p9rw-wrap .p9rw-sf-card:focus-within { border-color: rgba(99,102,241,.6)  !important; }

/* Pill inputs — specificity 0-4-1, beats any 0-2-1 or lower rule */
.p9rw-wrap .p9rw-settings-group .p9rw-sf-card input.p9rw-rs-input {
    border-radius: 9999px !important;
    border: 1.5px solid #e2e8f0 !important;
    background: #f8fafc !important;
    color: #334155 !important;
    padding: 10px 18px !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    outline: none !important;
    box-shadow: none !important;
    width: 100% !important;
    box-sizing: border-box !important;
    -webkit-appearance: none !important;
    appearance: none !important;
}
.p9rw-wrap .p9rw-settings-group .p9rw-sf-card input.p9rw-rs-input:focus {
    border-color: rgba(99,102,241,.55) !important;
    background: #fff !important;
    box-shadow: 0 0 0 3px rgba(99,102,241,.1) !important;
}

/* Label */
.p9rw-wrap .p9rw-sf-card .p9rw-sf-lbl {
    color: #475569 !important;
    font-size: 11px !important;
}

/* Hint text */
.p9rw-wrap .p9rw-sf-card .p9rw-sf-hint {
    color: #94a3b8 !important;
    font-size: 11px !important;
}

/* Footer group (toggle + button row) */
.p9rw-wrap .p9rw-settings-footer {
    background: #f8fafc !important;
    border: 1.5px solid #e2e8f0 !important;
}
.p9rw-wrap .p9rw-settings-footer .p9rw-tog-lbl {
    color: #334155 !important;
}

/* ================================================================
   LIFETIME STATS BAR
   ================================================================ */
.p9rw-lifetime-bar {
    display: flex;
    align-items: center;
    gap: 0;
    background: rgba(255,255,255,.05);
    border: 1px solid rgba(255,255,255,.1);
    border-radius: 16px;
    padding: 12px 20px;
    margin-bottom: 20px;
    flex-wrap: wrap;
}
.p9rw-lt-stat {
    display: flex;
    align-items: center;
    gap: 10px;
    flex: 1;
    min-width: 120px;
    padding: 6px 10px;
}
.p9rw-lt-icon { font-size: 20px; flex-shrink: 0; }
.p9rw-lt-num {
    font-size: 17px;
    font-weight: 800;
    color: #f1f5f9;
    line-height: 1;
}
.p9rw-lt-num.redeemed { color: var(--p9-rose); }
.p9rw-lt-num.expired  { color: var(--p9-amber); }
.p9rw-lt-num.small    { font-size: 11px; font-weight: 600; color: var(--p9-muted); }
.p9rw-lt-lbl { font-size: 10px; color: var(--p9-muted); text-transform: uppercase; letter-spacing: .4px; margin-top: 2px; }
.p9rw-lt-divider { width: 1px; height: 36px; background: rgba(255,255,255,.08); flex-shrink: 0; margin: 0 4px; }
@media (max-width: 600px) {
    .p9rw-lifetime-bar { gap: 6px; }
    .p9rw-lt-divider   { display: none; }
}

/* ================================================================
   SELECT-ALL ROW + CARD CHECKBOX
   ================================================================ */
.p9rw-select-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 8px 4px;
    margin-bottom: 6px;
    font-size: 12px;
    color: var(--p9-muted);
}
.p9rw-select-all-wrap {
    display: flex;
    align-items: center;
    gap: 7px;
    cursor: pointer;
    font-weight: 600;
    color: var(--p9-indigo);
}
.p9rw-select-all-wrap input[type="checkbox"] {
    width: 15px; height: 15px;
    accent-color: var(--p9-indigo);
    cursor: pointer;
}
.p9rw-selected-count { font-size: 11px; color: var(--p9-muted); }

.p9rw-acard-sel {
    position: absolute;
    top: 12px;
    right: 12px;
    z-index: 2;
}
.p9rw-card-cb {
    width: 16px;
    height: 16px;
    accent-color: var(--p9-indigo);
    cursor: pointer;
    border-radius: 4px;
}
.p9rw-acard { position: relative; } /* ensure sel is positioned */

/* ================================================================
   FLOATING BULK ACTION BAR
   ================================================================ */
.p9rw-bulk-bar {
    position: fixed;
    bottom: 24px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 9999;
    min-width: 640px;
    max-width: 92vw;
    background: #1e293b;
    border: 1px solid rgba(129,140,248,.4);
    border-radius: 9999px;
    box-shadow: 0 8px 32px rgba(0,0,0,.45), 0 0 0 1px rgba(129,140,248,.2);
    padding: 10px 16px 10px 20px;
    animation: p9rwSlideUp .22s ease;
}
@keyframes p9rwSlideUp {
    from { transform: translateX(-50%) translateY(20px); opacity: 0; }
    to   { transform: translateX(-50%) translateY(0);    opacity: 1; }
}
.p9rw-bulk-bar-inner {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: nowrap;
}
.p9rw-bulk-info {
    font-size: 13px;
    font-weight: 700;
    color: #f1f5f9;
    white-space: nowrap;
    flex-shrink: 0;
}
.p9rw-bulk-count {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 22px;
    height: 22px;
    background: var(--p9-indigo);
    color: #fff;
    border-radius: 9999px;
    font-size: 11px;
    font-weight: 800;
    padding: 0 6px;
    margin-right: 4px;
}
.p9rw-bulk-controls {
    display: flex;
    align-items: center;
    gap: 8px;
    flex: 1;
    min-width: 0;
}
.p9rw-bulk-input {
    padding: 7px 14px;
    border-radius: 9999px;
    border: 1px solid rgba(255,255,255,.12);
    background: rgba(255,255,255,.06);
    color: #f1f5f9;
    font-size: 13px;
    outline: none;
    font-family: inherit;
    width: 80px;
    -moz-appearance: textfield;
}
.p9rw-bulk-input.wide { width: 160px; }
.p9rw-bulk-input::-webkit-outer-spin-button,
.p9rw-bulk-input::-webkit-inner-spin-button { -webkit-appearance: none; }
.p9rw-bulk-input:focus { border-color: rgba(129,140,248,.5); }
.p9rw-bulk-select {
    padding: 7px 14px;
    border-radius: 9999px;
    border: 1px solid rgba(255,255,255,.12);
    background: rgba(255,255,255,.06);
    color: #f1f5f9;
    font-size: 13px;
    outline: none;
    font-family: inherit;
    cursor: pointer;
}
.p9rw-bulk-select option { background: #1e293b; }
@media (max-width: 640px) {
    .p9rw-bulk-bar { min-width: 94vw; border-radius: 20px; bottom: 12px; }
    .p9rw-bulk-input.wide { display: none; }
}

/* ================================================================
   EXPIRY TRIGGER ROW
   ================================================================ */
.p9rw-expiry-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    flex-wrap: wrap;
}
.p9rw-expiry-meta { display: flex; align-items: center; gap: 8px; font-size: 13px; }
.p9rw-expiry-label { color: #475569; font-weight: 600; }
.p9rw-expiry-time  { color: #64748b; }

/* ================================================================
   CSV IMPORT
   ================================================================ */
.p9rw-csv-hint {
    font-size: 12px;
    color: #64748b;
    margin-bottom: 14px;
    line-height: 1.5;
}
.p9rw-csv-hint code {
    background: #e2e8f0;
    border-radius: 6px;
    padding: 2px 6px;
    font-size: 11px;
    color: #334155;
}
.p9rw-csv-drop {
    border: 2px dashed #cbd5e1;
    border-radius: 16px;
    padding: 28px 20px;
    text-align: center;
    cursor: pointer;
    transition: all .18s;
    margin-bottom: 14px;
    background: #f8fafc;
}
.p9rw-csv-drop:hover,
.p9rw-csv-drop.drag-over {
    border-color: rgba(99,102,241,.55);
    background: rgba(99,102,241,.04);
}
.p9rw-csv-drop.has-file { border-color: rgba(52,211,153,.5); background: rgba(52,211,153,.04); }
.p9rw-csv-drop-icon  { font-size: 32px; margin-bottom: 8px; }
.p9rw-csv-drop-text  { font-size: 13px; color: #64748b; }
.p9rw-csv-browse     { color: var(--p9-indigo); font-weight: 600; text-decoration: underline; cursor: pointer; }
.p9rw-csv-filename   { font-size: 12px; color: #059669; font-weight: 600; margin-top: 8px; }
.p9rw-csv-result     { margin-top: 12px; font-size: 13px; }
.p9rw-csv-ok         { color: #059669; font-weight: 600; margin-bottom: 8px; }
.p9rw-csv-errors     { color: #dc2626; }
.p9rw-csv-errors ul  { margin: 6px 0 0 16px; padding: 0; }
.p9rw-csv-errors li  { margin-bottom: 2px; font-size: 12px; }

/* ================================================================
   ORDER LINK IN LOG
   ================================================================ */
.p9rw-order-link {
    color: var(--p9-indigo);
    font-size: 11px;
    font-weight: 700;
    text-decoration: none;
    opacity: .8;
    white-space: nowrap;
}
.p9rw-order-link:hover { opacity: 1; text-decoration: underline; }

/* ================================================================
   CUSTOMER PROGRESS BAR (always visible)
   ================================================================ */
.p9rw-wallet-progress { margin-top: 14px; }
.p9rw-wp-track {
    height: 6px;
    border-radius: 9999px;
    background: rgba(255,255,255,.1);
    overflow: hidden;
    margin-bottom: 6px;
}
.p9rw-wp-fill {
    height: 100%;
    border-radius: 9999px;
    background: linear-gradient(90deg, var(--p9-indigo), var(--p9-sky));
    transition: width .6s cubic-bezier(.4,0,.2,1);
}
.p9rw-wp-lbl {
    font-size: 11px;
    color: var(--p9-muted);
    text-align: center;
    transition: color .3s;
}

/* ================================================================
   BALANCE COUNT-UP ANIMATION FLASH
   ================================================================ */
@keyframes p9rwBalFlash {
    0%   { opacity: 1; }
    30%  { opacity: .4; color: var(--p9-emerald); }
    100% { opacity: 1; }
}
#p9rw-cust-bal-num.updating { animation: p9rwBalFlash .7s ease; }

/* ================================================================
   GLOBAL PILL INPUTS — applies to manager withdrawal form,
   modal fields, and any other .p9rw-field not already covered
   ================================================================ */

/* All text/number inputs inside the wrap */
.p9rw-wrap input.p9rw-field:not(.p9rw-pts-input),
.p9rw-wrap select.p9rw-field {
    border-radius: 9999px !important;
    border: 1.5px solid rgba(99,102,241,.18) !important;
    background: rgba(255,255,255,.7) !important;
    color: #334155 !important;
    padding: 10px 18px !important;
    outline: none !important;
    -webkit-appearance: none !important;
    appearance: none !important;
    box-shadow: none !important;
}
.p9rw-wrap input.p9rw-field:not(.p9rw-pts-input):focus,
.p9rw-wrap select.p9rw-field:focus {
    border-color: rgba(99,102,241,.55) !important;
    box-shadow: 0 0 0 3px rgba(99,102,241,.1) !important;
    background: #fff !important;
}

/* Textarea stays pill-adjacent but can't be a circle */
.p9rw-wrap textarea.p9rw-field {
    border-radius: 16px !important;
    border: 1.5px solid rgba(99,102,241,.18) !important;
    background: rgba(255,255,255,.7) !important;
    color: #334155 !important;
    padding: 10px 18px !important;
    outline: none !important;
    box-shadow: none !important;
}
.p9rw-wrap textarea.p9rw-field:focus {
    border-color: rgba(99,102,241,.55) !important;
    box-shadow: 0 0 0 3px rgba(99,102,241,.1) !important;
    background: #fff !important;
}

/* ── Form card — light-mode visibility ────────────────────────── */
.p9rw-wrap .p9rw-form-card {
    background: #f8fafc !important;
    border: 1.5px solid #e2e8f0 !important;
}
.p9rw-wrap .p9rw-form-title {
    color: #334155 !important;
}
.p9rw-wrap .p9rw-sf-lbl {
    color: #475569 !important;
}
.p9rw-wrap .p9rw-live-preview {
    background: rgba(99,102,241,.08) !important;
    color: #4f46e5 !important;
    border-radius: 9999px !important;
    font-size: 12px !important;
}

/* ── Locked card — light mode ───────────────────────────────── */
body:not(.portalcloud9-dark) .p9rw-locked-card {
    background: rgba(255,255,255,0.80);
    border-color: rgba(99,102,241,0.12);
}
body:not(.portalcloud9-dark) .p9rw-locked-title { color: #1e293b; }
body:not(.portalcloud9-dark) .p9rw-locked-sub   { color: #64748b; }
body:not(.portalcloud9-dark) .p9rw-locked-stats {
    background: rgba(99,102,241,0.05);
    border-color: rgba(99,102,241,0.12);
}
body:not(.portalcloud9-dark) .p9rw-locked-stat-label   { color: #64748b; }
body:not(.portalcloud9-dark) .p9rw-locked-stat-divider { background: rgba(99,102,241,0.12); }
body:not(.portalcloud9-dark) .p9rw-locked-prog-lbl     { color: #94a3b8; }
body:not(.portalcloud9-dark) .p9rw-locked-progress     { background: rgba(0,0,0,.06); }
body:not(.portalcloud9-dark) .p9rw-locked-stat-value   { color: #d97706; } /* amber visible on white */

/* ── Locked card — dark mode ────────────────────────────────── */
body.portalcloud9-dark .p9rw-locked-card {
    background: rgba(60,60,60,0.70);
    border-color: #708090;
}
body.portalcloud9-dark .p9rw-locked-title          { color: #ffffff; }
body.portalcloud9-dark .p9rw-locked-sub            { color: #cbd5e1; }
body.portalcloud9-dark .p9rw-locked-stats          { background: rgba(99,102,241,0.08); border-color: rgba(255,255,255,0.12); }
body.portalcloud9-dark .p9rw-locked-stat-value     { color: #fbbf24; } /* bright amber on dark bg */
body.portalcloud9-dark .p9rw-locked-stat-label     { color: #94a3b8; }
body.portalcloud9-dark .p9rw-locked-stat-divider   { background: rgba(255,255,255,0.1); }
body.portalcloud9-dark .p9rw-locked-prog-lbl       { color: #64748b; }
body.portalcloud9-dark .p9rw-locked-progress       { background: rgba(255,255,255,.06); }