/* ===== - Glassmorphism Pro UI v5.0 ===== */
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent;margin:0;padding:0;}
:root{
  --primary:#6b8e6b;--primary-light:#8bab8b;--primary-dark:#4a6e4a;--primary-darker:#3a5e3a;
  --primary-rgb:107,142,107;--primary-light-rgb:139,171,139;--primary-dark-rgb:74,110,74;--primary-darker-rgb:58,94,58;
  --accent:#c9a96e;--danger:#d4645c;--success:#6b9e6b;--info:#6b9eae;--warning:#d4a44e;
  --sidebar-width:86px;--header-height:56px;
  --card-bg:rgba(255,255,255,0.72);--body-bg:#e8e4dc;--text:#3a3a32;--text-muted:#7a7a6e;--text-light:#a0a090;
  --border:rgba(180,175,160,0.35);--border-light:rgba(200,195,180,0.25);--font-size:14px;
  --transition:all 0.3s cubic-bezier(0.4,0,0.2,1);
  --radius-sm:8px;--radius-md:12px;--radius-lg:16px;--radius-xl:20px;--radius-full:50px;
  --shadow-sm:0 1px 3px rgba(60,55,40,0.06);
  --shadow-md:0 4px 16px rgba(60,55,40,0.08);
  --shadow-lg:0 8px 30px rgba(60,55,40,0.1);
  --shadow-xl:0 16px 48px rgba(60,55,40,0.12);
  --glass:rgba(255,255,255,0.55);--glass-border:rgba(255,255,255,0.45);
  --gradient-start:var(--primary-dark);--gradient-end:var(--primary);--secondary:var(--primary-light);--secondary-light:rgba(var(--primary-rgb),0.08);
  --body-bg-gradient:linear-gradient(145deg,#e8e4dc 0%,#d8d4c8 30%,#e0dcd0 60%,#ece8e0 100%);
}
body{
  font-family:'Inter','Segoe UI','PingFang SC','Microsoft YaHei',sans-serif;
  background:var(--body-bg-gradient);
  min-height:100vh;font-size:var(--font-size);color:var(--text);overflow-x:hidden;
  background-attachment:fixed;
}
body.dark{--card-bg:rgba(30,35,28,0.8);--body-bg:#1a1e18;--text:#e0e0d8;--text-muted:#a0a098;--border:rgba(80,85,70,0.4);--border-light:rgba(60,65,50,0.3);--secondary-light:rgba(var(--primary-rgb),0.12);--glass:rgba(30,35,28,0.7);--glass-border:rgba(60,65,50,0.4);}
.hidden{display:none!important;}

/* ===== Login — 现代风格 ===== */
.login-overlay{position:fixed;inset:0;background:#f4f6f8;background-image:linear-gradient(180deg,#f8fafb 0%,#eef1f4 100%);z-index:2000;display:flex;justify-content:center;align-items:center;overflow:hidden;}
.login-bg-wave{position:absolute;inset:0;pointer-events:none;background:
  radial-gradient(ellipse 60% 40% at 20% 110%,rgba(148,163,184,0.18) 0%,transparent 60%),
  radial-gradient(ellipse 60% 40% at 80% -10%,rgba(148,163,184,0.14) 0%,transparent 60%),
  linear-gradient(140deg,transparent 40%,rgba(226,232,240,0.6) 60%,transparent 80%);
  opacity:0.9;}
.login-box{position:relative;background:#ffffff;border:1px solid #e6eaef;border-radius:20px;padding:44px 38px 32px;width:90%;max-width:400px;box-shadow:0 1px 2px rgba(15,23,42,0.04),0 12px 40px rgba(15,23,42,0.08);animation:loginFadeUp 0.4s cubic-bezier(0.4,0,0.2,1);}
@keyframes loginFadeUp{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:translateY(0)}}
@keyframes fadeUp{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}
@keyframes shake{0%,100%{transform:translateX(0)}25%{transform:translateX(-4px)}75%{transform:translateX(4px)}}
@keyframes pulse{0%,100%{box-shadow:0 0 0 0 rgba(var(--primary-rgb),.3)}50%{box-shadow:0 0 0 8px rgba(var(--primary-rgb),0)}}
@keyframes toastAnim{0%{opacity:0;transform:translateY(16px)}15%{opacity:1;transform:translateY(0)}80%{opacity:1}100%{opacity:0;transform:translateY(-8px)}}
@keyframes slideInRight{from{opacity:0;transform:translateX(60px)}to{opacity:1;transform:translateX(0)}}
@keyframes bounce{0%,100%{transform:translateY(0)}50%{transform:translateY(-5px)}}
.login-title{color:#0f172a;text-align:center;margin:0 0 28px;font-size:22px;font-weight:600;letter-spacing:0.5px;font-family:-apple-system,BlinkMacSystemFont,'Segoe UI','PingFang SC','Microsoft YaHei',sans-serif;}
.login-field{position:relative;margin-bottom:14px;}
.login-field-ico{position:absolute;left:16px;top:50%;transform:translateY(-50%);color:#94a3b8;display:flex;align-items:center;pointer-events:none;transition:color 0.2s ease;}
.login-field:focus-within .login-field-ico{color:#2563eb;}
.login-input{width:100%;padding:13px 16px 13px 42px;border:1px solid #e2e8f0;border-radius:12px;font-size:14px;background:#f8fafc;outline:none;transition:all 0.2s ease;color:#1e293b;font-family:-apple-system,BlinkMacSystemFont,'Segoe UI','PingFang SC','Microsoft YaHei',sans-serif;box-sizing:border-box;}
.login-input::placeholder{color:#94a3b8;font-size:13px;}
.login-input:hover{background:#ffffff;border-color:#cbd5e1;}
.login-input:focus{border-color:#2563eb;background:#ffffff;box-shadow:0 0 0 3px rgba(37,99,235,0.1);}
.login-btn{width:100%;padding:13px;background:linear-gradient(180deg,#2563eb,#1d4ed8);color:#fff;border:none;border-radius:12px;font-size:15px;font-weight:500;cursor:pointer;margin-top:10px;transition:all 0.2s ease;box-shadow:0 4px 12px rgba(37,99,235,0.25);letter-spacing:1px;font-family:inherit;}
.login-btn:hover{background:linear-gradient(180deg,#1d4ed8,#1e40af);box-shadow:0 6px 16px rgba(37,99,235,0.35);transform:translateY(-1px);}
.login-btn:active{transform:translateY(0);box-shadow:0 2px 6px rgba(37,99,235,0.2);}
.login-footer{display:flex;justify-content:space-between;align-items:center;margin-top:16px;font-size:12px;}
.login-link-muted{color:#64748b;text-decoration:none;transition:color 0.15s ease;}
.login-link-muted:hover{color:#2563eb;}
.login-error{color:#dc2626;font-size:12px;margin-top:10px;min-height:18px;text-align:center;}
/* 验证码 */
.login-captcha-row{display:flex;gap:10px;align-items:stretch;margin-bottom:14px;}
.login-captcha-field{flex:1;margin-bottom:0!important;}
.login-captcha-img{width:130px;height:46px;border:1px solid #e2e8f0;border-radius:10px;cursor:pointer;object-fit:cover;background:#fafbfc;transition:all 0.2s ease;flex-shrink:0;}
.login-captcha-img:hover{border-color:#2563eb;box-shadow:0 0 0 3px rgba(37,99,235,0.1);}

/* ===== Layout ===== */
.container{display:flex;min-height:100vh;max-width:100vw;padding:0;}

/* ===== Sidebar ===== */
.sidebar{
  width:var(--sidebar-width);
  background:rgba(255,255,255,0.35);
  backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px);
  border-right:1px solid rgba(255,255,255,0.4);
  position:fixed;left:0;top:0;bottom:0;z-index:100;display:flex;flex-direction:column;
  transition:width 0.35s cubic-bezier(0.4, 0, 0.2, 1);overflow-y:auto;overflow-x:hidden;
  will-change:width;
}
/* Mini Sidebar — */
.sidebar.mini{width:64px;overflow:visible;}
.sidebar.mini .sidebar-logo span{display:none;}
.sidebar.mini .sidebar-logo{justify-content:center;padding:10px 0;}
.sidebar.mini .nav-item{flex-direction:column;gap:2px;padding:8px 4px;margin:1px 4px;text-align:center;font-size:10px;justify-content:center;}
.sidebar.mini .nav-item .nav-icon{width:22px;height:22px;font-size:16px;}
.sidebar.mini .nav-item .nav-icon svg{width:20px;height:20px;}
.sidebar.mini .nav-item .nav-arrow{display:none;}
.sidebar.mini .nav-item .nav-badge{right:2px;top:2px;}
.sidebar.mini .nav-sub{display:none!important;}
.sidebar.mini .nav-divider{margin:2px 8px;}
.sidebar.mini .sidebar-footer{padding:8px 4px;}
.sidebar.mini .sidebar-user{flex-direction:column;gap:4px;padding:4px;}
.sidebar.mini .sidebar-user-info .name{font-size:9px;text-align:center;}
.sidebar.mini .sidebar-user-info .role{display:none;}
.sidebar.mini~.main-content{margin-left:64px;width:calc(100vw - 64px);}
.sidebar .nav-item,.sidebar .nav-icon,.sidebar .sidebar-logo span{transition:all 0.25s cubic-bezier(0.4, 0, 0.2, 1);}
.sidebar::-webkit-scrollbar{width:0;}
.sidebar-logo{padding:10px 4px;display:flex;flex-direction:column;align-items:center;gap:4px;border-bottom:1px solid rgba(var(--primary-rgb),0.12);flex-shrink:0;}
.sidebar-logo img{width:28px;height:28px;border-radius:8px;object-fit:contain;background:rgba(var(--primary-rgb),0.1);padding:2px;}
.sidebar-logo span{color:var(--primary-dark);font-size:9px;font-weight:800;white-space:nowrap;text-align:center;line-height:1.2;}
.sidebar-nav{flex:1;padding:3px 0;display:flex;flex-direction:column;gap:0;overflow-y:auto;}
.sidebar-nav::-webkit-scrollbar{width:0;}
.nav-divider{
  height:1px;
  background:linear-gradient(90deg,transparent,rgba(var(--primary-rgb),0.25),transparent);
  margin:5px 10px;
}
.nav-item{
  display:flex;flex-direction:column;align-items:center;gap:3px;padding:8px 4px;color:var(--text-muted);
  font-size:10.5px;font-weight:600;cursor:pointer;transition:all 0.25s cubic-bezier(0.4,0,0.2,1);
  text-decoration:none;position:relative;text-align:center;
  margin:2px 6px;border-radius:11px;white-space:nowrap;
}
.nav-item::before{
  content:'';position:absolute;left:0;top:50%;
  transform:translateY(-50%) scaleY(0);width:3px;height:60%;
  background:linear-gradient(180deg,var(--primary),var(--primary-dark));
  border-radius:0 3px 3px 0;transition:transform 0.25s ease;
}
.nav-item:hover{background:rgba(var(--primary-rgb),0.1);color:var(--primary-dark);transform:translateX(1px);}
.nav-item:hover::before{transform:translateY(-50%) scaleY(0.6);}
.nav-item:hover .nav-icon{transform:scale(1.1);}
@keyframes navActiveGlow{
  0%,100%{box-shadow:0 4px 12px rgba(var(--primary-dark-rgb),0.3),0 2px 4px rgba(var(--primary-dark-rgb),0.18),inset 0 1px 0 rgba(255,255,255,0.25);}
  50%{box-shadow:0 6px 18px rgba(var(--primary-dark-rgb),0.42),0 3px 6px rgba(var(--primary-dark-rgb),0.25),0 0 0 4px rgba(var(--primary-rgb),0.15),inset 0 1px 0 rgba(255,255,255,0.3);}
}
.nav-item.active{
  background:linear-gradient(135deg,var(--primary),var(--primary-dark));
  color:#fff;font-weight:800;transform:translateX(2px);
  animation:navActiveGlow 2.2s ease-in-out infinite;
}
.nav-item.active::before{transform:translateY(-50%) scaleY(1);background:linear-gradient(180deg,#f0f7f0,#d4e4d4);width:4px;box-shadow:0 0 8px rgba(255,255,255,0.5);}
.nav-item.active .nav-icon{color:#fff;transform:scale(1.12);filter:drop-shadow(0 2px 4px rgba(0,0,0,0.2));}
.nav-item.active::after{content:'';position:absolute;top:-6px;right:-6px;width:50px;height:50px;background:radial-gradient(circle,rgba(255,255,255,0.15),transparent 70%);pointer-events:none;}
.nav-item .nav-icon{width:24px;height:24px;display:flex;align-items:center;justify-content:center;flex-shrink:0;font-size:17px;transition:all 0.25s ease;}
.nav-item .nav-icon svg{width:21px;height:21px;stroke:currentColor;stroke-width:1.8;fill:none;stroke-linecap:round;stroke-linejoin:round;}
.nav-item .nav-badge{position:absolute;right:6px;top:4px;background:var(--danger);color:#fff;font-size:9px;padding:1px 5px;border-radius:8px;font-weight:700;box-shadow:0 2px 6px rgba(212,100,92,0.4);}
@keyframes navDangerGlow{
  0%,100%{box-shadow:0 4px 12px rgba(239,68,68,0.3),0 2px 4px rgba(185,28,28,0.2),inset 0 1px 0 rgba(255,255,255,0.2);}
  50%{box-shadow:0 6px 18px rgba(239,68,68,0.45),0 3px 6px rgba(185,28,28,0.25),0 0 0 4px rgba(239,68,68,0.15),inset 0 1px 0 rgba(255,255,255,0.25);}
}
.nav-item-danger{color:rgba(212,100,92,.85)!important;}
.nav-item-danger:hover{background:rgba(212,100,92,.1)!important;color:#d4645c!important;}
.nav-item-danger.active{
  background:linear-gradient(135deg,#ef4444,#b91c1c)!important;
  color:#fff!important;
  animation:navDangerGlow 2.2s ease-in-out infinite !important;
}
.nav-item-danger::before{background:linear-gradient(180deg,#ef4444,#b91c1c)!important;}

/* Sub menu */
.nav-sub{display:none;flex-direction:column;background:rgba(var(--primary-rgb),0.04);margin:1px 6px;border-radius:10px;padding:3px 0;}
.nav-sub.open{display:flex;}
.nav-sub .nav-item{padding:7px 4px;font-size:9.5px;margin:1px 4px;border-radius:8px;}
.nav-sub .nav-item::before{display:none;}
.nav-sub .nav-item .nav-icon{font-size:13px;width:18px;height:18px;}
.nav-item .nav-arrow{position:absolute;right:4px;top:4px;font-size:7px;color:var(--text-light);transition:transform 0.22s ease;display:block !important;}
.nav-item.expanded .nav-arrow{transform:rotate(90deg);color:var(--primary-dark);}
.nav-item.expanded{background:rgba(var(--primary-rgb),0.08);color:var(--primary-dark);}

.sidebar-footer{padding:6px 4px;border-top:1px solid rgba(var(--primary-rgb),0.1);flex-shrink:0;}
.sidebar-user{display:flex;flex-direction:column;align-items:center;gap:4px;cursor:pointer;padding:4px;border-radius:var(--radius-md);transition:var(--transition);}
.sidebar-user:hover{background:rgba(var(--primary-rgb),0.08);}
.sidebar-user-avatar{width:32px;height:32px;border-radius:50%;background:rgba(var(--primary-rgb),0.12);display:flex;align-items:center;justify-content:center;overflow:hidden;border:2px solid rgba(var(--primary-rgb),0.2);flex-shrink:0;}
.sidebar-user-avatar img{width:100%;height:100%;object-fit:cover;}
.sidebar-user-info{flex:1;min-width:0;}
.sidebar-user-info .name{color:var(--text);font-size:9px;font-weight:700;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-align:center;}
.sidebar-user-info .role{display:none;}

/* ===== Page Panel System - ===== */
.page-panel{
  animation:pageFadeIn .25s ease;
  width:100%;
  box-sizing:border-box;
  padding:16px 20px;
  min-height:calc(100vh - 56px);
}
/* — padding */
#page-home{padding:16px 20px;}
/* 仓库管理 — */
#page-stock-mgmt{
  overflow:hidden;
  max-width:100%;
  animation:none!important;
  padding:16px 20px;
}
#page-stock-mgmt .table-wrapper{
  overflow-x:auto!important;overflow-y:visible!important;display:block!important;
  max-width:100%!important;-webkit-overflow-scrolling:touch;scrollbar-width:thin;
}
@keyframes pageFadeIn{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}

/* page-content padding — page-panel */
.page-content{padding:0!important;}

/* */
@media(max-width:768px){
  .page-panel,
  #page-home,
  #page-stock-mgmt{padding:12px 14px;}
}

/* ===== Main ===== */
.main-content{flex:1;margin-left:var(--sidebar-width);display:flex;flex-direction:column;min-height:100vh;transition:margin-left 0.35s cubic-bezier(0.4, 0, 0.2, 1),width 0.35s cubic-bezier(0.4, 0, 0.2, 1);width:calc(100vw - var(--sidebar-width));box-sizing:border-box;overflow-y:auto;overflow-x:hidden;will-change:margin-left,width;}

/* ===== Header ===== */
.top-header{
  height:var(--header-height);
  background:rgba(255,255,255,0.45);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);
  display:flex;align-items:center;justify-content:space-between;padding:0 20px;
  border-bottom:1px solid rgba(255,255,255,0.35);
  position:sticky;top:0;z-index:50;
}
.header-left{display:flex;align-items:center;gap:10px;}
.sidebar-toggle{width:34px;height:34px;border:none;background:transparent;cursor:pointer;display:flex;align-items:center;justify-content:center;border-radius:var(--radius-sm);transition:var(--transition);font-size:17px;color:var(--text-muted);}
.sidebar-toggle:hover{background:rgba(var(--primary-rgb),0.1);color:var(--primary);}
.header-search{display:flex;align-items:center;background:rgba(255,255,255,0.5);border-radius:var(--radius-full);padding:0 14px;width:280px;border:1.5px solid rgba(255,255,255,0.4);transition:var(--transition);}
.header-search:focus-within{border-color:var(--primary);background:rgba(255,255,255,0.8);box-shadow:0 0 0 3px rgba(var(--primary-rgb),.08);}
.header-search input{border:none;background:transparent;padding:8px 0;font-size:12px;outline:none;flex:1;color:var(--text);}
.header-search input::placeholder{color:var(--text-light);}
.header-search .search-icon{color:var(--text-light);font-size:13px;margin-right:6px;}
.header-right{display:flex;align-items:center;gap:8px;}
.header-btn{width:36px;height:36px;border:none;background:rgba(255,255,255,0.3);cursor:pointer;display:flex;align-items:center;justify-content:center;border-radius:50%;transition:var(--transition);font-size:16px;color:var(--text-muted);position:relative;border:1px solid var(--border-light);}
.header-btn:hover{background:rgba(var(--primary-rgb),0.1);color:var(--primary);}
.header-btn .badge-dot{position:absolute;top:4px;right:4px;width:7px;height:7px;background:var(--danger);border-radius:50%;border:1.5px solid #fff;}

/* Header 带文字快捷按钮 — 统一柔和风格 */
.header-btn-text{
  width:auto !important;
  height:36px;
  padding:0 16px 0 13px !important;
  border-radius:18px !important;
  gap:7px;
  font-size:12.5px;
  font-weight:600;
  color:var(--text) !important;
  background:rgba(255,255,255,0.7) !important;
  border:1px solid var(--border) !important;
  box-shadow:0 1px 3px rgba(60,55,40,0.04) !important;
  backdrop-filter:blur(8px);
  -webkit-backdrop-filter:blur(8px);
  letter-spacing:0.3px;
}
.header-btn-text span{
  display:inline-block;
  white-space:nowrap;
  line-height:1;
}
.header-btn-text svg{
  transition:transform 0.25s ease;
  flex-shrink:0;
}
.header-btn-text:hover{
  background:linear-gradient(135deg,var(--primary),var(--primary-light)) !important;
  color:#fff !important;
  border-color:var(--primary) !important;
  box-shadow:0 4px 12px rgba(var(--primary-rgb),0.3) !important;
  transform:translateY(-1px);
}
.header-btn-text:hover svg{
  transform:rotate(-6deg) scale(1.08);
}
.header-btn-text:active{
  transform:translateY(0);
  box-shadow:0 2px 6px rgba(var(--primary-rgb),0.2) !important;
}

/* 危险按钮 — 安全退出 */
.header-btn-danger{
  color:#b91c1c !important;
  background:rgba(254,226,226,0.5) !important;
  border-color:rgba(239,68,68,0.25) !important;
}
.header-btn-danger:hover{
  background:linear-gradient(135deg,#ef4444,#b91c1c) !important;
  color:#fff !important;
  border-color:#ef4444 !important;
  box-shadow:0 4px 12px rgba(239,68,68,0.35) !important;
}

body.dark .header-btn-text{
  background:rgba(40,45,38,0.65) !important;
  color:#d0e0d0 !important;
  border-color:rgba(80,90,70,0.4) !important;
}
body.dark .header-btn-danger{
  background:rgba(127,29,29,0.25) !important;
  color:#fca5a5 !important;  border-color:rgba(239,68,68,0.35) !important;
}

/* ===== 💻 install-to-PC ===== */
.header-btn-install{
  background:linear-gradient(135deg,#10b981,#059669) !important;
  color:#fff !important;
  border:none !important;
  box-shadow:0 4px 14px rgba(16,185,129,0.35) !important;
  font-weight:700 !important;
  position:relative;
  overflow:hidden;
}
.header-btn-install::before{
  content:'';
  position:absolute;
  top:0;left:-100%;
  width:100%;height:100%;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,0.3),transparent);
  animation:shimmer 3s ease-in-out infinite;
}
@keyframes shimmer{
  0%,100%{left:-100%;}
  50%{left:100%;}
}
.header-btn-install:hover{
  background:linear-gradient(135deg,#059669,#047857) !important;
  transform:translateY(-2px) !important;
  box-shadow:0 6px 20px rgba(16,185,129,0.5) !important;
}
.header-btn-install svg{
  animation:bounce-soft 2s ease-in-out infinite;
}
@keyframes bounce-soft{
  0%,100%{transform:translateY(0);}
  50%{transform:translateY(-3px);}
}
body.dark .header-btn-install{
  background:linear-gradient(135deg,#059669,#047857) !important;
}

@media(max-width:700px){
  .header-btn-text span{display:none;}
  .header-btn-text{width:38px !important;padding:0 !important;border-radius:14px !important;gap:0;}
}
.header-user{display:flex;align-items:center;gap:7px;cursor:pointer;padding:4px 12px 4px 4px;border-radius:var(--radius-full);transition:var(--transition);}
.header-user:hover{background:rgba(var(--primary-rgb),0.08);}
.header-user-avatar{width:32px;height:32px;border-radius:50%;overflow:hidden;border:2px solid var(--border);}
.header-user-avatar img{width:100%;height:100%;object-fit:cover;}
.header-user-name{font-size:12px;font-weight:600;color:var(--text);}
.header-user-arrow{font-size:10px;color:var(--text-light);}

/* ===== Page Content ===== */
.page-content{flex:1;padding:10px;width:100%;box-sizing:border-box;}

/* ===== Breadcrumb ===== */
.breadcrumb{font-size:11px;color:var(--text-light);margin-bottom:14px;}
.breadcrumb a{color:var(--primary);text-decoration:none;}

/* ===== Page Views ===== */
.page-view{display:none;animation:fadeUp .3s ease;}
.page-view.active{display:block;}

/* ===== Dashboard Cards (Glassmorphism) ===== */
.dashboard-cards{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-bottom:20px;}
.dash-card{
  border-radius:var(--radius-xl);padding:22px 20px;display:flex;align-items:center;gap:16px;
  cursor:pointer;transition:var(--transition);color:#fff;position:relative;overflow:hidden;
  backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);
  border:1px solid rgba(255,255,255,0.3);
}
.dash-card:hover{transform:translateY(-3px);box-shadow:0 12px 28px rgba(0,0,0,.1);}
.dash-card:nth-child(1){background:linear-gradient(135deg,rgba(var(--primary-light-rgb),0.85),rgba(107,158,107,0.9));}
.dash-card:nth-child(2){background:linear-gradient(135deg,rgba(201,169,110,0.8),rgba(212,180,120,0.85));}
.dash-card:nth-child(3){background:linear-gradient(135deg,rgba(107,158,174,0.8),rgba(120,170,186,0.85));}
.dash-card:nth-child(4){background:linear-gradient(135deg,rgba(212,164,78,0.85),rgba(220,180,100,0.9));}
.dash-card::before{content:'';position:absolute;top:-20px;right:-20px;width:60px;height:60px;background:rgba(255,255,255,.12);border-radius:50%;}
.dash-card::after{content:'';position:absolute;bottom:-15px;left:-15px;width:45px;height:45px;background:rgba(255,255,255,.06);border-radius:50%;}
.dash-card-icon{font-size:28px;flex-shrink:0;opacity:.9;width:48px;height:48px;display:flex;align-items:center;justify-content:center;background:rgba(255,255,255,0.15);border-radius:14px;}
.dash-card-info{flex:1;}
.dash-card-label{font-size:11px;opacity:.85;margin-bottom:4px;font-weight:500;}
.dash-card-value{font-size:28px;font-weight:800;line-height:1.1;letter-spacing:-0.5px;}
.dash-card-sub{font-size:10px;opacity:.7;margin-top:2px;}

/* ===== Module Grid ===== */
.module-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:14px;margin-bottom:20px;}
.module-card{
  background:var(--card-bg);backdrop-filter:blur(12px);border:1px solid var(--glass-border);
  border-radius:var(--radius-lg);padding:24px 16px;text-align:center;
  cursor:pointer;transition:var(--transition);box-shadow:var(--shadow-sm);
}
.module-card:hover{border-color:var(--primary);transform:translateY(-3px);box-shadow:var(--shadow-md);}
.module-card-icon{width:52px;height:52px;border-radius:var(--radius-md);margin:0 auto 10px;display:flex;align-items:center;justify-content:center;font-size:24px;background:var(--secondary-light);color:var(--primary);transition:var(--transition);}
.module-card:hover .module-card-icon{background:var(--primary);color:#fff;}
.module-card-name{font-size:12px;font-weight:600;color:var(--text);}

/* ===== Content Card ===== */
.content-card{background:var(--card-bg);backdrop-filter:blur(12px);border-radius:var(--radius-lg);padding:20px;margin-bottom:16px;border:1px solid var(--glass-border);box-shadow:var(--shadow-sm);}
.content-card-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px;padding-bottom:10px;border-bottom:1px solid var(--border-light);}
.content-card-title{font-size:15px;font-weight:700;color:var(--text);display:flex;align-items:center;gap:8px;}

/* ===== Quick Actions ===== */
.quick-actions{
  display:flex;gap:8px;flex-wrap:wrap;padding:14px 18px;
  background:var(--card-bg);backdrop-filter:blur(12px);
  border-radius:var(--radius-lg);margin-bottom:16px;
  border:1px solid var(--glass-border);box-shadow:var(--shadow-sm);align-items:center;
}
.quick-actions .btn{font-size:11px;padding:7px 14px;border-radius:var(--radius-sm);}

/* ===== Search ===== */
.search-bar{display:none;}
.search-count{font-size:11px;color:var(--text-muted);}

/* ===== Lock ===== */
.lock-panel{
  background:var(--card-bg);backdrop-filter:blur(12px);
  border-radius:var(--radius-lg);padding:12px 18px;margin-bottom:14px;
  display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:10px;
  border:1px solid var(--glass-border);box-shadow:var(--shadow-sm);
}
.lock-status{padding:5px 14px;border-radius:var(--radius-full);color:#fff;font-weight:600;font-size:12px;}
.lock-status.locked{background:var(--danger);}
.lock-status.unlocked{background:var(--success);}
.lock-input{display:flex;gap:6px;}
.lock-input input{padding:7px 12px;border:1.5px solid var(--border);border-radius:var(--radius-full);font-size:12px;letter-spacing:3px;text-align:center;background:rgba(255,255,255,0.6);width:100px;outline:none;}
.lock-input input:focus{border-color:var(--primary);}

/* ===== Stats Grid (Glassmorphism) ===== */
.stats-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:12px;margin-bottom:16px;}
.stat-card{
  border-radius:var(--radius-lg);padding:16px 12px;color:#fff;text-align:center;
  cursor:pointer;transition:var(--transition);position:relative;overflow:hidden;
  border:1px solid rgba(255,255,255,0.25);backdrop-filter:blur(6px);
}
.stat-card:nth-child(1){background:linear-gradient(135deg,rgba(var(--primary-rgb),0.85),rgba(var(--primary-light-rgb),0.9));}
.stat-card:nth-child(2){background:linear-gradient(135deg,rgba(107,158,174,0.85),rgba(130,175,190,0.9));}
.stat-card:nth-child(3){background:linear-gradient(135deg,rgba(107,158,107,0.85),rgba(130,180,130,0.9));}
.stat-card:nth-child(4){background:linear-gradient(135deg,rgba(201,169,110,0.85),rgba(212,180,120,0.9));}
.stat-card:nth-child(5){background:linear-gradient(135deg,rgba(212,100,92,0.8),rgba(220,120,110,0.85));}
.stat-card::before{content:'';position:absolute;top:-14px;right:-14px;width:44px;height:44px;background:rgba(255,255,255,.1);border-radius:50%;}
.stat-card:hover{transform:translateY(-3px);box-shadow:0 8px 20px rgba(0,0,0,.1);}
.stat-card .val{font-size:20px;font-weight:800;margin:4px 0;}
.stat-card .lbl{font-size:10px;opacity:.85;font-weight:500;}

/* ===== Table ===== */
.toolbar{
  display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:10px;margin-bottom:12px;
  background:var(--card-bg);backdrop-filter:blur(12px);
  border-radius:var(--radius-lg);padding:12px 18px;
  border:1px solid var(--glass-border);box-shadow:var(--shadow-sm);
}
.table-wrapper{
  overflow-x:auto;border-radius:var(--radius-lg);
  border:1px solid var(--glass-border);box-shadow:var(--shadow-sm);
  background:var(--card-bg);backdrop-filter:blur(12px);
  width:100%;box-sizing:border-box;-webkit-overflow-scrolling:touch;
}
table{width:100%;border-collapse:collapse;font-size:11px;table-layout:auto;}
table th,table td{box-sizing:border-box;}
th{background:#f0f5f0;color:#2d4a2d;border:1px solid #c8d8c8;padding:10px 12px;font-weight:700;font-size:13px;position:sticky;top:0;text-align:center;white-space:nowrap;vertical-align:middle;z-index:2;}
th span.th-badge{display:inline;background:none;border:none;padding:0;border-radius:0;color:inherit;font-size:12px;font-weight:inherit;}
body.dark th{background:#2a352a;color:#d0e0d0;border-color:#3a4a3a;}
body.dark th span.th-badge{color:inherit;}
td{text-align:center;border:1px solid #d8e4d8;color:var(--text);white-space:nowrap;vertical-align:middle;padding:8px 10px;font-size:13px;}
tr:hover td{background:rgba(239,68,68,0.08)!important;transition:background 0.15s ease;cursor:pointer;}
tr:nth-child(even) td{background:#fafcfa;}
/* ★ — (!important CSS ) */
.table-wrapper tr.selected td,
.table-wrapper tr.selected:hover td,
.table-wrapper tr.selected:nth-child(even) td,
.table-wrapper tr.selected:nth-child(even):hover td{background:#dbeafe!important;color:#1e293b!important;}
tr:nth-child(even):hover td{background:#f0f5f0;}
.product-img{width:28px;height:28px;object-fit:cover;border-radius:6px;cursor:pointer;vertical-align:middle;display:block;margin:0 auto;}

/* ===== Buttons ===== */
.btn{padding:8px 16px;border:none;border-radius:var(--radius-sm);font-size:12px;font-weight:600;cursor:pointer;transition:var(--transition);display:inline-flex;align-items:center;gap:4px;}
.btn:hover{transform:translateY(-1px);filter:brightness(1.05);}
.btn-primary{background:linear-gradient(135deg,var(--primary),var(--primary-light));color:#fff;}
.btn-primary:hover{background:linear-gradient(135deg,var(--primary-dark),var(--primary));}
.btn-secondary{background:rgba(var(--primary-rgb),0.08);color:var(--primary-dark);border:1px solid var(--border);}
.btn-secondary:hover{background:rgba(var(--primary-rgb),0.15);}
.btn-danger{background:var(--danger);color:#fff;}
.btn-info{background:var(--info);color:#fff;}
.btn-success{background:var(--success);color:#fff;}
.action-btns{white-space:nowrap;text-align:center;}
.action-btns .edit-btn,.action-btns .del-btn,.action-btns .print-btn{margin:0 2px;}
.edit-btn{padding:4px 10px;border-radius:var(--radius-sm);font-size:10px;font-weight:600;cursor:pointer;border:none;background:var(--primary);color:#fff;white-space:nowrap;transition:var(--transition);display:inline-block;}
.del-btn{padding:4px 10px;border-radius:var(--radius-sm);font-size:10px;font-weight:600;cursor:pointer;border:none;background:var(--danger);color:#fff;white-space:nowrap;transition:var(--transition);display:inline-block;}
.print-btn{padding:4px 10px;border-radius:var(--radius-sm);font-size:10px;font-weight:600;cursor:pointer;border:none;background:var(--info);color:#fff;white-space:nowrap;transition:var(--transition);display:inline-block;}
.badge{padding:2px 8px;border-radius:var(--radius-full);font-size:10px;display:inline-block;line-height:1.5;vertical-align:middle;font-weight:600;}
.badge-v{background:rgba(124,58,237,0.1);color:#7c3aed;}
.badge-b{background:rgba(234,88,12,0.1);color:#ea580c;}
.badge-n{background:rgba(22,163,74,0.1);color:#16a34a;}
.badge-gift{background:rgba(201,169,110,0.15);color:#b8860b;}

/* ===== Modal ===== */
.modal{display:none;position:fixed;inset:0;background:rgba(40,40,30,.35);z-index:1000;justify-content:center;align-items:center;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);opacity:0;transition:opacity .25s ease;}
.modal.show{opacity:1;}
.modal-content{background:rgba(255,255,255,0.88);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border:1px solid rgba(255,255,255,0.5);border-radius:var(--radius-xl);padding:22px;width:92%;max-width:580px;max-height:88vh;overflow-y:auto;box-shadow:var(--shadow-xl);transform:scale(.88) translateY(14px);opacity:0;transition:all .3s cubic-bezier(.34,1.56,.64,1);}
.modal.show .modal-content{transform:scale(1) translateY(0);opacity:1;}
.modal-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px;padding-bottom:10px;border-bottom:1.5px solid var(--border);}
.modal-header h3{margin:0;color:var(--text);flex:1;text-align:center;font-size:15px;}
.close-btn{background:none;border:none;font-size:20px;cursor:pointer;color:var(--text-muted);line-height:1;width:30px;height:30px;display:flex;align-items:center;justify-content:center;border-radius:50%;transition:var(--transition);}
.close-btn:hover{color:var(--danger);background:rgba(212,100,92,0.08);}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;}
.form-field{display:flex;flex-direction:column;gap:3px;}
.form-field label{font-size:11px;font-weight:600;color:var(--primary-dark);}
.form-field input,.form-field select,.form-field textarea{padding:9px 12px;border:1.5px solid var(--border);border-radius:var(--radius-md);font-size:12px;background:rgba(255,255,255,0.7);outline:none;transition:var(--transition);color:var(--text);}
.form-field input:focus,.form-field select:focus,.form-field textarea:focus{border-color:var(--primary);box-shadow:0 0 0 3px rgba(var(--primary-rgb),.08);}
.full-width{grid-column:span 2;}
.modal-footer{display:flex;gap:10px;margin-top:14px;}
.modal-footer .btn{flex:1;padding:11px;font-size:13px;font-weight:700;border-radius:var(--radius-md);}

/* ===== Gallery ===== */
.gallery-upload-btn{background:linear-gradient(135deg,var(--primary),var(--primary-light));color:#fff;padding:11px;border-radius:var(--radius-md);text-align:center;cursor:pointer;margin:0 0 10px;font-weight:600;}
.gallery-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;max-height:340px;overflow-y:auto;padding:3px;}
.gallery-item{position:relative;background:rgba(var(--primary-rgb),0.06);border-radius:var(--radius-md);padding:4px;cursor:pointer;border:2px solid transparent;transition:var(--transition);}
.gallery-item:hover{border-color:var(--primary);}
.gallery-item img{width:100%;height:76px;object-fit:cover;border-radius:6px;display:block;}
.gallery-del{position:absolute;top:3px;right:3px;background:var(--danger);color:#fff;border:none;border-radius:50%;width:18px;height:18px;font-size:10px;cursor:pointer;display:flex;align-items:center;justify-content:center;}

/* ===== AI Panel (Glassmorphism) ===== */
.ai-panel{
  background:var(--card-bg);backdrop-filter:blur(12px);
  border-radius:var(--radius-lg);padding:16px;margin-top:16px;
  border:1px solid var(--glass-border);box-shadow:var(--shadow-sm);
}
.ai-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:10px;margin-bottom:10px;}
.ai-card{
  background:rgba(var(--primary-rgb),0.08);border-radius:var(--radius-md);padding:14px 10px;
  text-align:center;border:1px solid rgba(var(--primary-rgb),0.12);
}
.ai-card .val{font-size:17px;font-weight:800;color:var(--primary-dark);}
.ai-card .lbl{font-size:10px;color:var(--text-muted);margin-top:2px;}

/* ===== Toast ===== */
.toast{position:fixed;bottom:20px;right:20px;color:#fff;padding:11px 18px;border-radius:var(--radius-md);font-size:12px;z-index:9999;pointer-events:none;animation:toastAnim 2.5s ease forwards;box-shadow:var(--shadow-lg);font-weight:600;backdrop-filter:blur(8px);}
.toast.ok{background:rgba(107,158,107,0.9);}
.toast.err{background:rgba(212,100,92,0.9);}

/* ===== Footer ===== */
.contact-bar{background:var(--card-bg);backdrop-filter:blur(12px);border-radius:var(--radius-lg);padding:12px 18px;margin-top:16px;display:flex;justify-content:space-between;flex-wrap:wrap;color:var(--text-muted);font-size:11px;border:1px solid var(--glass-border);box-shadow:var(--shadow-sm);}
.server-status{background:var(--card-bg);backdrop-filter:blur(12px);border-radius:var(--radius-lg);padding:10px 18px;margin-top:8px;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:6px;color:var(--text-muted);font-size:10px;border:1px solid var(--glass-border);box-shadow:var(--shadow-sm);}
.status-dot{width:7px;height:7px;border-radius:50%;display:inline-block;margin-right:4px;}
.status-dot.online{background:var(--success);box-shadow:0 0 6px var(--success);}
.status-dot.offline{background:var(--danger);box-shadow:0 0 6px var(--danger);}

/* ===== Color Panel ===== */
.color-panel{position:absolute;top:100%;right:0;background:rgba(255,255,255,.92);backdrop-filter:blur(20px);border:1px solid var(--glass-border);border-radius:var(--radius-xl);padding:14px;box-shadow:var(--shadow-xl);z-index:200;width:260px;transform:translateY(-8px) scale(.96);transform-origin:top right;opacity:0;transition:all .25s cubic-bezier(.34,1.56,.64,1);pointer-events:none;}
.color-panel.open{transform:translateY(0) scale(1);opacity:1;pointer-events:all;}
.color-panel-title{font-size:11px;font-weight:700;color:var(--primary-dark);margin-bottom:8px;display:flex;justify-content:space-between;align-items:center;gap:3px;}
.color-panel-grid{display:grid;grid-template-columns:1fr 1fr;gap:5px;margin-bottom:6px;}
.color-item{display:flex;align-items:center;gap:4px;background:rgba(var(--primary-rgb),0.05);border:1px solid var(--border);padding:4px 7px;border-radius:var(--radius-sm);font-size:10px;font-weight:600;color:var(--text);}
.color-item input[type=color]{width:22px;height:18px;border:none;border-radius:3px;cursor:pointer;padding:0;background:none;}
.reset-btn{background:linear-gradient(135deg,var(--primary),var(--primary-light));border:none;color:#fff!important;-webkit-text-fill-color:#fff!important;padding:4px 10px;border-radius:var(--radius-full);cursor:pointer;font-size:10px;font-weight:600;}
.color-float-btn{display:none;}

/* ===== Pagination ===== */
.pagination{display:flex;justify-content:center;align-items:center;gap:4px;padding:12px 0;}
.pagination .page-btn{width:32px;height:32px;border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--card-bg);color:var(--text);font-size:12px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:var(--transition);}
.pagination .page-btn:hover{border-color:var(--primary);color:var(--primary);}
.pagination .page-btn.active{background:var(--primary);color:#fff;border-color:var(--primary);}

/* ===== Overlay & Responsive ===== */
.sidebar-overlay{display:none;position:fixed;inset:0;background:rgba(40,40,30,.35);z-index:999;backdrop-filter:blur(3px);}
.top-bar{display:none!important;}
@media(max-width:768px){
  .sidebar-overlay.show{display:block;}
  .sidebar{transform:translateX(-100%);position:fixed;z-index:1000;}
  .sidebar.open{transform:translateX(0);}
  .main-content{margin-left:0;width:100vw;max-width:100vw;}
  .dashboard-cards{grid-template-columns:1fr 1fr;}
  .stats-grid{grid-template-columns:repeat(2,1fr);}
  .module-grid{grid-template-columns:repeat(2,1fr);}
  .form-grid{grid-template-columns:1fr;}
  .full-width{grid-column:span 1;}
  .header-search{display:none;}
  .page-content{padding:14px;}
 /* responsive */
  #statsSection{grid-template-columns:1fr 1fr!important;}
  #statsSection>div:nth-child(4){grid-column:span 2;}
  .home-bottom-grid{grid-template-columns:1fr!important;grid-template-areas:'left' 'right' 'ai'!important;}
}
@media(max-width:480px){
  .dashboard-cards,.stats-grid{grid-template-columns:1fr;}
  .module-grid{grid-template-columns:repeat(2,1fr);}
}
@media print{
  .sidebar,.top-header,.quick-actions,.lock-panel,.ai-panel,.contact-bar,.server-status,.action-btns{display:none!important;}
  .main-content{margin-left:0!important;}
  .page-content{padding:0!important;}
  .table-wrapper{border:none!important;box-shadow:none!important;}
}

/* ===== ===== */
#bigDonutCanvas {
  display: block;
}
[style*="grid-area:ai"] {
  min-height: 160px;
}

/* ===== 14 Page Panel System Styles ===== */

/* Panel Header */
.panel-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:22px;flex-wrap:wrap;gap:12px;}
.panel-header h2{font-size:20px;font-weight:800;color:var(--text);margin:0;}
.panel-header .panel-desc{font-size:13px;color:var(--text-muted);margin:4px 0 0;}
.panel-actions{display:flex;gap:8px;flex-wrap:wrap;}

/* Panel Buttons */
.panel-btn{padding:8px 18px;border:1.5px solid var(--border);border-radius:var(--radius-md);background:rgba(255,255,255,0.6);color:var(--text-muted);font-size:12px;font-weight:600;cursor:pointer;transition:var(--transition);backdrop-filter:blur(6px);}
.panel-btn:hover{border-color:var(--primary);color:var(--primary-dark);background:rgba(var(--primary-rgb),0.08);}
.panel-btn.active{background:linear-gradient(135deg,var(--primary),var(--primary-light));color:#fff;border-color:var(--primary);}

/* Panel Card — */
.panel-card{
  background:#fff;
  border-radius:14px;
  padding:20px;
  border:1px solid rgba(var(--primary-rgb),0.1);
  box-shadow:0 2px 6px rgba(var(--primary-dark-rgb),0.05),0 1px 2px rgba(var(--primary-dark-rgb),0.03);
  transition:all 0.25s ease;
}
.panel-card:hover{
  box-shadow:0 5px 14px rgba(var(--primary-dark-rgb),0.08),0 2px 4px rgba(var(--primary-dark-rgb),0.04);
}
.panel-card h4{font-size:14px;font-weight:800;color:var(--text);margin:0 0 14px;display:flex;align-items:center;gap:8px;letter-spacing:-0.2px;}

/* Panel Body Grid */
.panel-body-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;}
@media(max-width:768px){.panel-body-grid{grid-template-columns:1fr;}}

/* Stats Row — */
.stats-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:14px;margin-bottom:16px;}
.stat-box{
  display:flex;align-items:center;gap:14px;padding:20px;border-radius:14px;
  color:#fff;position:relative;overflow:hidden;
  border:1px solid rgba(255,255,255,0.25);
  box-shadow:0 3px 10px rgba(0,0,0,0.08),0 1px 3px rgba(0,0,0,0.04);
  transition:all 0.28s cubic-bezier(0.4,0,0.2,1);
}
.stat-box:hover{
  transform:translateY(-3px);
  box-shadow:0 10px 24px rgba(0,0,0,0.15),0 4px 8px rgba(0,0,0,0.08);
}
.stat-box::after{content:'';position:absolute;top:-20px;right:-20px;width:80px;height:80px;background:rgba(255,255,255,.12);border-radius:50%;pointer-events:none;}
.stat-box::before{content:'';position:absolute;bottom:-25px;left:-25px;width:70px;height:70px;background:rgba(255,255,255,.06);border-radius:50%;pointer-events:none;}
.stat-box .stat-icon{font-size:26px;flex-shrink:0;width:48px;height:48px;display:flex;align-items:center;justify-content:center;background:rgba(255,255,255,.2);border-radius:12px;position:relative;z-index:1;box-shadow:inset 0 1px 0 rgba(255,255,255,0.25);}
.stat-box .stat-label{font-size:12px;opacity:.9;font-weight:600;position:relative;z-index:1;letter-spacing:0.3px;}
.stat-box .stat-value{font-size:24px;font-weight:900;margin:3px 0;position:relative;z-index:1;letter-spacing:-0.5px;}
.stat-box .stat-sub{font-size:10.5px;opacity:.8;position:relative;z-index:1;}
/* */
.stat-orange{background:linear-gradient(135deg,#d97706,#b45309);}
.stat-blue{background:linear-gradient(135deg,var(--primary),var(--primary-dark));}
.stat-green{background:linear-gradient(135deg,#10b981,#047857);}
.stat-red{background:linear-gradient(135deg,#dc2626,#991b1b);}
.stat-teal{background:linear-gradient(135deg,#0d9488,#0f766e);}
.stat-purple{background:linear-gradient(135deg,#8b5cf6,#6d28d9);}

/* Data Table */
.table-wrapper-sm{overflow-x:auto;border-radius:var(--radius-md);border:1px solid var(--border);}
.data-table{width:100%;border-collapse:collapse;font-size:12px;}
.data-table th{background:linear-gradient(135deg,var(--primary-dark),var(--primary));color:#fff;padding:11px 12px;font-weight:600;text-align:center;white-space:nowrap;position:sticky;top:0;z-index:1;}
.data-table td{padding:11px 12px;text-align:center;border-bottom:1px solid var(--border-light);color:var(--text);white-space:nowrap;}
.data-table tr:hover td{background:rgba(var(--primary-rgb),0.06);}
.data-table input[type="checkbox"]{width:15px;height:15px;cursor:pointer;accent-color:var(--primary);}

/* Action Button */
.action-btn{padding:5px 14px;background:linear-gradient(135deg,var(--primary),var(--primary-light));color:#fff;border:none;border-radius:var(--radius-sm);cursor:pointer;font-size:11px;font-weight:600;transition:var(--transition);}
.action-btn:hover{filter:brightness(1.1);transform:translateY(-1px);}

/* Status Badge */
.status-badge{padding:3px 10px;border-radius:var(--radius-full);font-size:10px;font-weight:600;display:inline-block;}
.status-badge.green{background:rgba(22,163,74,0.1);color:#16a34a;}
.status-badge.red{background:rgba(220,38,38,0.1);color:#dc2626;}
.status-badge.yellow{background:rgba(217,119,6,0.1);color:#d97706;}

/* Small Form */
.btn-primary-sm{padding:9px 22px;background:linear-gradient(135deg,var(--primary),var(--primary-light));color:#fff;border:none;border-radius:var(--radius-md);cursor:pointer;font-size:12px;font-weight:700;transition:var(--transition);box-shadow:0 2px 10px rgba(var(--primary-rgb),.2);}
.btn-primary-sm:hover{background:linear-gradient(135deg,var(--primary-dark),var(--primary));transform:translateY(-1px);}
.btn-outline{padding:9px 22px;background:rgba(255,255,255,0.6);color:var(--text-muted);border:1.5px solid var(--border);border-radius:var(--radius-md);cursor:pointer;font-size:12px;font-weight:600;transition:var(--transition);}
.btn-outline:hover{border-color:var(--primary);color:var(--primary-dark);}
.form-input-sm{padding:8px 12px;border:1.5px solid var(--border);border-radius:var(--radius-md);font-size:12px;outline:none;transition:var(--transition);color:var(--text);background:rgba(255,255,255,0.6);}
.form-input-sm:focus{border-color:var(--primary);box-shadow:0 0 0 3px rgba(var(--primary-rgb),.08);}

/* Mini Form */
.mini-form{display:flex;flex-direction:column;gap:10px;}
.mini-form-row{display:grid;grid-template-columns:auto 1fr auto 1fr;gap:8px;align-items:center;}
.mini-form-row label{font-size:11px;font-weight:600;color:var(--text-muted);white-space:nowrap;}
.mini-form-row input,.mini-form-row select{padding:8px 10px;border:1.5px solid var(--border);border-radius:var(--radius-sm);font-size:12px;outline:none;transition:var(--transition);background:rgba(255,255,255,0.6);}
.mini-form-row input:focus,.mini-form-row select:focus{border-color:var(--primary);}

/* Upload Zone */
.upload-zone{border:2px dashed var(--border);border-radius:var(--radius-lg);padding:32px;text-align:center;cursor:pointer;transition:var(--transition);background:rgba(var(--primary-rgb),0.04);}
.upload-zone:hover{border-color:var(--primary);background:rgba(var(--primary-rgb),0.08);}

/* ===== AI Chat ===== */
.ai-chat-container{display:flex;flex-direction:column;height:calc(100vh - 200px);max-height:600px;background:var(--card-bg);backdrop-filter:blur(12px);border-radius:var(--radius-lg);border:1px solid var(--glass-border);overflow:hidden;}
.ai-chat-messages{flex:1;overflow-y:auto;padding:18px;display:flex;flex-direction:column;gap:12px;}
.ai-msg{display:flex;gap:10px;align-items:flex-start;}
.ai-msg-user{flex-direction:row-reverse;}
.ai-avatar{width:36px;height:36px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:18px;flex-shrink:0;background:rgba(var(--primary-rgb),0.08);}
.ai-msg-bot .ai-avatar{background:linear-gradient(135deg,var(--primary),var(--primary-dark));color:#fff;}
.ai-bubble{max-width:70%;padding:11px 16px;border-radius:16px;font-size:13px;line-height:1.6;color:var(--text);}
.ai-msg-bot .ai-bubble{background:rgba(var(--primary-rgb),0.08);border-bottom-left-radius:4px;}
.ai-msg-user .ai-bubble{background:linear-gradient(135deg,var(--primary),var(--primary-light));color:#fff;border-bottom-right-radius:4px;}
.ai-chat-input-area{padding:14px;border-top:1px solid var(--border);display:flex;gap:10px;align-items:flex-end;background:rgba(255,255,255,0.4);}
.ai-chat-input{flex:1;padding:11px 14px;border:1.5px solid var(--border);border-radius:var(--radius-md);font-size:13px;resize:none;outline:none;font-family:inherit;transition:var(--transition);background:rgba(255,255,255,0.6);}
.ai-chat-input:focus{border-color:var(--primary);box-shadow:0 0 0 3px rgba(var(--primary-rgb),.08);}
.ai-send-btn{padding:11px 26px;background:linear-gradient(135deg,var(--primary),var(--primary-light));color:#fff;border:none;border-radius:var(--radius-md);cursor:pointer;font-weight:700;font-size:13px;transition:var(--transition);white-space:nowrap;}
.ai-send-btn:hover{background:linear-gradient(135deg,var(--primary-dark),var(--primary));}

/* ===== AI催款 专用样式 ===== */
.ai-debt-toolbar{
  display:flex;
  align-items:center;
  gap:12px;
  flex-wrap:wrap;
  padding:4px 2px;
}
.ai-debt-toolbar .cs-chip-group{flex-shrink:0;}
.ai-debt-toolbar .cs-search{flex:1;min-width:220px;width:auto;max-width:360px;}
.ai-debt-toolbar-right{
  display:flex;
  align-items:center;
  gap:10px;
  margin-left:auto;
  flex-shrink:0;
}
.ai-debt-badge{
  padding:6px 12px;
  background:rgba(var(--primary-rgb),0.08);
  color:var(--primary-dark);
  border-radius:20px;
  font-size:11px;
  font-weight:700;
  border:1px solid rgba(var(--primary-rgb),0.18);
}

/* AI催款 专用表格 - 大字号清晰样式 */
#page-ai-debt .data-table{font-size:14px;}
#page-ai-debt .data-table th{
  padding:14px 14px;
  font-size:13px;
  font-weight:700;
  letter-spacing:0.4px;
}
#page-ai-debt .data-table td{
  padding:14px 14px;
  font-size:13.5px;
  color:var(--text);
}
#page-ai-debt .data-table input[type="checkbox"]{
  width:17px;
  height:17px;
}

.ai-debt-avatar{
  width:34px;height:34px;border-radius:50%;
  background:linear-gradient(135deg,var(--primary),var(--primary-dark));
  color:#fff;display:flex;align-items:center;justify-content:center;
  font-weight:800;font-size:14px;flex-shrink:0;
  box-shadow:0 2px 6px rgba(var(--primary-dark-rgb),0.22);
}
.ai-debt-name{
  font-weight:700;
  font-size:14px;
  color:var(--text);
  letter-spacing:0.2px;
}
.ai-debt-phone{
  font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  font-size:13px;
  font-weight:600;
  color:var(--text);
  letter-spacing:0.3px;
}
.ai-debt-amount{
  color:#dc2626;
  font-weight:800;
  font-size:15px;
  letter-spacing:0.3px;
}
.ai-debt-amount-sub{
  font-size:11px;
  color:#94a3b8;
  margin-top:2px;
  font-weight:600;
}
.ai-debt-days{
  font-weight:800;
  font-size:14px;
  letter-spacing:0.3px;
}
.ai-debt-status{
  display:inline-block;
  padding:5px 14px;
  border-radius:20px;
  font-size:12px;
  font-weight:700;
  letter-spacing:0.3px;
}
.ai-debt-status.overdue{background:rgba(239,68,68,0.12);color:#dc2626;border:1px solid rgba(239,68,68,0.25);}
.ai-debt-status.warn{background:rgba(245,158,11,0.12);color:#d97706;border:1px solid rgba(245,158,11,0.28);}
.ai-debt-status.new{background:rgba(16,185,129,0.12);color:#059669;border:1px solid rgba(16,185,129,0.28);}

.ai-debt-level{
  display:inline-block;
  color:#fff;
  padding:5px 14px;
  border-radius:20px;
  font-size:12px;
  font-weight:700;
  letter-spacing:0.4px;
  box-shadow:0 2px 5px rgba(0,0,0,0.12);
}
.ai-debt-btn{
  display:inline-flex;
  align-items:center;
  gap:5px;
  padding:7px 14px;
  border:none;
  border-radius:var(--radius-sm);
  cursor:pointer;
  font-size:12.5px;
  font-weight:700;
  transition:var(--transition);
  margin:0 2px;
  letter-spacing:0.3px;
}
.ai-debt-btn-call{
  background:linear-gradient(135deg,#10b981,#059669);
  color:#fff;
  box-shadow:0 2px 6px rgba(16,185,129,0.28);
}
.ai-debt-btn-call:hover{
  filter:brightness(1.08);
  transform:translateY(-1px);
  box-shadow:0 4px 10px rgba(16,185,129,0.35);
}
.ai-debt-btn-view{
  padding:7px 10px;
  background:rgba(var(--primary-rgb),0.1);
  color:var(--primary-dark);
  border:1px solid rgba(var(--primary-rgb),0.22);
}
.ai-debt-btn-view:hover{
  background:var(--primary);
  color:#fff;
  border-color:var(--primary);
}

@media(max-width:768px){
  .ai-debt-toolbar{flex-direction:column;align-items:stretch;}
  .ai-debt-toolbar .cs-search{max-width:100%;}
  .ai-debt-toolbar-right{margin-left:0;justify-content:space-between;}
  #page-ai-debt .data-table th,
  #page-ai-debt .data-table td{padding:10px 8px;font-size:12.5px;}
}

body.dark .ai-debt-badge{background:rgba(var(--primary-rgb),0.18);border-color:rgba(var(--primary-rgb),0.3);color:#c8d8c8;}
body.dark .ai-debt-btn-view{background:rgba(var(--primary-rgb),0.2);color:#d0e0d0;border-color:rgba(var(--primary-rgb),0.3);}
body.dark .ai-debt-status.overdue{background:rgba(239,68,68,0.18);color:#fca5a5;}
body.dark .ai-debt-status.warn{background:rgba(245,158,11,0.18);color:#fcd34d;}
body.dark .ai-debt-status.new{background:rgba(16,185,129,0.18);color:#6ee7b7;}

/* ===== 导出中心 专用样式 ===== */
.export-table{
  width:100%;
  border-collapse:collapse;
  font-size:13px;
  border-radius:10px;
  overflow:hidden;
  border:1px solid var(--border-light);
}
.export-table tr{
  cursor:pointer;
  transition:background 0.15s ease;
  border-bottom:1px solid var(--border-light);
}
.export-table tr:last-child{border-bottom:none;}
.export-table tr:hover{background:rgba(var(--primary-rgb),0.06);}
.export-table tr:has(input[type="checkbox"]:checked){
  background:rgba(var(--primary-rgb),0.08);
}
.export-table tr:has(input[type="checkbox"]:checked) .export-table-name label{
  color:var(--primary-dark);
  font-weight:700;
}
.export-table td{
  padding:9px 10px;
  vertical-align:middle;
}
.export-table-chk{
  width:32px;
  text-align:center;
}
.export-table-chk input[type="checkbox"]{
  width:16px;height:16px;
  accent-color:var(--primary);
  cursor:pointer;
  margin:0;
  vertical-align:middle;
}
.export-table-ico{
  width:36px;
  padding-left:0;
  padding-right:0;
}
.export-table-ico span{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:30px;height:30px;
  border-radius:8px;
  background:rgba(var(--primary-rgb),0.1);
  color:var(--primary-dark);
}
.export-table tr[data-color="blue"]   .export-table-ico span{background:rgba(59,130,246,0.12);color:#2563eb;}
.export-table tr[data-color="green"]  .export-table-ico span{background:rgba(16,185,129,0.12);color:#059669;}
.export-table tr[data-color="purple"] .export-table-ico span{background:rgba(139,92,246,0.12);color:#7c3aed;}
.export-table tr[data-color="red"]    .export-table-ico span{background:rgba(239,68,68,0.12);color:#dc2626;}
.export-table tr[data-color="amber"]  .export-table-ico span{background:rgba(245,158,11,0.12);color:#d97706;}
.export-table tr[data-color="rose"]   .export-table-ico span{background:rgba(244,63,94,0.12);color:#e11d48;}
.export-table tr[data-color="teal"]   .export-table-ico span{background:rgba(20,184,166,0.12);color:#0d9488;}
.export-table tr[data-color="indigo"] .export-table-ico span{background:rgba(99,102,241,0.12);color:#4f46e5;}
.export-table-name label{
  font-size:13px;
  font-weight:600;
  color:var(--text);
  cursor:pointer;
  display:block;
  letter-spacing:0.2px;
}
.export-table-desc{
  font-size:11px;
  color:var(--text-muted);
  text-align:right;
  white-space:nowrap;
}

/* 导出参数区 */
.export-field{margin-bottom:14px;}
.export-field-label{
  display:block;
  font-size:12px;
  font-weight:700;
  color:var(--text);
  margin-bottom:7px;
  letter-spacing:0.2px;
}
.export-format-row{display:flex;gap:8px;flex-wrap:wrap;}
.export-format-btn{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:8px 14px;
  background:rgba(255,255,255,0.7);
  border:1.5px solid var(--border);
  border-radius:10px;
  font-size:12px;
  font-weight:600;
  color:var(--text);
  cursor:pointer;
  transition:all 0.22s ease;
}
.export-format-btn.active,
.export-format-btn:hover{
  background:linear-gradient(135deg,var(--primary),var(--primary-light));
  color:#fff;
  border-color:var(--primary);
  box-shadow:0 2px 8px rgba(var(--primary-rgb),0.22);
}
.export-date-row{
  display:flex;
  gap:8px;
  align-items:center;
}
.export-date-row input{flex:1;}
.export-date-sep{color:var(--text-muted);font-size:11px;}
.export-chip-group{display:flex;gap:6px;flex-wrap:wrap;}
.export-chip{
  padding:5px 12px;
  border:1.5px solid var(--border);
  border-radius:16px;
  background:rgba(255,255,255,0.7);
  font-size:11.5px;
  font-weight:600;
  color:var(--text-muted);
  cursor:pointer;
  transition:all 0.2s ease;
}
.export-chip:hover,
.export-chip.active{
  border-color:var(--primary);
  color:var(--primary-dark);
  background:rgba(var(--primary-rgb),0.08);
}
.export-submit-btn{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  width:100%;
  padding:12px;
  margin-top:6px;
  background:linear-gradient(135deg,var(--primary),var(--primary-light));
  color:#fff;
  border:none;
  border-radius:12px;
  font-size:13.5px;
  font-weight:700;
  cursor:pointer;
  letter-spacing:0.5px;
  box-shadow:0 4px 12px rgba(var(--primary-rgb),0.28);
  transition:all 0.22s ease;
}
.export-submit-btn:hover{
  background:linear-gradient(135deg,var(--primary-dark),var(--primary));
  transform:translateY(-1px);
  box-shadow:0 6px 16px rgba(var(--primary-rgb),0.35);
}
.export-submit-btn:active{transform:translateY(0);}

@media(max-width:700px){
  .export-table-desc{display:none;}
  .export-date-row{flex-direction:column;align-items:stretch;gap:6px;}
  .export-date-sep{display:none;}
}

body.dark .export-table{border-color:rgba(80,90,70,0.3);}
body.dark .export-table tr{border-color:rgba(80,90,70,0.25);}
body.dark .export-table tr:hover{background:rgba(var(--primary-rgb),0.12);}
body.dark .export-table-name label{color:#d0e0d0;}
body.dark .export-format-btn,body.dark .export-chip{background:rgba(40,45,38,0.7);color:#d0e0d0;border-color:rgba(80,90,70,0.35);}

/* ===== 添加销售记录 商品列表 - 强制样式覆盖全局 th ===== */
#itemsTable thead tr{
  background:linear-gradient(135deg,var(--primary-dark),var(--primary)) !important;
}
#itemsTable thead th{
  background:transparent !important;
  background-image:none !important;
  color:#ffffff !important;
  border:none !important;
  border-bottom:1px solid rgba(255,255,255,0.15) !important;
  font-size:13px !important;
  font-weight:700 !important;
  letter-spacing:0.5px !important;
  text-shadow:0 1px 2px rgba(0,0,0,0.2) !important;
  padding:12px 4px !important;
}
#itemsTable tfoot tr td{
  background:linear-gradient(135deg,#f0fdf4,#dcfce7) !important;
  color:#14532d !important;
}
body.dark #itemsTable thead tr{
  background:linear-gradient(135deg,#2d4a2d,var(--primary-dark)) !important;
}
body.dark #itemsTable thead th{color:#ffffff !important;}
body.dark #itemsTable tfoot tr td{
  background:linear-gradient(135deg,#1e3a1e,#2d4a2d) !important;
  color:#d0e8d0 !important;
}

/* ===== Credit Query ===== */
.credit-search-bar{display:flex;gap:14px;align-items:flex-end;flex-wrap:wrap;}
.credit-field{display:flex;flex-direction:column;gap:4px;}
.credit-field label{font-size:11px;font-weight:600;color:var(--text-muted);}
.credit-field input{padding:9px 12px;border:1.5px solid var(--border);border-radius:var(--radius-md);font-size:13px;outline:none;min-width:120px;transition:var(--transition);background:rgba(255,255,255,0.6);}
.credit-field input:focus{border-color:var(--primary);}
.credit-score-display{font-size:20px!important;font-weight:800!important;color:var(--primary-dark)!important;text-align:center;}
.credit-bar-chart{display:flex;flex-direction:column;gap:12px;padding:10px 0;}
.credit-bar-row{display:flex;align-items:center;gap:12px;}
.credit-bar-label{font-size:12px;font-weight:600;color:var(--text-muted);min-width:80px;}
.credit-bar{flex:1;height:20px;background:var(--border-light);border-radius:var(--radius-full);overflow:hidden;}
.credit-bar-fill{height:100%;border-radius:var(--radius-full);transition:width .6s ease;}
.credit-bar-fill.green{background:linear-gradient(90deg,#6b9e6b,#8bbb8b);}
.credit-bar-fill.red{background:linear-gradient(90deg,#d4645c,#e08078);}
.credit-bar-fill.yellow{background:linear-gradient(90deg,#c9a96e,#d4b880);}

/* ===== Export ===== */
.export-tree{display:flex;flex-direction:column;gap:10px;padding:8px 0;}
.export-item{display:flex;align-items:center;gap:10px;padding:10px 14px;background:rgba(var(--primary-rgb),0.06);border-radius:var(--radius-md);cursor:pointer;transition:var(--transition);}
.export-item:hover{background:rgba(var(--primary-rgb),0.12);}
.export-item label{cursor:pointer;font-size:13px;font-weight:600;color:var(--text);}
.export-item input[type="checkbox"]{width:16px;height:16px;accent-color:var(--primary);}
.export-options{display:flex;flex-direction:column;gap:8px;}
.export-options label{font-size:12px;font-weight:600;color:var(--text-muted);}
.export-progress{padding:18px;background:rgba(var(--primary-rgb),0.06);border-radius:var(--radius-md);text-align:center;}
.export-progress-text{font-size:13px;color:var(--text-muted);}
.export-progress-bar{height:6px;background:var(--border);border-radius:var(--radius-full);overflow:hidden;margin-bottom:8px;}
.export-progress-fill{height:100%;background:linear-gradient(90deg,var(--primary),var(--primary-light));border-radius:var(--radius-full);width:0%;}
@keyframes progressAnim{from{width:0%}to{width:100%}}

/* ===== Theme ===== */
.theme-modes{display:flex;gap:8px;flex-wrap:wrap;}
.theme-mode-btn{padding:10px 22px;border:1.5px solid var(--border);border-radius:var(--radius-md);background:rgba(255,255,255,0.6);color:var(--text);font-size:13px;font-weight:600;cursor:pointer;transition:var(--transition);}
.theme-mode-btn:hover{border-color:var(--primary);color:var(--primary-dark);}
.theme-mode-btn.active{background:linear-gradient(135deg,var(--primary),var(--primary-light));color:#fff;border-color:var(--primary);}
.theme-preview{border:1.5px solid var(--border);border-radius:var(--radius-md);min-height:180px;background:rgba(var(--primary-rgb),0.04);overflow:hidden;}
.color-swatches{display:flex;flex-direction:column;gap:8px;}
.swatch-row{display:flex;gap:8px;}
.swatch{width:48px;height:48px;border-radius:var(--radius-md);border:1px solid var(--border);cursor:pointer;transition:var(--transition);}
.swatch:hover{transform:scale(1.1);box-shadow:var(--shadow-md);}

/* ===== Security ===== */
.security-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:14px;}
.security-item{background:var(--card-bg);backdrop-filter:blur(12px);border:1px solid var(--glass-border);border-radius:var(--radius-lg);padding:22px;text-align:center;cursor:pointer;transition:var(--transition);}
.security-item:hover{border-color:var(--primary);box-shadow:var(--shadow-md);transform:translateY(-2px);}
.security-icon{font-size:32px;margin-bottom:8px;}
.security-icon.danger{color:#d4645c;}
.security-title{font-size:14px;font-weight:700;color:var(--text);margin-bottom:4px;}
.security-desc{font-size:11px;color:var(--text-muted);}
.security-alerts{display:flex;flex-direction:column;gap:8px;}
.alert-item{padding:13px 18px;border-radius:var(--radius-md);font-size:13px;font-weight:500;}
.alert-item.info{background:rgba(var(--primary-rgb),0.08);color:var(--primary-dark);border:1px solid rgba(var(--primary-rgb),0.2);}
.alert-item.warning{background:rgba(201,169,110,0.1);color:#8b6914;border:1px solid rgba(201,169,110,0.25);}
.alert-item.danger{background:rgba(212,100,92,0.08);color:#a03028;border:1px solid rgba(212,100,92,0.2);}

/* ===== Cleanup ===== */
.cleanup-grid{display:flex;flex-direction:column;gap:12px;}
.cleanup-item{display:flex;align-items:center;gap:14px;padding:18px;background:var(--card-bg);backdrop-filter:blur(12px);border:1px solid var(--glass-border);border-radius:var(--radius-lg);transition:var(--transition);}
.cleanup-item:hover{border-color:var(--primary);box-shadow:var(--shadow-sm);}
.cleanup-item input[type="checkbox"]{width:18px;height:18px;accent-color:var(--primary);cursor:pointer;}
.cleanup-info{display:flex;align-items:center;gap:12px;flex:1;}
.cleanup-icon{font-size:28px;}
.cleanup-title{font-size:14px;font-weight:700;color:var(--text);}
.cleanup-size{font-size:11px;color:var(--text-muted);margin-top:2px;}
.cleanup-result{padding:18px;background:rgba(var(--primary-rgb),0.06);border-radius:var(--radius-md);text-align:center;font-size:13px;color:var(--text-muted);}

/* ===== Report Grid ===== */
.report-grid{display:grid;grid-template-columns:2fr 1fr;gap:16px;}
@media(max-width:768px){.report-grid{grid-template-columns:1fr;}}
.report-chart-card{min-height:240px;}
.chart-placeholder{width:100%;min-height:200px;display:flex;align-items:center;justify-content:center;background:rgba(var(--primary-rgb),0.04);border-radius:var(--radius-md);}
.chart-empty{color:var(--text-light);font-size:14px;}

/* ===== 客户汇总 (Customer Summary) - Professional Dashboard v2.0 ===== */
.cs-page{
  padding:0;
  animation:fadeUp 0.4s ease;
  max-width:100%;
  overflow-x:hidden;
}

/* ========== Hero Header ( ) ========== */
.cs-hero{
  position:relative;
  margin-bottom:16px;
  border-radius:14px;
  overflow:hidden;
  background:linear-gradient(135deg,#ffffff,#f7f9f7);
  border:1px solid rgba(var(--primary-rgb),0.1);
  box-shadow:0 3px 10px rgba(var(--primary-dark-rgb),0.06),0 1px 3px rgba(var(--primary-dark-rgb),0.03);
}
.cs-hero-bg{
  position:absolute;
  inset:0;
  background:
    radial-gradient(circle at 92% 20%,rgba(var(--primary-rgb),0.14),transparent 50%),
    radial-gradient(circle at 8% 90%,rgba(201,169,110,0.08),transparent 45%);
  pointer-events:none;
}
.cs-hero-inner{
  position:relative;
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:14px;
  padding:14px 20px;
  flex-wrap:wrap;
}
.cs-title-wrap{
  display:flex;
  align-items:center;
  gap:12px;
  min-width:0;
}
.cs-title-ico{
  width:40px;
  height:40px;
  background:linear-gradient(135deg,var(--primary),var(--primary-dark));
  border-radius:11px;
  display:flex;
  align-items:center;
  justify-content:center;
  color:#fff;
  box-shadow:0 3px 10px rgba(var(--primary-dark-rgb),0.3),inset 0 1px 0 rgba(255,255,255,0.3);
  flex-shrink:0;
}
.cs-title-text{line-height:1.25;min-width:0;}
.cs-title{
  font-size:17px;
  font-weight:800;
  color:var(--text);
  margin:0;
  letter-spacing:-0.3px;
  display:flex;
  align-items:center;
  gap:10px;
  flex-wrap:wrap;
}
.cs-title-badge{
  font-size:10px;
  font-weight:600;
  color:var(--primary-dark);
  background:rgba(var(--primary-rgb),0.12);
  border:1px solid rgba(var(--primary-rgb),0.22);
  padding:2px 10px;
  border-radius:20px;
  letter-spacing:0.5px;
}
.cs-subtitle{
  font-size:12px;
  color:var(--text-muted);
  margin:4px 0 0;
  font-weight:500;
}
.cs-header-actions{
  display:flex;
  gap:8px;
  align-items:center;
  flex-wrap:wrap;
}

/* ========== Buttons ========== */
.cs-btn{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:8px 14px;
  border-radius:10px;
  font-size:12px;
  font-weight:600;
  cursor:pointer;
  transition:all 0.22s cubic-bezier(0.4,0,0.2,1);
  border:none;
  white-space:nowrap;
  line-height:1;
}
.cs-btn svg{flex-shrink:0;}
.cs-btn-ghost{
  background:rgba(255,255,255,0.7);
  color:var(--primary-dark);
  border:1px solid rgba(var(--primary-rgb),0.22);
  box-shadow:0 1px 2px rgba(var(--primary-dark-rgb),0.04);
}
.cs-btn-ghost:hover{
  background:#fff;
  border-color:rgba(var(--primary-rgb),0.4);
  transform:translateY(-1px);
  box-shadow:0 4px 12px rgba(var(--primary-dark-rgb),0.12);
}
.cs-btn-primary{
  background:linear-gradient(135deg,var(--primary),var(--primary-dark));
  color:#fff;
  box-shadow:0 3px 10px rgba(var(--primary-rgb),0.35);
}
.cs-btn-primary:hover{
  background:linear-gradient(135deg,var(--primary-dark),var(--primary-darker));
  transform:translateY(-1px);
  box-shadow:0 6px 18px rgba(var(--primary-rgb),0.4);
}

/* ========== KPI Cards Row ( ) ========== */
.cs-kpi-row{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:12px;
  margin-bottom:14px;
}
.cs-kpi{
  position:relative;
  background:#fff;
  border:1px solid rgba(var(--primary-rgb),0.1);
  border-radius:14px;
  padding:16px 18px;
  overflow:hidden;
  transition:all 0.28s cubic-bezier(0.4,0,0.2,1);
  box-shadow:0 2px 6px rgba(var(--primary-dark-rgb),0.05),0 1px 2px rgba(var(--primary-dark-rgb),0.03);
}
.cs-kpi::after{
  content:'';
  position:absolute;
  left:0;top:0;bottom:0;
  width:3px;
  border-radius:14px 0 0 14px;
  transition:width 0.28s ease;
}
.cs-kpi:hover{
  transform:translateY(-3px);
  box-shadow:0 8px 20px rgba(var(--primary-dark-rgb),0.1),0 3px 6px rgba(var(--primary-dark-rgb),0.05);
}
.cs-kpi:hover::after{width:5px;}
.cs-kpi-head{
  display:flex;
  justify-content:space-between;
  align-items:center;
  margin-bottom:8px;
}
.cs-kpi-ico{
  width:36px;
  height:36px;
  border-radius:10px;
  display:flex;
  align-items:center;
  justify-content:center;
  flex-shrink:0;
  box-shadow:0 2px 8px rgba(0,0,0,0.05);
}
.cs-kpi-ico svg{width:18px;height:18px;}
.cs-kpi-trend{
  display:inline-flex;
  align-items:center;
  gap:2px;
  font-size:9.5px;
  font-weight:700;
  padding:2px 7px;
  border-radius:10px;
  letter-spacing:0.2px;
  line-height:1.4;
}
.cs-trend-up{background:rgba(16,185,129,0.12);color:#059669;}
.cs-trend-down{background:rgba(239,68,68,0.1);color:#dc2626;}
.cs-kpi-body{position:relative;z-index:1;}
.cs-kpi-label{
  font-size:11px;
  font-weight:600;
  color:var(--text-muted);
  margin-bottom:3px;
  letter-spacing:0.2px;
}
.cs-kpi-value{
  font-size:24px;
  font-weight:900;
  line-height:1.05;
  letter-spacing:-0.6px;
  font-variant-numeric:tabular-nums;
}
.cs-kpi-sub{
  font-size:10px;
  color:var(--text-light);
  margin-top:4px;
  font-weight:500;
}
.cs-kpi-spark{
  position:absolute;
  top:-30px;
  right:-30px;
  width:110px;
  height:110px;
  border-radius:50%;
  opacity:0.07;
  pointer-events:none;
}

/* KPI Color Variants */
.cs-kpi-blue::after{background:linear-gradient(180deg,#3b82f6,#1d4ed8);}
.cs-kpi-blue .cs-kpi-ico{background:linear-gradient(135deg,rgba(59,130,246,0.15),rgba(29,78,216,0.1));color:#1d4ed8;}
.cs-kpi-blue .cs-kpi-value{color:#1d4ed8;}
.cs-kpi-blue .cs-kpi-spark{background:#3b82f6;}

.cs-kpi-green::after{background:linear-gradient(180deg,#10b981,#047857);}
.cs-kpi-green .cs-kpi-ico{background:linear-gradient(135deg,rgba(16,185,129,0.15),rgba(4,120,87,0.1));color:#047857;}
.cs-kpi-green .cs-kpi-value{color:#047857;}
.cs-kpi-green .cs-kpi-spark{background:#10b981;}

.cs-kpi-amber::after{background:linear-gradient(180deg,#f59e0b,#b45309);}
.cs-kpi-amber .cs-kpi-ico{background:linear-gradient(135deg,rgba(245,158,11,0.15),rgba(180,83,9,0.1));color:#b45309;}
.cs-kpi-amber .cs-kpi-value{color:#b45309;}
.cs-kpi-amber .cs-kpi-spark{background:#f59e0b;}

.cs-kpi-red::after{background:linear-gradient(180deg,#ef4444,#b91c1c);}
.cs-kpi-red .cs-kpi-ico{background:linear-gradient(135deg,rgba(239,68,68,0.15),rgba(185,28,28,0.1));color:#b91c1c;}
.cs-kpi-red .cs-kpi-value{color:#b91c1c;}
.cs-kpi-red .cs-kpi-spark{background:#ef4444;}

/* ========== Toolbar / Filter Bar ========== */
.cs-toolbar{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  margin-bottom:16px;
  padding:12px 16px;
  background:#fff;
  border:1px solid rgba(var(--primary-rgb),0.1);
  border-radius:12px;
  box-shadow:0 2px 6px rgba(var(--primary-dark-rgb),0.04);
  flex-wrap:wrap;
}
.cs-toolbar-left{
  display:flex;
  align-items:center;
  gap:14px;
  flex:1;
  flex-wrap:wrap;
  min-width:0;
}
.cs-toolbar-right{
  display:flex;
  align-items:center;
  gap:8px;
  flex-shrink:0;
}
.cs-sort-label{
  font-size:11px;
  color:var(--text-muted);
  font-weight:600;
  letter-spacing:0.2px;
}

/* Search */
.cs-search{
  position:relative;
  width:280px;
  max-width:100%;
}
.cs-search input{
  width:100%;
  padding:9px 32px 9px 36px;
  border:1.5px solid var(--border);
  border-radius:24px;
  font-size:12px;
  background:rgba(255,255,255,0.8);
  color:var(--text);
  outline:none;
  transition:all 0.22s ease;
  font-weight:500;
}
.cs-search input::placeholder{color:var(--text-light);font-weight:400;}
.cs-search input:focus{
  border-color:var(--primary);
  box-shadow:0 0 0 3px rgba(var(--primary-rgb),0.12);
  background:#fff;
}
.cs-search-ico{
  position:absolute;
  left:13px;
  top:50%;
  transform:translateY(-50%);
  color:var(--text-light);
  pointer-events:none;
}
.cs-search-clear{
  position:absolute;
  right:8px;
  top:50%;
  transform:translateY(-50%);
  width:20px;
  height:20px;
  border-radius:50%;
  border:none;
  background:rgba(0,0,0,0.08);
  color:var(--text-muted);
  font-size:14px;
  line-height:1;
  cursor:pointer;
  display:flex;
  align-items:center;
  justify-content:center;
  transition:all 0.18s ease;
}
.cs-search-clear:hover{
  background:rgba(220,38,38,0.12);
  color:#dc2626;
  transform:translateY(-50%) rotate(90deg);
}

/* Chips */
.cs-chip-group{
  display:flex;
  gap:4px;
  padding:3px;
  background:rgba(var(--primary-rgb),0.06);
  border-radius:24px;
  border:1px solid rgba(var(--primary-rgb),0.1);
}
.cs-chip{
  display:inline-flex;
  align-items:center;
  gap:5px;
  padding:6px 13px;
  border-radius:20px;
  border:none;
  background:transparent;
  font-size:11px;
  font-weight:600;
  color:var(--text-muted);
  cursor:pointer;
  transition:all 0.22s ease;
  white-space:nowrap;
  line-height:1;
}
.cs-chip:hover{
  background:rgba(255,255,255,0.7);
  color:var(--primary-dark);
}
.cs-chip.active{
  background:#fff;
  color:var(--primary-dark);
  box-shadow:0 2px 8px rgba(var(--primary-dark-rgb),0.15);
  font-weight:700;
}
.cs-chip-dot{
  width:7px;
  height:7px;
  border-radius:50%;
  display:inline-block;
}
.cs-chip-dot-all{background:linear-gradient(135deg,#94a3b8,#64748b);}
.cs-chip-dot-green{background:#10b981;}
.cs-chip-dot-blue{background:#3b82f6;}
.cs-chip-dot-red{background:#ef4444;}
.cs-chip-star{color:#f59e0b;font-size:12px;line-height:1;}

/* Select */
.cs-select{
  padding:8px 30px 8px 14px;
  border:1.5px solid var(--border);
  border-radius:10px;
  font-size:11.5px;
  font-weight:600;
  background:rgba(255,255,255,0.8);
  color:var(--text);
  cursor:pointer;
  outline:none;
  appearance:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath d='M1 1l4 4 4-4' stroke='%237a7a6e' stroke-width='1.5' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat:no-repeat;
  background-position:right 11px center;
  transition:all 0.22s ease;
  min-width:160px;
}
.cs-select:hover{border-color:rgba(var(--primary-rgb),0.4);background-color:#fff;}
.cs-select:focus{
  border-color:var(--primary);
  box-shadow:0 0 0 3px rgba(var(--primary-rgb),0.12);
  background-color:#fff;
}

/* ========== Table Card ========== */
.cs-card{
  background:#fff;
  border:1px solid rgba(var(--primary-rgb),0.1);
  border-radius:14px;
  overflow:hidden;
  box-shadow:0 3px 10px rgba(var(--primary-dark-rgb),0.06),0 1px 3px rgba(var(--primary-dark-rgb),0.03);
}
.cs-table-head-bar{
  display:flex;
  justify-content:space-between;
  align-items:center;
  padding:12px 20px;
  background:rgba(var(--primary-rgb),0.04);
  border-bottom:1px solid rgba(var(--primary-rgb),0.1);
  flex-wrap:wrap;
  gap:10px;
}
.cs-result-count{
  font-size:12px;
  color:var(--text-muted);
  display:flex;
  align-items:center;
  gap:5px;
  font-weight:500;
}
.cs-result-count b{
  color:var(--text);
  font-weight:800;
  font-size:13px;
  font-variant-numeric:tabular-nums;
}
.cs-legend{
  display:flex;
  gap:14px;
  align-items:center;
  flex-wrap:wrap;
}
.cs-legend-item{
  display:flex;
  align-items:center;
  gap:5px;
  font-size:11px;
  color:var(--text-muted);
  font-weight:500;
}
.cs-dot{
  width:8px;
  height:8px;
  border-radius:50%;
  display:inline-block;
  box-shadow:0 0 0 2px rgba(255,255,255,0.6);
}
.cs-dot-green{background:#10b981;}
.cs-dot-red{background:#ef4444;}
.cs-dot-amber{background:#f59e0b;}

/* Table */
.cs-table-wrap{
  overflow-x:auto;
  -webkit-overflow-scrolling:touch;
  scrollbar-width:thin;
  scrollbar-color:rgba(var(--primary-rgb),0.3) transparent;
  border-radius:14px;
  border:1px solid rgba(var(--primary-rgb),0.12);
  box-shadow:0 2px 10px rgba(15,23,42,0.04);
}
.cs-table-wrap::-webkit-scrollbar{height:7px;}
.cs-table-wrap::-webkit-scrollbar-track{background:transparent;}
.cs-table-wrap::-webkit-scrollbar-thumb{
  background:rgba(var(--primary-rgb),0.22);
  border-radius:10px;
}
.cs-table-wrap::-webkit-scrollbar-thumb:hover{background:rgba(var(--primary-rgb),0.4);}
.cs-table{
  width:100%;
  border-collapse:separate;
  border-spacing:0;
  font-size:12px;
  table-layout:auto;
  overflow:hidden;
}
.cs-table thead tr{
  background:linear-gradient(180deg,#3a4a5a,#2d3d4d);
}
.cs-table thead th{
  padding:11px 6px;
  font-size:11px;
  font-weight:700;
  color:#dce5ed;
  text-align:center;
  white-space:nowrap;
  border:none;
  letter-spacing:0.2px;
  text-transform:none;
  position:sticky;
  top:0;
  z-index:2;
}
/* — (客户名称 ) */
.cs-table thead th:nth-child(1),
.cs-table tbody td:nth-child(1){width:32px;padding-left:8px;padding-right:4px;}
.cs-table thead th:nth-child(2),
.cs-table tbody td:nth-child(2){width:36px;}
.cs-table thead th:nth-child(3){width:auto;max-width:180px;}
.cs-table tbody td:nth-child(3){
  text-align:left;
  padding-left:12px;
  max-width:180px;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.cs-table thead th:nth-child(4),
.cs-table tbody td:nth-child(4){width:1%;white-space:nowrap;}
.cs-table thead th:nth-child(5),
.cs-table tbody td:nth-child(5){width:1%;white-space:nowrap;}
.cs-table thead th:nth-child(6),
.cs-table tbody td:nth-child(6){width:1%;white-space:nowrap;}
.cs-table thead th:nth-child(7),
.cs-table tbody td:nth-child(7){width:1%;white-space:nowrap;}
.cs-table thead th:nth-child(8),
.cs-table tbody td:nth-child(8){width:1%;white-space:nowrap;}
.cs-table thead th:nth-child(9),
.cs-table tbody td:nth-child(9){width:1%;white-space:nowrap;}
.cs-table thead th:nth-child(10),
.cs-table tbody td:nth-child(10){width:1%;white-space:nowrap;}
.cs-table thead th:nth-child(11),
.cs-table tbody td:nth-child(11){width:1%;white-space:nowrap;padding-right:8px;}
.cs-table thead th:first-child{border-top-left-radius:14px;}
.cs-table thead th:last-child{border-top-right-radius:14px;}
.cs-table tbody tr:last-child td:first-child{border-bottom-left-radius:14px;}
.cs-table tbody tr:last-child td:last-child{border-bottom-right-radius:14px;}
.cs-table thead th.cs-th-left{text-align:left;padding-left:14px;}
.cs-table tbody tr{
  transition:background 0.18s ease;
}
.cs-table tbody tr:nth-child(even) td{
  background:rgba(var(--primary-rgb),0.025);
}
.cs-table tbody tr:hover td{
  background:rgba(var(--primary-rgb),0.07) !important;
}
.cs-table tbody td{
  padding:8px 6px;
  text-align:center;
  color:var(--text);
  vertical-align:middle;
  font-weight:500;
  white-space:nowrap;
  border-bottom:1px solid rgba(var(--primary-rgb),0.07);
  transition:background 0.18s ease;
}
.cs-table tbody tr:last-child td{border-bottom:none;}
.cs-table tbody td input[type="checkbox"]{
  width:15px;
  height:15px;
  accent-color:var(--primary);
  cursor:pointer;
}

/* Empty State */
.cs-empty{
  text-align:center !important;
  padding:56px 20px !important;
  color:var(--text-light);
}
.cs-empty-ico{
  font-size:40px;
  margin-bottom:10px;
  opacity:0.6;
}

/* ========== 已收 / 欠款 ========== */
.cs-cell-paid{
  display:inline-block;
  padding:3px 9px;
  border-radius:16px;
  background:linear-gradient(135deg,rgba(16,185,129,0.12),rgba(16,185,129,0.06));
  color:#047857;
  font-weight:700;
  font-size:11px;
  min-width:48px;
  font-variant-numeric:tabular-nums;
  border:1px solid rgba(16,185,129,0.22);
  letter-spacing:0.2px;
}
.cs-cell-debt{
  display:inline-block;
  padding:3px 9px;
  border-radius:16px;
  background:rgba(var(--primary-rgb),0.05);
  color:var(--text-light);
  font-weight:600;
  font-size:11px;
  min-width:48px;
  font-variant-numeric:tabular-nums;
  border:1px solid var(--border-light);
  letter-spacing:0.2px;
}
.cs-cell-debt.has-debt{
  background:linear-gradient(135deg,rgba(239,68,68,0.12),rgba(239,68,68,0.06));
  color:#b91c1c;
  font-weight:800;
  border-color:rgba(239,68,68,0.25);
}

/* ========== Action Buttons (操作列) ========== */
.cs-action-group{
  display:inline-flex;
  gap:4px;
  align-items:center;
  justify-content:center;
}
.cs-act-btn{
  display:inline-flex;
  align-items:center;
  gap:3px;
  padding:5px 7px;
  border-radius:7px;
  border:1px solid transparent;
  font-size:10.5px;
  font-weight:600;
  cursor:pointer;
  transition:all 0.2s cubic-bezier(0.4,0,0.2,1);
  line-height:1;
  white-space:nowrap;
}
.cs-act-btn svg{flex-shrink:0;width:12px;height:12px;}
.cs-act-btn span{line-height:1;}
.cs-act-btn:hover{
  transform:translateY(-1px);
  box-shadow:0 3px 8px rgba(0,0,0,0.08);
}
.cs-act-btn:active{transform:translateY(0);}
/* 详情 — */
.cs-act-view{
  background:rgba(37,99,235,0.08);
  color:#1d4ed8;
  border-color:rgba(37,99,235,0.2);
}
.cs-act-view:hover{
  background:rgba(37,99,235,0.15);
  border-color:rgba(37,99,235,0.4);
  color:#1e40af;
}
/* 编辑 — - */
.cs-act-edit{
  background:rgba(var(--primary-rgb),0.08);
  color:var(--primary-dark);
  border-color:rgba(var(--primary-rgb),0.22);
}
.cs-act-edit:hover{
  background:rgba(var(--primary-rgb),0.18);
  border-color:rgba(var(--primary-rgb),0.45);
}
/* 打印 — */
.cs-act-print{
  background:rgba(201,169,110,0.1);
  color:#8a6e2a;
  border-color:rgba(201,169,110,0.25);
}
.cs-act-print:hover{
  background:rgba(201,169,110,0.2);
  border-color:rgba(201,169,110,0.5);
  color:#6d5520;
}
/* : — */
@media(max-width:1440px){
  .cs-act-btn span{display:none;}
  .cs-act-btn{padding:6px 7px;border-radius:7px;}
  .cs-act-btn svg{width:13px;height:13px;}
  .cs-action-group{gap:5px;}
}

/* ========== Responsive ========== */
@media(max-width:1200px){
  .cs-kpi-row{grid-template-columns:repeat(2,1fr);}
}
@media(max-width:1024px){
  .cs-hero-inner{flex-direction:column;align-items:flex-start;}
  .cs-toolbar{flex-direction:column;align-items:stretch;}
  .cs-toolbar-left{flex-direction:column;align-items:stretch;}
  .cs-toolbar-right{justify-content:flex-end;}
  .cs-search{width:100%;}
  .cs-chip-group{overflow-x:auto;scrollbar-width:none;}
  .cs-chip-group::-webkit-scrollbar{display:none;}
}
/* # — */
@media(max-width:980px){
  .cs-table thead th:nth-child(2),
  .cs-table tbody td:nth-child(2){display:none;}
}
@media(max-width:640px){
  .cs-kpi-row{grid-template-columns:1fr;gap:10px;}
  .cs-header-actions{width:100%;}
  .cs-header-actions .cs-btn{flex:1;justify-content:center;}
  .cs-title{font-size:17px;}
  .cs-hero-inner{padding:14px 16px;}
  .cs-kpi{padding:14px;}
  .cs-kpi-value{font-size:24px;}
  .cs-table-head-bar{padding:10px 14px;}
  .cs-legend{gap:10px;}
}

/* ========== Dark Mode ========== */
body.dark .cs-hero{background:linear-gradient(135deg,rgba(30,35,28,0.85),rgba(30,35,28,0.7));border-color:rgba(80,90,70,0.3);}
body.dark .cs-kpi{background:linear-gradient(145deg,rgba(30,35,28,0.9),rgba(30,35,28,0.7));border-color:rgba(80,90,70,0.3);}
body.dark .cs-toolbar{background:linear-gradient(145deg,rgba(30,35,28,0.9),rgba(30,35,28,0.7));border-color:rgba(80,90,70,0.3);}
body.dark .cs-card{background:linear-gradient(145deg,rgba(30,35,28,0.92),rgba(30,35,28,0.78));border-color:rgba(80,90,70,0.3);}
body.dark .cs-table-head-bar{background:rgba(255,255,255,0.02);border-bottom-color:rgba(80,90,70,0.25);}
body.dark .cs-table tbody tr{border-bottom-color:rgba(80,90,70,0.15);}
body.dark .cs-table tbody tr:nth-child(even){background:rgba(255,255,255,0.015);}
body.dark .cs-table tbody tr:hover{background:rgba(var(--primary-rgb),0.1) !important;}
body.dark .cs-search input,body.dark .cs-select{background:rgba(40,45,38,0.7);color:var(--text);}
body.dark .cs-chip-group{background:rgba(255,255,255,0.04);border-color:rgba(80,90,70,0.25);}
body.dark .cs-chip.active{background:rgba(60,70,55,0.9);color:#d0e0d0;}
body.dark .cs-btn-ghost{background:rgba(40,45,38,0.6);color:#d0e0d0;border-color:rgba(80,90,70,0.3);}
body.dark .cs-btn-ghost:hover{background:rgba(50,60,48,0.9);}
body.dark .cs-title-badge{background:rgba(var(--primary-rgb),0.2);color:#a0c0a0;}


/* ===== 仓库总览 (Warehouse) - Enhanced v2.0 ===== */
/* 货位编号 */
.wh-slot-code{
  display:inline-block;
  padding:4px 10px;
  background:linear-gradient(135deg,#475569,#334155);
  color:#fff;
  border-radius:6px;
  font-size:11px;
  font-weight:700;
  letter-spacing:0.5px;
  font-family:'SF Mono',Menlo,Consolas,monospace;
  box-shadow:0 2px 6px rgba(51,65,85,0.25);
}

/* 分区 (A/B/C/D ...) */
.wh-zone-badge{
  display:inline-block;
  padding:4px 10px;
  border-radius:20px;
  font-size:11px;
  font-weight:700;
  letter-spacing:0.2px;
  border:1px solid transparent;
}
.wh-zone-a{background:rgba(var(--primary-rgb),0.12);color:var(--primary-darker);border-color:rgba(var(--primary-rgb),0.25);}
.wh-zone-b{background:rgba(201,169,110,0.14);color:#8a6e2a;border-color:rgba(201,169,110,0.3);}
.wh-zone-c{background:rgba(37,99,235,0.1);color:#1d4ed8;border-color:rgba(37,99,235,0.22);}
.wh-zone-d{background:rgba(168,85,247,0.1);color:#7c3aed;border-color:rgba(168,85,247,0.22);}
.wh-zone-e{background:rgba(236,72,153,0.1);color:#be185d;border-color:rgba(236,72,153,0.22);}
.wh-zone-f{background:rgba(14,165,233,0.1);color:#0369a1;border-color:rgba(14,165,233,0.22);}

/* (状态) */
.wh-status{
  display:inline-block;
  padding:3px 10px;
  border-radius:20px;
  font-size:10.5px;
  font-weight:700;
  letter-spacing:0.2px;
}
.wh-status-ok{background:rgba(16,185,129,0.12);color:#059669;border:1px solid rgba(16,185,129,0.25);}
.wh-status-low{background:rgba(245,158,11,0.12);color:#d97706;border:1px solid rgba(245,158,11,0.25);}
.wh-status-empty{background:rgba(239,68,68,0.1);color:#dc2626;border:1px solid rgba(239,68,68,0.22);}

/* */
.wh-edit-btn{
  display:inline-flex;
  align-items:center;
  gap:4px;
  padding:5px 11px;
  background:rgba(var(--primary-rgb),0.08);
  color:var(--primary-dark);
  border:1px solid rgba(var(--primary-rgb),0.22);
  border-radius:7px;
  font-size:11px;
  font-weight:600;
  cursor:pointer;
  transition:all 0.2s ease;
  line-height:1;
}
.wh-edit-btn:hover{
  background:rgba(var(--primary-rgb),0.16);
  border-color:rgba(var(--primary-rgb),0.4);
  transform:translateY(-1px);
  box-shadow:0 3px 8px rgba(var(--primary-dark-rgb),0.15);
}

/* */
.wh-table{font-size:12px;}
.wh-table thead th{padding:11px 10px;font-size:11.5px;}
.wh-table tbody td{padding:10px;vertical-align:middle;}
.wh-table tbody tr{transition:background 0.2s ease;}
.wh-table tbody tr:hover{background:rgba(var(--primary-rgb),0.04)!important;}

/* Dark Mode */
body.dark .wh-slot-code{background:linear-gradient(135deg,#64748b,#475569);}
body.dark .wh-edit-btn{background:rgba(var(--primary-rgb),0.15);color:#a0c0a0;border-color:rgba(var(--primary-rgb),0.3);}
body.dark .wh-edit-btn:hover{background:rgba(var(--primary-rgb),0.25);}


/* ===== 财务管理 (Finance Management) - Pro UI v2.0 ===== */

/* ===== ===== */
@keyframes shimmer{
  0%{background-position:-200% 0;}
  100%{background-position:200% 0;}
}

/* Tab ( ) — */
.fin-tab-bar{
  display:grid;
  grid-template-columns:repeat(6,1fr);
  gap:12px;
  margin-bottom:18px;
  padding:12px 14px;
  background:linear-gradient(145deg,#ffffff,#f7f9f7);
  border:1px solid rgba(var(--primary-rgb),0.1);
  border-radius:12px;
  box-shadow:0 2px 8px rgba(var(--primary-dark-rgb),0.05),0 1px 2px rgba(var(--primary-dark-rgb),0.03);
}
.fin-tab-big{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:9px;
  padding:12px 8px;
  border-radius:10px;
  border:1.5px solid rgba(var(--primary-rgb),0.1);
  background:#fff;
  font-size:14px;
  font-weight:700;
  color:var(--text);
  cursor:pointer;
  transition:border-color 0.22s ease,background 0.22s ease,color 0.22s ease;
  white-space:nowrap;
  position:relative;
  text-align:center;
  overflow:visible;
  animation:tabBreath 2.8s ease-in-out infinite;
  will-change:transform,box-shadow;
}
@keyframes tabBreath{
  0%,100%{
    transform:translateY(0);
    box-shadow:0 1px 3px rgba(var(--primary-dark-rgb),0.05);
  }
  50%{
    transform:translateY(-3px);
    box-shadow:0 8px 18px rgba(var(--primary-dark-rgb),0.14),0 3px 6px rgba(var(--primary-dark-rgb),0.08);
  }
}
.fin-tab-big:nth-child(1){animation-delay:0s;}
.fin-tab-big:nth-child(2){animation-delay:0.25s;}
.fin-tab-big:nth-child(3){animation-delay:0.5s;}
.fin-tab-big:nth-child(4){animation-delay:0.75s;}
.fin-tab-big:nth-child(5){animation-delay:1s;}
.fin-tab-big:nth-child(6){animation-delay:1.25s;}
.fin-tab-big:hover:not(.active){
  animation-play-state:paused;
  transform:translateY(-3px);
  border-color:rgba(var(--primary-rgb),0.3);
  box-shadow:0 6px 14px rgba(var(--primary-dark-rgb),0.12);
}

/* ========== Tab — ========== */
@keyframes activeBreath{
  0%,100%{
    transform:translateY(-2px);
    box-shadow:0 3px 10px var(--tab-shadow,rgba(var(--primary-dark-rgb),0.25)),0 1px 3px rgba(0,0,0,0.08);
  }
  50%{
    transform:translateY(-5px);
    box-shadow:0 8px 22px var(--tab-shadow-strong,rgba(var(--primary-dark-rgb),0.5)),0 3px 8px rgba(0,0,0,0.12);
  }
}
.fin-tab-big.active{
  animation:activeBreath 2s ease-in-out infinite;
  border-width:1.5px;
  z-index:2;
  font-size:12.5px;
  font-weight:800;
}

/* — */
.fin-tab-big.active::before{
  content:'';
  position:absolute;
  top:-7px;left:50%;
  transform:translateX(-50%);
  width:0;
  height:0;
  border-left:6px solid transparent;
  border-right:6px solid transparent;
  border-bottom:7px solid currentColor;
  z-index:3;
  filter:drop-shadow(0 -1px 2px rgba(0,0,0,0.08));
}

/* ::before ( ) */
.fin-tab-big:not(.active)::before,
.fin-tab-big:not(.active)::after,
.fin-tab-big:not(.active) .fin-tab-text::after{
  content:none;
  display:none;
}
.fin-tab-big > *{position:relative;z-index:1;}

/* */
/* 总览 — */
.fin-tab-big:nth-child(1).active{
  background:linear-gradient(135deg,var(--primary),var(--primary-dark));
  color:#fff;
  border-color:var(--primary-darker);
  --tab-shadow:rgba(var(--primary-dark-rgb),0.28);
  --tab-shadow-strong:rgba(var(--primary-dark-rgb),0.42);
}
.fin-tab-big:nth-child(1).active .fin-tab-ico{background:rgba(255,255,255,0.22)!important;color:#fff!important;}

/* 收入 — */
.fin-tab-big:nth-child(2).active{
  background:linear-gradient(135deg,#10b981,#047857);
  color:#fff;
  border-color:#065f46;
  --tab-shadow:rgba(16,185,129,0.3);
  --tab-shadow-strong:rgba(16,185,129,0.45);
}
.fin-tab-big:nth-child(2).active .fin-tab-ico{background:rgba(255,255,255,0.22)!important;color:#fff!important;}

/* 支出 — */
.fin-tab-big:nth-child(3).active{
  background:linear-gradient(135deg,#f59e0b,#b45309);
  color:#fff;
  border-color:#92400e;
  --tab-shadow:rgba(245,158,11,0.32);
  --tab-shadow-strong:rgba(245,158,11,0.48);
}
.fin-tab-big:nth-child(3).active .fin-tab-ico{background:rgba(255,255,255,0.22)!important;color:#fff!important;}

/* 工资 — */
.fin-tab-big:nth-child(4).active{
  background:linear-gradient(135deg,#3b82f6,#1d4ed8);
  color:#fff;
  border-color:#1e40af;
  --tab-shadow:rgba(59,130,246,0.32);
  --tab-shadow-strong:rgba(59,130,246,0.48);
}
.fin-tab-big:nth-child(4).active .fin-tab-ico{background:rgba(255,255,255,0.22)!important;color:#fff!important;}

/* 税费 — */
.fin-tab-big:nth-child(5).active{
  background:linear-gradient(135deg,#8b5cf6,#6d28d9);
  color:#fff;
  border-color:#5b21b6;
  --tab-shadow:rgba(139,92,246,0.32);
  --tab-shadow-strong:rgba(139,92,246,0.48);
}
.fin-tab-big:nth-child(5).active .fin-tab-ico{background:rgba(255,255,255,0.22)!important;color:#fff!important;}

/* 原料 — */
.fin-tab-big:nth-child(6).active{
  background:linear-gradient(135deg,#a16207,#78350f);
  color:#fff;
  border-color:#713f12;
  --tab-shadow:rgba(161,98,7,0.32);
  --tab-shadow-strong:rgba(161,98,7,0.48);
}
.fin-tab-big:nth-child(6).active .fin-tab-ico{background:rgba(255,255,255,0.22)!important;color:#fff!important;}

/* hover — */
.fin-tab-big:nth-child(1):not(.active):hover{border-color:rgba(var(--primary-rgb),0.3);background:linear-gradient(145deg,#fafcfa,#f0f7f0);}
.fin-tab-big:nth-child(2):not(.active):hover{border-color:rgba(16,185,129,0.3);background:linear-gradient(145deg,#fafefb,#f0fdf4);}
.fin-tab-big:nth-child(3):not(.active):hover{border-color:rgba(245,158,11,0.3);background:linear-gradient(145deg,#fefdf8,#fffbeb);}
.fin-tab-big:nth-child(4):not(.active):hover{border-color:rgba(59,130,246,0.3);background:linear-gradient(145deg,#fafcff,#eff6ff);}
.fin-tab-big:nth-child(5):not(.active):hover{border-color:rgba(139,92,246,0.3);background:linear-gradient(145deg,#fdfaff,#faf5ff);}
.fin-tab-big:nth-child(6):not(.active):hover{border-color:rgba(161,98,7,0.3);background:linear-gradient(145deg,#fffaf5,#fef7ed);}

.fin-tab-ico{
  width:32px;
  height:32px;
  border-radius:8px;
  display:flex;
  align-items:center;
  justify-content:center;
  flex-shrink:0;
  transition:transform 0.22s ease,background 0.22s ease;
}
.fin-tab-ico svg{width:16px;height:16px;}
.fin-tab-big:hover:not(.active) .fin-tab-ico{transform:scale(1.06);}
.fin-tab-big.active .fin-tab-ico{
  transform:scale(1.05);
  box-shadow:0 1px 3px rgba(0,0,0,0.08),inset 0 1px 0 rgba(255,255,255,0.3);
}
.fin-tab-text{
  font-size:14px;
  line-height:1.2;
  letter-spacing:0.3px;
  font-weight:700;
}

/* fin-tabs ( ) */
.fin-tabs{display:none !important;}

/* KPI */
.fin-kpi-row{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:14px;
  margin-bottom:16px;
}
.fin-kpi{
  position:relative;
  background:#fff;
  border:1px solid rgba(var(--primary-rgb),0.1);
  border-radius:14px;
  padding:16px 18px;
  overflow:hidden;
  cursor:pointer;
  transition:border-color 0.22s ease;
  will-change:transform,box-shadow;
  animation:kpiBreath 3s ease-in-out infinite;
}
@keyframes kpiBreath{
  0%,100%{
    transform:translateY(0);
    box-shadow:0 2px 6px rgba(var(--primary-dark-rgb),0.05),0 1px 2px rgba(var(--primary-dark-rgb),0.03);
  }
  50%{
    transform:translateY(-3px);
    box-shadow:0 8px 18px rgba(var(--primary-dark-rgb),0.12),0 3px 6px rgba(var(--primary-dark-rgb),0.06);
  }
}
.fin-kpi:nth-child(1){animation-delay:0s;}
.fin-kpi:nth-child(2){animation-delay:0.3s;}
.fin-kpi:nth-child(3){animation-delay:0.6s;}
.fin-kpi:nth-child(4){animation-delay:0.9s;}
.fin-kpi::after{
  content:'';
  position:absolute;
  left:0;top:0;bottom:0;
  width:3px;
  border-radius:14px 0 0 14px;
  transition:width 0.28s ease;
}
.fin-kpi:hover:not(.active){
  animation-play-state:paused;
  transform:translateY(-4px);
  border-color:rgba(var(--primary-rgb),0.22);
  box-shadow:0 10px 20px rgba(var(--primary-dark-rgb),0.14),0 3px 8px rgba(var(--primary-dark-rgb),0.06);
}
.fin-kpi:hover::after{width:4px;}

/* ========== KPI — ========== */
@keyframes finKpiBreath{
  0%,100%{
    transform:translateY(-3px);
    box-shadow:0 4px 12px var(--kpi-shadow,rgba(var(--primary-rgb),0.25)),0 2px 5px rgba(0,0,0,0.08);
  }
  50%{
    transform:translateY(-6px);
    box-shadow:0 10px 26px var(--kpi-shadow-strong,rgba(var(--primary-rgb),0.45)),0 4px 10px rgba(0,0,0,0.12);
  }
}
.fin-kpi.active{
  animation:finKpiBreath 2s ease-in-out infinite;
  border-width:2px;
  z-index:2;
}
.fin-kpi.active::after{width:5px;box-shadow:0 0 8px currentColor;}

/* — */
.fin-kpi.active::before{
  content:'';
  position:absolute;
  top:-2px;left:50%;
  transform:translateX(-50%);
  width:24%;
  height:3px;
  background:currentColor;
  border-radius:0 0 3px 3px;
  box-shadow:0 1px 4px currentColor;
}

/* KPI */
.fin-kpi-green.active{
  border-color:#10b981;
  --kpi-shadow:rgba(16,185,129,0.22);
  --kpi-shadow-strong:rgba(16,185,129,0.4);
}
.fin-kpi-amber.active{
  border-color:#f59e0b;
  --kpi-shadow:rgba(245,158,11,0.22);
  --kpi-shadow-strong:rgba(245,158,11,0.4);
}
.fin-kpi-blue.active{
  border-color:#3b82f6;
  --kpi-shadow:rgba(59,130,246,0.22);
  --kpi-shadow-strong:rgba(59,130,246,0.4);
}
.fin-kpi-primary.active{
  border-color:var(--primary-dark);
  --kpi-shadow:rgba(var(--primary-dark-rgb),0.22);
  --kpi-shadow-strong:rgba(var(--primary-dark-rgb),0.4);
}
.fin-kpi-head{
  display:flex;
  align-items:center;
  gap:10px;
  margin-bottom:10px;
}
.fin-kpi-ico{
  width:38px;
  height:38px;
  border-radius:10px;
  display:flex;
  align-items:center;
  justify-content:center;
  flex-shrink:0;
  box-shadow:0 3px 8px rgba(0,0,0,0.08);
}
.fin-kpi-label{
  font-size:12.5px;
  font-weight:700;
  color:var(--text);
  letter-spacing:0.2px;
}
.fin-kpi-value{
  font-size:28px;
  font-weight:900;
  line-height:1.05;
  letter-spacing:-0.5px;
  font-variant-numeric:tabular-nums;
  margin-bottom:4px;
}
.fin-kpi-sub{
  font-size:11px;
  color:var(--text-muted);
  font-weight:500;
}
.fin-kpi-sub b{color:var(--text);font-weight:800;}

/* KPI */
.fin-kpi-green::after{background:linear-gradient(180deg,#10b981,#047857);}
.fin-kpi-green .fin-kpi-ico{background:linear-gradient(135deg,rgba(16,185,129,0.15),rgba(4,120,87,0.1));color:#047857;}
.fin-kpi-green .fin-kpi-value{color:#047857;}

.fin-kpi-amber::after{background:linear-gradient(180deg,#f59e0b,#b45309);}
.fin-kpi-amber .fin-kpi-ico{background:linear-gradient(135deg,rgba(245,158,11,0.15),rgba(180,83,9,0.1));color:#b45309;}
.fin-kpi-amber .fin-kpi-value{color:#b45309;}

.fin-kpi-blue::after{background:linear-gradient(180deg,#3b82f6,#1d4ed8);}
.fin-kpi-blue .fin-kpi-ico{background:linear-gradient(135deg,rgba(59,130,246,0.15),rgba(29,78,216,0.1));color:#1d4ed8;}
.fin-kpi-blue .fin-kpi-value{color:#1d4ed8;}

.fin-kpi-primary::after{background:linear-gradient(180deg,var(--primary),var(--primary-dark));}
.fin-kpi-primary .fin-kpi-ico{background:linear-gradient(135deg,rgba(var(--primary-rgb),0.15),rgba(var(--primary-darker-rgb),0.1));color:var(--primary-dark);}
.fin-kpi-primary .fin-kpi-value{color:var(--primary-dark);}

/* */
.fin-card{
  background:#fff;
  border:1px solid rgba(var(--primary-rgb),0.1);
  border-radius:14px;
  overflow:hidden;
  box-shadow:0 3px 10px rgba(var(--primary-dark-rgb),0.06),0 1px 3px rgba(var(--primary-dark-rgb),0.03);
}
.fin-card-head{
  display:flex;
  justify-content:space-between;
  align-items:center;
  padding:16px 20px;
  background:linear-gradient(135deg,rgba(var(--primary-rgb),0.08),rgba(var(--primary-rgb),0.03));
  border-bottom:1px solid rgba(var(--primary-rgb),0.12);
  flex-wrap:wrap;
  gap:10px;
}
.fin-card-title{
  display:flex;
  align-items:center;
  gap:10px;
  font-size:15px;
  font-weight:800;
  color:var(--text);
  margin:0;
  letter-spacing:-0.2px;
}
.fin-card-title svg{color:var(--primary-dark);}

/* Switch (月报/年报) */
.fin-switch{
  display:inline-flex;
  background:rgba(var(--primary-rgb),0.08);
  border-radius:10px;
  padding:3px;
  border:1px solid rgba(var(--primary-rgb),0.15);
  box-shadow:inset 0 1px 2px rgba(0,0,0,0.04);
}
.fin-switch-btn{
  padding:7px 18px;
  border:none;
  background:transparent;
  border-radius:8px;
  font-size:12.5px;
  font-weight:700;
  color:var(--text-muted);
  cursor:pointer;
  transition:all 0.2s ease;
}
.fin-switch-btn:hover{color:var(--primary-dark);}
.fin-switch-btn.active{
  background:linear-gradient(135deg,var(--primary),var(--primary-dark));
  color:#fff;
  box-shadow:0 4px 10px rgba(var(--primary-dark-rgb),0.3),inset 0 1px 0 rgba(255,255,255,0.2);
}

/* Responsive */
@media(max-width:1200px){
  .fin-kpi-row{grid-template-columns:repeat(2,1fr);}
  .fin-tab-bar{grid-template-columns:repeat(3,1fr);}
}
@media(max-width:768px){
  .fin-tab-bar{grid-template-columns:repeat(2,1fr);gap:8px;padding:10px;}
  .fin-tab-big{padding:10px 6px;font-size:13px;}
  .fin-tab-text{font-size:13px;}
  .fin-tab-ico{width:28px;height:28px;}
}
@media(max-width:640px){
  .fin-kpi-row{grid-template-columns:1fr;}
  .fin-kpi-value{font-size:22px;}
  .fin-tab-bar{grid-template-columns:repeat(2,1fr);}
  .fin-tab-text{font-size:12.5px;}
}

/* Dark Mode */
body.dark .fin-kpi{background:linear-gradient(145deg,rgba(30,35,28,0.9),rgba(30,35,28,0.7));border-color:rgba(80,90,70,0.3);}
body.dark .fin-card{background:linear-gradient(145deg,rgba(30,35,28,0.92),rgba(30,35,28,0.78));border-color:rgba(80,90,70,0.3);}
body.dark .fin-card-head{background:rgba(255,255,255,0.02);border-bottom-color:rgba(80,90,70,0.25);}
body.dark .fin-tabs,body.dark .fin-switch{background:rgba(255,255,255,0.04);border-color:rgba(80,90,70,0.25);}
body.dark .fin-tab.active,body.dark .fin-switch-btn.active{background:rgba(60,70,55,0.9);color:#d0e0d0;}


/* ===== Accessibility — ===== */
@media (prefers-reduced-motion: reduce){
  .fin-tab-big,
  .fin-kpi,
  .cs-kpi,
  .stat-box,
  .nav-item.active,
  .nav-item-danger.active,
  .fin-tab-big.active{
    animation:none !important;
  }
  .fin-tab-big.active::before{display:none;}
}


/* ===== 仓库管理 ( ) ===== */
.stock-action-bar{
  display:flex;
  gap:5px;
  align-items:center;
  flex-shrink:0;
  flex-wrap:nowrap;
}
.stock-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:5px;
  height:34px;
  padding:0 10px;
  border-radius:9px;
  border:1.5px solid rgba(var(--primary-rgb),0.15);
  background:#fff;
  font-size:11.5px;
  font-weight:700;
  color:var(--text);
  cursor:pointer;
  white-space:nowrap;
  position:relative;
  box-sizing:border-box;
  line-height:1;
  transition:border-color 0.22s ease,background 0.22s ease,color 0.22s ease;
  will-change:transform,box-shadow;
  animation:stockBtnBreath 2.8s ease-in-out infinite;
}
.stock-btn-ico{
  width:20px;
  height:20px;
  border-radius:5px;
  display:flex;
  align-items:center;
  justify-content:center;
  flex-shrink:0;
  transition:transform 0.22s ease,background 0.22s ease;
}
.stock-btn-ico svg{width:12px;height:12px;}
@keyframes stockBtnBreath{
  0%,100%{
    transform:translateY(0);
    box-shadow:0 1px 3px rgba(var(--primary-dark-rgb),0.05);
  }
  50%{
    transform:translateY(-2px);
    box-shadow:0 6px 14px rgba(var(--primary-dark-rgb),0.12),0 2px 5px rgba(var(--primary-dark-rgb),0.06);
  }
}
.stock-btn:nth-child(1){animation-delay:0s;}
.stock-btn:nth-child(2){animation-delay:0.2s;}
.stock-btn:nth-child(3){animation-delay:0.4s;}
.stock-btn:nth-child(4){animation-delay:0.6s;}
.stock-btn:nth-child(5){animation-delay:0.8s;}
.stock-btn:nth-child(6){animation-delay:1s;}
.stock-btn:nth-child(7){animation-delay:1.2s;}
.stock-btn:nth-child(8){animation-delay:1.4s;}
.stock-btn:hover{
  animation-play-state:paused;
  transform:translateY(-3px);
  box-shadow:0 8px 18px rgba(var(--primary-dark-rgb),0.15),0 3px 6px rgba(var(--primary-dark-rgb),0.08);
}
.stock-btn:active{
  transform:translateY(-1px);
}
.stock-btn:hover .stock-btn-ico{transform:scale(1.08);}

/* */
/* 库存报表 — */
.stock-btn-green{border-color:rgba(16,185,129,0.2);}
.stock-btn-green .stock-btn-ico{background:linear-gradient(135deg,rgba(16,185,129,0.15),rgba(4,120,87,0.1));color:#047857;}
.stock-btn-green:hover{background:linear-gradient(135deg,#10b981,#047857);color:#fff;border-color:#065f46;}
.stock-btn-green:hover .stock-btn-ico{background:rgba(255,255,255,0.22);color:#fff;}

/* 导出 — */
.stock-btn-purple{border-color:rgba(139,92,246,0.2);}
.stock-btn-purple .stock-btn-ico{background:linear-gradient(135deg,rgba(139,92,246,0.15),rgba(109,40,217,0.1));color:#6d28d9;}
.stock-btn-purple:hover{background:linear-gradient(135deg,#8b5cf6,#6d28d9);color:#fff;border-color:#5b21b6;}
.stock-btn-purple:hover .stock-btn-ico{background:rgba(255,255,255,0.22);color:#fff;}

/* 仓库入库 — */
.stock-btn-pink{border-color:rgba(236,72,153,0.2);}
.stock-btn-pink .stock-btn-ico{background:linear-gradient(135deg,rgba(236,72,153,0.15),rgba(190,24,93,0.1));color:#be185d;}
.stock-btn-pink:hover{background:linear-gradient(135deg,#ec4899,#be185d);color:#fff;border-color:#9f1239;}
.stock-btn-pink:hover .stock-btn-ico{background:rgba(255,255,255,0.22);color:#fff;}

/* AI录入 — */
.stock-btn-cyan{border-color:rgba(14,165,233,0.2);}
.stock-btn-cyan .stock-btn-ico{background:linear-gradient(135deg,rgba(14,165,233,0.15),rgba(3,105,161,0.1));color:#0369a1;}
.stock-btn-cyan:hover{background:linear-gradient(135deg,#0ea5e9,#0369a1);color:#fff;border-color:#075985;}
.stock-btn-cyan:hover .stock-btn-ico{background:rgba(255,255,255,0.22);color:#fff;}

/* 打印选中 — */
.stock-btn-teal{border-color:rgba(13,148,136,0.2);}
.stock-btn-teal .stock-btn-ico{background:linear-gradient(135deg,rgba(13,148,136,0.15),rgba(15,118,110,0.1));color:#0f766e;}
.stock-btn-teal:hover{background:linear-gradient(135deg,#0d9488,#0f766e);color:#fff;border-color:#115e59;}
.stock-btn-teal:hover .stock-btn-ico{background:rgba(255,255,255,0.22);color:#fff;}

/* 删除选中 — */
.stock-btn-red{border-color:rgba(239,68,68,0.2);}
.stock-btn-red .stock-btn-ico{background:linear-gradient(135deg,rgba(239,68,68,0.15),rgba(185,28,28,0.1));color:#b91c1c;}
.stock-btn-red:hover{background:linear-gradient(135deg,#ef4444,#b91c1c);color:#fff;border-color:#991b1b;}
.stock-btn-red:hover .stock-btn-ico{background:rgba(255,255,255,0.22);color:#fff;}

/* 表格样式 — */
.stock-btn-gray{border-color:rgba(100,116,139,0.22);}
.stock-btn-gray .stock-btn-ico{background:linear-gradient(135deg,rgba(100,116,139,0.15),rgba(51,65,85,0.1));color:#334155;}
.stock-btn-gray:hover{background:linear-gradient(135deg,#64748b,#334155);color:#fff;border-color:#1e293b;}
.stock-btn-gray:hover .stock-btn-ico{background:rgba(255,255,255,0.22);color:#fff;}

/* 添加销售记录 — */
.stock-btn-primary{border-color:rgba(var(--primary-rgb),0.3);}
.stock-btn-primary .stock-btn-ico{background:linear-gradient(135deg,rgba(var(--primary-rgb),0.18),rgba(var(--primary-darker-rgb),0.12));color:var(--primary-dark);}
.stock-btn-primary:hover{background:linear-gradient(135deg,var(--primary),var(--primary-dark));color:#fff;border-color:var(--primary-darker);}
.stock-btn-primary:hover .stock-btn-ico{background:rgba(255,255,255,0.22);color:#fff;}

/* Responsive — - */
@media(max-width:1600px){
  .stock-btn{padding:0 8px;font-size:11px;gap:4px;}
  .stock-btn-ico{width:18px;height:18px;}
  .stock-btn-ico svg{width:11px;height:11px;}
  .stock-action-bar{gap:4px;}
}
@media(max-width:1300px){
  .stock-btn{padding:0 7px;font-size:10.5px;gap:3px;height:32px;}
  .stock-btn-ico{width:16px;height:16px;}
  .stock-btn-ico svg{width:10px;height:10px;}
  .stock-action-bar{gap:3px;}
}
@media(max-width:1100px){
  .stock-btn span:not(.stock-btn-ico){display:none;}
  .stock-btn{width:32px;padding:0;justify-content:center;}
  .stock-btn-ico{width:18px;height:18px;}
  .stock-btn-ico svg{width:12px;height:12px;}
}
@media(max-width:900px){
  .stock-action-bar{flex-wrap:wrap;gap:4px;}
  #actionBtnRow{flex-wrap:wrap;}
}
@media(max-width:768px){
  .stock-btn{width:30px;height:30px;}
}


/* ===== ===== */
.date-range-box{
  position:relative;
  display:inline-flex;
  align-items:center;
  gap:5px;
  height:34px;
  padding:0 10px;
  border:1.5px solid rgba(var(--primary-rgb),0.18);
  border-radius:9px;
  background:var(--card-bg,#fff);
  color:var(--text);
  font-size:11.5px;
  font-weight:600;
  cursor:pointer;
  box-sizing:border-box;
  user-select:none;
  transition:all 0.2s ease;
  min-width:150px;
}
.date-range-box:hover{
  border-color:rgba(var(--primary-rgb),0.35);
  background:rgba(var(--primary-rgb),0.04);
}
.date-range-box.has-value{
  border-color:rgba(var(--primary-rgb),0.4);
  background:rgba(var(--primary-rgb),0.08);
}
.date-range-label{
  flex:1;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  color:var(--text-muted);
  font-weight:600;
}
.date-range-box.has-value .date-range-label{color:var(--primary-dark);font-weight:700;}

/* */
.date-range-panel{
  display:none;
  position:absolute;
  top:calc(100% + 6px);
  left:0;
  z-index:100;
  background:#fff;
  border:1px solid rgba(var(--primary-rgb),0.2);
  border-radius:12px;
  box-shadow:0 10px 32px rgba(var(--primary-dark-rgb),0.15),0 4px 12px rgba(var(--primary-dark-rgb),0.08);
  padding:14px;
  min-width:280px;
  cursor:default;
  animation:drpFadeIn 0.2s ease;
}
.date-range-panel.open{display:block;}
@keyframes drpFadeIn{
  from{opacity:0;transform:translateY(-6px);}
  to{opacity:1;transform:translateY(0);}
}
.drp-row{
  display:flex;
  align-items:center;
  gap:10px;
  margin-bottom:10px;
}
.drp-row label{
  font-size:12px;
  font-weight:600;
  color:var(--text-muted);
  min-width:64px;
}
.drp-row input[type="date"]{
  flex:1;
  height:34px;
  padding:0 10px;
  border:1.5px solid rgba(var(--primary-rgb),0.2);
  border-radius:8px;
  font-size:12px;
  background:#fff;
  color:var(--text);
  cursor:pointer;
  outline:none;
  box-sizing:border-box;
  transition:border-color 0.2s ease,box-shadow 0.2s ease;
}
.drp-row input[type="date"]:focus{
  border-color:var(--primary);
  box-shadow:0 0 0 3px rgba(var(--primary-rgb),0.12);
}
.drp-quick{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:6px;
  padding:8px 0;
  margin:2px 0 10px;
  border-top:1px dashed rgba(var(--primary-rgb),0.15);
  border-bottom:1px dashed rgba(var(--primary-rgb),0.15);
}
.drp-quick button{
  padding:6px 0;
  border:1px solid rgba(var(--primary-rgb),0.2);
  background:rgba(var(--primary-rgb),0.04);
  border-radius:7px;
  font-size:11.5px;
  font-weight:600;
  color:var(--primary-dark);
  cursor:pointer;
  transition:all 0.2s ease;
}
.drp-quick button:hover{
  background:rgba(var(--primary-rgb),0.14);
  border-color:rgba(var(--primary-rgb),0.35);
  transform:translateY(-1px);
}
.drp-actions{
  display:flex;
  gap:8px;
  justify-content:flex-end;
}
.drp-reset,.drp-apply{
  padding:8px 18px;
  border-radius:8px;
  font-size:12px;
  font-weight:700;
  cursor:pointer;
  border:none;
  transition:all 0.2s ease;
}
.drp-reset{
  background:rgba(var(--primary-rgb),0.08);
  color:var(--primary-dark);
  border:1.5px solid rgba(var(--primary-rgb),0.25);
}
.drp-reset:hover{background:rgba(var(--primary-rgb),0.15);}
.drp-apply{
  background:linear-gradient(135deg,var(--primary),var(--primary-dark));
  color:#fff;
  box-shadow:0 3px 8px rgba(var(--primary-dark-rgb),0.25);
}
.drp-apply:hover{
  background:linear-gradient(135deg,var(--primary-dark),var(--primary-darker));
  box-shadow:0 5px 12px rgba(var(--primary-dark-rgb),0.35);
  transform:translateY(-1px);
}

/* */
@media(max-width:768px){
  .date-range-box{min-width:140px;font-size:11px;}
  .date-range-panel{min-width:260px;left:auto;right:0;}
}


/* ===== placeholder — ===== */
.stock-search-input::placeholder{
  color:rgba(120,135,115,0.45);
  font-weight:500;
  font-style:italic;
  letter-spacing:0.3px;
  opacity:1;
}
.stock-search-input::-webkit-input-placeholder{
  color:rgba(120,135,115,0.45);
  font-weight:500;
  font-style:italic;
  letter-spacing:0.3px;
}
.stock-search-input::-moz-placeholder{
  color:rgba(120,135,115,0.45);
  font-weight:500;
  font-style:italic;
  letter-spacing:0.3px;
  opacity:1;
}
.stock-search-input:-ms-input-placeholder{
  color:rgba(120,135,115,0.45);
  font-weight:500;
  font-style:italic;
  letter-spacing:0.3px;
}
/* focus placeholder */
.stock-search-input:focus{
  border-color:rgba(var(--primary-rgb),0.5);
  box-shadow:0 0 0 3px rgba(var(--primary-rgb),0.1);
  background:#fff;
}
.stock-search-input:focus::placeholder{
  color:rgba(120,135,115,0.3);
}

/* placeholder (选择日期范围) */
.date-range-box:not(.has-value) .date-range-label{
  color:rgba(120,135,115,0.5);
  font-weight:500;
  font-style:italic;
  letter-spacing:0.2px;
}


/* ===== (管理员) - Pro UI ===== */

/* 4 */
.admin-stat-row{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:14px;
  margin-bottom:16px;
}
.admin-stat-card{
  position:relative;
  background:#fff;
  border:1px solid rgba(var(--primary-rgb),0.1);
  border-radius:14px;
  padding:16px 18px;
  overflow:hidden;
  cursor:pointer;
  transition:border-color 0.22s ease;
  will-change:transform,box-shadow;
  animation:adminCardFloat 3.5s ease-in-out infinite;
}
@keyframes adminCardFloat{
  0%,100%{
    transform:translateY(0);
    box-shadow:0 2px 6px rgba(0,0,0,0.05),0 1px 2px rgba(0,0,0,0.03);
  }
  50%{
    transform:translateY(-4px);
    box-shadow:0 10px 24px rgba(0,0,0,0.12),0 4px 8px rgba(0,0,0,0.06);
  }
}
.admin-stat-card:nth-child(1){animation-delay:0s;}
.admin-stat-card:nth-child(2){animation-delay:0.4s;}
.admin-stat-card:nth-child(3){animation-delay:0.8s;}
.admin-stat-card:nth-child(4){animation-delay:1.2s;}
.admin-stat-card::after{
  content:'';
  position:absolute;
  left:0;top:0;bottom:0;
  width:4px;
  border-radius:14px 0 0 14px;
}
.admin-stat-card:hover{
  animation-play-state:paused;
  transform:translateY(-5px);
  box-shadow:0 12px 28px rgba(0,0,0,0.15),0 5px 10px rgba(0,0,0,0.08);
}
.admin-stat-head{
  display:flex;
  justify-content:space-between;
  align-items:center;
  margin-bottom:10px;
}
.admin-stat-ico{
  width:40px;
  height:40px;
  border-radius:11px;
  display:flex;
  align-items:center;
  justify-content:center;
  flex-shrink:0;
  box-shadow:0 3px 10px rgba(0,0,0,0.08),inset 0 1px 0 rgba(255,255,255,0.35);
}
.admin-stat-pulse{
  display:inline-block;
  width:10px;
  height:10px;
  border-radius:50%;
  background:#3b82f6;
  box-shadow:0 0 0 4px rgba(59,130,246,0.2);
  animation:statPulse 1.8s ease-in-out infinite;
}
.admin-pulse-green{background:#10b981!important;box-shadow:0 0 0 4px rgba(16,185,129,0.25)!important;}
@keyframes statPulse{
  0%,100%{box-shadow:0 0 0 0 rgba(59,130,246,0.3);}
  50%{box-shadow:0 0 0 8px rgba(59,130,246,0);}
}
.admin-stat-label{
  font-size:12.5px;
  font-weight:700;
  color:var(--text);
  margin-bottom:5px;
  letter-spacing:0.2px;
  display:flex;
  align-items:center;
  gap:5px;
}
.admin-stat-value{
  font-size:30px;
  font-weight:900;
  line-height:1.05;
  letter-spacing:-0.8px;
  font-variant-numeric:tabular-nums;
  margin-bottom:5px;
}
.admin-stat-sub{
  font-size:11px;
  color:var(--text-muted);
  font-weight:500;
}

/* */
.admin-stat-blue::after{background:linear-gradient(180deg,#3b82f6,#1d4ed8);}
.admin-stat-blue .admin-stat-ico{background:linear-gradient(135deg,#3b82f6,#1d4ed8);color:#fff;}
.admin-stat-blue .admin-stat-value{background:linear-gradient(135deg,#1d4ed8,#3b82f6);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;}

.admin-stat-green::after{background:linear-gradient(180deg,#10b981,#047857);}
.admin-stat-green .admin-stat-ico{background:linear-gradient(135deg,#10b981,#047857);color:#fff;}
.admin-stat-green .admin-stat-value{background:linear-gradient(135deg,#047857,#10b981);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;}

.admin-stat-amber::after{background:linear-gradient(180deg,#f59e0b,#b45309);}
.admin-stat-amber .admin-stat-ico{background:linear-gradient(135deg,#f59e0b,#b45309);color:#fff;}
.admin-stat-amber .admin-stat-value{background:linear-gradient(135deg,#b45309,#f59e0b);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;}

.admin-stat-purple::after{background:linear-gradient(180deg,#8b5cf6,#6d28d9);}
.admin-stat-purple .admin-stat-ico{background:linear-gradient(135deg,#8b5cf6,#6d28d9);color:#fff;}
.admin-stat-purple .admin-stat-value{background:linear-gradient(135deg,#6d28d9,#8b5cf6);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;}

.admin-dot{
  display:inline-block;
  width:7px;
  height:7px;
  border-radius:50%;
  margin-left:2px;
}
.admin-dot-green{
  background:#10b981;
  box-shadow:0 0 0 0 rgba(16,185,129,0.5);
  animation:dotPulse 1.5s ease-in-out infinite;
}
@keyframes dotPulse{
  0%,100%{box-shadow:0 0 0 0 rgba(16,185,129,0.5);}
  50%{box-shadow:0 0 0 6px rgba(16,185,129,0);}
}

/* ===== ===== */
.admin-table-card{
  background:#fff;
  border:1px solid rgba(var(--primary-rgb),0.1);
  border-radius:14px;
  overflow:hidden;
  box-shadow:0 2px 8px rgba(var(--primary-dark-rgb),0.05);
}
.admin-table-head{
  display:flex;
  justify-content:space-between;
  align-items:center;
  padding:14px 18px;
  background:linear-gradient(135deg,rgba(59,130,246,0.05),rgba(29,78,216,0.02));
  border-bottom:1px solid rgba(var(--primary-rgb),0.1);
}
.admin-table-title{
  display:flex;
  align-items:center;
  gap:8px;
  font-size:14px;
  font-weight:800;
  color:var(--text);
  margin:0;
}
.admin-table-title svg{color:#1d4ed8;}
.admin-count-badge{
  background:rgba(59,130,246,0.12);
  color:#1d4ed8;
  padding:4px 12px;
  border-radius:20px;
  font-size:11.5px;
  font-weight:700;
  letter-spacing:0.2px;
}

.admin-table-wrap{overflow-x:auto;}
.admin-table{
  width:100%;
  border-collapse:collapse;
  font-size:12px;
}
.admin-table thead tr{
  background:linear-gradient(180deg,#1e293b,#0f172a);
}
.admin-table thead th{
  padding:12px 14px;
  font-size:11.5px;
  font-weight:700;
  color:#e2e8f0;
  text-align:center;
  white-space:nowrap;
  border:none;
  letter-spacing:0.3px;
}
.admin-table tbody tr{
  border-bottom:1px solid rgba(var(--primary-rgb),0.08);
  transition:all 0.18s ease;
}
.admin-table tbody tr:hover{background:rgba(59,130,246,0.04);}
.admin-table tbody tr:last-child{border-bottom:none;}
.admin-table tbody td{padding:12px 14px;text-align:center;color:var(--text);vertical-align:middle;}

/* */
.admin-user-cell{text-align:left!important;}
.admin-user-wrap{
  display:flex;
  align-items:center;
  gap:12px;
}
.admin-avatar{
  position:relative;
  width:40px;
  height:40px;
  border-radius:11px;
  display:flex;
  align-items:center;
  justify-content:center;
  color:#fff;
  font-size:16px;
  font-weight:800;
  flex-shrink:0;
  box-shadow:0 3px 10px rgba(0,0,0,0.12),inset 0 1px 0 rgba(255,255,255,0.25);
  letter-spacing:0.5px;
}
.admin-avatar-dot{
  position:absolute;
  bottom:-2px;
  right:-2px;
  width:12px;
  height:12px;
  background:#10b981;
  border:2px solid #fff;
  border-radius:50%;
  box-shadow:0 0 0 0 rgba(16,185,129,0.5);
  animation:dotPulse 1.5s ease-in-out infinite;
}
.admin-user-info{min-width:0;}
.admin-user-name{
  font-size:13px;
  font-weight:700;
  color:var(--text);
  margin-bottom:2px;
  line-height:1.2;
}
.admin-user-meta{
  font-size:11px;
  color:var(--text-muted);
  font-family:'SF Mono',Menlo,monospace;
  letter-spacing:0.2px;
}

/* 角色 badge */
.admin-role-badge{
  display:inline-block;
  padding:4px 12px;
  border-radius:20px;
  font-size:11px;
  font-weight:700;
  letter-spacing:0.2px;
}

/* */
.admin-status{
  display:inline-flex;
  align-items:center;
  gap:5px;
  padding:4px 10px;
  border-radius:20px;
  font-size:11px;
  font-weight:700;
  letter-spacing:0.2px;
}
.admin-status-dot{
  width:6px;
  height:6px;
  border-radius:50%;
}
.admin-status-online{
  background:rgba(16,185,129,0.12);
  color:#059669;
  border:1px solid rgba(16,185,129,0.25);
}
.admin-status-online .admin-status-dot{
  background:#10b981;
  box-shadow:0 0 0 0 rgba(16,185,129,0.5);
  animation:dotPulse 1.5s ease-in-out infinite;
}
.admin-status-offline{
  background:rgba(148,163,184,0.1);
  color:#64748b;
  border:1px solid rgba(148,163,184,0.25);
}
.admin-status-offline .admin-status-dot{background:#94a3b8;}

/* */
.admin-hours{
  display:inline-block;
  padding:3px 10px;
  border-radius:20px;
  font-size:11px;
  font-weight:600;
  color:var(--text-muted);
  background:rgba(148,163,184,0.08);
}
.admin-hours.has-value{
  background:linear-gradient(135deg,rgba(139,92,246,0.1),rgba(109,40,217,0.06));
  color:#6d28d9;
  font-weight:700;
  border:1px solid rgba(139,92,246,0.2);
}

/* */
.admin-action-group{
  display:inline-flex;
  gap:4px;
  align-items:center;
  justify-content:center;
}
.admin-act-btn{
  display:inline-flex;
  align-items:center;
  gap:3px;
  padding:5px 8px;
  border-radius:7px;
  border:1px solid transparent;
  font-size:11px;
  font-weight:700;
  cursor:pointer;
  transition:all 0.2s ease;
  line-height:1;
}
.admin-act-btn:hover{transform:translateY(-1px);}
.admin-act-edit{
  background:rgba(59,130,246,0.1);
  color:#1d4ed8;
  border-color:rgba(59,130,246,0.2);
}
.admin-act-edit:hover{background:rgba(59,130,246,0.18);border-color:rgba(59,130,246,0.35);}
.admin-act-record{
  background:rgba(14,165,233,0.1);
  color:#0369a1;
  border-color:rgba(14,165,233,0.2);
}
.admin-act-record:hover{background:rgba(14,165,233,0.18);border-color:rgba(14,165,233,0.35);}
.admin-act-del{
  background:rgba(239,68,68,0.08);
  color:#dc2626;
  border-color:rgba(239,68,68,0.2);
}
.admin-act-del:hover{background:rgba(239,68,68,0.16);border-color:rgba(239,68,68,0.4);}

/* Empty state */
.admin-empty{
  text-align:center!important;
  padding:56px 20px!important;
  color:var(--text-light);
}
.admin-empty-ico{font-size:40px;margin-bottom:10px;opacity:0.6;}

/* Responsive */
@media(max-width:1200px){.admin-stat-row{grid-template-columns:repeat(2,1fr);}}
@media(max-width:768px){
  .admin-stat-row{grid-template-columns:1fr;}
  .admin-act-btn{padding:5px 7px;}
  .admin-table tbody td{padding:10px 8px;}
}


/* ===== 仓库管理 ( + ) ===== */
.stock-stat-row{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:12px;
  margin-bottom:14px;
}
.stock-stat-card{
  position:relative;
  display:flex;
  align-items:center;
  gap:12px;
  padding:16px 18px;
  border-radius:14px;
  background:#fff;
  border:1px solid rgba(var(--primary-rgb),0.1);
  overflow:hidden;
  transition:border-color 0.22s ease;
  will-change:transform,box-shadow;
  animation:stockStatFloat 3.2s ease-in-out infinite;
}
@keyframes stockStatFloat{
  0%,100%{
    transform:translateY(0);
    box-shadow:0 2px 6px rgba(0,0,0,0.05),0 1px 2px rgba(0,0,0,0.03);
  }
  50%{
    transform:translateY(-4px);
    box-shadow:0 10px 24px rgba(0,0,0,0.12),0 4px 8px rgba(0,0,0,0.06);
  }
}
.stock-stat-card:nth-child(1){animation-delay:0s;}
.stock-stat-card:nth-child(2){animation-delay:0.4s;}
.stock-stat-card:nth-child(3){animation-delay:0.8s;}
.stock-stat-card:nth-child(4){animation-delay:1.2s;}
.stock-stat-card:hover{
  animation-play-state:paused;
  transform:translateY(-6px);
  box-shadow:0 14px 32px rgba(0,0,0,0.14),0 5px 10px rgba(0,0,0,0.08);
}

/* (shine) */
.stock-sc-shine{
  position:absolute;
  top:0;
  left:-100%;
  width:50%;
  height:100%;
  background:linear-gradient(
    120deg,
    transparent 20%,
    rgba(255,255,255,0.6) 50%,
    transparent 80%
  );
  transform:skewX(-20deg);
  pointer-events:none;
  animation:stockShineSweep 4s ease-in-out infinite;
  z-index:1;
}
@keyframes stockShineSweep{
  0%{left:-100%;}
  60%{left:130%;}
  100%{left:130%;}
}
.stock-stat-card:nth-child(1) .stock-sc-shine{animation-delay:0s;}
.stock-stat-card:nth-child(2) .stock-sc-shine{animation-delay:1s;}
.stock-stat-card:nth-child(3) .stock-sc-shine{animation-delay:2s;}
.stock-stat-card:nth-child(4) .stock-sc-shine{animation-delay:3s;}

/* */
.stock-stat-card::after{
  content:'';
  position:absolute;
  left:0;top:0;bottom:0;
  width:4px;
  border-radius:14px 0 0 14px;
  z-index:2;
}

.stock-sc-ico{
  width:44px;
  height:44px;
  border-radius:12px;
  display:flex;
  align-items:center;
  justify-content:center;
  flex-shrink:0;
  color:#fff;
  box-shadow:0 3px 10px rgba(0,0,0,0.1),inset 0 1px 0 rgba(255,255,255,0.25);
  position:relative;
  z-index:2;
}
.stock-sc-body{position:relative;z-index:2;min-width:0;}
.stock-sc-label{
  font-size:11.5px;
  color:var(--text-muted);
  font-weight:600;
  margin-bottom:4px;
  letter-spacing:0.2px;
}
.stock-sc-value{
  font-size:22px;
  font-weight:900;
  line-height:1.1;
  letter-spacing:-0.5px;
  font-variant-numeric:tabular-nums;
}

/* */
.stock-sc-blue::after{background:linear-gradient(180deg,#3b82f6,#1d4ed8);}
.stock-sc-blue .stock-sc-ico{background:linear-gradient(135deg,#3b82f6,#1d4ed8);}
.stock-sc-blue .stock-sc-value{color:#1d4ed8;}

.stock-sc-green::after{background:linear-gradient(180deg,#10b981,#047857);}
.stock-sc-green .stock-sc-ico{background:linear-gradient(135deg,#10b981,#047857);}
.stock-sc-green .stock-sc-value{color:#047857;}

.stock-sc-red::after{background:linear-gradient(180deg,#ef4444,#b91c1c);}
.stock-sc-red .stock-sc-ico{background:linear-gradient(135deg,#ef4444,#b91c1c);}
.stock-sc-red .stock-sc-value{color:#b91c1c;}

.stock-sc-purple::after{background:linear-gradient(180deg,#8b5cf6,#6d28d9);}
.stock-sc-purple .stock-sc-ico{background:linear-gradient(135deg,#8b5cf6,#6d28d9);}
.stock-sc-purple .stock-sc-value{color:#6d28d9;}

/* Responsive */
@media(max-width:1200px){.stock-stat-row{grid-template-columns:repeat(2,1fr);}}
@media(max-width:640px){.stock-stat-row{grid-template-columns:1fr;}}

/* ===== Accessibility — ===== */
@media (prefers-reduced-motion: reduce){
  .stock-stat-card,
  .admin-stat-card,
  .stock-sc-shine{
    animation:none !important;
  }
}


/* ===== — + ===== */
#statsSection > div{
  position:relative;
  overflow:hidden;
  animation:homeStatFloat 3.5s ease-in-out infinite;
  will-change:transform,box-shadow;
}
@keyframes homeStatFloat{
  0%,100%{
    transform:translateY(0);
    box-shadow:0 2px 6px rgba(0,0,0,0.05);
  }
  50%{
    transform:translateY(-4px);
    box-shadow:0 10px 24px rgba(0,0,0,0.1),0 4px 8px rgba(0,0,0,0.05);
  }
}
#statsSection > div:nth-child(1){animation-delay:0s;}
#statsSection > div:nth-child(2){animation-delay:0.3s;}
#statsSection > div:nth-child(3){animation-delay:0.6s;}
#statsSection > div:nth-child(4){animation-delay:0.9s;}
#statsSection > div:nth-child(5){animation-delay:1.2s;}
#statsSection > div:hover{
  animation-play-state:paused;
  transform:translateY(-6px)!important;
  box-shadow:0 14px 32px rgba(0,0,0,0.14)!important;
}

/* ( ) */
#statsSection > div::after{
  content:'';
  position:absolute;
  top:0;
  left:-100%;
  width:50%;
  height:100%;
  background:linear-gradient(
    120deg,
    transparent 20%,
    rgba(255,255,255,0.55) 50%,
    transparent 80%
  );
  transform:skewX(-20deg);
  pointer-events:none;
  animation:homeStatShine 4s ease-in-out infinite;
  z-index:1;
}
@keyframes homeStatShine{
  0%{left:-100%;}
  60%{left:130%;}
  100%{left:130%;}
}
#statsSection > div:nth-child(1)::after{animation-delay:0s;}
#statsSection > div:nth-child(2)::after{animation-delay:0.8s;}
#statsSection > div:nth-child(3)::after{animation-delay:1.6s;}
#statsSection > div:nth-child(4)::after{animation-delay:2.4s;}
#statsSection > div:nth-child(5)::after{animation-delay:3.2s;}

/* */
#statsSection > div > *{position:relative;z-index:2;}

@media (prefers-reduced-motion: reduce){
  #statsSection > div,
  #statsSection > div::after{
    animation:none !important;
  }
}


/* ===== ===== */
.af-perm-header{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:12px;
  margin-bottom:10px;
  padding:10px 14px;
  background:linear-gradient(135deg,#faf5ff,#f3e8ff);
  border:1px solid rgba(124,58,237,0.15);
  border-radius:12px;
}
.af-perm-title{
  font-size:13.5px;
  font-weight:800;
  color:#6d28d9;
  letter-spacing:0.2px;
}
.af-perm-subtitle{
  font-size:10.5px;
  color:#94a3b8;
  margin-top:2px;
  font-weight:500;
}
.af-perm-actions{
  display:flex;
  gap:6px;
  flex-shrink:0;
}
.af-btn-all,.af-btn-none{
  display:inline-flex;
  align-items:center;
  gap:4px;
  padding:6px 12px;
  border:none;
  border-radius:8px;
  font-size:11px;
  font-weight:700;
  cursor:pointer;
  transition:all 0.2s ease;
}
.af-btn-all{
  background:linear-gradient(135deg,#10b981,#047857);
  color:#fff;
  box-shadow:0 2px 6px rgba(16,185,129,0.3);
}
.af-btn-all:hover{
  background:linear-gradient(135deg,#059669,#065f46);
  transform:translateY(-1px);
  box-shadow:0 4px 10px rgba(16,185,129,0.4);
}
.af-btn-none{
  background:#fff;
  color:#64748b;
  border:1.5px solid #e2e8f0;
}
.af-btn-none:hover{
  background:#f8fafc;
  border-color:#cbd5e1;
  color:#334155;
}

/* ===== ===== */
.af-perm-container{
  padding:14px;
  background:linear-gradient(145deg,#fafbfc,#f3f4f6);
  border:1px solid #e5e7eb;
  border-radius:14px;
  max-height:420px;
  overflow-y:auto;
}
.af-perm-container::-webkit-scrollbar{width:6px;}
.af-perm-container::-webkit-scrollbar-track{background:transparent;}
.af-perm-container::-webkit-scrollbar-thumb{background:rgba(124,58,237,0.2);border-radius:3px;}
.af-perm-container::-webkit-scrollbar-thumb:hover{background:rgba(124,58,237,0.35);}

.af-perm-groups{
  display:flex;
  flex-direction:column;
  gap:12px;
}

/* ===== ===== */
.af-group{
  background:#fff;
  border:1.5px solid var(--gbd,#e5e7eb);
  border-radius:12px;
  overflow:hidden;
  transition:all 0.25s ease;
  box-shadow:0 1px 3px rgba(0,0,0,0.03);
}
.af-group:hover{
  box-shadow:0 4px 12px rgba(0,0,0,0.06);
  transform:translateY(-1px);
  border-color:var(--gc,#7c3aed);
}
.af-group-danger{
  background:linear-gradient(145deg,#fff,#fef2f2);
}
.af-group-danger .af-group-name{color:#dc2626;}

/* */
.af-group-head{
  display:flex;
  justify-content:space-between;
  align-items:center;
  padding:10px 14px;
  background:var(--gbg,#f8fafc);
  border-bottom:1px solid var(--gbd,#e5e7eb);
}
.af-group-title{
  display:flex;
  align-items:center;
  gap:10px;
  flex:1;
  min-width:0;
}
.af-group-dot{
  width:8px;
  height:8px;
  border-radius:50%;
  background:var(--gc,#7c3aed);
  flex-shrink:0;
  box-shadow:0 0 0 3px rgba(0,0,0,0.05);
}
.af-group-name{
  font-size:12.5px;
  font-weight:800;
  color:var(--gc,#334155);
  letter-spacing:0.2px;
  line-height:1.2;
}
.af-group-desc{
  font-size:10.5px;
  color:#94a3b8;
  margin-top:2px;
  line-height:1.3;
}

/* toggle ( ) */
.af-group-toggle{
  position:relative;
  display:inline-block;
  width:38px;
  height:22px;
  cursor:pointer;
  flex-shrink:0;
}
.af-group-toggle input{
  opacity:0;
  width:0;
  height:0;
}
.af-group-toggle-slider{
  position:absolute;
  inset:0;
  background:#cbd5e1;
  border-radius:22px;
  transition:all 0.25s ease;
}
.af-group-toggle-slider::before{
  content:'';
  position:absolute;
  left:3px;
  top:3px;
  width:16px;
  height:16px;
  background:#fff;
  border-radius:50%;
  box-shadow:0 2px 4px rgba(0,0,0,0.15);
  transition:all 0.25s cubic-bezier(0.4,0,0.2,1);
}
.af-group-toggle input:checked + .af-group-toggle-slider{
  background:var(--gc,#7c3aed);
  box-shadow:inset 0 0 0 1px var(--gc,#7c3aed);
}
.af-group-toggle input:checked + .af-group-toggle-slider::before{
  transform:translateX(16px);
}

/* */
.af-group-items{
  display:grid;
  grid-template-columns:1fr;
  gap:6px;
  padding:10px;
}

/* */
.af-perm-item{
  display:flex;
  align-items:center;
  gap:10px;
  padding:10px 12px;
  border-radius:10px;
  cursor:pointer;
  background:#fafbfc;
  border:1.5px solid #e5e7eb;
  transition:all 0.2s ease;
}
.af-perm-item input[type="checkbox"]{
  position:absolute;
  opacity:0;
  width:0;
  height:0;
}
.af-perm-check{
  width:20px;
  height:20px;
  border-radius:6px;
  background:#fff;
  border:1.5px solid #cbd5e1;
  display:flex;
  align-items:center;
  justify-content:center;
  color:transparent;
  transition:all 0.2s ease;
  flex-shrink:0;
}
.af-perm-item:hover{
  border-color:var(--gc,#7c3aed);
  background:#fff;
  transform:translateX(2px);
}
.af-perm-item:hover .af-perm-check{
  border-color:var(--gc,#7c3aed);
}
.af-perm-item.is-checked{
  background:linear-gradient(135deg,#fff,var(--gbg,#faf5ff));
  border-color:var(--gc,#7c3aed);
  box-shadow:0 0 0 2px rgba(124,58,237,0.08);
}
.af-perm-item.is-checked .af-perm-check{
  background:var(--gc,#7c3aed);
  border-color:var(--gc,#7c3aed);
  color:#fff;
}
.af-perm-item.is-checked .af-perm-name{color:var(--gc,#7c3aed);}

.af-perm-ico{
  font-size:18px;
  flex-shrink:0;
  filter:grayscale(0.2);
  transition:filter 0.2s ease;
}
.af-perm-item:hover .af-perm-ico,
.af-perm-item.is-checked .af-perm-ico{filter:grayscale(0);}
.af-perm-text{
  flex:1;
  display:flex;
  flex-direction:column;
  gap:2px;
  min-width:0;
}
.af-perm-name{
  font-size:12.5px;
  color:#1e293b;
  font-weight:700;
  letter-spacing:0.1px;
  line-height:1.2;
}
.af-perm-desc{
  font-size:10px;
  color:#94a3b8;
  font-weight:500;
  line-height:1.3;
}

/* 2 ( ) */
@media (min-width: 520px){
  .af-group-items{grid-template-columns:1fr 1fr;}
 /* — */
  .af-group-items:has(.af-perm-item:only-child){grid-template-columns:1fr;}
}

/* Modal */
#adminFormOverlay > div{max-width:640px!important;}


/* ===== — ===== */
/* body data-role="limited" (super_admin )
 .super-admin-only — JS */
body[data-role="limited"] .super-admin-only{display:none!important;}
body[data-role="limited"] .delete-protected{display:none!important;}


/* ===== AI Assistant Workspace - 现代化设计 ===== */
.ai-workspace{
  display:flex;flex-direction:column;
  height:calc(100vh - 56px);max-height:calc(100vh - 56px);
  background:linear-gradient(180deg,#fafbfc 0%,#f4f6f8 100%);
  overflow:hidden;
}

/* Header */
.ai-header{
  display:flex;justify-content:space-between;align-items:center;
  padding:14px 24px;background:#ffffff;
  border-bottom:1px solid #e5e7eb;
  flex-shrink:0;
  box-shadow:0 1px 0 rgba(15,23,42,0.02);
}
.ai-header-brand{display:flex;align-items:center;gap:12px;}
.ai-header-logo{
  width:40px;height:40px;border-radius:12px;
  background:linear-gradient(135deg,#6366f1,#8b5cf6);
  color:#fff;display:flex;align-items:center;justify-content:center;
  box-shadow:0 4px 12px rgba(99,102,241,0.3);
}
.ai-header-title{margin:0;font-size:15px;font-weight:700;color:#0f172a;letter-spacing:0.2px;}
.ai-header-subtitle{
  display:flex;align-items:center;gap:6px;
  font-size:11px;color:#64748b;margin-top:2px;
}
.ai-status-dot{
  width:6px;height:6px;border-radius:50%;background:#10b981;
  box-shadow:0 0 0 3px rgba(16,185,129,0.15);
  animation:aiDotPulse 2s ease-in-out infinite;
}
@keyframes aiDotPulse{0%,100%{opacity:1}50%{opacity:0.6}}

.ai-header-actions{display:flex;gap:6px;}
.ai-btn-icon{
  width:34px;height:34px;border-radius:10px;border:1px solid #e5e7eb;
  background:#ffffff;color:#6b7280;cursor:pointer;
  display:flex;align-items:center;justify-content:center;
  transition:all 0.15s ease;
}
.ai-btn-icon:hover{background:#f3f4f6;color:#1f2937;border-color:#cbd5e1;}

/* Quick Actions Row */
.ai-quick-row{
  display:flex;gap:10px;padding:14px 24px;
  background:#ffffff;border-bottom:1px solid #eef0f3;
  overflow-x:auto;scrollbar-width:none;flex-shrink:0;
}
.ai-quick-row::-webkit-scrollbar{display:none;}
.ai-quick-card{
  display:flex;flex-direction:column;align-items:center;gap:6px;
  min-width:76px;padding:10px 12px;border-radius:12px;
  background:#fafbfc;border:1px solid transparent;
  cursor:pointer;transition:all 0.15s ease;
  flex-shrink:0;
}
.ai-quick-card:hover{background:#ffffff;border-color:#e5e7eb;transform:translateY(-1px);box-shadow:0 4px 12px rgba(15,23,42,0.06);}
.ai-quick-ico{
  width:36px;height:36px;border-radius:10px;
  display:flex;align-items:center;justify-content:center;
}
.ai-quick-label{font-size:11px;font-weight:600;color:#374151;white-space:nowrap;}

/* Chat Container */
.ai-chat-container{
  flex:1;display:flex;flex-direction:column;
  max-width:900px;width:100%;margin:0 auto;
  overflow:hidden;
}
.ai-chat-messages{
  flex:1;overflow-y:auto;padding:20px 24px;
  scroll-behavior:smooth;
}
.ai-chat-messages::-webkit-scrollbar{width:6px;}
.ai-chat-messages::-webkit-scrollbar-thumb{background:#cbd5e1;border-radius:3px;}

/* Message Bubbles */
.ai-msg{display:flex;gap:10px;margin-bottom:16px;align-items:flex-start;animation:aiMsgIn 0.25s ease;}
@keyframes aiMsgIn{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}
.ai-msg-user{flex-direction:row-reverse;}
.ai-avatar{
  width:32px;height:32px;border-radius:50%;flex-shrink:0;
  display:flex;align-items:center;justify-content:center;
  background:linear-gradient(135deg,#6366f1,#8b5cf6);
  color:#fff;font-weight:700;font-size:14px;
  box-shadow:0 2px 6px rgba(99,102,241,0.25);
}
.ai-msg-user .ai-avatar{background:linear-gradient(135deg,#0ea5e9,#2563eb);box-shadow:0 2px 6px rgba(14,165,233,0.25);}
.ai-bubble{
  background:#ffffff;border:1px solid #e5e7eb;
  padding:12px 16px;border-radius:16px;border-top-left-radius:4px;
  max-width:78%;font-size:13px;line-height:1.7;color:#1e293b;
  box-shadow:0 1px 2px rgba(15,23,42,0.04);
  word-wrap:break-word;
}
.ai-msg-user .ai-bubble{
  background:linear-gradient(135deg,#eef2ff,#e0e7ff);
  border-color:#c7d2fe;color:#1e3a8a;
  border-radius:16px;border-top-right-radius:4px;
}
.ai-bubble code{
  background:#f3f4f6;padding:2px 6px;border-radius:4px;
  font-family:'Menlo','Monaco','Consolas',monospace;font-size:11.5px;
  color:#4f46e5;border:1px solid #e5e7eb;
}
.ai-bubble b{color:#0f172a;}
.ai-bubble table{width:100%;border-collapse:collapse;margin:8px 0;font-size:11.5px;background:#ffffff;border:1px solid #e2e8f0;border-radius:8px;overflow:hidden;}
.ai-bubble thead tr{background:#f1f5f9!important;}
.ai-bubble th{background:#f1f5f9!important;padding:8px 10px;font-weight:600;border-bottom:1px solid #e2e8f0;text-align:left;color:#0f172a!important;font-size:11.5px;letter-spacing:0.2px;}
.ai-bubble td{padding:7px 10px;border-bottom:1px solid #f1f5f9;color:#1e293b;background:#ffffff;}
.ai-bubble tr:last-child td{border-bottom:none;}
.ai-bubble tr:nth-child(even) td{background:#fafbfc;}
.ai-bubble tr:hover td{background:#f5f7ff;}

/* Typing indicator */
.ai-typing{display:inline-flex;gap:3px;padding:2px 0;}
.ai-typing span{width:6px;height:6px;border-radius:50%;background:#cbd5e1;animation:aiTyping 1.4s infinite ease-in-out;}
.ai-typing span:nth-child(2){animation-delay:0.2s;}
.ai-typing span:nth-child(3){animation-delay:0.4s;}
@keyframes aiTyping{0%,60%,100%{transform:translateY(0);opacity:0.4}30%{transform:translateY(-4px);opacity:1}}

/* Suggestions */
.ai-suggestions{
  display:flex;gap:6px;padding:0 24px 10px;flex-wrap:wrap;
  max-width:900px;margin:0 auto;width:100%;
}
.ai-suggest-chip{
  padding:6px 12px;border-radius:20px;
  background:#ffffff;border:1px solid #e5e7eb;
  font-size:11px;font-weight:500;color:#475569;
  cursor:pointer;transition:all 0.15s ease;user-select:none;
}
.ai-suggest-chip:hover{
  background:#eef2ff;border-color:#c7d2fe;color:#4f46e5;
  transform:translateY(-1px);box-shadow:0 2px 6px rgba(99,102,241,0.1);
}

/* Input Area */
.ai-input-area{
  padding:14px 24px 18px;
  max-width:900px;margin:0 auto;width:100%;
  flex-shrink:0;
}
.ai-input-wrap{
  display:flex;align-items:flex-end;gap:10px;
  background:#ffffff;border:1.5px solid #e5e7eb;
  border-radius:16px;padding:8px 8px 8px 16px;
  transition:all 0.15s ease;
  box-shadow:0 1px 2px rgba(15,23,42,0.04);
}
.ai-input-wrap:focus-within{
  border-color:#6366f1;
  box-shadow:0 0 0 3px rgba(99,102,241,0.1),0 1px 2px rgba(15,23,42,0.04);
}
.ai-input-wrap textarea{
  flex:1;border:none;outline:none;background:transparent;resize:none;
  padding:8px 0;font-size:13.5px;color:#1e293b;
  font-family:-apple-system,BlinkMacSystemFont,'Segoe UI','PingFang SC',sans-serif;
  min-height:24px;max-height:140px;line-height:1.6;
}
.ai-input-wrap textarea::placeholder{color:#9ca3af;}
.ai-send-btn{
  width:40px;height:40px;border-radius:12px;border:none;
  background:linear-gradient(135deg,#6366f1,#8b5cf6);
  color:#fff;cursor:pointer;flex-shrink:0;
  display:flex;align-items:center;justify-content:center;
  box-shadow:0 2px 8px rgba(99,102,241,0.3);
  transition:all 0.15s ease;
}
.ai-send-btn:hover{transform:translateY(-1px);box-shadow:0 4px 12px rgba(99,102,241,0.4);}
.ai-send-btn:active{transform:translateY(0);}
.ai-send-btn:disabled{opacity:0.5;cursor:not-allowed;}

.ai-input-hint{
  font-size:10.5px;color:#94a3b8;text-align:center;
  margin-top:8px;letter-spacing:0.2px;
}

/* Dark mode adjustments */
body.dark .ai-workspace{background:linear-gradient(180deg,#0f172a 0%,#1e293b 100%);}
body.dark .ai-header,
body.dark .ai-quick-row{background:#1e293b;border-color:#334155;}
body.dark .ai-header-title{color:#f1f5f9;}
body.dark .ai-bubble{background:#1e293b;border-color:#334155;color:#e2e8f0;}
body.dark .ai-bubble b{color:#f1f5f9;}
body.dark .ai-quick-card{background:#0f172a;}
body.dark .ai-input-wrap{background:#1e293b;border-color:#334155;}


/* ===== AI Assistant - Text Contrast Fix ===== */
.ai-bubble{color:#1e293b!important;}
.ai-bubble *{color:inherit;}
.ai-bubble b,.ai-bubble strong{color:#0f172a!important;font-weight:700;}
.ai-bubble code{background:#f1f5f9!important;color:#4f46e5!important;padding:2px 6px;border-radius:4px;font-family:Menlo,Monaco,Consolas,monospace;font-size:11.5px;border:1px solid #e2e8f0;}
.ai-bubble pre{background:#0f172a!important;color:#e2e8f0!important;padding:10px 12px;border-radius:8px;margin:8px 0;font-family:Menlo,Monaco,Consolas,monospace;font-size:11.5px;overflow-x:auto;line-height:1.5;}
.ai-bubble pre *{color:inherit;}

/* */
.ai-msg-bot .ai-bubble{background:#ffffff!important;border-color:#e5e7eb!important;}
.ai-msg-user .ai-bubble{background:linear-gradient(135deg,#eef2ff,#e0e7ff)!important;border-color:#c7d2fe!important;color:#1e3a8a!important;}
.ai-msg-user .ai-bubble b{color:#0f172a!important;}


/* ===== AI Bubble Table — 强制样式，不受表格样式切换影响 ===== */
.ai-bubble table,
.ai-bubble table th,
.ai-bubble table td,
.ai-bubble table tr{
  all:revert;
}
.ai-bubble table{
  width:100%!important;border-collapse:collapse!important;margin:8px 0!important;
  font-size:11.5px!important;background:#ffffff!important;
  border:1px solid #e2e8f0!important;border-radius:8px!important;overflow:hidden!important;
}
.ai-bubble table thead tr,
.ai-bubble table th{
  background:#f8fafc!important;
  background-image:none!important;
  color:#0f172a!important;
  padding:8px 10px!important;
  font-weight:600!important;
  border:1px solid #e2e8f0!important;
  text-align:left!important;
  font-size:11.5px!important;
  letter-spacing:0.2px!important;
  animation:none!important;
  box-shadow:none!important;
  transform:none!important;
  -webkit-text-fill-color:#0f172a!important;
}
.ai-bubble table td{
  padding:7px 10px!important;
  border:1px solid #e2e8f0!important;
  color:#1e293b!important;
  background:#ffffff!important;
  background-image:none!important;
  font-size:11.5px!important;
  text-align:left!important;
  -webkit-text-fill-color:#1e293b!important;
}
.ai-bubble table tr:nth-child(even) td{background:#fafbfc!important;}
.ai-bubble table tr:last-child td{border-bottom:1px solid #e2e8f0!important;}
.ai-bubble table tr:hover td{background:#f5f7ff!important;}

/* User message — 确保表格可读 */
.ai-msg-user .ai-bubble table th{background:#ffffff!important;color:#0f172a!important;}
.ai-msg-user .ai-bubble table td{background:#ffffff!important;color:#1e293b!important;}

/* ========== 系统设置 · 标准化样式 v2 ========== */
.settings-page{padding:0;max-width:1280px;margin:0 auto;border:none!important;}

/* 页头 */
.settings-header{display:flex;align-items:flex-start;justify-content:space-between;flex-wrap:wrap;gap:16px;margin-bottom:18px;padding:0;border:none;background:transparent;}
.settings-title{display:flex;align-items:center;gap:12px;margin:0;padding:0;background:transparent;-webkit-text-fill-color:initial;}
.settings-title .ico{width:40px;height:40px;border-radius:12px;display:inline-flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#6366f1,#8b5cf6);color:#fff;font-size:18px;box-shadow:0 6px 16px rgba(99,102,241,0.35);flex-shrink:0;}
.settings-title .txt{display:flex;flex-direction:column;gap:2px;}
.settings-title .txt h2{font-size:17px;font-weight:700;color:#0f172a;margin:0;letter-spacing:0.2px;background:transparent;-webkit-text-fill-color:#0f172a;line-height:1.3;}
.settings-title .txt p{font-size:12px;color:#64748b;margin:0;line-height:1.4;}

/* 网格 */
.settings-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-bottom:14px;align-items:stretch;}
@media(max-width:1024px){.settings-grid{grid-template-columns:repeat(2,1fr);}}
@media(max-width:680px){.settings-grid{grid-template-columns:1fr;}}

/* 卡片 */
.settings-card{background:#ffffff;border:1px solid #e2e8f0;border-radius:12px;padding:16px 16px 14px;display:flex;flex-direction:column;min-height:0;transition:border-color .2s,box-shadow .2s,transform .2s;position:relative;overflow:hidden;box-shadow:0 1px 2px rgba(15,23,42,0.04);}
.settings-card::before{content:'';position:absolute;top:0;left:0;right:0;height:3px;background:linear-gradient(90deg,#6366f1,#8b5cf6);opacity:0;transition:opacity .25s;border-radius:12px 12px 0 0;}
.settings-card:hover{border-color:#c7d2fe;box-shadow:0 4px 14px rgba(15,23,42,0.06);}
.settings-card:hover::before{opacity:1;}
.settings-card-head{display:flex;align-items:center;gap:8px;margin-bottom:14px;padding:0;border:none;}
.settings-card-head .ico{font-size:15px;line-height:1;width:auto;height:auto;background:transparent;padding:0;}
.settings-card-title{font-size:13px;font-weight:700;color:#0f172a;margin:0;letter-spacing:0.3px;background:transparent;-webkit-text-fill-color:#0f172a;}
.settings-card-body{flex:1;display:flex;flex-direction:column;gap:12px;}

/* 主题选择 */
.theme-picker{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;}
.theme-opt{position:relative;padding:14px 6px;border-radius:10px;border:1.5px solid #e2e8f0;background:#fafbfc;cursor:pointer;text-align:center;transition:all .2s;overflow:hidden;font-family:inherit;}
.theme-opt .emo{font-size:20px;line-height:1;display:block;margin-bottom:6px;}
.theme-opt .lbl{font-size:11px;font-weight:600;color:#0f172a;letter-spacing:0.5px;display:block;}
.theme-opt:hover{transform:translateY(-1px);border-color:#a5b4fc;background:#fff;}
.theme-opt.active{border-color:#6366f1;background:#eef2ff;box-shadow:inset 0 0 0 1px #6366f1;}
.theme-opt.active::after{content:'✓';position:absolute;top:4px;right:6px;font-size:10px;color:#6366f1;font-weight:700;}
.theme-opt.theme-dark{background:#1a1a2e;border-color:#2d2d4a;}
.theme-opt.theme-dark .lbl{color:#e5e7eb;}
.theme-opt.theme-dark:hover{background:#22223a;}
.theme-opt.theme-dark.active{background:#1a1a2e;border-color:#818cf8;box-shadow:inset 0 0 0 1px #818cf8;}
.theme-opt.theme-dark.active::after{color:#818cf8;}
.theme-opt.theme-eye{background:#f0f5e8;}
.theme-opt.theme-eye:hover{background:#e8f0dc;}

/* 字体大小 */
.font-picker{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;}
.font-btn{padding:8px 4px;border-radius:8px;border:1.5px solid #e2e8f0;background:#fafbfc;color:#64748b;cursor:pointer;font-weight:600;transition:all .2s;text-align:center;font-family:inherit;}
.font-btn:hover{border-color:#a5b4fc;color:#6366f1;background:#fff;}
.font-btn.active{border-color:#6366f1;background:#eef2ff;color:#6366f1;box-shadow:inset 0 0 0 1px #6366f1;}
.font-btn.s1{font-size:11px;}
.font-btn.s2{font-size:12px;}
.font-btn.s3{font-size:13px;}
.font-btn.s4{font-size:14px;}
.font-slider-wrap{display:flex;align-items:center;gap:10px;padding:4px 2px 0;}
.font-slider-wrap .sm{font-size:10px;color:#94a3b8;font-weight:600;}
.font-slider-wrap .lg{font-size:14px;color:#94a3b8;font-weight:600;}
.font-slider{flex:1;accent-color:#6366f1;height:4px;margin:0;}

/* 表单组 */
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:10px 12px;}
.form-field{display:flex;flex-direction:column;gap:5px;min-width:0;}
.form-label{font-size:11px;font-weight:600;color:#64748b;letter-spacing:0.3px;}
.form-control{width:100%;padding:8px 10px;border:1px solid #e2e8f0;border-radius:8px;font-size:12px;background:#fff;color:#0f172a;outline:none;transition:all .2s;font-family:inherit;appearance:none;-webkit-appearance:none;-moz-appearance:none;background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%2364748b' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 10px center;background-size:11px;padding-right:28px;}
.form-control:hover{border-color:#a5b4fc;}
.form-control:focus{border-color:#6366f1;box-shadow:0 0 0 3px rgba(99,102,241,0.12);}

/* 功能控制 */
.feature-card{grid-column:1/-1;}
.feature-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;}
@media(max-width:900px){.feature-grid{grid-template-columns:repeat(2,1fr);}}
@media(max-width:540px){.feature-grid{grid-template-columns:1fr;}}
.feature-item{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 12px;border-radius:10px;border:1px solid #e2e8f0;background:#fafbfc;transition:all .2s;}
.feature-item:hover{border-color:#c7d2fe;background:#fff;}
.feature-item.on{border-color:#bbf7d0;background:#f0fdf4;}
.feature-left{display:flex;align-items:center;gap:10px;min-width:0;flex:1;}
.feature-ico{width:30px;height:30px;border-radius:8px;display:inline-flex;align-items:center;justify-content:center;background:#fff;border:1px solid #e2e8f0;font-size:14px;flex-shrink:0;}
.feature-item.on .feature-ico{background:#dcfce7;border-color:#86efac;}
.feature-name{font-size:12.5px;font-weight:600;color:#0f172a;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.feature-item:not(.on) .feature-name{color:#94a3b8;}

/* 开关 */
.tgl{position:relative;width:38px;height:22px;background:#e2e8f0;border-radius:22px;cursor:pointer;transition:background .25s;flex-shrink:0;}
.tgl::after{content:'';position:absolute;top:2px;left:2px;width:18px;height:18px;background:#fff;border-radius:50%;transition:left .25s;box-shadow:0 1px 3px rgba(0,0,0,0.2),0 0 0 0.5px rgba(0,0,0,0.04);}
.tgl.on{background:#22c55e;}
.tgl.on::after{left:18px;}
.tgl:hover{filter:brightness(0.97);}

/* 底部按钮 */
.settings-footer{display:flex;gap:10px;justify-content:flex-end;flex-wrap:wrap;padding-top:4px;}
.btn-st{padding:9px 18px;border-radius:8px;font-size:12.5px;font-weight:600;cursor:pointer;transition:all .2s;display:inline-flex;align-items:center;gap:6px;border:1px solid transparent;line-height:1;font-family:inherit;}
.btn-st.ghost{background:#fff;color:#64748b;border-color:#e2e8f0;}
.btn-st.ghost:hover{background:#f8fafc;color:#0f172a;border-color:#cbd5e1;}
.btn-st.primary{background:linear-gradient(135deg,#6366f1,#8b5cf6);color:#fff;box-shadow:0 4px 12px rgba(99,102,241,0.3);}
.btn-st.primary:hover{transform:translateY(-1px);box-shadow:0 6px 18px rgba(99,102,241,0.45);color:#fff;}
.btn-st.primary:active{transform:translateY(0);}

/* 暗色主题 */
body.dark .settings-card{background:#0f172a;border-color:#1e293b;}
body.dark .settings-card:hover{border-color:#334155;}
body.dark .settings-title .txt h2,body.dark .settings-title .txt h2{color:#f1f5f9;-webkit-text-fill-color:#f1f5f9;}
body.dark .settings-card-title{color:#f1f5f9;-webkit-text-fill-color:#f1f5f9;}
body.dark .theme-opt{background:rgba(255,255,255,0.03);border-color:#1e293b;}
body.dark .theme-opt:hover{background:rgba(255,255,255,0.06);border-color:#475569;}
body.dark .theme-opt.active{background:rgba(99,102,241,0.15);}
body.dark .theme-opt .lbl{color:#f1f5f9;}
body.dark .font-btn{background:rgba(255,255,255,0.03);border-color:#1e293b;color:#94a3b8;}
body.dark .font-btn.active{background:rgba(99,102,241,0.15);color:#a5b4fc;}
body.dark .form-control{background:rgba(255,255,255,0.04);border-color:#1e293b;color:#f1f5f9;}
body.dark .feature-item{background:rgba(255,255,255,0.02);border-color:#1e293b;}
body.dark .feature-item:hover{background:rgba(255,255,255,0.04);}
body.dark .feature-item.on{background:rgba(34,197,94,0.08);border-color:rgba(34,197,94,0.3);}
body.dark .feature-ico{background:rgba(255,255,255,0.04);border-color:#1e293b;}
body.dark .feature-name{color:#f1f5f9;}
body.dark .btn-st.ghost{background:rgba(255,255,255,0.02);border-color:#1e293b;color:#94a3b8;}
body.dark .btn-st.ghost:hover{background:rgba(255,255,255,0.05);color:#f1f5f9;}
body.dark .tgl{background:#334155;}


/* ========== 界面风格 · 主题色变量 ========== */
:root{
  --accent-1:var(--primary);
  --accent-2:var(--primary-light);
  --accent-soft:var(--secondary-light);
  --accent-border:rgba(107,142,107,0.35);
  --accent-hover:rgba(107,142,107,0.55);
}

/* 默认风格（绿色 - 当前风格）*/
body.style-default{
  --primary:#6b8e6b;--primary-light:#8bab8b;--primary-dark:#4a6e4a;--primary-darker:#3a5e3a;
  --primary-rgb:107,142,107;--primary-light-rgb:139,171,139;--primary-dark-rgb:74,110,74;--primary-darker-rgb:58,94,58;
  --secondary:#8bab8b;--secondary-light:rgba(107,142,107,0.08);
  --gradient-start:#4a6e4a;--gradient-end:#6b8e6b;
  --accent:#c9a96e;
  --accent-1:#6b8e6b;--accent-2:#8bab8b;--accent-soft:rgba(107,142,107,0.1);--accent-border:rgba(107,142,107,0.35);--accent-hover:rgba(107,142,107,0.55);
  --body-bg-gradient:linear-gradient(145deg,#e8e4dc 0%,#d8d4c8 30%,#e0dcd0 60%,#ece8e0 100%);
}

/* 海洋风格 — (Glass Morphism) */
body.style-ocean{
  --primary:#5b8ba8;--primary-light:#8eb4cc;--primary-dark:#3f6b87;--primary-darker:#2d5670;
  --primary-rgb:91,139,168;--primary-light-rgb:142,180,204;--primary-dark-rgb:63,107,135;--primary-darker-rgb:45,86,112;
  --secondary:#7ba4bc;--secondary-light:rgba(123,164,188,0.08);
  --gradient-start:#5b8ba8;--gradient-end:#8eb4cc;
  --accent:#9cc4d8;
  --accent-1:#5b8ba8;--accent-2:#7ba4bc;--accent-soft:rgba(91,139,168,0.1);--accent-border:rgba(91,139,168,0.28);--accent-hover:rgba(91,139,168,0.45);
  --body-bg-gradient:linear-gradient(145deg,#eaf2f7 0%,#d9e7ef 35%,#e4eef3 65%,#eef5f8 100%);
}

/* — 海洋 */
body.style-ocean .settings-card,
body.style-ocean .stock-card,
body.style-ocean .stat-card,
body.style-ocean .sec-card,
body.style-ocean .fin-card,
body.style-ocean .fin-kpi,
body.style-ocean .home-stat-card,
body.style-ocean .cs-card,
body.style-ocean .ad-card{
  background:rgba(255,255,255,0.55)!important;
  backdrop-filter:blur(18px) saturate(140%);
  -webkit-backdrop-filter:blur(18px) saturate(140%);
  border:1px solid rgba(255,255,255,0.7)!important;
  box-shadow:0 8px 32px rgba(91,139,168,0.12),inset 0 1px 0 rgba(255,255,255,0.6)!important;
}
body.style-ocean .sidebar{
  background:linear-gradient(180deg,rgba(255,255,255,0.55),rgba(234,242,247,0.5))!important;
  backdrop-filter:blur(28px) saturate(180%);
  -webkit-backdrop-filter:blur(28px) saturate(180%);
  border-right:1px solid rgba(255,255,255,0.7);
  box-shadow:4px 0 24px rgba(91,139,168,0.08);
}
body.style-ocean .sidebar-logo{border-bottom:1px solid rgba(91,139,168,0.18);}
body.style-ocean .sidebar-logo span{color:#2d5670;}
body.style-ocean .nav-item{color:#3f6b87;font-weight:700;}
body.style-ocean .nav-item:hover{background:rgba(91,139,168,0.15);color:#2d5670;}
body.style-ocean .nav-item.active{
  background:linear-gradient(135deg,rgba(91,139,168,0.88),rgba(63,107,135,0.92))!important;
  color:#fff;
  box-shadow:0 4px 16px rgba(63,107,135,0.35),inset 0 1px 0 rgba(255,255,255,0.4);
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
}
body.style-ocean .nav-divider{background:linear-gradient(90deg,transparent,rgba(91,139,168,0.3),transparent);}
body.style-ocean .main-content{
  background:transparent;
}
body.style-ocean .top-bar,
body.style-ocean .page-header{
  background:rgba(255,255,255,0.5)!important;
  backdrop-filter:blur(16px) saturate(140%);
  -webkit-backdrop-filter:blur(16px) saturate(140%);
  border-bottom:1px solid rgba(255,255,255,0.55);
}
body.style-ocean table,
body.style-ocean .inline-detail-box,
body.style-ocean .finInlineDetail{
  background:rgba(255,255,255,0.45)!important;
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
}

/* 翡翠 → (Matcha — ) */
body.style-emerald{
  --primary:#7a9b6e;--primary-light:#a3bd98;--primary-dark:#5d7e54;--primary-darker:#486240;
  --primary-rgb:122,155,110;--primary-light-rgb:163,189,152;--primary-dark-rgb:93,126,84;--primary-darker-rgb:72,98,64;
  --secondary:#8fad82;--secondary-light:rgba(143,173,130,0.08);
  --gradient-start:#5d7e54;--gradient-end:#8fad82;
  --accent:#b8cdad;
  --accent-1:#7a9b6e;--accent-2:#8fad82;--accent-soft:rgba(122,155,110,0.1);--accent-border:rgba(122,155,110,0.3);--accent-hover:rgba(122,155,110,0.5);
  --body-bg-gradient:linear-gradient(145deg,#eef3e8 0%,#e0ead6 35%,#e8f0dd 65%,#f1f5ea 100%);
}

/* 玫瑰 → (Muted Coral — ) */
body.style-rose{
  --primary:#c17a85;--primary-light:#d9a0a8;--primary-dark:#a05e6b;--primary-darker:#824852;
  --primary-rgb:193,122,133;--primary-light-rgb:217,160,168;--primary-dark-rgb:160,94,107;--primary-darker-rgb:130,72,82;
  --secondary:#cc8b95;--secondary-light:rgba(204,139,149,0.08);
  --gradient-start:#a05e6b;--gradient-end:#cc8b95;
  --accent:#e0b0b8;
  --accent-1:#c17a85;--accent-2:#cc8b95;--accent-soft:rgba(193,122,133,0.1);--accent-border:rgba(193,122,133,0.3);--accent-hover:rgba(193,122,133,0.48);
  --body-bg-gradient:linear-gradient(145deg,#f7ecee 0%,#f0dee2 35%,#f4e5e8 65%,#faf0f2 100%);
}

/* 琥珀 → (Warm Sand — ) */
body.style-amber{
  --primary:#c69a6e;--primary-light:#dbb892;--primary-dark:#a77d54;--primary-darker:#875f3e;
  --primary-rgb:198,154,110;--primary-light-rgb:219,184,146;--primary-dark-rgb:167,125,84;--primary-darker-rgb:135,95,62;
  --secondary:#d0a87f;--secondary-light:rgba(208,168,127,0.08);
  --gradient-start:#a77d54;--gradient-end:#d0a87f;
  --accent:#e5c9a7;
  --accent-1:#c69a6e;--accent-2:#d0a87f;--accent-soft:rgba(198,154,110,0.1);--accent-border:rgba(198,154,110,0.3);--accent-hover:rgba(198,154,110,0.48);
  --body-bg-gradient:linear-gradient(145deg,#f5ede0 0%,#ebdfc9 35%,#f0e7d4 65%,#f8f1e2 100%);
}

/* 紫罗兰 → (Soft Lavender — ) */
body.style-violet{
  --primary:#8a7fb0;--primary-light:#a89ec7;--primary-dark:#6e6494;--primary-darker:#564d77;
  --primary-rgb:138,127,176;--primary-light-rgb:168,158,199;--primary-dark-rgb:110,100,148;--primary-darker-rgb:86,77,119;
  --secondary:#9a8fc0;--secondary-light:rgba(154,143,192,0.08);
  --gradient-start:#6e6494;--gradient-end:#9a8fc0;
  --accent:#bcb2d8;
  --accent-1:#8a7fb0;--accent-2:#9a8fc0;--accent-soft:rgba(138,127,176,0.1);--accent-border:rgba(138,127,176,0.3);--accent-hover:rgba(138,127,176,0.48);
  --body-bg-gradient:linear-gradient(145deg,#efecf5 0%,#e0dbed 35%,#e8e3f0 65%,#f3eff7 100%);
}

/* 设置页 · 使用变量使主题色生效 */
.settings-title .ico{background:linear-gradient(135deg,var(--accent-1),var(--accent-2))!important;}
.settings-card::before{background:linear-gradient(90deg,var(--accent-1),var(--accent-2))!important;}
.settings-card:hover{border-color:var(--accent-border)!important;}
.theme-opt:hover{border-color:var(--accent-hover)!important;}
.theme-opt.active{border-color:var(--accent-1)!important;background:var(--accent-soft)!important;box-shadow:inset 0 0 0 1px var(--accent-1)!important;}
.theme-opt.active::after{color:var(--accent-1)!important;}
.font-btn:hover{border-color:var(--accent-hover)!important;color:var(--accent-1)!important;}
.font-btn.active{border-color:var(--accent-1)!important;background:var(--accent-soft)!important;color:var(--accent-1)!important;box-shadow:inset 0 0 0 1px var(--accent-1)!important;}
.font-slider{accent-color:var(--accent-1)!important;}
.form-control:hover{border-color:var(--accent-hover)!important;}
.form-control:focus{border-color:var(--accent-1)!important;box-shadow:0 0 0 3px color-mix(in srgb,var(--accent-1) 15%,transparent)!important;}
.feature-item:hover{border-color:var(--accent-border)!important;}
.btn-st.primary{background:linear-gradient(135deg,var(--accent-1),var(--accent-2))!important;}
.btn-st.primary:hover{box-shadow:0 6px 18px color-mix(in srgb,var(--accent-1) 45%,transparent)!important;}

/* ========== 界面风格 选择器 ========== */
.style-picker{display:grid;grid-template-columns:repeat(6,1fr);gap:10px;}
@media(max-width:900px){.style-picker{grid-template-columns:repeat(3,1fr);}}
@media(max-width:540px){.style-picker{grid-template-columns:repeat(2,1fr);}}

.style-opt{position:relative;padding:8px 6px 10px;border-radius:10px;border:1.5px solid #e2e8f0;background:#fff;cursor:pointer;text-align:center;transition:all .2s;font-family:inherit;overflow:hidden;}
.style-opt:hover{transform:translateY(-2px);border-color:var(--accent-hover);box-shadow:0 4px 12px rgba(15,23,42,0.08);}
.style-opt.active{border-color:var(--accent-1);box-shadow:0 0 0 2px color-mix(in srgb,var(--accent-1) 25%,transparent);}
.style-opt.active::after{content:'✓';position:absolute;top:4px;right:6px;font-size:11px;color:#fff;font-weight:700;background:var(--accent-1);width:16px;height:16px;border-radius:50%;display:flex;align-items:center;justify-content:center;line-height:1;}

.style-preview{display:block;width:100%;height:38px;border-radius:6px;margin-bottom:6px;position:relative;overflow:hidden;}
.style-preview::before{content:'';position:absolute;top:5px;left:5px;right:5px;height:6px;border-radius:3px;background:rgba(255,255,255,0.55);}
.style-preview::after{content:'';position:absolute;bottom:5px;left:5px;width:55%;height:6px;border-radius:3px;background:rgba(255,255,255,0.75);}

.style-p-default{background:linear-gradient(135deg,var(--primary-dark),var(--primary-light));}
.style-p-ocean{background:linear-gradient(135deg,#5b8ba8,#8eb4cc);backdrop-filter:blur(10px);}
.style-p-ocean::before{background:rgba(255,255,255,0.75)!important;}
.style-p-ocean::after{background:rgba(255,255,255,0.9)!important;}
.style-p-emerald{background:linear-gradient(135deg,#5d7e54,#8fad82);}
.style-p-rose{background:linear-gradient(135deg,#a05e6b,#cc8b95);}
.style-p-amber{background:linear-gradient(135deg,#a77d54,#d0a87f);}
.style-p-violet{background:linear-gradient(135deg,#6e6494,#9a8fc0);}

.style-opt .lbl{font-size:11px;font-weight:600;color:#0f172a;display:block;line-height:1.2;}

body.dark .style-opt{background:rgba(255,255,255,0.03);border-color:#1e293b;}
body.dark .style-opt .lbl{color:#f1f5f9;}


/* ========== 整站色调随主题自动调整 ========== */
/* hue-rotate */
:root{--site-hue:0deg;--site-sat:1;}
body.style-default,
body.style-ocean,
body.style-emerald,
body.style-rose,
body.style-amber,
body.style-violet{--site-hue:0deg;--site-sat:1;}

.main-content,.sidebar{
  transition:background .4s ease,filter .4s ease;
}

/* 保护：登录遮罩、toast、modal 遮罩不参与滤镜 */
.login-overlay,.modal-overlay,.modal,.toast,#verifyPasswordModal{filter:none!important;}