/* ============================================================
   资产明细页通用样式（积分 / 余额 / 游戏积分）
   - 移动端（≤768px）：卡片式流水列表
   - 电脑端（≥769px）：表头 + 数据表格，宽内容区
   一套 DOM、两份数据容器，由本文件按断点切换显隐
   ============================================================ */

body { background: var(--c-bg); }

/* ---------- 顶部导航条 ---------- */
.ast-topbar {
    position: sticky; top: 0; z-index: 20;
    background: var(--c-surface);
    border-bottom: 1px solid var(--c-border);
    padding: 14px 16px;
}
.ast-topbar-inner {
    max-width: 720px; margin: 0 auto;
    display: flex; align-items: center; justify-content: space-between;
    gap: 12px;
}
.ast-back {
    width: 40px; height: 40px; border-radius: 50%;
    background: var(--c-bg-2); color: var(--c-text-2);
    display: flex; align-items: center; justify-content: center;
    text-decoration: none; flex-shrink: 0;
    transition: background .2s, color .2s;
}
.ast-back:hover { background: var(--c-primary-light); color: var(--c-primary); }
.ast-title { font-size: 17px; font-weight: 700; color: var(--c-text); margin: 0; flex: 1; text-align: center; }
.ast-topbar-space { width: 40px; flex-shrink: 0; }

/* ---------- 内容容器：移动端 720 ---------- */
.ast-wrap {
    max-width: 720px;
    margin: 0 auto;
    padding: 16px 12px 88px;
}

