/*
 * SaaSShop Admin Components
 * 说明：用于承接 Blade 中零散的 inline style，便于后续统一美化与治理。
 *
 * 美化方向：Ant Design Pro 风格（规整、企业中后台范式）
 */

/* Toast（渐进增强：配合 admin.js 展示更友好的反馈提示） */
.toast-container{
    position:fixed;
    top:16px;
    right:16px;
    z-index:999;
    display:flex;
    flex-direction:column;
    gap:10px;
    width:min(420px, calc(100vw - 32px));
}

.toast{
    background:var(--adm-bg-container, #ffffff);
    border:1px solid var(--adm-border-color, #e5e7eb);
    border-left-width:4px;
    border-radius:var(--adm-radius, 12px);
    padding:12px 12px;
    color:var(--adm-text, #0f172a);
    box-shadow:var(--adm-shadow-popover);
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:12px;
}

.toast-success{border-left-color:var(--adm-success, #16a34a);}
.toast-warning{border-left-color:var(--adm-warning, #f59e0b);}
.toast-error{border-left-color:var(--adm-error, #ef4444);}

.toast-content{
    font-size:13px;
    line-height:1.45;
    word-break:break-word;
}

.toast-close{
    appearance:none;
    border:none;
    background:transparent;
    color:var(--adm-text-muted, #94a3b8);
    font-size:18px;
    line-height:1;
    cursor:pointer;
    padding:2px 6px;
    border-radius:8px;
}

.toast-close:hover{
    background:var(--adm-primary-tint-08, rgba(22, 119, 255, .08));
    color:var(--adm-text, #0f172a);
}

.form-inline-row{
    display:flex;
    align-items:center;
    gap:8px;
}

.text-danger{
    color:#b42318;
}

/* 平台订单：退款状态治理区块 */
.refund-governance-block{
    margin-top:12px;
    border:1px dashed var(--adm-error-border-strong, rgba(239, 68, 68, .45));
    background:var(--adm-error-bg, #fef2f2);
}

.refund-governance-title{
    margin-bottom:6px;
}

.refund-governance-meta{
    margin-bottom:8px;
}

/* 平台订单：治理提示块（用于 BMPA / 同步订阅 等动作前的安全阀说明） */
.governance-block{
    margin-top:10px;
    width:100%;
    border:1px solid var(--adm-error-border-soft, rgba(239, 68, 68, .25));
    background:var(--adm-error-bg, #fef2f2);
}

.governance-block-title{
    margin:0;
}

.governance-block-body{
    margin-top:6px;
    font-size:12px;
    line-height:1.5;
}

/* 可复用：治理提示块内的说明/脚注文本 */
.governance-block-footnote{
    margin-top:6px;
    font-size:12px;
    line-height:1.5;
}

/* 可复用：折叠面板（参考 Ant Design Pro 的筛选区交互：可折叠、摘要做成一条可点 Header） */

/* 可复用：Filters Card（平台订单/订阅等列表页共用：统一筛选区观感） */
.filters-card{
    padding:0;
}

.filters-summary{
    padding:14px 16px;
}

.filters-body{
    padding:14px 16px 16px;
    border-top:1px solid var(--adm-border-color, #e5e7eb);
}

.filters-grid{
    margin:0;
}

/* 可复用：List Card（列表页统一卡片：标题区/操作区/表格区） */
.list-card{
    padding:0;
}

/* 可复用：Pagination（中后台分页，参考 Ant Design Pro） */
.adm-pagination{
    margin-top:16px;
}

/* 强制去掉分页区域下划线：避免被全局 a:hover{text-decoration:underline;} 影响 */
.adm-pagination a,
.adm-pagination a:hover,
.adm-pagination a:focus,
.adm-pagination a:active{
    text-decoration:none !important;
}

.adm-pagination-inner{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    flex-wrap:wrap;
}

.adm-page-list{
    display:flex;
    align-items:center;
    gap:6px;
    flex-wrap:wrap;
}

.adm-page-btn,
.adm-page-num,
.adm-page-ellipsis{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-width:32px;
    height:32px;
    padding:0 10px;
    border-radius:10px;
    border:1px solid var(--adm-border-color, #e5e7eb);
    background:var(--adm-bg-container, #ffffff);
    color:var(--adm-text, #0f172a);
    text-decoration:none;
    box-shadow:var(--adm-shadow-sm);
}

.adm-page-ellipsis{
    border-color:transparent;
    background:transparent;
    box-shadow:none;
    min-width:auto;
    padding:0 6px;
    color:var(--adm-text-muted, #94a3b8);
}

.adm-page-num.is-active{
    border-color:var(--adm-primary-border-45, rgba(22, 119, 255, .45));
    background:var(--adm-primary-tint-08, rgba(22, 119, 255, .08));
    color:var(--adm-text, #0f172a);
    font-weight:700;
}

.adm-page-btn:hover,
.adm-page-num:hover{
    text-decoration:none;
    border-color:var(--adm-primary-border-35, rgba(22, 119, 255, .35));
    background:var(--adm-primary-tint-06, rgba(22, 119, 255, .06));
}

.adm-page-btn.is-disabled{
    opacity:.55;
    cursor:not-allowed;
}

.adm-page-meta{
    margin-left:auto;
}

.list-card-header{
    padding:14px 16px;
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:12px;
}

.list-card-title{
    margin:0;
}

.list-card-subtitle{
    margin-top:6px;
}

.list-card-body{
    border-top:1px solid var(--adm-border-color, #e5e7eb);
    padding:0;
    overflow:hidden;
}

.list-card-table{
    margin:0;
    border-collapse:separate;
    border-spacing:0;
}

.list-card-table tbody tr:last-child td{
    border-bottom:none;
}

.list-card-table th,
.list-card-table td{
    padding:12px 12px;
}

.list-card-table thead th{
    background:var(--adm-table-header-bg, #fafafa);
}

.list-card-table tbody tr:hover td{
    background:var(--adm-table-row-hover-bg, rgba(22, 119, 255, .04));
}

.list-card-table .table-empty{
    padding:24px 12px;
    text-align:center;
    background:var(--adm-surface-tint);
}

/* 可复用：PageHeader（参考 Ant Design Pro：标题区 + 描述 + 右侧操作区） */
.page-header{
    width:100%;
    padding:16px;
    border:1px solid var(--adm-border-color, #e5e7eb);
    border-radius:var(--adm-radius, 12px);
    background:var(--adm-bg-container, #ffffff);
}

.page-header-main{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:12px;
}

.page-header-title{
    font-size:18px;
    font-weight:700;
    color:var(--adm-text, #0f172a);
    line-height:1.2;
}

.page-header-subtitle{
    margin-top:6px;
    font-size:13px;
    color:var(--adm-text-secondary, #64748b);
    line-height:1.45;
}

.page-header-actions{
    display:flex;
    align-items:center;
    gap:10px;
    flex-wrap:wrap;
}

.page-header-meta{
    margin-top:12px;
    display:flex;
    flex-wrap:wrap;
    gap:12px;
    color:var(--adm-text-secondary, #64748b);
    font-size:12px;
}

/* 可复用：KPI 卡片栅格（参考 Ant Design Pro Analysis：第一行 4 个等宽卡片） */

/* 可复用：迷你图表/排行/占比（渐进增强：由 admin.js 渲染，页面无 JS 时为空但不影响表格） */
.adm-mini-chart,
.adm-mini-rank,
.adm-mini-share{
    margin-top:10px;
    width:100%;
    padding:10px 10px;
    border:1px solid var(--adm-border-color, #e5e7eb);
    border-radius:var(--adm-radius, 12px);
    background:var(--adm-surface-tint);
    box-shadow:var(--adm-shadow-sm);
}

/* 迷你图表的摘要行（用于展示合计/峰值等口径，参考 Ant Design Pro 的 card extra/meta 文案） */
.adm-mini-meta{
    margin-top:8px;
    display:flex;
    flex-wrap:wrap;
    gap:6px;
    align-items:center;
    color:var(--adm-text-secondary, #64748b);
    font-size:12px;
}

.adm-mini-meta-item strong{
    color:var(--adm-text, #0f172a);
}

.adm-mini-meta-sep{
    color:var(--adm-text-muted, #94a3b8);
}

.adm-mini-chart.is-empty,
.adm-mini-rank.is-empty,
.adm-mini-share.is-empty{
    align-items:center;
    justify-content:center;
    color:var(--adm-text-muted, #94a3b8);
    font-size:12px;
}

.adm-mini-chart{
    /* 高度加大：避免 bar 与容器 padding/边框挤压，提升可读性 */
    height:110px;
    display:flex;
    align-items:flex-end;
    gap:8px;
}

.adm-mini-chart-bar{
    flex:1;
    min-width:0;
    height:10px;
    border-radius:10px 10px 4px 4px;
    border:1px solid var(--adm-primary-border-35, rgba(22, 119, 255, .35));
    background:var(--adm-primary-tint-08, rgba(22, 119, 255, .08));
    position:relative;
    overflow:hidden;
}

.adm-mini-chart-bar::after{
    content:"";
    position:absolute;
    inset:0;
    background:linear-gradient(180deg, rgba(22, 119, 255, .22), rgba(22, 119, 255, .04));
}

.adm-mini-chart-bar:hover{
    border-color:var(--adm-primary-border-45, rgba(22, 119, 255, .45));
    background:var(--adm-primary-tint-06, rgba(22, 119, 255, .06));
}

/* 趋势迷你图：bar 可点击（JS 渐进增强把 bar 渲染为 <a>） */
.adm-mini-chart-bar-link{
    display:block;
    cursor:pointer;
    text-decoration:none;
}

.adm-mini-chart-bar-link:hover{
    text-decoration:none;
}

/* 可复用：迷你排行（渐进增强：由 admin.js 渲染，页面无 JS 时为空但不影响表格） */
.adm-mini-rank{
    display:flex;
    flex-direction:column;
    gap:8px;
}

.adm-mini-rank-row{
    display:flex;
    align-items:center;
    gap:10px;
}

/* 迷你排行：整行可点击（JS 渐进增强把 row 渲染为 <a>） */
.adm-mini-rank-row-link{
    color:inherit;
    text-decoration:none;
    border-radius:10px;
    padding:2px 4px;
}

.adm-mini-rank-row-link:hover{
    background:var(--adm-primary-tint-06, rgba(22, 119, 255, .06));
    text-decoration:none;
}

/* 迷你占比：整行可点击（JS 渐进增强把 row 渲染为 <a>） */
.adm-mini-share-row-link{
    display:flex;
    align-items:center;
    gap:10px;
    color:inherit;
    text-decoration:none;
    border-radius:10px;
    padding:2px 4px;
}

.adm-mini-share-row-link:hover{
    background:var(--adm-primary-tint-06, rgba(22, 119, 255, .06));
    text-decoration:none;
}

.adm-mini-rank-name{
    width:72px;
    min-width:72px;
    max-width:72px;
    font-size:12px;
    color:var(--adm-text-secondary, #64748b);
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
}

.adm-mini-rank-bar-wrap{
    flex:1;
    min-width:0;
    height:12px;
    border-radius:999px;
    background:rgba(15, 23, 42, .06);
    overflow:hidden;
}

.adm-mini-rank-bar{
    height:100%;
    border-radius:999px;
    background:linear-gradient(90deg, rgba(22, 119, 255, .55), rgba(22, 119, 255, .18));
}

.adm-mini-rank-value{
    width:92px;
    min-width:92px;
    text-align:right;
    font-size:12px;
    color:var(--adm-text, #0f172a);
}

/* 可复用：迷你占比（Top5）（渐进增强：由 admin.js 渲染，页面无 JS 时为空但不影响表格） */
.adm-mini-share{
    display:flex;
    flex-direction:column;
    gap:8px;
}

.adm-mini-share-row{
    display:flex;
    align-items:center;
    gap:10px;
}

.adm-mini-share-name{
    width:72px;
    min-width:72px;
    max-width:72px;
    font-size:12px;
    color:var(--adm-text-secondary, #64748b);
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
}

.adm-mini-share-bar-wrap{
    flex:1;
    min-width:0;
    height:12px;
    border-radius:999px;
    background:rgba(15, 23, 42, .06);
    overflow:hidden;
}

.adm-mini-share-bar{
    height:100%;
    border-radius:999px;
    background:linear-gradient(90deg, rgba(245, 158, 11, .45), rgba(245, 158, 11, .16));
}

.adm-mini-share-value{
    width:92px;
    min-width:92px;
    text-align:right;
    font-size:12px;
    color:var(--adm-text, #0f172a);
}

.kpi-grid{
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:12px;
    align-items:stretch; /* 关键：保证同一行 KPI 卡片等高 */
}

/*
 * 重要：admin-base.css 有全局规则 `.card + .card{margin-top:20px;}` 用于“纵向堆叠卡片”。
 * 但在 grid（KPI / two-col 等）里会导致“第二张卡片整体下沉”，出现你看到的“站点在中间、其它在底部”的错位。
 * 因此：在 KPI grid 场景显式清零 margin-top。
 */
.kpi-grid .card{
    margin-top:0;
}

/* KPI 卡片：统一为竖向 flex，保证标题/数值/脚注布局稳定且等高 */
.kpi-grid .card{
    display:flex;
    flex-direction:column;
    height:100%;
}
.kpi-grid .stat-card-footnote{
    margin-top:auto; /* 把脚注推到底部，进一步锁定等高视觉 */
}

/* Dashboard 两列卡片：同样清理“纵向堆叠 margin-top”对 grid 的干扰，确保“趋势/排行/工作台/定位/最近订单/占比”顶边对齐 */
.two-col .card{
    margin-top:0;
}

/* 通用：所有 grid 容器内的卡片，都应清理 `.card + .card{margin-top:20px;}` 的纵向堆叠规则。
 * 否则会出现“同一行/同一网格里的第2张卡开始整体下沉”的错位。
 */
.grid > .card,
.grid-2 > .card,
.grid-3 > .card,
.grid-4 > .card,
.grid-5 > .card,
.grid-6 > .card{
    margin-top:0;
}

@media (max-width: 1024px){
    .kpi-grid{
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width: 640px){
    .kpi-grid{
        grid-template-columns:1fr;
    }
}

.stat-card-title{
    font-size:12px;
    color:var(--adm-text-secondary, #64748b);
}

.stat-card-value{
    margin-top:10px;
    font-size:22px;
    font-weight:800;
    color:var(--adm-text, #0f172a);
    letter-spacing:.2px;
}

.stat-card-footnote{
    margin-top:8px;
    font-size:12px;
    color:var(--adm-text-muted, #94a3b8);
}

.collapsible > summary{
    list-style:none;
    cursor:pointer;
}

.collapsible > summary::-webkit-details-marker{
    display:none;
}

.collapsible-summary{
    user-select:none;
}

.collapsible-body{
    margin-top:10px;
}

/* 平台订单：工具区（两列分组卡片化，避免表单散落） */
.tool-grid{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:12px;
    align-items:stretch;
}

/* 工具区：统一“被治理阻断”提示样式（避免 Blade 内散落的 class 组合） */
.adm-tool-blocked-hint{
    margin-top:6px;
    font-size:12px;
    line-height:1.5;
    color:var(--adm-error, #ef4444);
}

/* 工具区：按钮被禁用时的“软提示”视觉（更像 Ant Design Pro 的 disabled + hint 组合） */
.tool-group button[disabled]{
    opacity:.55;
    cursor:not-allowed;
}
.tool-group button[disabled] + .adm-tool-blocked-hint{
    color:var(--adm-text-muted, #94a3b8);
}

/* 防止 focus-box（border） + 内部 form 宽度造成列间“压线/重叠” */
.tool-grid > *{
    min-width:0;
}

@media (max-width: 768px){
    .tool-grid{
        grid-template-columns:1fr;
    }
}

.tool-group{
    width:100%;
    height:100%;
    display:flex;
    flex-direction:column;
}

.tool-group-title{
    font-size:12px;
    color:#94a3b8;
    text-transform:uppercase;
    letter-spacing:.08em;
    font-weight:700;
    margin:0 0 10px;
}

.tool-group-subtitle{
    margin:0 0 6px;
}

/* 平台订单列表：避免列太多导致内容挤压成“竖排/断字” */
.table-wrap{
    width:100%;
    overflow-x:auto;
}

.table-wrap table.platform-orders-table{
    min-width:1600px;
}

/* 平台订单列表：根据视图控制 min-width（精简视图更紧凑，full 视图更宽） */
.platform-orders-table.is-compact{
    min-width:1400px;
}

.platform-orders-table.is-full{
    min-width:2000px;
}

.table-nowrap th,
.table-nowrap td{
    white-space:nowrap;
    word-break:normal;
}

/* 平台订单列表：精简视图（默认隐藏部分列，避免列表过长） */
.platform-orders-table .col-optional{
    display:none;
}

.platform-orders-table.is-full .col-optional{
    display:table-cell;
}

/* 平台订单列表（精简视图）：进一步收敛信息密度 */
.platform-orders-table.is-compact td{
    padding-top:8px;
    padding-bottom:8px;
}

.platform-orders-table.is-compact .muted-xs{
    font-size:12px;
}

/* 平台订单列表：二行辅助信息（例如 线索/订阅ID） */
.platform-orders-table .row-meta{
    margin-top:2px;
}

/* 平台订单列表：行内治理提示（精简视图主要入口） */
.platform-orders-table .row-warn,
[data-page="admin.dashboard"] .row-warn{
    margin-top:4px;
    padding:4px 6px;
    border-left:3px solid var(--adm-error, #ef4444);
    background:var(--adm-error-bg, #fef2f2);
    border-radius:4px;
    cursor:help;
}

.platform-orders-table .row-warn a.link,
[data-page="admin.dashboard"] .row-warn a.link{
    color:var(--adm-error, #ef4444);
    text-decoration:underline;
}

.platform-orders-table .row-warn a.link:hover,
[data-page="admin.dashboard"] .row-warn a.link:hover{
    text-decoration:none;
}

.platform-orders-table .row-warn-prefix,
[data-page="admin.dashboard"] .row-warn-prefix{
    font-weight:600;
    display:inline-block;
    padding:1px 6px;
    border-radius:10px;
    background:var(--adm-error-tint, rgba(239, 68, 68, .12));
    color:var(--adm-error, #ef4444);
    margin-right:4px;
}

/* 仪表盘最近订单：扫描信息行（用于快速判断治理状态，不替代下方治理提示入口） */
[data-page="admin.dashboard"] .adm-order-scanline{
    margin-top:3px;
    line-height:1.4;
}

[data-page="admin.dashboard"] .adm-order-scanitem strong{
    font-weight:700;
}

[data-page="admin.dashboard"] .adm-order-scansep{
    color:var(--adm-text-muted, #94a3b8);
    padding:0 2px;
}

/* 平台订单详情页：锚点直达高亮（从仪表盘/集合跳转时更清晰） */
#relation-subscription:target,
#sync-failed:target,
#bmpa-failed:target,
#payment-receipts:target,
#add-payment-receipt:target,
#refund-receipts:target,
#add-refund-receipt:target{
    scroll-margin-top:90px;
    box-shadow:0 0 0 3px var(--adm-primary-focus-ring, rgba(22, 119, 255, .12)), var(--adm-shadow-sm, 0 1px 2px rgba(15, 23, 42, 0.06));
}

/* 平台订单列表：精简视图也要可达的治理提示（对账/退款不一致） */
.platform-orders-table .governance-hints{
    margin-bottom:6px;
}

.platform-orders-table .governance-hint{
    line-height:1.4;
}

/* 总台管理：顶部导航（顶部主菜单保留，但视觉对齐 Ant Design Pro Header） */
.sidebar.topnav{
    white-space:normal;
    overflow-x:visible;
    background:var(--adm-bg-header, #ffffff);
    border-bottom:1px solid var(--adm-border-color, #e5e7eb);
    box-shadow:var(--adm-shadow-header, none);
}

.topnav-row{
    display:flex;
    align-items:center;
    gap:16px;
    flex-wrap:wrap;
}

.topnav-brand{
    display:inline-flex;
    align-items:center;
    font-weight:800;
    color:var(--adm-text, #0f172a);
    padding:8px 10px;
    border-radius:var(--adm-radius-sm, 10px);
}

.topnav-brand:hover{
    text-decoration:none;
    background:var(--adm-primary-tint-08, rgba(22, 119, 255, .08));
}

.topnav-menu{
    display:flex;
    align-items:center;
    gap:8px;
    flex:1;
    flex-wrap:wrap;
}

.topnav-link,
.topnav-summary{
    display:inline-flex;
    align-items:center;
    gap:6px;
    padding:8px 10px;
    border-radius:var(--adm-radius-sm, 10px);
    color:var(--adm-text-secondary, #64748b);
}

.topnav-link:hover,
.topnav-summary:hover{
    text-decoration:none;
    background:var(--adm-primary-tint-08, rgba(22, 119, 255, .08));
    color:var(--adm-text, #0f172a);
}

.topnav-item{
    position:relative;
}

.topnav-item > summary::-webkit-details-marker{
    display:none;
}

.topnav-item > summary{
    list-style:none;
    cursor:pointer;
    user-select:none;
}

.topnav-dropdown{
    position:absolute;
    top:calc(100% + 8px);
    left:0;
    min-width:180px;
    background:var(--adm-bg-container, #ffffff);
    border:1px solid var(--adm-border-color, #e5e7eb);
    border-radius:var(--adm-radius, 12px);
    padding:10px;
    box-shadow:var(--adm-shadow-popover);
    z-index:100;
}

/* details 未展开时不展示下拉 */
.topnav-item:not([open]) .topnav-dropdown{
    display:none;
}

.topnav-sub{
    display:block;
    padding:9px 10px;
    border-radius:var(--adm-radius-sm, 10px);
    color:var(--adm-text, #0f172a);
    margin:0;
}

.topnav-sub:hover{
    text-decoration:none;
    background:var(--adm-primary-tint-08, rgba(22, 119, 255, .08));
}

.topnav-actions{
    display:flex;
    align-items:center;
    gap:10px;
}

.topnav-meta{
    margin-top:6px;
}

/* 移动端：下拉改为文档流（避免 absolute 导致溢出） */
@media (max-width: 768px){
    .topnav-row{gap:10px;}
    .topnav-dropdown{
        position:static;
        min-width:auto;
        box-shadow:none;
        margin-top:6px;
    }
}

/* 兼容：旧的左侧导航二级分组样式（保留但不再作为主形态） */
.sidebar .nav-group{
    margin:10px 0;
}

.sidebar .nav-group-title{
    cursor:pointer;
    user-select:none;
    color:#94a3b8;
    font-size:12px;
    text-transform:uppercase;
    letter-spacing:.08em;
    font-weight:700;
    margin:0 0 6px;
    list-style:none;
}

.sidebar .nav-group summary::-webkit-details-marker{
    display:none;
}

.sidebar .nav-item--sub{
    display:block;
    padding-left:12px;
}