/* =====================================================================
ChangkeERP V0.4 — 按评审原型 V0.3 重构
设计变量与全局框架 / 通用组件
===================================================================== */
:root{
--teal:#009e95; --teal-600:#00877f; --teal-050:#e6f6f4; --teal-025:#f2faf9;
--red:#e5484d; --red-050:#fdedec;
--amber:#e6a23c; --amber-050:#fdf3e5;
--gold:#d9b84a; --steel:#5ba1c0;
--ink:#20262c; --tx2:#5d6873; --tx3:#98a2ab;
--line:#e7eaee; --line2:#eef1f4;
--bg:#f2f4f6; --card:#ffffff;
--dark:#1c212a; --dark2:#232a35; --dark3:#3d4f63;
--radius:10px; --sh:0 1px 2px rgba(20,28,38,.04);
}
*{box-sizing:border-box;margin:0;padding:0}
/* Language controls are available before login and remain visible in the application header. */
.language-control,.auth-language{display:flex;align-items:center;gap:8px;font-size:12px;color:var(--tx2)}
.language-select{min-width:122px;max-width:160px;height:34px}
.auth-language{justify-content:flex-end;margin-bottom:20px;flex-wrap:wrap}
.language-control{flex:none}
.language-control>span,.auth-language>label{white-space:nowrap}
html[lang="vi"] .sidebar{width:250px}
html[lang="vi"] .nav-item{line-height:1.45}
html[lang="vi"] .nav-group-title{line-height:1.4}
html[lang="vi"] .auth-slogan{font-size:30px;line-height:1.35}
html[lang="vi"] .auth-row{gap:10px;flex-wrap:wrap;font-size:12px}
html[lang="vi"] .cfg-head{flex-wrap:wrap;row-gap:10px}
html[lang="vi"] .settings-row{grid-template-columns:190px 1fr}
html[lang="vi"] .auto-note{width:100%;margin-left:0}
html[lang="vi"] .hlnum{margin-inline:.2em}
html[lang="vi"] .sku-img-box.has-img::before,html[lang="vi"] .upload-box.has-img::before{content:'Đổi ảnh'}
html:is([lang="ms"],[lang="fil"]) .sidebar{width:250px}
html:is([lang="ms"],[lang="fil"]) .nav-item,html:is([lang="ms"],[lang="fil"]) .nav-group-title{line-height:1.45}
html:is([lang="ms"],[lang="fil"]) .auth-slogan{font-size:28px;line-height:1.35}
html:is([lang="ms"],[lang="fil"]) .auth-row,html:is([lang="ms"],[lang="fil"]) .cfg-head{flex-wrap:wrap;gap:10px}
html:is([lang="ms"],[lang="fil"]) .settings-row{grid-template-columns:190px 1fr}
html:is([lang="ms"],[lang="fil"]) .auto-note{width:100%;margin-left:0}
html[lang="ms"] .sku-img-box.has-img::before,html[lang="ms"] .upload-box.has-img::before{content:'Tukar gambar'}
html[lang="fil"] .sku-img-box.has-img::before,html[lang="fil"] .upload-box.has-img::before{content:'Palitan'}
@media(max-width:900px){.language-control>span{display:none}.layout .topbar{height:auto;min-height:56px;flex-wrap:wrap;padding-top:8px;padding-bottom:8px}.topbar-right{flex-wrap:wrap}}
html,body{height:100%}
body{
font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Microsoft YaHei","Helvetica Neue",Arial,sans-serif;
font-size:14px;color:var(--ink);background:var(--bg);
-webkit-font-smoothing:antialiased;
}
button{font:inherit;color:inherit;border:none;background:none;cursor:pointer}
input,select,textarea{font:inherit;color:inherit}
a{color:var(--teal);text-decoration:none;cursor:pointer}
img{display:block;max-width:100%}
h1,h2,h3,h4{font-weight:600}
.num{font-variant-numeric:tabular-nums}
/* ============ 应用框架 ============ */
.layout{display:flex;min-height:100vh}
.main{flex:1;min-width:0;display:flex;flex-direction:column}
.content{padding:18px 24px 48px}
.shared-data-status{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 14px;margin-bottom:14px;border:1px solid var(--line);border-radius:8px;background:var(--card);color:var(--tx2);font-size:12px;line-height:1.7}
.shared-data-status[hidden]{display:none}
.shared-data-status.syncing,.data-err.data-pending{background:var(--amber-050);border-color:var(--amber);color:var(--ink)}
.shared-data-status.failed{border-color:var(--amber)}
.view{display:none}
.view.active{display:block}
/* ============ 侧边栏 ============ */
.sidebar{
width:214px;flex:none;background:var(--card);
border-right:1px solid var(--line2);
display:flex;flex-direction:column;
position:sticky;top:0;height:100vh;overflow:hidden;
}
.brand{display:flex;align-items:center;gap:10px;padding:18px 16px 14px;flex:none}
.brand-logo{
width:34px;height:34px;border-radius:9px;background:var(--teal);
color:#fff;font-weight:700;font-size:17px;
display:flex;align-items:center;justify-content:center;flex:none;
}
.brand-name{font-size:15.5px;font-weight:700;letter-spacing:.01em}
.brand-sub{font-size:8.5px;color:#b9c0c8;letter-spacing:.16em;margin-top:2px;white-space:nowrap}
.nav{flex:1;min-height:0;padding:2px 10px 10px;overflow-y:auto;overflow-x:hidden;overscroll-behavior-y:contain;scrollbar-width:none;-ms-overflow-style:none}
.nav::-webkit-scrollbar{display:none;width:0;height:0}
.nav-group{margin-top:12px}
.nav-group-title{font-size:12px;color:var(--tx3);padding:6px 10px 4px}
.nav-item{
display:flex;align-items:center;gap:9px;
padding:8px 10px;border-radius:8px;
color:#4a5560;font-size:13.5px;cursor:pointer;
position:relative;user-select:none;
}
.nav-item svg{width:16px;height:16px;flex:none;color:#8b959e}
.nav-item:hover{background:#f5f7f8}
.nav-item.active{background:var(--teal-050);color:var(--teal);font-weight:600}
.nav-item.active svg{color:var(--teal)}
.nav-item.active::before{content:"";position:absolute;left:0;top:7px;bottom:7px;width:3px;border-radius:3px;background:var(--teal)}
.nav-tree-toggle{width:100%;border:0;background:transparent;font:inherit;text-align:left;color:inherit}
.nav-tree-toggle .nav-tree-caret{margin-left:auto;width:13px;height:13px;transition:transform .15s}
.nav-tree-toggle[aria-expanded="true"] .nav-tree-caret{transform:rotate(90deg)}
.nav-tree-children{margin:2px 0 6px 18px;padding-left:10px;border-left:1px solid var(--line)}
.nav-tree-children[hidden],[data-catalog-manage][hidden],.nav-tree-toggle[hidden]{display:none!important}
.nav-tree-children .nav-item{padding-left:15px;min-height:34px}
.nav-tree-children .catalog-sales-icon{display:none}
.nav-tree-children.nav-tree-flat{margin:0;padding:0;border:0}
.nav-tree-flat .nav-item{padding:8px 10px;min-height:0}
.nav-tree-flat .catalog-sales-icon{display:block}
.dialog.catalog-combo-dialog{width:800px;max-width:calc(100vw - 32px)}
.catalog-combo-dialog .dialog-body>*{flex-shrink:0}
.catalog-form-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px 18px}
.catalog-stock-modes{border:0;padding:0;margin:2px 0}
.catalog-stock-modes legend{font-size:14px;font-weight:600;margin-bottom:10px}
.catalog-stock-mode-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.catalog-stock-mode{display:flex;align-items:flex-start;gap:10px;border:1px solid var(--line);border-radius:8px;padding:14px;cursor:pointer}
.catalog-stock-mode:has(input:checked){border-color:var(--teal);background:var(--teal-050)}
.catalog-stock-mode:has(input:disabled){opacity:.55;cursor:not-allowed}
.catalog-stock-mode:focus-within{outline:2px solid var(--teal);outline-offset:2px}
.catalog-stock-mode input{margin-top:3px;accent-color:var(--teal);flex:none}
.catalog-stock-mode strong{display:block;font-size:14px;font-weight:600}
.catalog-stock-mode small{display:block;color:var(--tx2);font-size:12px;line-height:1.6;margin-top:5px}
.catalog-stock-modes .form-tip{margin-top:10px}
.catalog-recipe-head{display:flex;flex-wrap:wrap;align-items:center;gap:12px;margin:8px 0 12px}
.catalog-recipe-head span{font-size:12px;color:var(--tx2)}
.catalog-part-row{display:grid;grid-template-columns:minmax(180px,1fr) 100px 34px;align-items:start;gap:10px;margin-bottom:12px}
.catalog-part-row label{display:block;font-size:12px;color:var(--tx2);margin-bottom:6px}
.catalog-part-row .select,.catalog-part-row .input{width:100%}
.catalog-part-row .btn{margin-top:23px;padding:5px 10px}
.catalog-part-remove[hidden],#catalog-combo-part-add[hidden]{display:none}
.catalog-combo-summary{background:var(--teal-050);color:var(--teal);padding:14px 16px;border-radius:8px;margin:16px 0 10px;font-size:14px;font-weight:600}
.catalog-combo-dialog>#catalog-combo-preview{flex:none;margin:0 20px 14px}
.catalog-preview-title{font-size:12px;margin-bottom:8px}
.catalog-preview-deduction{font-size:16px;line-height:1.7;overflow-wrap:anywhere}
.catalog-preview-stock{font-size:13px;margin-top:10px;font-weight:400}
.catalog-preview-context{font-size:12px;margin-top:8px;font-weight:400;color:var(--tx2);overflow-wrap:anywhere}
.catalog-preview-warning{background:var(--amber-050);color:var(--amber);padding:10px 12px;border-radius:6px;margin-top:12px;font-size:12px;font-weight:400;line-height:1.6}
.catalog-code{font-size:12px;color:var(--tx2);margin-top:4px;overflow-wrap:anywhere}
.catalog-recipe-line{margin:4px 0;overflow-wrap:anywhere}
#view-assortment.ro #as-bulk-drop{display:none!important}
@media(max-width:640px){.catalog-form-grid,.catalog-stock-mode-grid{grid-template-columns:1fr}.catalog-part-row{grid-template-columns:minmax(120px,1fr) 80px 32px}}
.sidebar-foot{margin-top:auto;border-top:1px solid var(--line2);padding:6px 10px 10px;flex:none}
/* ============ 顶栏 ============ */
.topbar{
height:56px;background:var(--card);border-bottom:1px solid var(--line2);
display:flex;align-items:center;gap:14px;padding:0 24px;
position:sticky;top:0;z-index:60;
}
.crumbs{font-size:13px;color:var(--tx3);display:flex;align-items:center;gap:8px}
.crumbs .crumb-cur{color:var(--ink);font-weight:600}
.crumbs .sep{color:#c8ced5}
.topbar-right{margin-left:auto;display:flex;align-items:center;gap:10px}
.user-meta{text-align:right;line-height:1.25}
.user-name{font-size:13px;font-weight:600}
.user-role{font-size:11.5px;color:var(--tx3)}
.avatar{
width:32px;height:32px;border-radius:50%;background:var(--teal);color:#fff;
display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:600;
}
.icon-btn{
width:30px;height:30px;border-radius:8px;display:flex;align-items:center;justify-content:center;
color:#8b959e;cursor:pointer;
}
.icon-btn:hover{background:#f2f4f6;color:var(--ink)}
/* ============ 卡片 ============ */
.card{background:var(--card);border:1px solid var(--line2);border-radius:var(--radius);box-shadow:var(--sh)}
.card-pad{padding:16px 20px}
.card-head{display:flex;align-items:center;gap:12px;padding:14px 20px;border-bottom:1px solid var(--line2)}
.card-title{font-size:15px;font-weight:600}
.card-head .right{margin-left:auto;display:flex;align-items:center;gap:10px}
/* ============ 按钮/链接 ============ */
.btn{
display:inline-flex;align-items:center;justify-content:center;gap:6px;
height:32px;padding:0 14px;border-radius:7px;font-size:13px;
border:1px solid transparent;background:#fff;color:var(--ink);white-space:nowrap;
transition:background .12s,border-color .12s;
}
.btn svg{width:14px;height:14px}
.btn-primary{background:var(--teal);color:#fff}
.btn-primary:hover{background:var(--teal-600)}
.btn-outline{border-color:var(--line);color:#4a5560}
.btn-outline:hover{border-color:#d5dade;background:#fafbfb}
.btn-ghost{color:var(--tx2)}
.btn-ghost:hover{background:#f2f4f6}
.btn-sm{height:27px;padding:0 10px;font-size:12.5px;border-radius:6px}
.btn:disabled{opacity:.5;cursor:not-allowed}
.link{color:var(--teal);font-size:13px}
.link:hover{text-decoration:underline}
.link-danger{color:var(--red);font-size:13px}
.link-danger:hover{text-decoration:underline}
.link-muted{color:var(--tx3);font-size:13px}
.link-muted:hover{color:var(--tx2)}
/* ============ 表单 ============ */
.field{display:flex;flex-direction:column;gap:6px}
.field>label{font-size:13px;font-weight:600;color:var(--ink)}
.field>label .req{color:var(--red);margin-right:3px}
.form-tip{font-size:12px;color:var(--tx3);line-height:1.5;margin-top:-2px}
.input,.select{
height:34px;border:1px solid var(--line);border-radius:7px;background:#fff;
padding:0 11px;font-size:13px;outline:none;width:100%;transition:border-color .12s;
}
.input:focus,.select:focus{border-color:var(--teal);box-shadow:0 0 0 3px rgba(0,158,149,.08)}
.input::placeholder{color:#b3bbc3}
.select{appearance:none;background-image:url("data:image/svg+xml;utf8,");background-repeat:no-repeat;background-position:right 11px center;padding-right:30px}
.input-wrap{position:relative}
.input-wrap .input{padding-right:34px}
.input-eye{position:absolute;right:9px;top:50%;transform:translateY(-50%);color:#9aa4ad;width:20px;height:20px;display:flex;align-items:center;justify-content:center;cursor:pointer}
.captcha-box{position:absolute;right:5px;top:50%;transform:translateY(-50%);cursor:pointer;line-height:0;display:flex}
.captcha-box svg{display:block;border-radius:6px}
.input-eye svg{width:15px;height:15px}
.search{position:relative;width:220px}
.search .input{padding-left:31px}
.search .search-ic{position:absolute;left:10px;top:50%;transform:translateY(-50%);width:14px;height:14px;color:#9aa4ad;pointer-events:none}
.search .search-ic svg{width:14px;height:14px}
/* ============ 表格 ============ */
.table-wrap{overflow-x:auto}
table.table{width:100%;border-collapse:collapse;font-size:13px}
.table th{
background:#f7f8fa;color:#66707a;font-weight:500;
text-align:left;padding:10px 16px;white-space:nowrap;
}
.table td{padding:12px 16px;border-top:1px solid var(--line2);color:#2a3238;vertical-align:middle}
.table tbody tr:hover td{background:#fafbfc}
.table .td-strong{font-weight:600;color:var(--ink)}
.table .th-check,.table .td-check{width:36px;padding-right:0}
.cell-sub{display:block;font-size:12px;color:var(--tx3);margin-top:2px}
/* ============ 分页 ============ */
.pager{display:flex;align-items:center;gap:4px;padding:12px 16px;border-top:1px solid var(--line2);color:var(--tx3);font-size:12.5px}
.pager .pg-info{margin-right:auto}
.pg{min-width:28px;height:28px;padding:0 6px;border-radius:7px;display:flex;align-items:center;justify-content:center;color:#5d6873;font-size:12.5px;cursor:pointer}
.pg:hover{background:#f2f4f6}
.pg.active{background:var(--teal-050);border:1.5px solid var(--teal);color:var(--teal);font-weight:600}
.pg.dots{pointer-events:none}
.pager .pg-size{display:flex;align-items:center;gap:6px;margin-left:8px}
.pager select{height:28px;border:1px solid #d5dade;border-radius:7px;padding:0 6px;background:#fff;color:#5d6873;font-size:12.5px}
/* ============ 标签/徽章 ============ */
.tag{display:inline-flex;align-items:center;gap:4px;padding:2.5px 9px;border-radius:6px;font-size:12px;font-weight:500;white-space:nowrap}
.tag-teal{background:var(--teal-050);color:var(--teal)}
.tag-gray{background:#f1f3f5;color:#66707a}
.tag-red{background:var(--red-050);color:var(--red)}
.tag-amber{background:var(--amber-050);color:#c07d23}
.tag-plain{color:var(--tx2)}
/* ============ 开关 ============ */
.switch{position:relative;width:38px;height:22px;border-radius:99px;background:#d8dde2;flex:none;cursor:pointer;transition:background .15s}
.switch::after{content:"";position:absolute;top:2px;left:2px;width:18px;height:18px;border-radius:50%;background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.18);transition:left .15s}
.switch.on{background:var(--teal)}
.switch.on::after{left:18px}
/* ============ 复选框(自定义)============ */
.checkbox{display:inline-flex;align-items:center;gap:7px;font-size:13px;color:var(--ink);cursor:pointer;user-select:none}
.checkbox input{position:absolute;opacity:0;width:0;height:0}
.checkbox .box{
width:16px;height:16px;border-radius:4px;border:1.5px solid #cdd4da;background:#fff;flex:none;
display:flex;align-items:center;justify-content:center;transition:all .12s;
}
.checkbox .box svg{width:10px;height:10px;color:#fff;opacity:0}
.checkbox input:checked+.box{background:var(--teal);border-color:var(--teal)}
.checkbox input:checked+.box svg{opacity:1}
.checkbox input:disabled+.box{background:#f2f4f6;border-color:#e0e5e9}
/* ============ 弹窗 ============ */
.mask{
position:fixed;inset:0;background:rgba(17,24,32,.45);
display:none;align-items:center;justify-content:center;z-index:300;padding:24px;
}
.mask.show{display:flex}
.dialog{
background:#fff;border-radius:12px;width:420px;max-width:100%;max-height:88vh;
display:flex;flex-direction:column;box-shadow:0 20px 50px rgba(15,22,32,.22);
animation:dialogIn .16s ease;
}
@keyframes dialogIn{from{transform:translateY(8px) scale(.98);opacity:.5}to{transform:none;opacity:1}}
.dialog-lg{width:560px}
.dialog-head{display:flex;align-items:center;justify-content:space-between;padding:16px 20px;border-bottom:1px solid var(--line2);flex:none}
.dialog-head h3{font-size:15.5px}
.dialog-head .dialog-close{color:#9aa4ad;width:26px;height:26px;border-radius:7px;display:flex;align-items:center;justify-content:center}
.dialog-head .dialog-close:hover{background:#f2f4f6;color:var(--ink)}
.dialog-body{padding:18px 20px;overflow-y:auto;display:flex;flex-direction:column;gap:14px}
/* 弹窗正文/提示文字:跟随主题变量,深色模式下不会变成“黑底黑字” */
.dialog-text{margin:0;font-size:13.5px;line-height:1.7;color:var(--tx2)}
.dialog-note{font-size:12.5px;line-height:1.7;color:var(--tx2);margin-bottom:12px}
.dialog-foot{display:flex;justify-content:flex-end;gap:10px;padding:14px 20px 18px;border-top:1px solid var(--line2);flex:none}
/* ============ 商品图片大图预览 ============ */
.prod-thumb{position:relative}
.image-preview-trigger{position:absolute;inset:0;display:block;width:100%;height:100%;padding:0;border:0;border-radius:inherit;background:transparent;cursor:pointer}
.image-preview-hint{position:absolute;inset:0;z-index:1;display:flex;align-items:center;justify-content:center;border-radius:inherit;background:rgba(17,24,32,.48);color:#fff;opacity:0;transition:opacity .15s ease;pointer-events:none}
.image-preview-trigger .image-preview-hint svg{width:20px;height:20px;flex:none}
.image-preview-trigger:hover .image-preview-hint,.image-preview-trigger:focus-visible .image-preview-hint{opacity:1}
.image-preview-trigger:focus-visible{outline:3px solid var(--teal);outline-offset:-3px}
body.image-preview-open{overflow:hidden}
.image-preview{position:fixed;left:var(--preview-x,50%);top:var(--preview-y,50%);transform:translate(-50%,-50%);margin:0;width:min(1040px,calc(var(--preview-vw,100vw) - 32px));max-width:none;max-height:calc(var(--preview-vh,100dvh) - 32px);padding:0;border:1px solid var(--line);border-radius:12px;background:var(--card);color:var(--ink);box-shadow:0 20px 60px rgba(0,0,0,.3)}
.image-preview::backdrop{background:rgba(5,9,13,.78)}
.image-preview-panel{display:flex;flex-direction:column;max-height:calc(var(--preview-vh,100dvh) - 34px)}
.image-preview-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;padding:16px 20px;border-bottom:1px solid var(--line);flex:none}
.image-preview-head>div{min-width:0}
.image-preview-head h3{font-size:16px}
#image-preview-name{margin-top:4px;color:var(--tx2);font-size:13px;overflow-wrap:anywhere;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
#image-preview-close{flex:none;width:36px;height:36px;border:0;border-radius:8px;background:var(--bg);color:var(--ink);font-size:26px;cursor:pointer}
#image-preview-close:focus-visible{outline:2px solid var(--teal);outline-offset:2px}
.image-preview-stage{display:flex;align-items:center;justify-content:center;min-height:160px;overflow:auto;padding:20px;background:var(--bg)}
.image-preview-stage img{display:block;width:auto;height:auto;max-width:100%;max-height:calc(var(--preview-vh,100dvh) - 180px);object-fit:contain}
.image-preview-stage [hidden]{display:none}
#image-preview-status{padding:48px 12px;color:var(--tx2);text-align:center}
@media(max-width:600px){.image-preview-head{padding:12px}.image-preview-stage{padding:12px}.image-preview-stage img{max-height:calc(var(--preview-vh,100dvh) - 170px)}}
/* ============ 提示/空态 ============ */
.toast{
position:fixed;left:50%;bottom:34px;transform:translateX(-50%) translateY(8px);
background:rgba(28,33,42,.92);color:#fff;font-size:13px;
padding:9px 16px;border-radius:8px;opacity:0;transition:all .2s;z-index:700;
pointer-events:none;max-width:70vw;
}
.toast.show{opacity:1;transform:translateX(-50%) translateY(0)}
.empty{padding:40px 16px;text-align:center;color:var(--tx3);font-size:13px}
.empty .empty-teal{color:var(--teal);font-size:14px}
/* ============ 工具条 ============ */
.toolbar{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin-bottom:14px}
.toolbar .spacer{flex:1}
.page-flash{display:flex;align-items:center;gap:10px;margin-bottom:14px;font-size:13px;color:var(--tx3)}
.page-flash .link{font-size:13px}
/* ============ 分段切换(销售额/订单量等)============ */
.seg{display:inline-flex;background:#f2f4f6;border-radius:8px;padding:3px;gap:2px}
.seg .seg-btn{padding:5px 13px;border-radius:6px;font-size:12.5px;color:#66707a;transition:all .12s}
.seg .seg-btn.active{background:#fff;color:var(--teal);font-weight:600;box-shadow:0 1px 2px rgba(20,28,38,.08)}
/* ============ Tabs(白底卡片用)============ */
.tabs{display:flex;gap:22px;border-bottom:1px solid var(--line2);padding:0 20px}
.tabs .tab{padding:12px 2px;font-size:14px;color:#66707a;cursor:pointer;position:relative;font-weight:500}
.tabs .tab.active{color:var(--teal);font-weight:600}
.tabs .tab.active::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:2.5px;border-radius:2px;background:var(--teal)}
/* ============ 图表面板(白色) ============ */
.chart-panel{background:var(--card);border:1px solid var(--line2);border-radius:var(--radius);box-shadow:var(--sh);overflow:hidden}
.chart-tabs{display:flex}
.chart-tab{
flex:1;text-align:center;padding:11px 8px;font-size:13px;color:#66707a;cursor:pointer;
background:transparent;transition:background .12s;user-select:none;
}
.chart-tab:hover{background:#f7f8fa;color:var(--ink)}
.chart-tab.active{background:var(--teal-050);color:var(--teal);font-weight:600;border-radius:8px 8px 0 0;font-size:13.5px}
.chart-body{padding:14px 16px 12px}
.chart-head{display:flex;align-items:center;gap:16px;font-size:11.5px;color:#66707a;margin-bottom:10px}
.chart-head .grow{flex:1}
#chart-head{flex-wrap:wrap;column-gap:12px;row-gap:6px}
#chart-head .mini-label{white-space:nowrap}
.legend{display:inline-flex;align-items:center;gap:6px;white-space:nowrap}
.legend i{width:9px;height:9px;border-radius:2px;display:inline-block;flex:none}
.legend i.line{width:14px;height:2.5px;border-radius:2px}
.legend i.ink{background:var(--ink)} /* 图例墨色线条:随主题自动变色 */
.chart-svg-wrap{position:relative}
.chart-svg-wrap svg{display:block;width:100%;height:auto}
.chart-title{font-size:14.5px;font-weight:600;color:var(--ink)}
/* 迷你统计信息(近7日标题区) */
.mini-label{font-size:11px;color:#7d8a97}
/* ============ 经营预警信息流 ============ */
.feed{padding:6px 18px 14px}
.feed-group{padding:12px 0;border-bottom:1px solid var(--line2)}
.feed-group:last-of-type{border-bottom:none}
.feed-group.feed-link{cursor:pointer;border-radius:8px;transition:background .15s}
.feed-group.feed-link:hover{background:var(--teal-050)}
.feed-group .feed-go{margin-left:auto;font-size:12px;font-weight:500;color:var(--teal);white-space:nowrap}
.feed-head{display:flex;align-items:center;gap:8px;font-size:13px;font-weight:600;color:var(--ink)}
.feed-dot{width:7px;height:7px;border-radius:50%;flex:none}
.feed-dot.sku{background:#b5544a}
.feed-dot.price{background:#c25e50}
.feed-dot.logi{background:#a9574b}
.feed-dot.surge{background:var(--amber)}
.feed-dot.clear{background:#4aa38c}
.feed-dot.replenish{background:#5ba1c0}
.feed-msg{font-size:12.5px;color:#3a444d;margin:6px 0 0 15px;line-height:1.55}
.feed-time{font-size:11.5px;color:var(--tx3);margin:4px 0 0 15px}
.feed-foot{padding:10px 20px 16px;display:flex;justify-content:flex-end}
.feed-empty{padding:34px 16px;text-align:center}
.feed-empty .tip{color:var(--teal);font-size:13.5px}
/* ============ KPI 卡 ============ */
.kpi-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.kpi{position:relative;background:var(--card);border:1px solid var(--line2);border-radius:var(--radius);box-shadow:var(--sh);padding:16px 18px 14px}
.kpi-label{font-size:12.5px;color:#66707a}
.kpi-label .cur{color:#a2abb3}
.kpi-value{font-size:25px;font-weight:700;letter-spacing:-.01em;margin-top:9px}
.kpi-foot{display:flex;align-items:center;gap:10px;margin-top:10px;font-size:12px;color:var(--tx3);flex-wrap:wrap}
.kpi-foot .delta{font-weight:500}
.delta-up{color:var(--teal)}
.delta-down{color:var(--red)}
.kpi-icon{
position:absolute;top:14px;right:14px;width:34px;height:34px;border-radius:8px;
background:#f4f6f7;display:flex;align-items:center;justify-content:center;color:#7c8792;
}
.kpi-icon svg{width:16px;height:16px}
/* ============ 排行榜 ============ */
/* 最多显示 14 行；桌面端行高随趋势区域调整，使两侧底部对齐。 */
.rank-list{--rank-row-height:60px;max-height:calc(14 * var(--rank-row-height));overflow-y:auto;overscroll-behavior-y:contain;overflow-anchor:none;padding:0}
.rank-list.rank-virtual{height:calc(14 * var(--rank-row-height));contain:layout paint}
.rank-row{display:grid;grid-template-columns:22px 1fr auto;grid-template-rows:minmax(16px,1fr) 4px;align-items:center;gap:3px 6px;height:var(--rank-row-height);padding:4px 12px}
.rank-no{color:#a7b0b8;font-size:12.5px;text-align:center}
.rank-name{font-size:12px;font-weight:600;color:var(--ink);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rank-val{font-size:11.5px;color:var(--tx3);white-space:nowrap}
.rank-bar-wrap{grid-column:2 / span 2;height:5px;border-radius:3px;background:#eef1f3;overflow:hidden;width:60%}
.rank-bar{height:100%;border-radius:3px;background:var(--teal)}
/* ============ 通用小工具 ============ */
.muted{color:var(--tx3)}
.mt8{margin-top:8px}.mt14{margin-top:14px}.mt20{margin-top:20px}
.flex{display:flex;align-items:center;gap:10px}
.flex-wrap{flex-wrap:wrap}
.grow{flex:1}
.divider{height:1px;background:var(--line2);margin:14px 0}
/* ============ 登录/注册页 ============ */
#login-overlay{position:fixed;inset:0;background:var(--bg);display:none;align-items:center;justify-content:center;z-index:500;padding:24px;overflow:auto}
#login-overlay.show{display:flex}
body.locked{overflow:hidden}
/* 启动探测登录态期间(body.locked 且登录层未显示):先藏主体,避免先闪一下后台再闪登录层 */
body.locked .layout{visibility:hidden}
/* 库存预警:不预警 SKU 列表 */
.inv-ignore-body{padding:12px 20px 14px}
.inv-ignore-add{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.inv-ignore-add .input{flex:1;max-width:520px;min-width:220px}
.inv-ignore-list{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}
.inv-ignore-chip{display:inline-flex;align-items:center;gap:8px;padding:4px 10px;border-radius:999px;background:var(--teal-050,#eef9f7);border:1px solid var(--line2);font-size:12.5px}
.inv-ignore-chip b{font-weight:600;font-variant-numeric:tabular-nums}
.inv-ignore-chip a{color:var(--tx3);cursor:pointer;font-size:14px;line-height:1}
.inv-ignore-chip a:hover{color:#e25555}
.inv-ignore-empty{font-size:12.5px;color:var(--tx3)}
body.theme-dark .inv-ignore-chip{background:#1b2830;border-color:#28323c}
.auth-card{display:flex;width:880px;max-width:96vw;min-height:470px;background:#fff;border-radius:14px;overflow:hidden;box-shadow:0 24px 70px rgba(16,24,34,.12)}
.auth-left{flex:0 0 43%;background:#e8f5f2;padding:40px 36px;display:flex;flex-direction:column}
.auth-brand{font-size:12.5px;letter-spacing:.2em;color:#0d8f86;font-weight:700}
.auth-slogan{font-size:26px;line-height:1.45;font-weight:700;color:#163f3b;margin-top:76px}
.auth-slogan em{color:var(--teal);font-style:normal}
.auth-desc{margin-top:16px;color:#5c7a76;font-size:13px;line-height:1.75;max-width:260px}
.auth-right{flex:1;padding:44px 52px;display:flex;flex-direction:column;justify-content:center;min-width:0}
.auth-title{font-size:20px;font-weight:600}
.auth-title em{color:var(--teal);font-style:normal;font-weight:700}
.auth-form{display:flex;flex-direction:column;gap:13px;margin-top:24px}
.auth-form .field{gap:5px}
.auth-row{display:flex;align-items:center;justify-content:space-between;font-size:12.5px}
.auth-submit{height:38px;border-radius:8px;background:var(--teal);color:#fff;font-size:14px;font-weight:600;margin-top:3px}
.auth-submit:hover{background:var(--teal-600)}
.auth-switch{text-align:center;font-size:12.5px;color:var(--tx3);margin-top:16px}
.code-btn{position:absolute;right:4px;top:50%;transform:translateY(-50%);height:26px;padding:0 9px;border-radius:6px;color:var(--teal);font-size:12.5px}
.code-btn:hover{background:var(--teal-025)}
.code-btn:disabled{color:#b3bbc3;cursor:default}
/* ============ 工作台布局 ============ */
/* 排行榜跨两行时，将额外高度留给第二行，避免撑开指标卡与图表的间距。 */
.dash{display:grid;grid-template-columns:320px minmax(0,1fr) 320px;grid-template-rows:min-content 1fr;gap:16px;align-items:start}
.dash-rank{grid-column:1;grid-row:1 / span 2}
.dash-kpis{grid-column:2 / span 2;grid-row:1;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;align-content:start}
.dash-charts{grid-column:2;grid-row:2;display:flex;flex-direction:column;gap:16px;min-width:0}
.dash-feed{grid-column:3;grid-row:2}
@media(max-width:1280px){
.dash{grid-template-columns:1fr;grid-template-rows:none}
.dash-rank,.dash-kpis,.dash-charts,.dash-feed{grid-column:1;grid-row:auto}
.dash-kpis{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:760px){
.layout:has(#view-dashboard.active) .sidebar{width:54px}
.layout:has(#view-dashboard.active) .brand{padding:14px 9px}
.layout:has(#view-dashboard.active) .brand>div:not(.brand-logo),.layout:has(#view-dashboard.active) .nav-group-title{display:none}
.layout:has(#view-dashboard.active) .nav{padding:2px 6px}
.layout:has(#view-dashboard.active) .nav-item{font-size:0;gap:0;justify-content:center;padding:10px}
.layout:has(#view-dashboard.active) .content{padding:14px 12px 32px}
.layout:has(#view-dashboard.active) .topbar{padding:8px 12px;gap:8px}
.layout:has(#view-dashboard.active) .user-meta{display:none}
}
@media(max-width:600px){
.dash-kpis{grid-template-columns:minmax(0,1fr)}
}
/* ============ 规则开关卡(预警页) ============ */
.rule-card{display:flex;align-items:flex-start;gap:16px;padding:16px 20px}
.rule-card .rule-main{flex:1;min-width:0}
.rule-title{font-size:14.5px;font-weight:600}
.rule-desc{font-size:12.5px;color:var(--tx3);margin-top:6px;line-height:1.7}
/* ============ 筛选条 / 指标卡(报告页) ============ */
.filter-bar{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin-bottom:14px}
.filter-bar .select{width:auto;min-width:150px;height:33px}
.filter-bar .input{width:auto}
.date-range{display:flex;align-items:center;gap:6px}
.date-range .input{width:142px;height:33px}
.date-range .sep{color:#c8ced5}
.metric-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-bottom:16px}
.metric{background:#fff;border:1px solid var(--line2);border-radius:var(--radius);box-shadow:var(--sh);padding:15px 18px}
.metric .m-label{font-size:12.5px;color:#66707a}
.metric .m-value{font-size:22px;font-weight:700;margin-top:8px}
.metric .m-foot{margin-top:8px;font-size:12px;color:var(--tx3);display:flex;gap:8px;align-items:center}
/* ============ 货盘管理 ============ */
.mini-metrics{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-bottom:16px}
.mini-metric{position:relative;background:#fff;border:1px solid var(--line2);border-radius:var(--radius);box-shadow:var(--sh);padding:16px 18px}
.mini-metric .mm-icon{position:absolute;top:14px;right:14px;width:34px;height:34px;border-radius:8px;background:#f4f6f7;display:flex;align-items:center;justify-content:center;color:#7c8792}
.mini-metric .mm-icon svg{width:16px;height:16px}
.mini-metric .mm-label{font-size:12.5px;color:#66707a}
.mini-metric .mm-value{font-size:23px;font-weight:700;margin-top:10px}
.prod-cell{display:flex;align-items:center;gap:12px;min-width:200px}
.prod-thumb{width:40px;height:40px;border-radius:8px;background:#f2f4f6;overflow:hidden;flex:none;display:flex;align-items:center;justify-content:center;color:#c3cad1}
.prod-thumb img{width:100%;height:100%;object-fit:cover}
.prod-name{font-size:13px;font-weight:600}
.prod-specs{margin-top:3px}
.tag-spec{font-size:11px;color:var(--teal);background:var(--teal-050);padding:1.5px 6px;border-radius:4px}
.sku-chip{font-size:11.5px;color:#5d6873;background:#f2f4f6;border-radius:5px;padding:2px 7px;font-family:ui-monospace,Consolas,monospace;white-space:nowrap}
.price{font-weight:600;white-space:nowrap}
.price .unit{font-size:11.5px;color:var(--tx3);margin-left:1px;font-weight:400}
/* SKU 行(新增/编辑商品) */
.sku-head,.sku-row{display:grid;grid-template-columns:1.1fr 1.1fr .8fr .8fr 28px;gap:8px;align-items:center}
.sku-head{font-size:11.5px;color:var(--tx3);padding:0 2px;margin-bottom:6px}
.sku-head .req{color:var(--red);margin-right:2px}
.sku-row .input{height:32px;font-size:12.5px}
.sku-del{width:28px;height:28px;border-radius:7px;display:flex;align-items:center;justify-content:center;color:#9aa4ad}
.sku-del:hover{background:var(--red-050);color:var(--red)}
.sku-img-box{width:40px;height:40px;border-radius:8px;border:1.5px dashed #d5dade;background:#fafbfc;display:flex;align-items:center;justify-content:center;color:#9aa4ad;cursor:pointer;position:relative;overflow:hidden;flex:none}
.sku-img-box:hover{border-color:var(--teal);color:var(--teal)}
.sku-img-box svg{width:16px;height:16px}
.sku-img-box img{width:100%;height:100%;object-fit:cover;display:block}
.sku-img-box.has-img{border-style:solid;border-color:var(--line2)}
.sku-img-box.has-img::after{content:'';position:absolute;inset:0;background:rgba(23,29,38,.45);opacity:0;transition:opacity .15s}
.sku-img-box.has-img::before{content:'更换';position:absolute;z-index:1;color:#fff;font-size:10.5px;opacity:0;transition:opacity .15s;pointer-events:none}
.sku-img-box.has-img:hover::before,.sku-img-box.has-img:hover::after{opacity:1}
.upload-box{width:88px;height:88px;border:1.5px dashed #d5dade;border-radius:10px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;color:#9aa4ad;font-size:11.5px;cursor:pointer;background:#fafbfc}
.upload-box:hover{border-color:var(--teal);color:var(--teal)}
.upload-box svg{width:18px;height:18px}
.upload-box.has-img{border-style:solid;border-color:var(--line2);position:relative;overflow:hidden}
.upload-box.has-img img{width:100%;height:100%;object-fit:cover;display:block}
.upload-box.has-img::after{content:'';position:absolute;inset:0;border-radius:8px;background:rgba(23,29,38,.45);opacity:0;transition:opacity .15s}
.upload-box.has-img::before{content:'更换';position:absolute;z-index:1;color:#fff;font-size:11px;opacity:0;transition:opacity .15s;pointer-events:none}
.upload-box.has-img:hover::before,.upload-box.has-img:hover::after{opacity:1}
/* ============ 角色权限勾选组 ============ */
.perm-group{display:grid;grid-template-columns:repeat(3,1fr);gap:11px 14px}
.perm-all{border-bottom:1px solid var(--line2);padding-bottom:12px;margin-bottom:12px}
/* ============ 通知设置 ============ */
.toggle-card{display:flex;align-items:center;gap:14px;padding:16px 20px;border-bottom:1px solid var(--line2)}
.toggle-card:last-child{border-bottom:none}
.toggle-card .tc-main{flex:1;min-width:0}
.toggle-card .tc-title{font-size:14px;font-weight:600}
.toggle-card .tc-desc{font-size:12px;color:var(--tx3);margin-top:4px}
.notify-form{display:flex;flex-direction:column;gap:14px;padding:16px 20px 20px}
.notify-form .row{display:grid;grid-template-columns:110px 1fr;gap:12px;align-items:center}
.notify-form .row>label{font-size:13px;color:#3a444d}
.notify-form .row>label .req{color:var(--red);margin-right:3px}
.notify-form .row-inline{display:flex;gap:10px;align-items:center}
.notify-form .row-inline .input{flex:1}
/* ============ 图表 tooltip / 数据提示 ============ */
.chart-tip{
position:fixed;z-index:800;background:rgba(23,29,38,.94);color:#fff;font-size:12px;line-height:1.5;
padding:7px 10px;border-radius:7px;pointer-events:none;opacity:0;transition:opacity .1s;max-width:260px;
}
.chart-tip.show{opacity:1}
.chart-tip .tt-muted{color:#b9c4ce}
/* ============ 系统设置占位 ============ */
.settings-row{display:grid;grid-template-columns:170px 1fr;gap:12px;align-items:center;padding:13px 0;border-bottom:1px solid var(--line2);font-size:13px}
.settings-row:last-child{border-bottom:none}
.settings-row .k{color:#66707a}
.placeholder-note{font-size:13px;color:var(--tx3);line-height:1.9}
/* 数据更新行 */
.updated-line{display:flex;align-items:center;gap:12px;font-size:13px;color:var(--tx3);margin-bottom:14px}
.updated-line .num{color:#7c8792;flex:1 1 auto;min-width:0}
.updated-line .upd-label{flex:none;white-space:nowrap}
.updated-line .link{flex:none;white-space:nowrap}
.updated-line .cur-label{flex:none;font-size:12.5px;color:#7c8792;white-space:nowrap}
.updated-line .cur-select{flex:none;width:auto;font-size:12.5px;font-weight:600;color:var(--teal);border:1.5px solid rgba(0,158,149,.55);border-radius:999px;background-color:#e9f8f6;background-image:url("data:image/svg+xml;utf8,");background-repeat:no-repeat;background-position:right 10px center;background-size:10px 6px;padding:0 26px 0 12px;cursor:pointer;box-shadow:0 0 0 3px rgba(0,158,149,.1);transition:box-shadow .15s ease,background-color .15s ease}
.updated-line .cur-select:hover{background-color:#dcf4f1;box-shadow:0 0 0 4px rgba(0,158,149,.18)}
.updated-line .cur-select:focus{border-color:var(--teal);box-shadow:0 0 0 4px rgba(0,158,149,.25)}
.updated-line .cur-select:disabled{opacity:.55;cursor:default;box-shadow:none}
@media(max-width:700px){
.updated-line{flex-wrap:wrap;gap:8px 10px}
.updated-line .num{flex:1 1 45%}
.updated-line .cur-select{max-width:100%}
}
/* 批量导入货盘弹窗(2026-10-16) */
/* 库存预警安全线配置(2026-10-16) */
.inv-threshold-row{display:flex;align-items:center;gap:8px;font-size:13px;color:#5d6873;flex-wrap:wrap}
.inv-threshold-row .input{width:88px;height:30px;text-align:center;font-weight:600}
/* 报告页美元结算标注(2026-10-16) */
.money-tag{margin-left:auto;font-size:12px;color:#0b7a72;background:#e9f8f6;border:1px solid rgba(0,158,149,.3);border-radius:6px;padding:2px 9px;white-space:nowrap}
.import-tip{font-size:12.5px;color:#5d6873;line-height:1.9;background:#f7f9fb;border:1px solid #eef1f4;border-radius:8px;padding:10px 12px;margin-bottom:12px}
.import-tip .link{margin-left:6px;white-space:nowrap}
#as-import-text{display:block;width:100%;height:168px;padding:10px 12px;line-height:1.7;font-family:inherit;font-size:12.5px;resize:vertical}
.import-file-row{display:flex;align-items:center;gap:10px;margin-top:10px}
#as-import-file-name{font-size:12.5px;color:#7c8792;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:360px}
/* 货盘批量选择 / 批量操作(2026-10-16) */
.as-check,.as-check-all{width:15px;height:15px;accent-color:var(--teal);cursor:pointer;vertical-align:middle;margin:0}
.table .col-check{width:42px;text-align:center}
tr.as-row.row-sel>td{background:#f0fbfa}
tr.as-row.row-sel .assort-name{color:var(--teal)}
/* 批量操作下拉菜单(放在地区选择前,2026-10-16) */
.bulk-drop{position:relative;flex:none}
.bulk-btn{display:inline-flex;align-items:center;gap:6px;white-space:nowrap}
.bulk-btn.on{border-color:var(--teal);color:var(--teal);background:#f0fbfa}
.bulk-num{min-width:17px;height:17px;line-height:17px;padding:0 5px;border-radius:9px;background:var(--teal);color:#fff;font-size:11px;font-weight:700;text-align:center}
.bulk-caret{width:0;height:0;border-left:4px solid transparent;border-right:4px solid transparent;border-top:5px solid currentColor;transition:transform .15s;margin-top:1px}
.bulk-drop.open .bulk-caret{transform:rotate(180deg)}
.bulk-menu{position:absolute;top:calc(100% + 6px);left:0;min-width:172px;background:var(--card);border:1px solid var(--line);border-radius:12px;box-shadow:0 12px 36px rgba(23,43,77,.15);padding:6px;z-index:80}
.bulk-head{font-size:12px;color:#7c8792;padding:7px 10px 6px;border-bottom:1px solid #eef2f6;margin-bottom:4px}
.bulk-head .hlnum{color:var(--teal);font-weight:700}
.bulk-item{display:block;padding:8px 11px;min-height:36px;border-radius:7px;font-size:13px;color:var(--tx2);cursor:pointer}
.bulk-item:hover{background:var(--teal-025);color:var(--teal-600)}
.bulk-item.danger{color:var(--red)}
.bulk-item.danger:hover{background:#fdf1f1;color:var(--red)}
.bulk-item.disabled{opacity:.45;cursor:not-allowed;color:#96a0ab}
.bulk-item.disabled:hover{background:none;color:#96a0ab}
.bulk-sep{height:1px;background:#eef2f6;margin:4px 2px}
/* 日期快捷段 */
.seg.seg-days .seg-btn{padding:5px 10px}
/* ============ 店铺授权(列表页通用) ============ */
.list-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 16px}
#view-assortment .list-head{flex-wrap:wrap}
.list-head .search{width:300px}
.updated-mini{font-size:12.5px;color:var(--tx3)}
.td-datetime{white-space:normal;line-height:1.5;min-width:96px}
.btn-danger{background:var(--red);color:#fff}
.btn-danger:hover{background:#d13c41}
.st{display:inline-flex;align-items:center;gap:6px;padding:2.5px 10px;border-radius:6px;background:#f1f3f5;font-size:12px;color:#3a444d;white-space:nowrap}
.st i{width:6px;height:6px;border-radius:50%;display:inline-block;flex:none;background:#b6bec6}
.st.ok i{background:#2f9e7a}
.st.wait{color:#8b949c}
/* ============ 权限管理(角色/部门/成员) ============ */
.list-note{font-size:13.5px;color:#3a444d}
.list-note b{color:var(--ink)}
.perm-rows{display:flex;flex-direction:column;gap:11px}
.perm-rows .perm-group{gap:11px 14px}
.td-op{white-space:nowrap}
/* ============ 报告页筛选(店铺报告/商品报告) ============ */
.filter-group{display:inline-flex;align-items:center;gap:10px;background:#fff;border:1px solid var(--line2);border-radius:10px;padding:8px 10px;box-shadow:var(--sh)}
.filter-group .select{width:auto;min-width:0}
.seg-line{background:transparent;padding:0;gap:6px}
.seg-line .seg-btn{border:1px solid transparent;border-radius:7px;background:transparent;padding:5px 12px}
.seg-line .seg-btn.active{border-color:var(--teal);color:var(--teal);background:#fff;font-weight:500;box-shadow:none}
.filter-group .date-range{border:1px solid var(--line);border-radius:7px;height:32px;padding:0 10px;display:flex;align-items:center;gap:6px;background:#fff}
.date-range .dinput{border:none;outline:none;width:84px;font-size:13px;color:var(--ink);background:transparent;font-variant-numeric:tabular-nums}
.filter-group .report-date-range{display:grid;grid-template-columns:minmax(0,1fr)24px minmax(0,1fr);width:320px;max-width:100%;padding:0;gap:0;cursor:pointer;overflow:hidden}
.report-date-range .date-half{position:relative;display:flex;align-items:center;align-self:stretch;padding:0 10px;min-width:0;cursor:pointer;user-select:none}
.report-date-range .date-trigger{display:flex;align-items:center;justify-content:space-between;gap:8px;width:100%;height:100%;padding:0;border:0;outline:none;background:transparent;color:var(--ink);font:inherit;font-size:13px;font-variant-numeric:tabular-nums;cursor:pointer;user-select:none}
.report-date-range .date-value{white-space:nowrap;user-select:none}
.report-date-range .date-half:hover,.report-date-range .date-half:focus-within{background:var(--teal-soft,#e5f5f3)}
.report-date-range .sep{display:flex;align-items:center;justify-content:center;align-self:stretch;user-select:none;border-left:1px solid var(--line2);border-right:1px solid var(--line2)}
.report-date-range .dinput{position:absolute;inset:0;width:100%;min-width:0;height:100%;padding:0;opacity:0;pointer-events:none;color-scheme:light}
.report-date-range.date-picker-native .date-trigger{display:none}
.report-date-range.date-picker-native .dinput{position:static;opacity:1;pointer-events:auto}
.report-date-range:focus-within{border-color:var(--teal);box-shadow:0 0 0 2px rgba(0,158,149,.1)}
body.theme-dark .report-date-range .dinput{color-scheme:dark}
body.theme-dark .report-date-range .date-half:hover,body.theme-dark .report-date-range .date-half:focus-within{background:#173638}
.date-range svg{width:15px;height:15px;color:#9aa4ad;flex:none}
.thumb-pink{background:linear-gradient(160deg,#f8cfde,#f2a9c6 55%,#ec93b6)}
/* ============ 采购管理(区域/仓库/货盘) ============ */
.procurement-search{width:250px;max-width:100%}
.procurement-warning{padding:12px 16px;margin-bottom:14px;background:var(--amber-050);border:1px solid var(--amber);border-radius:8px;color:var(--ink);font-size:13px;line-height:1.8}
.procurement-warning[hidden]{display:none}
.procurement-warning span+span{margin-left:8px;overflow-wrap:anywhere}
.filter-bar .procurement-search .input{width:100%;padding-left:12px}
.procurement-head{gap:16px;flex-wrap:wrap}
.procurement-sort{display:flex;align-items:center;gap:10px;margin-left:auto;font-size:13px;color:var(--tx3)}
.procurement-sort .select{width:auto;max-width:230px}
.procurement-note{margin:0;padding:10px 22px;border-top:1px solid var(--line2);line-height:1.8}
.procurement-table{min-width:1450px}
#pur-metrics{grid-template-columns:repeat(3,minmax(0,1fr))}
#pur-settings-mask .dialog{max-width:580px;width:calc(100% - 24px)}
#pur-settings-error{color:var(--danger,#db5548)}
.procurement-table .assort-cell{max-width:350px;white-space:normal;overflow-wrap:anywhere}
.procurement-table .num{white-space:nowrap}
.procurement-tabs{display:flex;gap:8px;padding:12px 22px;border-top:1px solid var(--line2)}
.procurement-stock-table{min-width:980px}
.procurement-stock-table .assort-name{max-width:280px;white-space:normal;overflow-wrap:anywhere}
.procurement-order-link{display:block;color:var(--teal);font-size:12px;padding:4px 0;text-align:left}
.procurement-setting-days{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.procurement-setting-days label{display:flex;flex-direction:column;gap:8px;min-width:0}
.procurement-setting-days input{width:100%}
.procurement-wide-dialog{width:1240px;max-width:100%}
.procurement-dialog-filters{display:flex;flex-wrap:wrap;gap:8px}
.procurement-dialog-filters .select{width:auto;max-width:260px;min-width:130px}
.procurement-detail-table{min-width:1600px}
.procurement-log-table{min-width:1500px}
.procurement-log-table details{min-width:200px;max-width:300px;white-space:normal}
.procurement-wide-dialog .table-wrap{flex:none;max-height:42vh;overflow:auto}
.procurement-wide-dialog .pager{padding:8px 0;flex:none}
.procurement-wide-dialog .form-tip{line-height:1.8}
.procurement-wide-dialog .table td{overflow-wrap:anywhere}
@media(max-width:760px){.mask:has(.procurement-wide-dialog){padding:10px}.procurement-wide-dialog .dialog-body{padding:12px}.procurement-dialog-filters .select{max-width:100%;flex:1}}
.procurement-definition{line-height:1.8;margin-top:14px}
@media(max-width:760px){
.layout:has(#view-procurement-reports.active) .sidebar{width:54px}
.layout:has(#view-procurement-reports.active) .brand{padding:14px 9px}
.layout:has(#view-procurement-reports.active) .brand>div:not(.brand-logo),.layout:has(#view-procurement-reports.active) .nav-group-title{display:none}
.layout:has(#view-procurement-reports.active) .nav{padding:2px 6px}
.layout:has(#view-procurement-reports.active) .nav-item{font-size:0;gap:0;justify-content:center;padding:10px}
.layout:has(#view-procurement-reports.active) .content{padding:14px 12px 32px}
.layout:has(#view-procurement-reports.active) .topbar{padding:8px 12px;gap:8px}
.layout:has(#view-procurement-reports.active) .user-meta{display:none}
.layout:has(#view-procurement-reports.active) .topbar-right{gap:4px}
#view-procurement-reports .filter-group{width:100%;max-width:100%;flex-wrap:wrap}
#view-procurement-reports .report-date-range{width:100%}
#view-procurement-reports .procurement-search{width:100%}
#view-procurement-reports .kpi-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
#view-procurement-reports .kpi{padding:14px}
#view-procurement-reports .kpi-icon{display:none}
#view-procurement-reports .procurement-sort{margin-left:0}
#view-procurement-reports .card-head{padding:14px}
#view-procurement-reports .procurement-note{padding:10px 14px;overflow-wrap:anywhere}
#view-procurement-reports .pager{flex-wrap:wrap;gap:8px;padding:14px}
}
.req{color:var(--red);margin-right:2px;font-style:normal}
.assort-cell{display:flex;align-items:center;gap:12px;min-width:210px}
.prod-glyph{width:40px;height:40px;border-radius:8px;background:#f2f4f6;flex:none;display:flex;align-items:center;justify-content:center;color:#6b7680;overflow:hidden;position:relative}
.prod-glyph svg{width:18px;height:18px}
.prod-glyph img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;background:#f2f4f6}
.assort-name{font-size:13px;font-weight:600}
.assort-specs{font-size:12px;color:var(--tx3);margin-top:3px}
.table .as-sku-summary{width:220px;min-width:160px;max-width:280px;white-space:normal;overflow-wrap:anywhere}
.as-sku-summary .sku-chip{white-space:normal;overflow-wrap:anywhere}
.as-sku-more{font-size:12px;white-space:nowrap}
.sku-row.c4,.sku-head.c4{grid-template-columns:46px 1.05fr 1.05fr 76px 88px minmax(100px,1fr) 100px 28px;min-width:820px}
.sku-row.c5,.sku-head.c5{grid-template-columns:46px minmax(90px,1fr) minmax(110px,1.2fr) 76px 76px 88px minmax(100px,1fr) 100px 28px}
#as-mask .dialog{width:1040px;max-width:calc(100vw - 48px)}
#as-sku-grid{overflow-x:auto;padding:3px}
.sku-head.c5,.sku-row.c5{min-width:900px}
.sku-row .select{min-width:0;font-size:12px}
.sku-stock[readonly]{background:var(--teal-025);color:var(--teal-600);font-weight:600}
.sku-bundle-config{grid-column:1/-1;padding:12px 14px;border:1px solid var(--line);border-radius:9px;background:var(--teal-025)}
.sku-bundle-tip{font-size:12px;color:var(--tx2);line-height:1.7;margin-bottom:8px}
.sku-bundle-options{display:flex;flex-wrap:wrap;gap:8px 16px;font-size:12px;color:var(--tx2)}
.sku-bundle-options label{display:flex;align-items:center;gap:6px;cursor:pointer}
.sku-component{accent-color:var(--teal)}
#as-sku-rows{display:flex;flex-direction:column;gap:8px}
.as-warehouse-stocks{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 12px;margin-top:12px}
#as-qty[readonly]{background:var(--bg);color:var(--tx2)}
@media(max-width:600px){.as-warehouse-stocks{grid-template-columns:1fr}}
/* 货盘商品行:点击展开全部 SKU(参照 TK 商品管理) */
.as-row{cursor:default}
.as-row.as-expandable{cursor:pointer}
.as-row .assort-name{display:flex;align-items:center;gap:6px}
.as-caret{width:13px;height:13px;color:#b6bec6;flex:none;transition:transform .15s,color .15s}
.as-row:hover .as-caret{color:var(--teal)}
.as-row.as-open td{background:var(--teal-025)}
.as-row.as-open:hover td{background:#eaf6f4}
.as-row.as-open .as-caret{transform:rotate(90deg);color:var(--teal)}
.table .as-expand td{padding:0;border-top:none}
.as-sku-panel{background:#fafbfc;padding:2px 16px 14px 68px;animation:asSkuIn .18s ease}
.as-sku-bar{display:flex;align-items:center;gap:8px;padding:8px 2px 10px}
.as-sku-badge{font-size:12.5px;font-weight:600;color:#3a444d}
.as-collapse{margin-left:auto;display:inline-flex;align-items:center;gap:3px;font-size:12.5px;color:var(--teal);user-select:none}
.as-collapse svg{width:13px;height:13px}
.as-sku-rows{background:#fff;border:1px solid var(--line2);border-radius:9px;padding:0 14px}
.as-sku-item{display:grid;grid-template-columns:minmax(0,1fr) 126px 126px minmax(120px,168px);gap:10px;align-items:center;padding:8px 0;border-top:1px dashed var(--line2)}
.as-sku-item:first-child{border-top:none}
.as-sku-id{display:flex;align-items:center;gap:8px;min-width:0}
.as-sku-thumb{width:40px;height:40px;border-radius:9px;background:#f2f4f6;border:1px solid var(--line2);flex:none;display:flex;align-items:center;justify-content:center;color:#c3cad1;overflow:hidden;position:relative}
.as-sku-thumb img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.as-sku-thumb svg{width:18px;height:18px}
.as-sku-name{font-size:13px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.as-sku-val{height:30px;border:1px solid var(--line2);border-radius:7px;display:flex;align-items:center;justify-content:flex-end;gap:6px;padding:0 9px;background:#fff;font-size:12.5px;font-weight:600;font-variant-numeric:tabular-nums;color:var(--ink);white-space:nowrap;min-width:0;overflow:hidden}
.as-sku-val .lbl{font-size:11px;color:var(--tx3);font-weight:400;margin-right:auto}
@media (max-width:1180px){.as-sku-item{grid-template-columns:minmax(0,1fr) 110px 110px minmax(100px,1fr);gap:8px}}
@keyframes asSkuIn{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:none}}
/* ============ 自动化管理(预警/自动化库存/通知设置) ============ */
.cfg-card{padding:18px 20px}
.cfg-head{display:flex;align-items:center;gap:12px}
.cfg-name{font-size:16px;font-weight:600}
.cfg-head .link{margin-left:auto}
/* 设置项行(外观等):左侧名称+说明,右侧开关;标题由 .card-head 单独占一行 */
.set-row{display:flex;align-items:center;gap:24px;padding:18px 20px}
.set-row .set-main{flex:1;min-width:0}
.set-row .set-name{font-size:13.5px;font-weight:600;color:#5d6873}
.set-row .set-desc{margin-top:6px;font-size:12.5px;line-height:1.7;color:var(--tx3)}
/* 系统设置-外观:开关靠右 */
#theme-switch{margin-left:auto;flex:none}
.cfg-desc{margin-top:10px;font-size:13px;color:#66707a;line-height:1.9}
.hlnum{color:var(--teal);font-weight:600}
.card-sub{font-size:12.5px;color:var(--tx3);margin-top:4px}
.count-badge{display:inline-flex;align-items:center;justify-content:center;min-width:22px;height:20px;padding:0 7px;border-radius:6px;background:#f1f3f5;color:#66707a;font-size:12px;font-weight:600}
.cfg-card + .card{margin-top:16px}
.cfg-card + .cfg-card{margin-top:16px}
#view-settings .card + .card{margin-top:16px}
.alert-pill{color:var(--red);font-weight:500}
.ab-ok{color:#2f9e63;font-weight:500}
.ab-miss{color:#8a949e}
.ab-fail{color:var(--red);font-weight:500}
.ab-sep{color:#c3cad1;margin:0 2px}
.match-ok{color:var(--teal)}
.rule-line{display:flex;align-items:center;flex-wrap:wrap;gap:8px;font-size:13.5px;color:#2a3238;line-height:1.8}
.rule-line .input{width:90px;height:34px;text-align:center;flex:none}
/* 行内开关(如“实际写入 TikTok 平台库存”):文字在左、开关在右 */
.rule-line.rule-switch{justify-content:space-between;gap:16px;flex-wrap:nowrap}
.rule-line.rule-switch .switch{flex:none}
#stock-cfg-low,#stock-cfg-inc,#stock-cfg-add{width:130px}
.cfg-group-label{font-size:13.5px;font-weight:600;color:var(--ink)}
.auto-note{margin:16px 0 0 auto;width:min(640px,100%);font-size:13px;color:#55606c;line-height:2}
.auto-note .note-red{color:var(--red)}
.pg-tail{color:var(--tx3);font-size:12.5px;margin-left:4px}
.qty-danger{color:var(--red);font-weight:600}
.qty-warn{color:#c07d23;font-weight:600}
/* 通知设置 */
.notify-form{margin-top:2px}
.nf-row{display:flex;align-items:center;gap:12px;margin-top:16px}
.nf-label{width:108px;flex:none;font-size:13.5px;color:var(--ink);font-weight:600}
.nf-label .req{color:var(--red);font-weight:400}
.nf-row .input{flex:1}
.nf-row .input.fixed{flex:none;width:170px}
.nf-row .btn{flex:none}
.cfg-form-off{opacity:.5;pointer-events:none}
/* 系统设置 */
.settings-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px 16px;padding:18px 20px 6px}
.settings-grid .field>label{font-size:13px;font-weight:600;color:#5d6873}
.settings-help{padding:6px 20px 18px;font-size:12.5px;color:var(--tx3)}
.input:disabled{background:#f7f8fa;color:#9aa4ad;border-color:#e0e5e9;cursor:not-allowed}
/* 执行记录详情 */
.ad-head{display:flex;align-items:center;gap:10px;padding:15px 20px 12px;flex:none}
.ad-head b{font-size:14.5px;font-weight:600}
.ad-date{color:#98a2ac;font-size:13px}
.ad-tools{margin-left:auto;display:flex;align-items:center;gap:8px}
.ad-lbl{font-size:13px;color:var(--tx2)}
.ad-tools .select{width:120px;height:32px}
#ad-wrap{overflow:auto;flex:1;min-height:120px}
/* 操作说明 */
.guide-list{display:flex;flex-direction:column;gap:10px;font-size:13.5px;color:#3d4652;line-height:1.8}
.guide-warn{background:var(--red-050,#fdecec);color:var(--red);border-radius:8px;padding:10px 12px;font-size:12.5px;line-height:1.7}
.guide-warn b{display:block;margin-bottom:2px}
/* ============ 角色操作权限(无操作权限的模块只读) ============ */
.view.ro .op-toolbar{display:none !important}
#shop-auth-settings-btn[hidden]{display:none}
.view.ro .td-op,.view.ro .col-op{display:none !important}
.view.ro .cfg-head .link{display:none}
.view.ro .switch{pointer-events:none;opacity:.55}
.view.ro .notify-form{opacity:.6;pointer-events:none}
.view.ro .as-bulk-drop{display:none !important}
.view.ro .col-check{display:none !important}
.ro-hint{margin:0 0 12px;padding:8px 12px;border-radius:8px;background:var(--amber-050);color:#a4722a;font-size:12.5px;line-height:1.5;border:1px solid rgba(192,125,35,.25)}
body.theme-dark .ro-hint{background:#2a2418;color:#e0b779;border-color:rgba(224,183,121,.25)}
.invite-body{padding:18px 20px}
.invite-code-row{display:flex;align-items:center;gap:12px;margin-bottom:10px}
#invite-code{font-family:ui-monospace,Consolas,monospace;font-size:22px;letter-spacing:3px;font-weight:700;color:var(--ink);background:var(--teal-050);padding:10px 18px;border-radius:10px}
.invite-actions{display:flex;gap:10px;margin-top:16px}
body.theme-dark #invite-code{background:#16302e;color:#cfe9e5}
.sys-val{font-size:13px;line-height:1.45;color:var(--ink);background:var(--bg);border:1px solid var(--line);border-radius:8px;padding:9px 12px;word-break:break-all;min-height:38px;display:flex;align-items:center}
body.theme-dark .sys-val{background:#1b242e;border-color:#3a4855;color:#e3e9ef}
/* ============ 多选下拉(店铺组/全店铺:搜索+全选+复选列表) ============ */
.ms{position:relative;display:inline-block}
.ms-btn{display:flex;align-items:center;gap:10px;height:33px;padding:0 11px;border:1px solid var(--line);border-radius:7px;background:#fff;font-size:13px;color:var(--ink);cursor:pointer;text-align:left;transition:border-color .12s}
.ms-btn .ms-label{flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ms-btn .ms-arrow{width:10px;height:6px;color:var(--teal);flex:none;transition:transform .15s}
.ms.open .ms-btn{border-color:var(--teal);box-shadow:0 0 0 3px rgba(0,158,149,.08)}
.ms.open .ms-arrow{transform:rotate(180deg)}
.ms-panel{position:absolute;top:calc(100% + 6px);left:0;z-index:60;width:max-content;min-width:100%;max-width:360px;background:var(--card);border:1px solid var(--line);border-radius:12px;box-shadow:0 12px 36px rgba(23,43,77,.15);padding:6px;display:none;overflow-x:hidden}
.ms.open .ms-panel{display:block}
.ms-search{position:relative;margin:2px 2px 8px}
.ms-search input{width:100%;height:32px;border:1px solid var(--line);border-radius:7px;padding:0 30px 0 10px;font-size:12.5px;outline:none;background:#fff;color:var(--ink)}
.ms-search input::placeholder{color:#b3bbc3}
.ms-search input:focus{border-color:var(--teal);box-shadow:0 0 0 3px rgba(0,158,149,.08)}
.ms-search svg{position:absolute;right:9px;top:50%;transform:translateY(-50%);width:13px;height:13px;color:#9aa4ad;pointer-events:none}
.ms-all{background:#f7f8fa;margin-bottom:4px;font-weight:500}
.ms-list{max-height:216px;overflow:auto}
.ms-item{display:flex;align-items:center;gap:8px;padding:8px 11px;min-height:36px;border-radius:7px;font-size:13px;color:var(--tx2);cursor:pointer;user-select:none;white-space:nowrap}
.ms-item:hover{background:var(--teal-025);color:var(--teal-600)}
.ms-item:has(input:checked){background:var(--teal-050);color:var(--teal-600)}
.ms-item input{position:absolute;opacity:0;width:0;height:0}
.ms-item .box{width:16px;height:16px;border-radius:4px;border:1.5px solid var(--teal);background:#fff;flex:none;display:flex;align-items:center;justify-content:center;transition:all .12s}
.ms-item .box svg{width:10px;height:10px;color:#fff;opacity:0}
.ms-item input:checked + .box{background:var(--teal)}
.ms-item input:checked + .box svg{opacity:1}
.ms-empty{padding:14px 10px;text-align:center;color:var(--tx3);font-size:12.5px}
/* ==================== 排行卡三件套:奖牌 / 进度条 / 轮播高亮(2026-10-16) ==================== */
.rank-no{width:22px;height:22px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:11.5px;transition:transform .25s ease}
.rank-no.rank-medal-gold{background:linear-gradient(160deg,#ffe08a,#f5b32c 60%,#d8941a);color:#7a4a00;box-shadow:0 2px 6px rgba(240,160,40,.45),inset 0 0 0 2px rgba(255,255,255,.55)}
.rank-no.rank-medal-silver{background:linear-gradient(160deg,#f5f9fd,#c3cfdb 60%,#a2b3c3);color:#46535f;box-shadow:0 2px 6px rgba(150,165,180,.42),inset 0 0 0 2px rgba(255,255,255,.65)}
.rank-no.rank-medal-bronze{background:linear-gradient(160deg,#f8c8a0,#cb7942 60%,#a85c2a);color:#5e2c0c;box-shadow:0 2px 6px rgba(197,112,58,.42),inset 0 0 0 2px rgba(255,255,255,.5)}
.rank-row{border-radius:8px}
.rank-bar{background:linear-gradient(90deg,var(--teal),#3fc4b8);transition:width .45s ease,box-shadow .3s ease}
/* 数据加载失败提示条(接口异常时避免把“加载失败”误读为空态“一切正常”) */
.data-err{display:flex;align-items:center;gap:8px;margin:0 0 12px;padding:9px 14px;border:1px solid #f0c2b4;background:#fdf1ec;color:#b4543a;border-radius:10px;font-size:13px}
.data-err svg{width:15px;height:15px;flex:none}
.data-err .data-err-retry{margin-left:auto;flex:none;color:#b4543a;font-weight:600;cursor:pointer}
.data-err .data-err-retry:hover{text-decoration:underline}
/* =====================================================================
深色模式(body.theme-dark,入口:系统设置 → 外观)
①覆盖 CSS 变量(自动作用于全部 var() 引用) ②补齐硬编码颜色 ③图表 SVG 属性色覆盖
===================================================================== */
body.theme-dark{
--teal-050:#0f2f2c; --teal-025:#0d2725;
--red-050:#3a2123; --amber-050:#3a2d18;
--ink:#e3e9ef; --tx2:#9fabb8; --tx3:#71808d;
--line:#2b3540; --line2:#232d37;
--bg:#0f141a; --card:#171f27;
--sh:0 1px 2px rgba(0,0,0,.25);
color-scheme:dark;
}
/* 侧边栏 / 顶栏 */
body.theme-dark .brand-sub{color:#5c6874}
body.theme-dark .nav-item{color:#c3cdd7}
body.theme-dark .nav-item svg{color:#7e8b98}
body.theme-dark .nav-item:hover{background:#1e2831}
body.theme-dark .crumbs .sep{color:#4a5661}
body.theme-dark .icon-btn{color:#7e8b98}
body.theme-dark .icon-btn:hover{background:#232e39;color:var(--ink)}
/* 按钮(深色下阴影不可见:主按钮恢复品牌青色;其余按钮亮一档底色 + 可见描边,轮廓清晰) */
body.theme-dark .btn{background:#2b3a49;border-color:#455667}
body.theme-dark .btn:hover{background:#314250;border-color:#54687b}
body.theme-dark .btn-primary{background:var(--teal);border-color:transparent}
body.theme-dark .btn-primary:hover{background:#00b3a8;border-color:transparent}
body.theme-dark .btn-outline{color:#d3dde5}
body.theme-dark .btn-ghost{background:transparent;border-color:transparent}
body.theme-dark .btn-ghost:hover{background:#232e39}
/* 表单(亮一档描边让输入区域轮廓清晰;悬停再亮一点;聚焦青色光圈) */
body.theme-dark .input,body.theme-dark .select{background:#141b22;border-color:#4a5966}
body.theme-dark .input:hover,body.theme-dark .select:hover{border-color:#5b6d7e}
body.theme-dark .input:focus,body.theme-dark .select:focus{border-color:#12b8ac;box-shadow:0 0 0 3px rgba(18,184,172,.18)}
body.theme-dark .input::placeholder{color:#5f6b77}
body.theme-dark .input:disabled{background:#1a222b;color:#5f6b77;border-color:#28323c}
/* 表格 */
body.theme-dark .table th{background:#1b242d;color:#93a1ae}
body.theme-dark .table td{color:#cbd5df}
body.theme-dark .table tbody tr:hover td{background:#1d2731}
/* 分页 */
body.theme-dark .pg{color:#9fabb8}
body.theme-dark .pg:hover{background:#232e39}
body.theme-dark .pager select{background:#141b22;border-color:#2b3540;color:#c3cdd7}
/* 标签 / 徽章 / 状态 */
body.theme-dark .tag-gray{background:#222c36;color:#93a1ae}
body.theme-dark .tag-amber{color:#e0a95a}
body.theme-dark .count-badge{background:#222c36;color:#93a1ae}
body.theme-dark .st{background:#222c36;color:#c3cdd7}
body.theme-dark .st.wait{color:#71808d}
body.theme-dark .st i{background:#4a5661}
/* 开关 / 复选框 */
body.theme-dark .switch{background:#3a4550}
body.theme-dark .switch::after{background:#eef2f6}
body.theme-dark .switch.on{background:#13b3a6} /* 深色下开态提亮,避免被上面的基础覆盖导致"开=关"看不清 */
body.theme-dark .checkbox .box{border-color:#4a5661;background:#1b242d}
body.theme-dark .checkbox input:disabled+.box{background:#222c36;border-color:#2b3540}
/* 弹窗 */
body.theme-dark .mask{background:rgba(5,9,13,.62)}
body.theme-dark .dialog{background:#1b242d;box-shadow:0 20px 50px rgba(0,0,0,.5)}
body.theme-dark .dialog-text,body.theme-dark .dialog-note{color:#cbd5df}
body.theme-dark .dialog-body .form-tip{color:#9fabb8}
body.theme-dark .dialog-head .dialog-close{color:#7e8b98}
body.theme-dark .dialog-head .dialog-close:hover{background:#232e39;color:var(--ink)}
/* seg / tabs / 图表头 */
body.theme-dark .seg{background:#1b242d}
body.theme-dark .seg .seg-btn{color:#93a1ae}
body.theme-dark .seg .seg-btn.active{background:#2a3540;box-shadow:none}
body.theme-dark .tabs .tab{color:#93a1ae}
body.theme-dark .chart-tab{color:#93a1ae}
body.theme-dark .chart-tab:hover{background:#1d2731}
body.theme-dark .chart-head{color:#93a1ae}
body.theme-dark .mini-label{color:#71808d}
/* KPI / 排行 / 信息流 */
body.theme-dark .kpi-label{color:#93a1ae}
body.theme-dark .kpi-label .cur{color:#6d7a87}
body.theme-dark .kpi-icon{background:#222c36;color:#93a1ae}
body.theme-dark .rank-no{color:#71808d}
body.theme-dark .rank-bar-wrap{background:#28323c}
body.theme-dark .feed-msg{color:#b9c4cf}
body.theme-dark .feed-group.feed-link:hover{background:#0f2a28}
/* 报告 / 货盘 / 指标卡 */
body.theme-dark .metric,body.theme-dark .mini-metric{background:var(--card)}
body.theme-dark .metric .m-label,body.theme-dark .mini-metric .mm-label{color:#93a1ae}
body.theme-dark .mini-metric .mm-icon{background:#222c36;color:#93a1ae}
body.theme-dark .filter-group{background:var(--card)}
body.theme-dark .filter-group .date-range{background:#141b22;border-color:#2b3540}
body.theme-dark .date-range .dinput{color:var(--ink)}
body.theme-dark .prod-thumb,body.theme-dark .prod-glyph,body.theme-dark .as-sku-thumb{background:#222c36}
body.theme-dark .sku-img-box,body.theme-dark .upload-box{border-color:#39444f;background:#1a222b}
body.theme-dark .sku-img-box.has-img,body.theme-dark .upload-box.has-img{border-color:var(--line2)}
body.theme-dark .sku-chip{background:#222c36;color:#a8b4bf}
body.theme-dark .as-sku-panel{background:#161e26}
body.theme-dark .as-sku-rows,body.theme-dark .as-sku-val{background:#141b22}
body.theme-dark .as-sku-val{border-color:#28323c}
body.theme-dark .as-row.as-open:hover td{background:#122a28}
body.theme-dark tr.as-row.row-sel>td{background:#0f2a29}
/* 批量操作菜单 */
body.theme-dark .bulk-menu{background:#1b242d;border-color:#2b3540;box-shadow:0 12px 32px rgba(0,0,0,.45)}
body.theme-dark .bulk-btn.on{background:#0f2a28}
body.theme-dark .bulk-head{color:#71808d;border-bottom-color:#26303a}
body.theme-dark .bulk-item{color:#c3cdd7}
body.theme-dark .bulk-item:hover{background:#122a28}
body.theme-dark .bulk-item.danger:hover{background:#331f21}
body.theme-dark .bulk-sep{background:#26303a}
/* 多选下拉 */
body.theme-dark .ms-btn{background:#141b22}
body.theme-dark .ms-panel{background:#1b242d;box-shadow:0 12px 36px rgba(0,0,0,.45)}
body.theme-dark .ms-search input{background:#141b22}
body.theme-dark .ms-all{background:#222c36}
body.theme-dark .ms-item{color:#cbd5df}
body.theme-dark .ms-item:hover{background:#153b35;color:#64d8cb}
body.theme-dark .ms-item:has(input:checked){background:#153b35;color:#64d8cb}
body.theme-dark .ms-item .box{background:#141b22}
/* 登录 / 注册页 */
body.theme-dark .auth-card{background:#171f27;box-shadow:0 24px 70px rgba(0,0,0,.5)}
body.theme-dark .auth-left{background:#11302b}
body.theme-dark .auth-brand{color:#2bb3a7}
body.theme-dark .auth-slogan{color:#d6e5e1}
body.theme-dark .auth-desc{color:#8aa7a1}
/* 系统设置与说明文本 */
body.theme-dark .settings-grid .field>label{color:#93a1ae}
body.theme-dark .settings-row .k{color:#93a1ae}
body.theme-dark .list-note{color:#b9c4cf}
body.theme-dark .cfg-desc{color:#93a1ae}
body.theme-dark .set-row .set-name{color:#a8b4bf}
body.theme-dark .set-row .set-desc{color:#93a1ae}
body.theme-dark .rule-line{color:#cbd5df}
body.theme-dark .auto-note{color:#93a1ae}
body.theme-dark .guide-list{color:#b9c4cf}
body.theme-dark .import-tip{background:#1b242d;border-color:#26303a;color:#93a1ae}
body.theme-dark .notify-form .row>label{color:#b9c4cf}
body.theme-dark .inv-threshold-row{color:#9fabb8}
body.theme-dark .updated-line .num,body.theme-dark .updated-line .cur-label{color:#71808d}
body.theme-dark .updated-line .cur-select{background-color:#0f2a28;box-shadow:0 0 0 3px rgba(0,158,149,.12)}
body.theme-dark .updated-line .cur-select:hover{background-color:#123230}
body.theme-dark .money-tag{background:#0f2a28;color:#3fc4b8;border-color:rgba(0,158,149,.35)}
body.theme-dark .data-err{background:#33211d;border-color:#5a3a31;color:#e8a08c}
body.theme-dark .data-err .data-err-retry{color:#e8a08c}
/* ============ 深色模式切换动画(圆形扩散/收缩,View Transitions API)============ */
::view-transition-old(root),::view-transition-new(root){animation:none;mix-blend-mode:normal}
html.theme-to-dark::view-transition-new(root){animation:theme-circle-in .55s cubic-bezier(.4,0,.2,1) both}
html.theme-to-light::view-transition-old(root){animation:theme-circle-out .55s cubic-bezier(.4,0,.2,1) both;z-index:1} /* 提到上层,否则收缩被下层新快照盖住(实测) */
@keyframes theme-circle-in{from{clip-path:circle(0px at 50% 50%)}to{clip-path:circle(var(--theme-r,120vmax) at 50% 50%)}}
@keyframes theme-circle-out{from{clip-path:circle(var(--theme-r,120vmax) at 50% 50%)}to{clip-path:circle(0px at 50% 50%)}}
@media (prefers-reduced-motion: reduce){
html.theme-to-dark::view-transition-new(root),html.theme-to-light::view-transition-old(root){animation:none}
}
/* 图表 SVG(内联 presentation attribute 优先度低于 CSS,可直接覆盖) */
body.theme-dark svg [fill="#7d8a97"]{fill:#8d9aa7}
body.theme-dark svg [fill="#20262c"]{fill:#dfe7ee}
body.theme-dark svg [stroke="#20262c"]{stroke:#dfe7ee}
body.theme-dark svg [stroke="#ffffff"]{stroke:#171f27}
body.theme-dark svg [stop-color="#20262c"]{stop-color:#dfe7ee}
body.theme-dark svg [fill="rgba(32,38,44,.15)"]{fill:rgba(223,231,238,.18)}
/* 网格线:浅色下是深色半透明细线,深色下改为淡白细线(否则“隐身”) */
body.theme-dark svg [stroke="rgba(16,24,34,.06)"]{stroke:rgba(255,255,255,.08)}
body.theme-dark svg [stroke="rgba(16,24,34,.05)"]{stroke:rgba(255,255,255,.06)}
/* 柱色在暗背景上轻微提亮,提高辨识度 */
body.theme-dark svg [fill="#d9b84a"]{fill:#e3c35d}
body.theme-dark svg [fill="#5ba1c0"]{fill:#69b1d5}
/* 货盘:订单库存同步卡片(2026-10-18) */
.inv-sync-card{display:flex;align-items:center;gap:16px;padding:14px 18px;margin-bottom:16px;border-left:4px solid var(--teal)}
.inv-sync-main{min-width:0;flex:1 1 auto}
.inv-sync-title{display:flex;align-items:center;gap:8px;flex-wrap:wrap;font-size:14px;font-weight:700;color:var(--ink)}
.inv-sync-desc{margin-top:5px;font-size:12.5px;line-height:1.7;color:var(--tx3);word-break:break-word}
.inv-sync-card #as-sync-btn{flex:none;white-space:nowrap}
#view-assortment.ro #as-sync-btn{display:none}
#view-stock-automation.ro #stock-run-btn{display:none}
/* 自动化库存执行结果标签 */
.tag-ok{background:var(--teal-050);color:#007a72}
.tag-danger{background:var(--red-050);color:var(--red)}
body.theme-dark .tag-ok{background:#0f2a28;color:#3fc4b8}
body.theme-dark .tag-danger{background:#331f21;color:#ff8f8f}