/* admin/assets/style.css - 科达优品后台管理 · Apple 风设计系统 */
:root {
  --bg: #f5f5f7;
  --card: #ffffff;
  --text: #1d1d1f;
  --text2: #6e6e73;
  --text3: #86868b;
  --line: #e5e5ea;
  --primary: #0071e3;
  --primary-h: #0077ed;
  --accent: #0071e3;
  --green: #34c759;
  --orange: #ff9500;
  --red: #ff3b30;
  --radius: 14px;
  --radius-sm: 10px;
  --shadow: 0 1px 3px rgba(0,0,0,.06), 0 8px 24px rgba(0,0,0,.04);
  --shadow-lg: 0 4px 12px rgba(0,0,0,.08), 0 24px 48px rgba(0,0,0,.08);
}
* { box-sizing: border-box; margin: 0; padding: 0; }
html, body { height: 100%; }
body {
  font-family: -apple-system, BlinkMacSystemFont, "SF Pro SC", "PingFang SC", "Helvetica Neue", Helvetica, "Microsoft YaHei", sans-serif;
  background: var(--bg); color: var(--text);
  -webkit-font-smoothing: antialiased; font-size: 14px; line-height: 1.5;
}
a { color: var(--primary); text-decoration: none; }
button, input, select, textarea { font-family: inherit; font-size: 14px; }

/* 图标尺寸：强制压住 96px 原图，避免缓存旧样式时后台图标撑爆卡片/按钮 */
img.ico, .ico > img { display: inline-block !important; vertical-align: middle; object-fit: contain; max-width: 100%; max-height: 100%; }
.ico-sm { width: 16px !important; height: 16px !important; min-width: 16px; }
.ico-md { width: 20px !important; height: 20px !important; min-width: 20px; }
.ico-lg { width: 28px !important; height: 28px !important; min-width: 28px; }
.ico-xl { width: 40px !important; height: 40px !important; min-width: 40px; }
.btn > img.ico, .card-title img.ico, .empty img.ico { flex: 0 0 auto; }