/* ---------- 概览卡片 ---------- */
.ast-overview {
    position: relative; overflow: hidden;
    background: linear-gradient(135deg, var(--c-surface) 0%, var(--c-primary-light) 100%);
    border-radius: var(--radius-lg);
    padding: 24px 20px 20px;
    margin-bottom: var(--space-md);
    box-shadow: var(--shadow);
    border: 1px solid var(--c-border);
}
.ast-overview::before {
    content: ''; position: absolute; top: 0; left: 0; right: 0;
    height: 4px;
    background: linear-gradient(90deg, #1890ff, #36cfc9);
}
.ast-overview::after {
    content: ''; position: absolute; border-radius: 50%;
    width: 180px; height: 180px; top: -70px; right: -50px;
    background: rgba(24, 144, 255, 0.06);
    pointer-events: none;
}
.ast-overview-label { font-size: 13px; color: var(--c-text-3); font-weight: 500; position: relative; z-index: 1; }
.ast-overview-num {
    font-size: 38px; font-weight: 800; line-height: 1.1; margin-top: 4px;
    color: var(--c-primary); position: relative; z-index: 1;
    word-break: break-all;
}
.ast-overview-num small { font-size: 14px; font-weight: 600; margin-left: 6px; color: var(--c-text-3); }
.ast-overview-meta {
    display: flex; gap: 20px; margin-top: 16px;
    font-size: 12px; color: var(--c-text-3);
    padding-top: 14px;
    border-top: 1px solid var(--c-border);
    position: relative; z-index: 1;
    flex-wrap: wrap;
}
.ast-overview-meta b { font-size: 16px; font-weight: 700; display: block; margin-top: 2px; }
.ast-meta-in b { color: #059669; }
.ast-meta-out b { color: #ef4444; }
.ast-meta-frozen b { color: #d97706; }

/* ---------- 区块标题 ---------- */
.ast-section-title {
    font-size: 15px; font-weight: 700; color: var(--c-text);
    display: flex; align-items: center; gap: 8px;
    margin: 4px 2px 12px;
}
.ast-section-title i {
    width: 28px; height: 28px; border-radius: 8px;
    background: var(--c-primary-light); color: var(--c-primary);
    display: inline-flex; align-items: center; justify-content: center;
    font-size: 13px;
}
.ast-section-title .ast-count {
    font-size: 12px; font-weight: 600; color: var(--c-text-3);
    margin-left: auto;
}

/* ---------- 移动端：卡片流水列表 ---------- */
.ast-mobile-list { display: flex; flex-direction: column; gap: 10px; }
.ast-log-card {
    background: var(--c-surface);
    border-radius: var(--radius-lg);
    border: 1px solid var(--c-border);
    box-shadow: var(--shadow);
    padding: 14px 16px;
    display: flex; align-items: center; justify-content: space-between;
    gap: 12px;
}
.ast-log-main { flex: 1; min-width: 0; }
.ast-log-reason-row { display: flex; align-items: center; gap: 8px; }
.ast-log-reason {
    font-size: 14px; font-weight: 600; color: var(--c-text);
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.ast-log-time { font-size: 11px; color: var(--c-text-3); margin-top: 3px; }
.ast-log-amt { font-size: 16px; font-weight: 800; white-space: nowrap; text-align: right; }
.ast-log-amt.plus { color: #10b981; }
.ast-log-amt.minus { color: #ef4444; }
.ast-log-after { font-size: 11px; color: var(--c-text-3); margin-top: 3px; text-align: right; }

/* 冻结变动标注（积分明细：冻结中/解冻） */
.ast-log-frozen {
    font-size: 10px; font-weight: 700; color: #d97706;
    margin-top: 2px; text-align: right; white-space: nowrap;
}

/* 类型药丸标签 */
.ast-type-pill {
    flex-shrink: 0;
    font-size: 10px; font-weight: 600;
    padding: 2px 8px; border-radius: 999px;
    background: var(--c-bg-2); color: var(--c-text-3);
    border: 1px solid var(--c-border);
    white-space: nowrap;
}
.ast-type-pill.t-sign, .ast-type-pill.t-recharge, .ast-type-pill.t-refund,
.ast-type-pill.t-game_reward, .ast-type-pill.t-sign_milestone, .ast-type-pill.t-register,
.ast-type-pill.t-admin_gift, .ast-type-pill.t-lottery_guess_reopen {
    background: #d1fae5; color: #047857; border-color: transparent;
}
.ast-type-pill.t-consume, .ast-type-pill.t-game_play, .ast-type-pill.t-game_exchange,
.ast-type-pill.t-guess, .ast-type-pill.t-lottery_guess, .ast-type-pill.t-shop_exchange,
.ast-type-pill.t-sign_makeup, .ast-type-pill.t-pdf_download {
    background: #fee2e2; color: #b91c1c; border-color: transparent;
}
/* 商城订单 / 商城退款 / 消费奖励：同时存在收支两种场景（下单扣款+收货送积分 / 退款+回扣积分），采用中性配色 */
.ast-type-pill.t-mall_order, .ast-type-pill.t-mall_refund, .ast-type-pill.t-mall_pay_reward {
    background: #ede9fe; color: #6d28d9; border-color: transparent;
}

/* ---------- PC端：数据表格（移动端隐藏） ---------- */
.ast-pc-card {
    display: none;
    background: var(--c-surface);
    border-radius: var(--radius-lg);
    border: 1px solid var(--c-border);
    box-shadow: var(--shadow);
    overflow: hidden;
}
.ast-table { width: 100%; border-collapse: collapse; font-size: 14px; }
.ast-table thead th {
    background: var(--c-bg-2);
    color: var(--c-text-3);
    font-size: 12px; font-weight: 700;
    text-align: left;
    padding: 13px 18px;
    border-bottom: 1px solid var(--c-border);
    white-space: nowrap;
}
.ast-table tbody td {
    padding: 14px 18px;
    border-bottom: 1px solid var(--c-border);
    color: var(--c-text-2);
    vertical-align: middle;
}
.ast-table tbody tr:last-child td { border-bottom: none; }
.ast-table tbody tr { transition: background .15s; }
.ast-table tbody tr:hover { background: var(--c-primary-light); }
.ast-table .col-amt { font-weight: 800; white-space: nowrap; text-align: right; }
.ast-table .col-amt.plus { color: #059669; }
.ast-table .col-amt.minus { color: #ef4444; }
.ast-table .col-after { white-space: nowrap; color: var(--c-text-3); text-align: right; font-variant-numeric: tabular-nums; }
.ast-table .col-time { white-space: nowrap; color: var(--c-text-3); font-size: 13px; font-variant-numeric: tabular-nums; }
.ast-table .col-reason { font-weight: 600; color: var(--c-text); }

/* ---------- 空状态 / 加载 ---------- */
.ast-empty {
    padding: 48px 16px; text-align: center;
    color: var(--c-text-3); font-weight: 600; font-size: 14px;
}
.ast-empty i { display: block; font-size: 40px; margin-bottom: 12px; opacity: .35; }
.ast-pc-card .ast-empty { padding: 64px 16px; }

/* ---------- 分页（两端共用：首页/上一页/当前页/总页/下一页/尾页） ---------- */
.ast-pagination {
    display: flex; align-items: center; justify-content: center; gap: 4px;
    margin-top: 18px; flex-wrap: wrap;
}
.ast-page-btn {
    min-width: 34px; height: 34px; padding: 0 12px;
    border-radius: var(--radius); font-size: 13px; font-weight: 600;
    background: var(--c-surface); color: var(--c-text-2);
    border: 1px solid var(--c-border);
    display: inline-flex; align-items: center; justify-content: center;
    transition: all .15s;
}
.ast-page-btn:hover:not(.disabled):not(.active) {
    background: var(--c-primary-light); color: var(--c-primary); border-color: var(--c-primary-light);
}
.ast-page-btn.active { background: var(--c-primary); color: #fff; border-color: var(--c-primary); }
.ast-page-btn.disabled { opacity: .4; cursor: not-allowed; }
.ast-page-info { font-size: 12px; color: var(--c-text-3); padding: 0 10px; font-weight: 600; white-space: nowrap; }

/* ============================================================
   电脑端布局（≥769px）：宽内容区 + 表格替代卡片
   ============================================================ */
@media (min-width: 769px) {
    .ast-title { font-size: 20px; }
    .ast-wrap { max-width: 960px; padding: 24px 16px 60px; }
    .ast-topbar-inner { max-width: 960px; }
    .ast-overview { padding: 28px 28px 22px; }
    .ast-overview-num { font-size: 44px; }
    .ast-overview-meta { gap: 36px; }

    /* 移动端卡片列表隐藏，表格显示 */
    .ast-mobile-list { display: none; }
    .ast-pc-card { display: block; }
}

/* ============================================================
   暗黑模式
   ============================================================ */
html[data-theme="dark"] .ast-topbar { background: var(--c-surface); border-bottom-color: var(--c-border); }
html[data-theme="dark"] .ast-back { background: var(--c-bg-2); color: var(--c-text-2); }
html[data-theme="dark"] .ast-back:hover { background: rgba(24,144,255,.12); color: #40a9ff; }
html[data-theme="dark"] .ast-title { color: var(--c-text); }

html[data-theme="dark"] .ast-overview {
    background: linear-gradient(135deg, var(--c-surface) 0%, rgba(24,144,255,.08) 100%);
    border-color: var(--c-border);
}
html[data-theme="dark"] .ast-overview::after { background: rgba(24,144,255,.08); }
html[data-theme="dark"] .ast-overview-label { color: var(--c-text-3); }
html[data-theme="dark"] .ast-overview-num { color: #40a9ff; }
html[data-theme="dark"] .ast-overview-num small { color: var(--c-text-3); }
html[data-theme="dark"] .ast-overview-meta { color: var(--c-text-3); border-top-color: var(--c-border); }
html[data-theme="dark"] .ast-meta-in b { color: #34d399; }
html[data-theme="dark"] .ast-meta-out b { color: #f87171; }
html[data-theme="dark"] .ast-meta-frozen b { color: #fbbf24; }

html[data-theme="dark"] .ast-section-title { color: var(--c-text); }
html[data-theme="dark"] .ast-section-title i { background: rgba(24,144,255,.15); color: #40a9ff; }
html[data-theme="dark"] .ast-section-title .ast-count { color: var(--c-text-3); }

html[data-theme="dark"] .ast-log-card { background: var(--c-surface); border-color: var(--c-border); }
html[data-theme="dark"] .ast-log-reason { color: var(--c-text); }
html[data-theme="dark"] .ast-log-time,
html[data-theme="dark"] .ast-log-after { color: var(--c-text-3); }
html[data-theme="dark"] .ast-log-frozen { color: #fbbf24; }
html[data-theme="dark"] .ast-type-pill { background: var(--c-bg-2); color: var(--c-text-3); border-color: var(--c-border); }
html[data-theme="dark"] .ast-type-pill.t-sign,
html[data-theme="dark"] .ast-type-pill.t-recharge,
html[data-theme="dark"] .ast-type-pill.t-refund,
html[data-theme="dark"] .ast-type-pill.t-game_reward,
html[data-theme="dark"] .ast-type-pill.t-sign_milestone,
html[data-theme="dark"] .ast-type-pill.t-register,
html[data-theme="dark"] .ast-type-pill.t-admin_gift,
html[data-theme="dark"] .ast-type-pill.t-lottery_guess_reopen { background: rgba(52,211,153,.15); color: #34d399; }
html[data-theme="dark"] .ast-type-pill.t-consume,
html[data-theme="dark"] .ast-type-pill.t-game_play,
html[data-theme="dark"] .ast-type-pill.t-game_exchange,
html[data-theme="dark"] .ast-type-pill.t-guess,
html[data-theme="dark"] .ast-type-pill.t-lottery_guess,
html[data-theme="dark"] .ast-type-pill.t-shop_exchange,
html[data-theme="dark"] .ast-type-pill.t-sign_makeup,
html[data-theme="dark"] .ast-type-pill.t-pdf_download { background: rgba(248,113,113,.15); color: #f87171; }
html[data-theme="dark"] .ast-type-pill.t-mall_order,
html[data-theme="dark"] .ast-type-pill.t-mall_refund,
html[data-theme="dark"] .ast-type-pill.t-mall_pay_reward { background: rgba(139,92,246,.18); color: #a78bfa; }

html[data-theme="dark"] .ast-pc-card { background: var(--c-surface); border-color: var(--c-border); }
html[data-theme="dark"] .ast-table thead th { background: var(--c-bg-2); color: var(--c-text-3); border-bottom-color: var(--c-border); }
html[data-theme="dark"] .ast-table tbody td { border-bottom-color: var(--c-border); color: var(--c-text-2); }
html[data-theme="dark"] .ast-table tbody tr:hover { background: rgba(24,144,255,.08); }
html[data-theme="dark"] .ast-table .col-amt.plus { color: #34d399; }
html[data-theme="dark"] .ast-table .col-amt.minus { color: #f87171; }
html[data-theme="dark"] .ast-table .col-reason { color: var(--c-text); }

html[data-theme="dark"] .ast-empty { color: var(--c-text-3); }
html[data-theme="dark"] .ast-page-btn { background: var(--c-surface); color: var(--c-text-2); border-color: var(--c-border); }
html[data-theme="dark"] .ast-page-btn:hover:not(.disabled):not(.active) { background: rgba(24,144,255,.12); color: #40a9ff; border-color: transparent; }
html[data-theme="dark"] .ast-page-info { color: var(--c-text-3); }