/* 经营看板 & 门店管理 通用样式（配合 ui-kit 变量） */
.mr-board { --bd-gap: 14px; }

.board-head {
    display: flex; justify-content: space-between; align-items: flex-end;
    gap: 16px; flex-wrap: wrap; margin-bottom: 16px;
}
.board-title { font-size: 20px; font-weight: 700; color: var(--mr-ink); letter-spacing: .01em; display: flex; align-items: center; gap: 10px; }
.board-title .board-date { font-size: 12.5px; color: var(--mr-muted); font-weight: 500; }
.board-sub { font-size: 12.5px; color: var(--mr-muted); margin-top: 5px; }
.board-tools { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.board-tools .chip {
    height: 32px; padding: 0 13px; border-radius: 8px;
    border: 1px solid var(--mr-line); background: #fff; color: #5A6778;
    font-size: 12.5px; text-decoration: none; display: inline-flex; align-items: center; gap: 4px;
    transition: .15s;
}
.board-tools .chip:hover { border-color: var(--mr-brand-line); color: var(--mr-brand-dark); background: #F7FBFA; }
.board-tools .chip.on { background: var(--mr-brand-soft); border-color: var(--mr-brand-line); color: var(--mr-brand-dark); font-weight: 600; }
.board-tools input[type="date"] { height: 32px; font-size: 12.5px; border-radius: 8px; }

/* 12 栅格 */
.board-grid { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: var(--bd-gap); }
.span-2 { grid-column: span 2; }
.span-3 { grid-column: span 3; } .span-4 { grid-column: span 4; }
.span-5 { grid-column: span 5; } .span-6 { grid-column: span 6; }
.span-7 { grid-column: span 7; } .span-8 { grid-column: span 8; }
.span-9 { grid-column: span 9; } .span-12 { grid-column: span 12; }

@media (max-width: 1199.98px) {
    .span-2 { grid-column: span 3; }
    .span-3, .span-4, .span-5, .span-7 { grid-column: span 6; }
    .span-8, .span-9 { grid-column: span 12; }
}
@media (max-width: 991.98px) {
    .span-2 { grid-column: span 4; }
    .span-3, .span-4, .span-5, .span-6, .span-7 { grid-column: span 6; }
}
@media (max-width: 575.98px) {
    .board-grid > * { grid-column: span 12 !important; }
}

/* KPI */
.kpi {
    position: relative; background: #fff; border: 1px solid var(--mr-line);
    border-radius: 12px; padding: 15px 16px 13px; overflow: hidden; min-width: 0;
}
.kpi::after {
    content: ''; position: absolute; right: -26px; top: -30px; width: 92px; height: 92px;
    border-radius: 50%; background: var(--mr-brand-soft); opacity: .8;
}
.kpi.amber::after { background: #FBF2E2; }
.kpi.blue::after { background: #EDF2FB; }
.kpi.rose::after { background: #FDEDEC; }
.kpi.gray::after { background: #F1F4F8; }
.kpi-top { position: relative; z-index: 1; display: flex; justify-content: space-between; align-items: center; }
.kpi-label { font-size: 12.5px; color: var(--mr-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.kpi-ico { font-size: 15px; color: var(--mr-brand); }
.kpi.amber .kpi-ico { color: #B07A16; }
.kpi.blue .kpi-ico { color: #3B6FD9; }
.kpi.rose .kpi-ico { color: #C0392B; }
.kpi.gray .kpi-ico { color: #7A8798; }
.kpi-value {
    position: relative; z-index: 1; font-size: 26px; font-weight: 700; color: var(--mr-ink);
    letter-spacing: -.015em; line-height: 1.15; margin-top: 7px;
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
@media (max-width: 1199.98px) { .kpi-value { font-size: 21px; } }
.kpi-value small { font-size: 13px; font-weight: 500; color: var(--mr-muted); margin-left: 3px; }
.kpi-foot {
    position: relative; z-index: 1; margin-top: 7px; font-size: 12px; color: var(--mr-muted);
    display: flex; align-items: center; gap: 6px; flex-wrap: wrap;
}
.delta {
    display: inline-flex; align-items: center; gap: 1px; font-weight: 600;
    padding: 1px 6px; border-radius: 5px; font-size: 11.5px;
}
.delta.up { color: #14804A; background: #E9F7EF; }
.delta.down { color: #C0392B; background: #FDECEA; }
.delta.flat { color: #7A8798; background: #F1F4F8; }

/* 卡片 */
.board-card {
    background: #fff; border: 1px solid var(--mr-line); border-radius: 12px;
    padding: 15px 18px 16px; min-width: 0;
    display: flex; flex-direction: column;
}
.board-card-hd { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 8px; }
.board-card-hd h6 {
    margin: 0; font-size: 13.5px; font-weight: 600; color: var(--mr-ink);
    display: flex; align-items: center; gap: 7px;
}
.board-card-hd h6 i { color: var(--mr-brand); font-size: 14px; }
.board-card-hd .more { font-size: 12px; color: var(--mr-muted); text-decoration: none; white-space: nowrap; }
.board-card-hd .more:hover { color: var(--mr-brand); }
.board-card-hd .tag { font-size: 11.5px; color: var(--mr-muted); background: #F5F7FA; border-radius: 6px; padding: 2px 7px; white-space: nowrap; flex: 0 0 auto; }

.chart-box { width: 100%; flex: 1 1 auto; min-height: 140px; }
.chart-box.mini { min-height: 112px; }

/* 排行 / 迷你列表 */
.mini-list { list-style: none; margin: 0; padding: 0; }
.mini-list li {
    display: flex; align-items: center; gap: 9px;
    padding: 7px 0; border-bottom: 1px dashed var(--mr-line-soft); font-size: 13px; min-width: 0;
}
.mini-list li:last-child { border-bottom: 0; }
.mini-list .rank-no {
    width: 20px; height: 20px; border-radius: 6px; background: #F1F4F8; color: #7A8798;
    display: flex; align-items: center; justify-content: center; font-size: 11px; font-weight: 700; flex: 0 0 20px;
}
.mini-list .rank-no.top1 { background: #FDECEA; color: #C0392B; }
.mini-list .rank-no.top2 { background: #FBF2E2; color: #B07A16; }
.mini-list .rank-no.top3 { background: #EAF4EF; color: #14804A; }
.mini-list .nm { flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: #3C4A5A; }
.mini-list .sub { color: var(--mr-muted); font-size: 11.5px; }
.mini-list .amt { flex: 0 0 auto; font-size: 12.5px; font-weight: 600; color: var(--mr-ink); }
.bar-line { flex: 1 1 auto; height: 6px; border-radius: 4px; background: #F1F4F8; overflow: hidden; min-width: 24px; }
.bar-line > i { display: block; height: 100%; border-radius: 4px; background: var(--mr-brand); }
.bar-line > i.gold { background: linear-gradient(90deg, #C9A25E, #BE9A57); }
.empty-tip { color: #98A3B3; font-size: 12.5px; padding: 14px 0; text-align: center; }

/* 待办 */
.todo-row { display: flex; align-items: center; gap: 10px; padding: 8px 0; border-bottom: 1px dashed var(--mr-line-soft); font-size: 13px; }
.todo-row:last-child { border-bottom: 0; }
.todo-badge {
    flex: 0 0 auto; min-width: 38px; height: 22px; padding: 0 7px; border-radius: 6px;
    display: inline-flex; align-items: center; justify-content: center;
    font-size: 12px; font-weight: 600; background: var(--mr-brand-soft); color: var(--mr-brand-dark);
}
.todo-badge.warn { background: #FBF2E2; color: #A9740F; }
.todo-badge.danger { background: #FDECEA; color: #C0392B; }
.todo-badge.muted { background: #F1F4F8; color: #7A8798; }
.todo-main { flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.todo-main b { color: var(--mr-ink); font-weight: 600; }
.todo-main .sub { color: var(--mr-muted); font-size: 11.5px; margin-left: 6px; }

/* 表格 */
.board-table { width: 100%; font-size: 12.5px; margin: 0; }
.board-table thead th {
    color: var(--mr-muted); font-weight: 600; font-size: 12px;
    border-bottom: 1px solid var(--mr-line-soft); padding: 8px 8px;
}
.board-table tbody td { padding: 9px 8px; border-bottom: 1px dashed var(--mr-line-soft); color: #3C4A5A; vertical-align: middle; }
.board-table tbody tr:last-child td { border-bottom: 0; }
.board-table .num { text-align: right; font-variant-numeric: tabular-nums; }

/* 顶栏「开分店」入口 */
.erp-shop-add {
    display: inline-flex; align-items: center; gap: 4px;
    height: 28px; padding: 0 11px; border-radius: 7px;
    background: var(--mr-brand-soft); color: var(--mr-brand-dark) !important;
    font-size: 12.5px; font-weight: 600; text-decoration: none;
    border: 1px solid var(--mr-brand-line);
}
.erp-shop-add:hover { background: var(--mr-brand); color: #fff !important; border-color: var(--mr-brand); }

/* ==================== 门店管理 ==================== */
.shop-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
@media (max-width: 1199.98px) { .shop-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 767.98px) { .shop-grid { grid-template-columns: 1fr; } }

.shop-card {
    background: #fff; border: 1px solid var(--mr-line); border-radius: 14px;
    padding: 17px 18px 15px; position: relative; min-width: 0;
    transition: box-shadow .18s, transform .18s, border-color .18s;
}
.shop-card:hover { box-shadow: 0 16px 34px -20px rgba(15, 23, 42, .3); transform: translateY(-1px); }
.shop-card.current { border-color: var(--mr-brand-line); box-shadow: 0 0 0 1px var(--mr-brand-line) inset; }
.shop-card.off { background: #FAFBFC; }
.shop-card.off .shop-avatar { background: #F1F4F8; color: #98A3B3; }
.shop-card.off .shop-name { color: #7A8798; }

.shop-top { display: flex; align-items: flex-start; gap: 11px; }
.shop-avatar {
    width: 40px; height: 40px; border-radius: 11px; flex: 0 0 40px;
    background: var(--mr-brand-soft); color: var(--mr-brand-dark);
    display: flex; align-items: center; justify-content: center; font-size: 18px;
}
.shop-name { font-size: 15px; font-weight: 650; color: var(--mr-ink); line-height: 1.3; word-break: break-all; }
.shop-badges { margin-top: 3px; display: flex; gap: 5px; flex-wrap: wrap; }
.shop-badges .bd { font-size: 11px; padding: 1px 7px; border-radius: 5px; background: #F1F4F8; color: #7A8798; }
.shop-badges .bd.on { background: var(--mr-brand-soft); color: var(--mr-brand-dark); }
.shop-badges .bd.cur { background: #FBF2E2; color: #A9740F; }
.shop-badges .bd.stop { background: #FDECEA; color: #C0392B; }

.shop-meta { margin-top: 12px; font-size: 12.5px; color: var(--mr-muted); line-height: 1.7; }
.shop-meta i { width: 14px; display: inline-block; color: #AAB4C2; }

.shop-stats { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 4px; margin-top: 12px; }
.shop-stats > div { min-width: 0; }
.shop-stats .lb { font-size: 11.5px; color: var(--mr-muted); }
.shop-stats .vl { font-size: 15px; font-weight: 650; color: var(--mr-ink); line-height: 1.3; }
.shop-stats .vl.money { color: #0E7263; }

.shop-foot { display: flex; gap: 8px; margin-top: 14px; padding-top: 12px; border-top: 1px solid var(--mr-line-soft); }
.shop-foot .btn { height: 30px; font-size: 12.5px; border-radius: 7px; padding: 0 12px; display: inline-flex; align-items: center; gap: 4px; }

.shop-summary { display: flex; gap: 26px; flex-wrap: wrap; margin-bottom: 16px; }
.shop-summary .item .lb { font-size: 12.5px; color: var(--mr-muted); }
.shop-summary .item .vl { font-size: 22px; font-weight: 700; color: var(--mr-ink); line-height: 1.3; }
.shop-summary .item .vl small { font-size: 12px; font-weight: 500; color: var(--mr-muted); }