/* 布局 */
.app { display: flex; min-height: 100vh; }
.sidebar {
  width: 220px; background: rgba(0,0,0,.78); color: #f5f5f7;
  display: flex; flex-direction: column; position: fixed; top: 0; left: 0; bottom: 0; z-index: 50;
}
.sidebar .brand { padding: 22px 20px 16px; display: flex; align-items: center; gap: 10px; }
.sidebar .brand .logo { width: 34px; height: 34px; border-radius: 9px; object-fit: contain; display: block; }
.sidebar .brand .name { font-weight: 600; font-size: 15px; }
.sidebar .brand .sub { font-size: 11px; color: rgba(245,245,247,.5); }
.sidebar nav { padding: 8px 10px; flex: 1; overflow-y: auto; }
.sidebar .nav-group { margin: 6px 0 14px; }
.sidebar .nav-group .gh-title { font-size: 11px; color: rgba(245,245,247,.4); padding: 8px 12px 6px; letter-spacing: .5px; }
.sidebar .nav-item { display: flex; align-items: center; gap: 10px; padding: 10px 12px; border-radius: 8px; color: rgba(245,245,247,.85); cursor: pointer; font-size: 13.5px; }
.sidebar .nav-item:hover { background: rgba(255,255,255,.08); color: #fff; }
.sidebar .nav-item.active { background: var(--primary); color: #fff; }
.sidebar .nav-item .ico { width: 18px; text-align: center; }
.sidebar .nav-item .badge { margin-left: auto; background: var(--red); color: #fff; border-radius: 10px; padding: 1px 7px; font-size: 11px; }
.sidebar .me { padding: 14px 16px; border-top: 1px solid rgba(255,255,255,.1); display: flex; align-items: center; gap: 10px; }
.sidebar .me .avatar { width: 32px; height: 32px; border-radius: 50%; background: linear-gradient(135deg,#34c759,#30b0c7); display: grid; place-items: center; font-weight: 600; color: #fff; }
.sidebar .me .info { flex: 1; min-width: 0; }
.sidebar .me .info .nm { font-size: 13px; font-weight: 500; }
.sidebar .me .info .rl { font-size: 11px; color: rgba(245,245,247,.5); }
.sidebar .me .logout { color: rgba(245,245,247,.6); cursor: pointer; font-size: 18px; }
.sidebar .me .logout:hover { color: var(--red); }

.main { flex: 1; margin-left: 220px; padding: 28px 36px 60px; min-width: 0; }
.topbar { display: flex; align-items: center; justify-content: space-between; margin-bottom: 22px; }
.topbar h1 { font-size: 24px; font-weight: 700; letter-spacing: -0.3px; }
.topbar .sub { color: var(--text3); font-size: 13px; margin-top: 2px; }

/* 卡片：Neumorphism 轻拟物（更暗更高级） */
.card { background: var(--card); border: 1px solid rgba(255,255,255,.1); border-radius: var(--radius); box-shadow: var(--neu-out); transition: box-shadow .28s ease, transform .28s ease; }
.card-pad { padding: 24px; }
.card-title { font-size: 15px; font-weight: 600; margin-bottom: 14px; display: flex; align-items: center; gap: 8px; }
.card-title .more { margin-left: auto; font-size: 12px; color: var(--primary); cursor: pointer; font-weight: 400; }

/* 统计卡 */
.stats-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; margin-bottom: 22px; }
.stat-card { background: var(--card); border: 1px solid rgba(255,255,255,.1); border-radius: var(--radius); padding: 20px 22px; box-shadow: var(--neu-out); transition: box-shadow .3s ease, transform .3s ease; }
.stat-card::after {
  /* 顶部品牌绿渐变细条 */
  content: ""; position: absolute; top: 0; left: 0; right: 0; height: 3px;
  background: linear-gradient(90deg, var(--brand), var(--brand-soft));
  opacity: 0; transition: opacity .3s;
}
.stat-card:hover { transform: translateY(-4px); box-shadow: var(--shadow-pop); }
.stat-card:hover::after { opacity: 1; }
.stat-card .value { color: var(--steel-900); }
.stat-card .ic {
  background: var(--brand-mint);
  box-shadow: 0 4px 12px rgba(42,157,111,.18);
}

.grid-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.grid-3 { display: grid; grid-template-columns: repeat(3,1fr); gap: 16px; }

/* 表格 */
.tbl-wrap { background: var(--card); border: 1px solid rgba(255,255,255,.1); border-radius: var(--radius); box-shadow: var(--shadow); overflow-x: auto; overflow-y: hidden; -webkit-overflow-scrolling: touch; }
.tbl-bar { padding: 14px 18px; display: flex; align-items: center; gap: 12px; flex-wrap: wrap; border-bottom: 1px solid var(--line); }
table { width: 100%; border-collapse: collapse; }
.tbl-wrap > table { min-width: 720px; }
th, td { padding: 12px 16px; text-align: left; font-size: 13.5px; }
thead th { background: linear-gradient(180deg, #2a323c, #1a2029); color: var(--text2); font-weight: 600; font-size: 12.5px; border-bottom: 1px solid var(--line); white-space: nowrap; }
tbody tr { border-bottom: 1px solid var(--line); }
tbody tr:hover { background: var(--brand-mint); }
.t-num { font-variant-numeric: tabular-nums; font-weight: 600; }
.t-mute { color: var(--text3); }
.t-right { text-align: right; }

/* 标签 */
.tag { display: inline-block; padding: 2px 9px; border-radius: 12px; font-size: 11.5px; font-weight: 500; }
.tag.green { background: rgba(52,199,89,.12); color: var(--green); }
.tag.blue { background: rgba(0,113,227,.1); color: var(--primary); }
.tag.orange { background: rgba(255,149,0,.12); color: var(--orange); }
.tag.red { background: rgba(255,59,48,.1); color: var(--red); }
.tag.gray { background: rgba(142,142,147,.14); color: var(--text3); }

/* 表单 */
.field { margin-bottom: 16px; }
.field label { display: block; font-size: 13px; color: var(--text2); margin-bottom: 7px; font-weight: 600; }
.field .req { color: var(--red); }
input.ipt, select.ipt, textarea.ipt { width: 100%; padding: 12px 14px; background: rgba(255,255,255,.12); border: 1.5px solid rgba(255,255,255,.2); border-radius: 16px; transition: border-color .2s, box-shadow .2s, transform .2s; }
input.ipt:focus, select.ipt:focus, textarea.ipt:focus {
  outline: none; border-color: rgba(26,122,84,.6);
  box-shadow: 0 0 0 4px rgba(26,122,84,.15);
  transform: translateY(-1px);
}
textarea.ipt { resize: vertical; min-height: 72px; }
.hint { font-size: 12px; color: var(--text3); margin-top: 5px; }

/* 按钮：hover 上浮光影扩散（更高级） */
.btn { display: inline-flex; align-items: center; gap: 6px; padding: 9px 18px; border-radius: 999px; font-weight: 600; letter-spacing: .2px; transition: transform .22s cubic-bezier(.2,.7,.3,1), box-shadow .22s ease, background .22s ease; }
.btn-primary {
  background: linear-gradient(135deg, var(--brand) 0%, var(--brand-soft) 100%);
  color: #fff;
  box-shadow: 0 4px 14px rgba(26,122,84,.32);
}
.btn-primary:hover {
  background: linear-gradient(135deg, var(--brand-h) 0%, var(--brand) 100%);
  transform: translateY(-2px);
  box-shadow: 0 10px 26px rgba(26,122,84,.4);
}
.btn-ghost {
  background: var(--steel-100); color: var(--text);
  border: 1px solid var(--line);
}
.btn-ghost:hover { background: var(--brand-mint); transform: translateY(-1px); }
.btn-danger {
  background: rgba(192,69,58,.1); color: var(--danger);
}
.btn-danger:hover { background: rgba(192,69,58,.18); transform: translateY(-1px); }
.btn-sm { padding: 5px 12px; font-size: 12px; }

/* 工具条 */
.toolbar { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.toolbar .spacer { flex: 1; }
.search-box { position: relative; }
.search-box input { padding-left: 32px; width: 220px; }
.search-box .ico { position: absolute; left: 10px; top: 50%; transform: translateY(-50%); color: var(--text3); }

/* 复选框组（权限） */
.perm-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 8px; }
.perm-item { display: flex; align-items: center; gap: 8px; padding: 9px 12px; border: 1px solid var(--line); border-radius: 8px; cursor: pointer; font-size: 13px; }
.perm-item:hover { border-color: var(--primary); }
.perm-item input { accent-color: var(--primary); }

/* 模态框 */
.modal-mask { position: fixed; inset: 0; background: rgba(0,0,0,.4); display: none; align-items: center; justify-content: center; z-index: 100; backdrop-filter: blur(4px); }
.modal-mask.show { display: flex; }
.modal { background: #fff; border-radius: var(--radius); width: 520px; max-width: 92vw; max-height: 88vh; overflow: auto; box-shadow: var(--shadow-lg); }
.modal-hd { padding: 18px 22px; border-bottom: 1px solid var(--line); font-size: 16px; font-weight: 600; display: flex; align-items: center; }
.modal-hd .close { margin-left: auto; cursor: pointer; color: var(--text3); font-size: 20px; }
.modal-bd { padding: 22px; }
.modal-ft { padding: 14px 22px; border-top: 1px solid var(--line); display: flex; justify-content: flex-end; gap: 10px; }
.modal-wide { width: 760px; }

/* 登录页：环保动态动画登录页（更暗更高级） */
.login-wrap { min-height: 100vh; display: grid; place-items: center; background: radial-gradient(ellipse at 30% 20%, #0a2d22 0%, #051814 60%, #020d0a 100%); padding: 24px; position: relative; overflow: hidden; }
.login-wrap::before {
  content: ""; position: absolute; top: 0; left: 0; right: 0; bottom: 0;
  background: 
    radial-gradient(circle at 20% 30%, rgba(42,157,111,.1) 0%, transparent 50%),
    radial-gradient(circle at 80% 70%, rgba(42,157,111,.08) 0%, transparent 60%);
  animation: particleFlow 15s linear infinite;
}
.login-wrap::after {
  content: ""; position: absolute; top: 0; left: 0; right: 0; bottom: 0;
  background: 
    linear-gradient(135deg, transparent 40%, rgba(42,157,111,.02) 45%, transparent 50%),
    linear-gradient(45deg, transparent 30%, rgba(42,157,111,.01) 35%, transparent 40%);
  background-size: 200% 200%; animation: lightSweep 20s linear infinite;
}
.login-box { width: 380px; background: rgba(26,32,41,.92); backdrop-filter: blur(24px); -webkit-backdrop-filter: blur(24px); border: 1px solid rgba(255,255,255,.15); border-radius: 24px; padding: 44px 38px 34px; box-shadow: 0 30px 80px rgba(0,0,0,.5); text-align: center; position: relative; z-index: 2; }
.login-box::before {
  content: ""; position: absolute; top: -20px; right: -20px; bottom: -20px; left: -20px;
  background: radial-gradient(circle at 30% 30%, rgba(42,157,111,.08) 0%, transparent 40%);
  border-radius: inherit; z-index: -1;
}
.login-box .logo { width: 76px; height: 76px; margin: 0 auto 16px; object-fit: contain; display: block; border-radius: 20px; animation: logoBreathe 4s ease-in-out infinite; filter: drop-shadow(0 0 20px rgba(42,157,111,.3)); }
.login-box h1 { font-size: 21px; font-weight: 800; color: var(--steel-900); letter-spacing: .3px; margin-bottom: 8px; }
.login-box .tip { color: var(--text3); font-size: 13px; margin-top: 6px; margin-bottom: 28px; letter-spacing: .5px; opacity: 0; animation: textFade .8s .75s both; }
.login-box .field { text-align: left; margin-bottom: 18px; animation: fieldExpand .55s cubic-bezier(.2,.7,.3,1) both; }
.login-box .field:nth-of-type(1){ animation-delay: .5s; }
.login-box .field:nth-of-type(2){ animation-delay: .62s; }
.login-box .btn-primary { width: 100%; justify-content: center; margin-top: 10px; padding: 13px; font-size: 15px; background: linear-gradient(135deg, #0d4d33 0%, #1a7a54 100%); box-shadow: 0 4px 14px rgba(26,122,84,.32); animation: textFade .6s .75s both; }
.login-box .btn-primary:hover { 
  background: linear-gradient(135deg, #0a3d2a 0%, #0d4d33 100%); 
  box-shadow: 0 8px 24px rgba(26,122,84,.48); 
  transform: translateY(-2px);
}

/* 回收箭头动态背景 */
@keyframes recycleFlow {
  0% { transform: translateX(-100%) rotate(0deg); opacity: 0; }
  10% { opacity: 1; }
  90% { opacity: 1; }
  100% { transform: translateX(100%) rotate(360deg); opacity: 0; }
}
@keyframes particleFlow {
  0% { transform: translate(0, 0) scale(1); opacity: 0; }
  10% { opacity: 1; }
  90% { opacity: 1; }
  100% { transform: translate(100px, -100px) scale(1.5); opacity: 0; }
}
@keyframes lightSweep {
  0% { background-position: 0% 0%; }
  100% { background-position: 100% 100%; }
}
@keyframes logoBreathe {
  0%, 100% { transform: scale(1); filter: drop-shadow(0 0 20px rgba(42,157,111,.3)); }
  50% { transform: scale(1.05); filter: drop-shadow(0 0 30px rgba(42,157,111,.5)); }
}
@keyframes fieldExpand {
  0% { transform: translateY(20px); opacity: 0; }
  100% { transform: translateY(0); opacity: 1; }
}
@keyframes textFade {
  0% { opacity: 0; transform: translateY(10px); }
  100% { opacity: 1; transform: translateY(0); }
}

/* 后台主页：环保科技商务风（低饱和高级灰基底） */
.main { background: linear-gradient(135deg, #1a2029 0%, #0f141a 100%); color: var(--steel-100); }
.card { background: rgba(26,32,41,.85); border: 1px solid rgba(255,255,255,.12); box-shadow: 0 8px 32px rgba(0,0,0,.3); }
.card::after {
  content: ""; position: absolute; top: 0; left: 0; right: 0; height: 2px;
  background: linear-gradient(90deg, rgba(42,157,111,.3), rgba(26,122,84,.5));
  opacity: 0; transition: opacity .3s;
}
.card:hover::after { opacity: 1; }
.card-pad { padding: 24px; }
.card-title { font-size: 15px; font-weight: 600; margin-bottom: 14px; display: flex; align-items: center; gap: 8px; color: var(--steel-200); }
.card-title .more { margin-left: auto; font-size: 12px; color: rgba(42,157,111,.7); cursor: pointer; font-weight: 400; }
.card-title .more:hover { color: rgba(42,157,111,1); }

/* 仪表盘数据卡片（环保科技风格） */
.stat-card { background: rgba(26,32,41,.85); border: 1px solid rgba(255,255,255,.12); border-radius: var(--radius); padding: 20px 22px; box-shadow: 0 8px 32px rgba(0,0,0,.3); transition: transform .3s ease, box-shadow .3s ease; }
.stat-card:hover { transform: translateY(-4px); box-shadow: 0 16px 48px rgba(0,0,0,.4); }
.stat-card .value { color: var(--steel-100); font-size: 28px; font-weight: 700; }
.stat-card .ic {
  background: rgba(42,157,111,.15);
  box-shadow: 0 4px 12px rgba(42,157,111,.18);
}
.stat-card .ic img { filter: invert(1) brightness(1.2); }

/* 表格（环保科技风格） */
.tbl-wrap { background: rgba(26,32,41,.85); border: 1px solid rgba(255,255,255,.12); box-shadow: 0 8px 32px rgba(0,0,0,.3); }
thead th { background: rgba(42,157,111,.1); color: var(--steel-200); }
tbody tr:hover { background: rgba(42,157,111,.05); }
.t-mute { color: var(--steel-400); }

/* 标签（环保科技风格） */
.tag { display: inline-block; padding: 2px 9px; border-radius: 12px; font-size: 11.5px; font-weight: 500; }
.tag.green { background: rgba(42,157,111,.12); color: rgba(42,157,111,.9); }
.tag.blue { background: rgba(0,113,227,.1); color: rgba(0,113,227,.9); }
.tag.orange { background: rgba(255,149,0,.12); color: rgba(255,149,0,.9); }
.tag.red { background: rgba(255,59,48,.1); color: rgba(255,59,48,.9); }
.tag.gray { background: rgba(142,142,147,.14); color: rgba(142,142,147,.9); }

/* 输入框（环保科技风格） */
input.ipt, select.ipt, textarea.ipt { 
  background: rgba(255,255,255,.08); 
  border: 1.5px solid rgba(255,255,255,.2); 
  color: var(--steel-100);
}
input.ipt:focus, select.ipt:focus, textarea.ipt:focus {
  border-color: rgba(42,157,111,.6);
  box-shadow: 0 0 0 4px rgba(42,157,111,.15);
}

/* 按钮（环保科技风格） */
.btn-primary {
  background: linear-gradient(135deg, #0d4d33 0%, #1a7a54 100%);
  color: #fff;
  box-shadow: 0 4px 14px rgba(26,122,84,.32);
}
.btn-primary:hover {
  background: linear-gradient(135deg, #0a3d2a 0%, #0d4d33 100%);
  transform: translateY(-2px);
  box-shadow: 0 10px 26px rgba(26,122,84,.4);
}

/* 侧边栏（环保科技风格） */
.sidebar { background: rgba(15,20,26,.95); }
.sidebar .nav-item:hover { background: rgba(42,157,111,.1); }
.sidebar .nav-item.active { background: rgba(42,157,111,.2); }
.sidebar .me { border-top: 1px solid rgba(255,255,255,.1); }

/* 顶部导航（环保科技风格） */
.topbar { color: var(--steel-100); }
.topbar h1 { color: var(--steel-100); }
.topbar .sub { color: var(--steel-400); }

/* 空态（环保科技风格） */
.empty { color: var(--steel-400); }

/* 响应式调整（环保科技风格） */
@media (max-width: 1100px) {
  .login-box { width: 340px; }
  .stats-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 720px) {
  .login-box { width: 300px; padding: 34px 28px 24px; }
  .stats-grid { grid-template-columns: 1fr; }
  .sidebar { width: 70px; }
  .sidebar .nav-item span { display: none; }
  .main { margin-left: 70px; padding: 20px 16px 40px; }
}

/* 空态 */
.empty { text-align: center; padding: 60px 20px; color: var(--text3); }
.empty .ico { font-size: 40px; margin-bottom: 10px; }

/* 排行 */
.rank-row { display: flex; align-items: center; gap: 12px; padding: 12px 0; border-bottom: 1px solid var(--line); }
.rank-row:last-child { border: none; }
.rank-no { width: 24px; height: 24px; border-radius: 50%; background: rgba(0,0,0,.06); display: grid; place-items: center; font-weight: 700; font-size: 12px; color: var(--text2); }
.rank-no.t1 { background: #ffd700; color: #fff; }
.rank-no.t2 { background: #c0c0c0; color: #fff; }
.rank-no.t3 { background: #cd7f32; color: #fff; }
.rank-row .nm { font-weight: 500; }
.rank-row .v { margin-left: auto; font-weight: 700; font-variant-numeric: tabular-nums; }

/* 进度条 */
.bar { height: 8px; background: rgba(0,0,0,.06); border-radius: 4px; overflow: hidden; }
.bar > i { display: block; height: 100%; background: var(--primary); border-radius: 4px; }

.price-tier { display: grid; grid-template-columns: repeat(5,1fr); gap: 1px; background: var(--line); border-radius: 8px; overflow: hidden; margin: 8px 0; }
.price-tier .pt { background: #fff; padding: 10px; text-align: center; }
.price-tier .pt .lb { font-size: 11px; color: var(--text3); }
.price-tier .pt .vl { font-weight: 700; font-size: 15px; margin-top: 3px; }

.prod-cell { display: flex; align-items: center; gap: 10px; min-width: 220px; }
.prod-thumb { width: 46px; height: 46px; border-radius: 8px; object-fit: cover; flex: 0 0 auto; background: #f2f3f5; border: 1px solid var(--line); display: grid; place-items: center; overflow: hidden; }
.empty-thumb { display: grid; place-items: center; }
.prod-gallery-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(104px, 1fr)); gap: 10px; }
.prod-gallery-item, .prod-gallery-add { aspect-ratio: 1; border-radius: 10px; border: 1px solid var(--line); overflow: hidden; position: relative; background: #f5f5f7; }
.prod-gallery-item img { width: 100%; height: 100%; object-fit: cover; display: block; }
.prod-gallery-add { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 6px; color: var(--text3); cursor: pointer; }
.prod-gallery-add:disabled { cursor: not-allowed; opacity: .62; }
.prod-img-del { position: absolute; top: 6px; right: 6px; width: 24px; height: 24px; border-radius: 50%; border: 0; background: rgba(0,0,0,.55); color: #fff; cursor: pointer; }
.prod-main-tag { position: absolute; left: 6px; bottom: 6px; background: var(--primary); color: #fff; border-radius: 999px; padding: 2px 8px; font-size: 11px; }
.inspect-admin { border: 1px solid var(--line); border-radius: 10px; overflow: hidden; background: #fff; }
.inspect-admin-group { border-top: 1px solid var(--line); padding: 14px 14px 0; }
.inspect-admin-group:first-child { border-top: 0; }
.inspect-admin-title { font-weight: 700; margin-bottom: 10px; }
.inspect-admin-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }

.site-grid { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(320px, .85fr); gap: 22px; align-items: start; }
.settings-tabs { display:grid; grid-template-columns:repeat(4, minmax(0, 1fr)); gap:10px; margin-bottom:16px; }
.settings-tab { text-align:left; border:1px solid var(--line); background:#fff; border-radius:999px; padding:13px 20px; cursor:pointer; color:var(--text); min-height:78px; transition:border-color .16s, box-shadow .16s, background .16s; }
.settings-tab b { display:block; font-size:14px; margin-bottom:6px; }
.settings-tab span { display:block; color:var(--text3); font-size:12px; line-height:1.45; }
.settings-tab:hover { border-color:rgba(0,113,227,.45); background:rgba(0,113,227,.03); }
.settings-tab.on { border-color:var(--primary); background:rgba(0,113,227,.06); box-shadow:0 8px 22px rgba(0,113,227,.10); }
.settings-panel { border:1px solid var(--line); border-radius:14px; background:#fff; padding:18px; }
.settings-panel .btn, .settings-panel button { border-radius:999px; }
.settings-panel-head { display:flex; align-items:flex-start; justify-content:space-between; gap:14px; padding-bottom:14px; margin-bottom:16px; border-bottom:1px solid var(--line); }
.settings-panel-title { font-size:18px; font-weight:700; margin-bottom:4px; }
.settings-narrow { max-width:860px; }
.site-banner-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 12px; }
.site-banner { border: 1px solid var(--line); border-radius: 12px; overflow: hidden; background: #fff; }
.site-banner img { width: 100%; aspect-ratio: 2.88 / 1; object-fit: cover; display: block; background: #f5f5f7; }
.site-banner-body { padding: 12px; display: flex; flex-direction: column; gap: 8px; }
.site-add { min-height: 198px; border: 1px dashed #c8c8cf; background: #fafafa; border-radius: 28px; color: var(--text2); display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px; cursor: pointer; }
.site-add:hover { border-color: var(--primary); color: var(--primary); background: rgba(0,113,227,.04); }
.site-add small { color: var(--text3); }
.store-admin-head { display:flex; justify-content:space-between; align-items:flex-start; gap:14px; margin-bottom:14px; }
.store-admin-list { display:flex; flex-direction:column; gap:12px; margin-bottom:18px; }
.store-admin-card { border:1px solid var(--line); border-radius:12px; padding:14px; background:#fff; }
.store-admin-card-head { display:flex; justify-content:space-between; align-items:center; gap:10px; margin-bottom:12px; }
.map-mask { position:fixed; inset:0; background:rgba(0,0,0,.38); z-index:9999; display:flex; align-items:center; justify-content:center; padding:24px; }
.map-panel { width:min(780px, 96vw); background:#fff; border-radius:16px; box-shadow:0 24px 70px rgba(0,0,0,.24); padding:18px; }
.map-head, .map-foot { display:flex; justify-content:space-between; align-items:flex-start; gap:16px; }
.map-search { display:flex; gap:10px; margin:16px 0 10px; align-items:center; }
.map-search-input { border-radius:999px !important; padding-left:16px !important; }
.map-search-btn { flex:0 0 auto; white-space:nowrap; }
.map-search-state { font-size:12px; color:var(--text3); background:#f7f7f9; border:1px solid var(--line); border-radius:999px; padding:8px 14px; margin-bottom:12px; }
.map-search-state.error { color:var(--red); background:rgba(255,59,48,.06); border-color:rgba(255,59,48,.18); }
.map-results { display:flex; flex-direction:column; gap:8px; margin:0 0 12px; max-height:190px; overflow:auto; }
.map-result { display:flex; align-items:center; justify-content:space-between; gap:14px; border:1px solid var(--line); border-radius:18px; background:#fff; padding:10px 12px 10px 16px; }
.map-result-main { min-width:0; }
.map-result-main b { display:block; font-size:13px; margin-bottom:2px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.map-result-main span { display:block; color:var(--text3); font-size:12px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.map-result-actions { flex:0 0 auto; display:flex; gap:8px; }
.map-wrap { position:relative; width:720px; max-width:100%; height:420px; overflow:hidden; background:#eef2f6; border:1px solid var(--line); border-radius:12px; margin:16px auto; cursor:crosshair; }
.map-tile { position:absolute; width:256px; height:256px; user-select:none; pointer-events:none; }
.map-pin { position:absolute; left:50%; top:50%; width:22px; height:22px; margin:-22px 0 0 -11px; border-radius:50% 50% 50% 0; background:#ef3d2f; transform:rotate(-45deg); box-shadow:0 3px 10px rgba(0,0,0,.25); }
.map-pin::after { content:""; position:absolute; inset:6px; border-radius:50%; background:#fff; }
.map-coord { color:var(--text2); font-size:13px; line-height:32px; }
.map-tools { display:flex; gap:8px; flex-wrap:wrap; justify-content:flex-end; }

@media (max-width: 1100px) {
  .settings-tabs { grid-template-columns:repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 720px) {
  .settings-tabs { grid-template-columns:1fr; }
  .settings-tab { min-height:auto; }
  .settings-panel { padding:14px; }
  .map-search, .map-result, .map-foot { flex-direction:column; align-items:stretch; }
  .map-result-actions, .map-tools { justify-content:flex-start; }
}

.service-layout { display: grid; grid-template-columns: 320px minmax(0, 1fr); gap: 16px; align-items: stretch; min-height: calc(100vh - 130px); }
.service-list, .service-chat { overflow: hidden; }
.service-list-head { display:flex; align-items:center; justify-content:space-between; padding:16px 18px; border-bottom:1px solid var(--line); }
.service-list-head span { color:var(--text3); font-size:12px; }
.service-sessions { max-height: calc(100vh - 190px); overflow:auto; padding:10px; }
.service-session { border:1px solid var(--line); border-radius:12px; padding:12px; margin-bottom:10px; cursor:pointer; background:#fff; }
.service-session:hover, .service-session.active { border-color: var(--primary); background: rgba(0,113,227,.04); }
.ss-top { display:flex; align-items:center; justify-content:space-between; gap:10px; }
.svc-unread { min-width:20px; height:20px; padding:0 6px; border-radius:999px; background:var(--red); color:#fff; font-size:11px; display:inline-flex; align-items:center; justify-content:center; }
.ss-msg { color:var(--text2); font-size:12.5px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; margin-top:8px; }
.ss-foot { display:flex; align-items:center; justify-content:space-between; gap:10px; color:var(--text3); font-size:12px; margin-top:10px; }
.service-chat { display:flex; flex-direction:column; }
.service-chat-head { display:flex; align-items:center; justify-content:space-between; padding:18px 20px; border-bottom:1px solid var(--line); }
.service-chat-head h2 { font-size:18px; margin:0; }
.service-msgs { flex:1; min-height:360px; max-height: calc(100vh - 470px); overflow:auto; padding:18px; background:#fafafa; }
.svc-msg { max-width:74%; margin-bottom:14px; }
.svc-msg.mine { margin-left:auto; }
.svc-meta { font-size:12px; color:var(--text3); margin:0 6px 5px; }
.svc-msg.mine .svc-meta { text-align:right; }
.svc-bubble { background:#fff; border:1px solid var(--line); border-radius:14px; border-top-left-radius:4px; padding:12px 14px; box-shadow:0 1px 3px rgba(0,0,0,.03); white-space:pre-wrap; }
.svc-msg.mine .svc-bubble { background:var(--primary); color:#fff; border-color:var(--primary); border-top-left-radius:14px; border-top-right-radius:4px; }
.svc-bubble.ai { background:#f4fbf7; border-color:rgba(52,199,89,.22); }
.svc-msg-title { font-weight:700; margin-bottom:10px; }
.svc-product { display:flex; gap:10px; background:#f5f5f7; border-radius:10px; padding:10px; margin-top:8px; color:var(--text); }
.svc-product img, .svc-prod-empty { width:62px; height:62px; border-radius:8px; object-fit:cover; background:#fff; flex:0 0 auto; }
.svc-prod-empty { display:grid; place-items:center; color:var(--text3); font-size:12px; }
.svc-product b, .svc-product span, .svc-product em { display:block; }
.svc-product span { color:var(--text2); font-size:12px; margin-top:3px; }
.svc-product em { color:var(--red); font-style:normal; font-weight:700; margin-top:5px; }
.svc-warranty { background:#f5f5f7; border-radius:10px; padding:10px; margin-top:8px; display:flex; flex-direction:column; gap:4px; color:var(--text); }
.svc-warranty span { color:var(--text2); font-size:12px; }
.svc-report { display:grid; grid-template-columns:repeat(4,1fr); gap:8px; color:var(--text); }
.svc-report div { background:#f5f5f7; border-radius:10px; padding:10px; }
.svc-report span { display:block; color:var(--text3); font-size:12px; }
.svc-report b { font-size:16px; }
.svc-location { display:flex; align-items:center; justify-content:space-between; gap:12px; background:#f5f5f7; border-radius:10px; padding:10px; margin-top:8px; color:var(--text); }
.svc-location div { min-width:0; }
.svc-location b, .svc-location span { display:block; }
.svc-location span { color:var(--text2); font-size:12px; margin-top:3px; }
.svc-location a, .svc-location em { flex:0 0 auto; border-radius:999px; padding:6px 10px; background:rgba(0,113,227,.1); color:var(--primary); font-size:12px; font-style:normal; text-decoration:none; font-weight:700; }
.service-tools { border-top:1px solid var(--line); padding:12px 18px 4px; background:#fff; }
.svc-tool-row { display:grid; grid-template-columns:minmax(0, 1fr) auto; gap:8px; align-items:center; margin-bottom:8px; }
.svc-tool-row.warranty { grid-template-columns:minmax(0, .8fr) minmax(0, 1fr) auto; }
.svc-tool-row.compact { display:flex; align-items:center; }
.svc-pill { height:34px; min-width:82px; border:1px solid var(--line); border-radius:999px; padding:0 14px; background:#f7f8fa; color:var(--text); font-size:13px; font-weight:700; display:inline-flex; align-items:center; justify-content:center; cursor:pointer; white-space:nowrap; box-shadow:0 1px 2px rgba(0,0,0,.03); }
.svc-pill:hover { border-color:rgba(0,113,227,.28); background:rgba(0,113,227,.06); transform:translateY(-1px); }
.svc-pill.primary { background:var(--primary); border-color:var(--primary); color:#fff; }
.svc-pill.danger { background:rgba(255,59,48,.08); border-color:rgba(255,59,48,.18); color:var(--red); }
.service-reply { display:grid; grid-template-columns:minmax(0, 1fr) auto; gap:12px; border-top:1px solid var(--line); padding:14px 18px; }
.service-reply textarea { min-height:58px; resize:vertical; }

@media (max-width: 900px) {
  .stats-grid { grid-template-columns: repeat(2,1fr); }
  .grid-2, .grid-3, .inspect-admin-grid, .site-grid, .service-layout { grid-template-columns: 1fr; }
  .sidebar { transform: translateX(-100%); }
}

/* 品牌型号管理 */
.cat-tabs { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 16px; }
.cat-tab { padding: 7px 16px; border-radius: 999px; background: #f0f0f3; color: var(--text2); font-size: 13px; cursor: pointer; }
.cat-tab.on { background: var(--primary); color: #fff; }
.cm-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.cm-col { border: 1px solid var(--line); border-radius: 12px; overflow: hidden; }
.cm-head { display: flex; align-items: center; justify-content: space-between; padding: 12px 14px; background: #fafafa; border-bottom: 1px solid var(--line); font-weight: 600; font-size: 13.5px; }
.cm-list { max-height: 56vh; overflow-y: auto; }
.cm-row { display: flex; align-items: center; gap: 10px; padding: 11px 14px; border-bottom: 1px solid var(--line); cursor: default; }
.cm-row.on { background: rgba(0,113,227,0.07); }
.cm-row[onclick] { cursor: pointer; }
.cm-name { flex: 1; font-size: 13.5px; word-break: break-all; }
.cm-meta { font-size: 12px; color: var(--text2); }
.cm-del { border: none; background: transparent; color: var(--red); font-size: 12.5px; cursor: pointer; padding: 2px 6px; border-radius: 6px; }
.cm-del:hover { background: rgba(255,59,48,0.1); }
@media (max-width: 920px) { .cm-grid { grid-template-columns: 1fr; } }

/* 员工管理：经营提成设置 */
.staff-admin-grid { display:grid; grid-template-columns:minmax(280px, .9fr) minmax(460px, 1.25fr); gap:16px; margin-bottom:16px; align-items:stretch; }
.staff-guide { background:linear-gradient(135deg, rgba(0,113,227,.07), rgba(94,92,230,.06)); }
.staff-comm-head { display:flex; align-items:flex-start; justify-content:space-between; gap:14px; margin-bottom:14px; }
.staff-commission-table { border:1px solid var(--line); border-radius:16px; overflow:hidden; background:var(--card); }
.staff-commission-row { display:grid; grid-template-columns:1.15fr 1fr 1fr; gap:12px; align-items:center; padding:12px 14px; border-top:1px solid var(--line); }
.staff-commission-row:first-child { border-top:0; }
.staff-commission-row.head { background:rgba(0,0,0,.035); color:var(--text2); font-size:12px; font-weight:700; }
.staff-commission-row b { color:var(--text); font-size:13.5px; }
.staff-commission-row .ipt { padding:9px 11px; border-radius:12px; font-weight:700; color:var(--text); }

@media (max-width: 1080px) {
  .staff-admin-grid { grid-template-columns:1fr; }
}

/* 回收报价：更清晰的价格维护界面 */
.rq-layout { grid-template-columns:240px minmax(260px, .9fr) minmax(520px, 1.6fr) !important; align-items:start; }
.rq-detail-head { display:flex; justify-content:space-between; gap:14px; padding:14px 0 16px; border-bottom:1px solid var(--line); margin-bottom:14px; }
.rq-model-title { font-weight:850; font-size:20px; color:var(--text); }
.rq-subtabs { display:flex; gap:10px; margin-bottom:14px; }
.rq-subtabs button { border:1px solid var(--line); background:var(--card); color:var(--text); border-radius:999px; padding:9px 16px; cursor:pointer; font-weight:750; }
.rq-subtabs button span { color:var(--text3); margin-left:4px; }
.rq-subtabs button.on { border-color:var(--primary); background:rgba(0,113,227,.08); color:var(--primary); }
.rq-page-head { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:12px; padding:10px 12px; border:1px solid #d8d8de; border-radius:14px; background:#fff; color:#63636a; font-size:12.5px; }
.rq-page-head > div { display:flex; gap:8px; }
.rq-price-list { display:flex; flex-direction:column; gap:14px; }
.rq-quote-card { border:1px solid #d8d8de; border-radius:18px; padding:16px; background:#fff; color:#1d1d1f; box-shadow:0 8px 22px rgba(0,0,0,.045); }
.rq-quote-top { display:grid; grid-template-columns:minmax(0, 1fr) 136px auto; gap:14px; align-items:center; padding-bottom:14px; margin-bottom:14px; border-bottom:1px solid #e5e5ea; background:#fff; }
.rq-quote-main { min-width:0; }
.rq-quote-line { display:flex; align-items:center; gap:10px; min-width:0; }
.rq-quote-line b { color:#1d1d1f; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.rq-condition-chip { flex:none; display:inline-flex; align-items:center; justify-content:center; min-height:28px; padding:4px 12px; border-radius:999px; background:#fff5f3; border:1px solid rgba(198,40,40,.18); color:#c62828; font-weight:900; font-size:13px; }
.condition-select { color:#c62828 !important; font-weight:900 !important; background:#fff !important; }
.rq-quote-meta { margin-top:8px; color:#63636a; font-size:12.5px; }
.rq-price-field label { display:block; color:#3a3a3c; font-size:12px; font-weight:750; margin-bottom:6px; }
.rq-price-field .ipt { color:var(--red); font-weight:900; font-size:16px; text-align:right; }
.rq-quote-actions { display:flex; gap:8px; align-items:center; justify-content:flex-end; flex-wrap:wrap; }
.rq-edit-grid { display:grid; grid-template-columns:repeat(3, minmax(0, 1fr)); gap:12px; }
.rq-edit-grid .field { margin-bottom:0; }
.rq-standard-table { margin-top:12px; border:1px solid #d8d8de; border-radius:14px; overflow:hidden; background:#fff; color:#1d1d1f; }
.rq-standard-title { padding:10px 12px; font-weight:850; color:#1d1d1f; background:#f5f5f7; }
.rq-standard-row { display:grid; grid-template-columns:108px 1fr; border-top:1px solid #e5e5ea; font-size:13px; background:#fff; }
.rq-standard-row span { padding:9px 10px; color:#3a3a3c; background:#fbfbfd; font-weight:750; }
.rq-standard-row b { padding:9px 10px; color:#1d1d1f; font-weight:750; line-height:1.55; }
.rq-standards-grid { display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:14px; }
.rq-standard-card { border:1px solid #d8d8de; border-radius:18px; padding:14px; background:#fff; color:#1d1d1f; }
.rq-save-row { display:flex; justify-content:flex-end; gap:10px; margin-top:16px; }

@media (max-width: 1180px) {
  .rq-layout { grid-template-columns:1fr !important; }
  .rq-quote-top { grid-template-columns:1fr; }
  .rq-price-field .ipt { text-align:left; }
  .rq-edit-grid, .rq-standards-grid { grid-template-columns:1fr; }
}

/* 使用说明 */
.help-layout { display:grid; grid-template-columns:240px minmax(0, 1fr); gap:18px; align-items:start; }
.help-toc { position:sticky; top:86px; display:flex; flex-direction:column; gap:8px; }
.help-toc a { padding:10px 12px; border-radius:12px; color:var(--text2); text-decoration:none; font-weight:750; }
.help-toc a:hover { background:rgba(0,113,227,.08); color:var(--primary); }
.help-main { line-height:1.72; }
.help-main section { padding:4px 0 20px; border-bottom:1px solid var(--line); }
.help-main section:last-child { border-bottom:0; padding-bottom:0; }
.help-main h2 { margin:0 0 12px; font-size:21px; color:var(--text); }
.help-block { padding:14px 0; border-top:1px solid rgba(0,0,0,.055); }
.help-block:first-child { border-top:0; }
.help-block h3 { margin:0 0 6px; font-size:15px; color:var(--text); }
.help-block div { color:var(--text2); font-size:14px; }
.api-grid { display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:12px; margin:14px 0; }
.api-card { display:block; padding:14px; border:1px solid var(--line); border-radius:16px; background:var(--card); text-decoration:none; color:var(--text); }
.api-card b { display:block; margin-bottom:4px; }
.api-card span { display:block; font-size:12px; color:var(--primary); word-break:break-all; }
.api-card em { display:block; margin-top:8px; color:var(--text2); font-style:normal; font-size:12.5px; }
@media (max-width: 980px) {
  .help-layout { grid-template-columns:1fr; }
  .help-toc { position:static; }
  .api-grid { grid-template-columns:1fr; }
}

/* 合规备案信息 */
.admin-compliance {
  color: var(--text3);
  font-size: 12px;
  text-align: center;
}
.admin-compliance a {
  color: var(--text3);
  text-decoration: none;
}
.admin-compliance a:hover {
  color: var(--primary);
}
.login-compliance {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 14px;
  z-index: 3;
  color: rgba(245,245,247,.58);
}
.login-compliance a {
  color: rgba(245,245,247,.62);
}
.admin-shell-compliance {
  margin: 34px 0 0;
  padding: 18px 0 0;
  border-top: 1px solid var(--line);
}
