/* ── Wallet module ──────────────────────────────────────────────── */

.r33-wallet-module {
    display       : flex;
    flex-direction: column;
    gap           : 28px;
    padding       : 4px 0 20px;
}

/* Balance card */

.r33-wallet-balance-card {
    display         : flex;
    align-items     : center;
    justify-content : space-between;
    gap             : 16px;
    background      : #111;
    border-radius   : 12px;
    padding         : 24px 28px;
}

.r33-wallet-balance__label {
    font-size     : 0.68rem;
    font-weight   : 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color         : #666;
    margin        : 0 0 8px;
}

.r33-wallet-balance__amount {
    display    : flex;
    align-items: center;
    gap        : 8px;
    color      : #c9a84c;
    font-size  : 1.8rem;
    font-weight: 700;
    line-height: 1;
}

.r33-wallet-balance__amount svg { flex-shrink: 0; }

.r33-wallet-balance__sub {
    font-size : 0.72rem;
    color     : #555;
    margin    : 6px 0 0;
}

.r33-wallet-topup-btn {
    flex-shrink: 0;
    white-space: nowrap;
}

/* Spend actions */

.r33-wallet-actions__label {
    font-size     : 0.68rem;
    font-weight   : 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color         : #bbb;
    margin        : 0 0 12px;
}

.r33-wallet-actions__grid {
    display              : grid;
    grid-template-columns: repeat(2, 1fr);
    gap                  : 12px;
}

.r33-wallet-action-card {
    display        : flex;
    flex-direction : column;
    gap            : 6px;
    padding        : 18px 20px;
    background     : #fafafa;
    border         : 1px solid #ebebeb;
    border-radius  : 10px;
    text-decoration: none;
    color          : inherit;
    transition     : border-color .15s, background .15s;
}

.r33-wallet-action-card:hover {
    border-color   : #c9a84c;
    background     : #fffdf5;
    text-decoration: none;
    color          : inherit;
}

.r33-wallet-action-card svg {
    color      : #c9a84c;
    flex-shrink: 0;
    margin-bottom: 4px;
}

.r33-wallet-action-card__title {
    font-size  : 0.88rem;
    font-weight: 600;
    color      : #111;
}

.r33-wallet-action-card__sub {
    font-size  : 0.76rem;
    color      : #888;
    line-height: 1.4;
}

/* Transaction history */

.r33-wallet-history__label {
    font-size     : 0.68rem;
    font-weight   : 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color         : #bbb;
    margin        : 0 0 12px;
}

.r33-wallet-history__list {
    display       : flex;
    flex-direction: column;
    border        : 1px solid #ebebeb;
    border-radius : 10px;
    overflow      : hidden;
}

.r33-wallet-txn {
    display        : flex;
    align-items    : center;
    justify-content: space-between;
    gap            : 12px;
    padding        : 12px 16px;
    border-bottom  : 1px solid #f5f5f5;
    font-size      : 0.82rem;
}

.r33-wallet-txn:last-child { border-bottom: none; }

.r33-wallet-txn__desc {
    color    : #333;
    min-width: 0;
    overflow : hidden;
    text-overflow: ellipsis;
    white-space  : nowrap;
}

.r33-wallet-txn__meta {
    display    : flex;
    align-items: center;
    gap        : 12px;
    flex-shrink: 0;
}

.r33-wallet-txn__amount {
    font-weight: 600;
    white-space: nowrap;
}

.r33-wallet-txn--credit .r33-wallet-txn__amount { color: #16a34a; }
.r33-wallet-txn--debit  .r33-wallet-txn__amount { color: #dc2626; }

.r33-wallet-txn__date {
    font-size : 0.72rem;
    color     : #bbb;
    white-space: nowrap;
}

/* Empty state */

.r33-wallet-history--empty p {
    font-size : 0.84rem;
    color     : #aaa;
    text-align: center;
    padding   : 24px;
    margin    : 0;
    background: #fafafa;
    border    : 1px solid #ebebeb;
    border-radius: 10px;
}

/* Responsive */

@media (max-width: 480px) {
    .r33-wallet-balance-card { flex-direction: column; align-items: flex-start; }
    .r33-wallet-topup-btn    { width: 100%; justify-content: center; }
    .r33-wallet-actions__grid { grid-template-columns: 1fr; }
}
