:root { color-scheme: light; --brand:#12b76a; --ink:#17181c; --muted:#7d8390; --line:#e8eaf0; --canvas:#f4f5f8; --green:#12b76a; }
* { box-sizing:border-box; }
body { margin:0; min-width:1100px; color:var(--ink); background:var(--canvas); font:14px/1.5 Inter,"PingFang SC","Microsoft YaHei",sans-serif; }
button,input,select,textarea { font:inherit; }
button { cursor:pointer; }
.hidden { display:none !important; }
.login-shell { min-height:100vh; display:grid; place-items:center; background:#111217; }
.login-card { width:390px; padding:42px; background:#fff; border-radius:24px; box-shadow:0 30px 80px #0008; text-align:center; }
.brand-mark { width:74px; height:74px; margin:0 auto 20px; display:grid; place-items:center; color:#111; background:var(--brand); border-radius:22px; font-size:24px; font-weight:900; }
.login-card h1 { margin:0; font-size:26px; }
.login-card p { margin:8px 0 26px; color:var(--muted); }
.login-card input { width:100%; height:48px; margin-top:10px; padding:0 16px; border:1px solid var(--line); border-radius:12px; outline:0; }
.login-card input:focus { border-color:var(--brand); box-shadow:0 0 0 3px #12b76a26; }
.login-card button { width:100%; height:48px; margin-top:14px; border:0; border-radius:12px; background:var(--brand); font-weight:800; }
.error { min-height:22px; margin-top:10px; color:#e5484d; }
.app-shell { min-height:100vh; display:grid; grid-template-columns:240px 1fr; }
.sidebar { position:sticky; top:0; height:100vh; padding:26px 18px; display:flex; flex-direction:column; color:#fff; background:#17181c; overflow-y:auto; }
.logo { display:flex; align-items:center; gap:12px; padding:0 8px 28px; }
.logo span { width:42px; height:42px; display:grid; place-items:center; color:#111; background:var(--brand); border-radius:12px; font-weight:900; }
.logo strong { font-size:17px; }
nav { display:grid; gap:8px; }
.nav-item,.logout { height:46px; padding:0 16px; border:0; border-radius:12px; color:#b9bdc8; background:transparent; text-align:left; }
.nav-item:hover,.nav-item.active { color:#111; background:var(--brand); font-weight:700; }
.logout { margin-top:auto; color:#9297a3; }
main { padding:0 34px 50px; min-width:0; }
header { height:102px; display:flex; align-items:center; justify-content:space-between; }
header p,header h1 { margin:0; }
header p { color:var(--muted); font-size:12px; letter-spacing:2px; }
header h1 { margin-top:2px; font-size:26px; }
.status { padding:8px 12px; color:#087a45; background:#e9f9f0; border-radius:999px; font-weight:700; }
.status::before { content:""; display:inline-block; width:7px; height:7px; margin-right:7px; background:var(--green); border-radius:50%; }
.view { display:none; }
.view.active { display:block; }
.summary-grid { display:grid; grid-template-columns:repeat(6,1fr); gap:16px; }
.metric { padding:24px; background:#fff; border:1px solid var(--line); border-radius:18px; }
.metric span { color:var(--muted); }
.metric strong { display:block; margin-top:10px; font-size:28px; }
.panel { background:#fff; border:1px solid var(--line); border-radius:18px; }
.welcome { min-height:280px; margin-top:18px; padding:46px; display:flex; align-items:center; justify-content:space-between; overflow:hidden; }
.welcome h2 { margin:8px 0; font-size:30px; }
.welcome p { color:var(--muted); }
.eyebrow { color:#0b7a4e; font-size:12px; font-weight:800; letter-spacing:3px; }
.orb { width:190px; height:190px; display:grid; place-items:center; color:#17181c; background:var(--brand); border-radius:48px; transform:rotate(8deg); font-size:76px; font-weight:900; box-shadow:0 22px 50px #12b76a52; }
.toolbar { min-height:74px; display:flex; align-items:center; justify-content:space-between; }
.toolbar h2,.toolbar p { margin:0; }
.toolbar h2 { font-size:20px; }
.toolbar p { color:var(--muted); }
.primary,.secondary { min-height:40px; padding:0 18px; border:0; border-radius:10px; font-weight:700; }
.primary { color:#17181c; background:var(--brand); }
.secondary { color:#555; background:#f0f1f4; }
.toolbar select,.toolbar input[type=search] { height:40px; padding:0 12px; border:1px solid var(--line); border-radius:10px; background:#fff; }
.toolbar select { padding-right:34px; }
.table-wrap { overflow-x:auto; }
table { width:100%; border-collapse:collapse; }
th,td { padding:16px 18px; border-bottom:1px solid var(--line); text-align:left; vertical-align:middle; }
th { color:#7b808b; background:#fafbfc; font-size:12px; }
tr:last-child td { border-bottom:0; }
.entity { display:flex; align-items:center; gap:12px; max-width:360px; }
.entity img { width:46px; height:46px; flex:none; object-fit:cover; border-radius:10px; background:#eee; }
.entity strong,.entity small { display:block; }
.entity small { overflow:hidden; color:var(--muted); text-overflow:ellipsis; white-space:nowrap; }
.pill { display:inline-flex; padding:5px 9px; border-radius:999px; font-size:12px; font-weight:700; }
.pill.on { color:#087a45; background:#e9f9f0; }
.pill.off { color:#8a4b00; background:#fff3dc; }
.pill.banned { color:#b42318; background:#fee4e2; }
.action { border:0; color:#0b7a4e; background:transparent; font-weight:700; }
.danger { color:#d92d20; }
.approve { color:#07864d; }
.status-select { height:34px; border:1px solid var(--line); border-radius:8px; }
dialog { width:620px; padding:0; border:0; border-radius:20px; box-shadow:0 30px 100px #0005; }
dialog::backdrop { background:#12131899; }
#editor-form { padding:26px; }
.dialog-head { display:flex; align-items:center; justify-content:space-between; }
.dialog-head h2 { margin:0; }
.dialog-head button { width:36px; height:36px; border:0; border-radius:50%; background:#f0f1f4; font-size:22px; }
.form-grid { margin-top:22px; display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.field { display:grid; gap:7px; }
.field.wide { grid-column:1/-1; }
.field label { color:#616671; font-weight:700; }
.field input,.field select,.field textarea { width:100%; min-height:42px; padding:10px 12px; border:1px solid var(--line); border-radius:10px; outline:0; }
.field textarea { min-height:86px; resize:vertical; }
.dialog-actions { margin-top:24px; display:flex; justify-content:flex-end; gap:10px; }
.toast { position:fixed; right:28px; bottom:28px; padding:13px 18px; color:#fff; background:#17181c; border-radius:10px; opacity:0; transform:translateY(12px); pointer-events:none; transition:.2s; }
.toast.show { opacity:1; transform:none; }
.empty { padding:44px !important; color:var(--muted); text-align:center; }
.settings-form { padding:24px; display:grid; grid-template-columns:320px 1fr auto; gap:18px; align-items:end; }
.settings-form .wide { grid-column:auto; }
.settings-form textarea { min-height:78px; }
.settings-actions { padding-bottom:1px; }
.notice-panel { margin-top:18px; }
.banner-toolbar { margin-top:28px; }
.banner-panel { margin-top:18px; }
.banner-preview { width:120px; height:58px; object-fit:cover; border-radius:10px; background:#eee; }
.image-upload-row { display:flex; align-items:center; gap:14px; padding:12px; border:1px dashed #d8dbe3; border-radius:12px; }
.image-upload-preview { width:112px; height:76px; flex:none; object-fit:cover; border-radius:10px; background:#eee; }
.image-upload-empty { width:112px; height:76px; flex:none; display:grid; place-items:center; padding:8px; color:var(--muted); background:#f7f8fa; border-radius:10px; text-align:center; font-size:12px; }
.image-upload-button { min-width:104px; }
.image-upload-row small { color:var(--muted); }
.commission-form { padding:24px; display:flex; align-items:center; gap:24px; }
.commission-form > div:first-child { flex:1; }
.commission-form label { font-size:17px; font-weight:800; }
.commission-form p { margin:5px 0 0; color:var(--muted); }
.rate-input { width:150px; height:44px; padding:0 12px; display:flex; align-items:center; border:1px solid var(--line); border-radius:10px; background:#fff; }
.rate-input input { min-width:0; width:100%; border:0; outline:0; font-size:18px; font-weight:800; }
.rate-input span { color:var(--muted); }
.worker-panel { margin-top:18px; }
.customer-filters { padding:18px; margin-bottom:18px; display:flex; flex-wrap:wrap; align-items:end; gap:12px; }
.customer-filters label { display:grid; gap:5px; color:var(--muted); font-size:12px; }
.customer-filters input,.customer-filters select { min-height:40px; padding:8px 10px; border:1px solid var(--line); border-radius:8px; }
.customer-pagination,.table-pagination { display:flex; justify-content:flex-end; align-items:center; gap:14px; padding:18px 0; }
.customer-pagination button:disabled,.table-pagination button:disabled { opacity:.4; cursor:default; }
.customer-metrics { display:grid; grid-template-columns:repeat(4,minmax(130px,1fr)); gap:14px; margin-bottom:18px; }
.customer-metrics .metric strong { font-size:23px; }
.customer-note { margin:12px 0 20px; color:#777d86; line-height:1.7; }
.customer-tag { display:inline-block; padding:3px 8px; margin:2px; border:1px solid currentColor; border-radius:12px; font-size:12px; white-space:nowrap; }
.customer-split { display:grid; grid-template-columns:1fr 1fr; gap:18px; margin-top:20px; }
#customer-dialog { width:min(1180px,95vw); max-height:90vh; overflow-y:auto; }
.customer-dialog-content { padding:26px; }
.customer-dialog-content .customer-details { display:grid; grid-template-columns:1fr 1fr; gap:16px; padding:18px 0; }
.customer-dialog-content .customer-details textarea { min-height:70px; width:100%; }
.customer-view th { white-space:nowrap; }
.customer-view small { color:var(--muted); }
.customer-form .field input[type=checkbox] { width:auto; min-height:20px; }

.service-admin-grid {
  max-height:220px;
  padding:10px;
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:8px;
  overflow-y:auto;
  background:#f8f9fb;
  border:1px solid var(--line);
  border-radius:10px;
}
.service-admin-option {
  min-width:0;
  padding:9px 10px;
  display:flex;
  align-items:center;
  gap:8px;
  background:#fff;
  border-radius:8px;
  cursor:pointer;
}
.service-admin-option input { width:auto; min-height:auto; }
.service-admin-option span { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }

#chat-dialog { width:min(1180px,95vw); max-height:90vh; overflow-y:auto; }
.chat-dialog-content { padding:26px; }
.chat-log-meta { margin:0 0 14px; color:var(--muted); font-size:13px; line-height:1.7; }
.chat-log { max-height:56vh; overflow-y:auto; padding:16px; background:#f8f9fb; border:1px solid var(--line); border-radius:12px; }
.chat-log-item { display:flex; gap:10px; margin-bottom:16px; }
.chat-log-item:last-child { margin-bottom:0; }
.chat-log-item.from-worker { flex-direction:row-reverse; }
.chat-log-item img { width:34px; height:34px; flex:none; border-radius:50%; object-fit:cover; background:#e9ecf2; }
.chat-log-bubble { max-width:min(560px,70%); padding:9px 13px; background:#fff; border:1px solid var(--line); border-radius:12px; }
.chat-log-item.from-worker .chat-log-bubble { background:#e9f9f0; border-color:#a7e8cb; }
.chat-log-bubble .chat-log-name { margin-bottom:4px; font-size:12px; color:var(--muted); }
.chat-log-bubble .chat-log-text { white-space:pre-wrap; word-break:break-word; line-height:1.6; }
.chat-log-bubble .chat-log-time { margin-top:5px; font-size:12px; color:var(--muted); }

/* 订单结单图缩略图 */
.completion-thumb { width: 56px; height: 56px; border-radius: 8px; object-fit: cover; background: #eee; }

/* 商品平台价格：开放下拉 + 价格输入同行 */
.platform-price-row { display: flex; align-items: center; gap: 10px; }
.platform-price-row select { width: 110px; flex: none; }
.platform-price-row input { flex: 1; }

/* 顶栏：面包屑 + 退出登录 */
header { gap: 18px; }
.header-main { min-width: 0; }
.header-actions { display: flex; align-items: center; gap: 12px; }
.breadcrumb { display: flex; align-items: center; gap: 6px; margin-bottom: 4px; color: var(--muted); font-size: 12px; letter-spacing: 1px; }
.breadcrumb i { font-style: normal; color: #c9ccd4; }
.breadcrumb span:last-child { color: #555; font-weight: 700; }
header .logout { margin-top: 0; height: 38px; padding: 0 16px; color: #555; background: #f0f1f4; border-radius: 10px; font-weight: 700; }
header .logout:hover { color: #111; background: #e6e8ec; }

/* 侧边栏分组（布局调整：按业务分组，组内缩进） */
.nav-group { margin-bottom: 8px; }
.nav-group-title { display: block; padding: 8px 16px 2px; color: #6a6f7d; font-size: 11px; letter-spacing: 1.5px; }
.nav-group .nav-item { height: 40px; padding-left: 20px; }

/* 来单提醒：顶栏开关 + 新订单卡片浮层 + 设置弹窗 */
.incoming-toggle { display:flex; align-items:center; gap:7px; height:38px; padding:0 13px; border:0; border-radius:10px; color:#087a45; background:#e9f9f0; font-weight:700; }
.incoming-toggle:hover { background:#dcf4e7; }
.incoming-toggle.off { color:#8a4b00; background:#fff3dc; }
.incoming-toggle.has-unread { color:#fff; background:#e5484d; }
.incoming-toggle.has-unread:hover { background:#cf3d42; }
.incoming-badge { min-width:20px; height:20px; padding:0 6px; display:inline-flex; align-items:center; justify-content:center; border-radius:999px; color:#fff; background:#e5484d; font-size:12px; font-weight:800; }
.incoming-toggle.has-unread .incoming-badge { color:#e5484d; background:#fff; }

.incoming-stack { position:fixed; right:34px; bottom:98px; z-index:40; width:380px; max-height:calc(100vh - 170px); display:none; flex-direction:column; gap:14px; padding:4px; overflow-y:auto; }
.incoming-stack.show { display:flex; }
.incoming-card { padding:18px 20px; background:#fff; border:1px solid #b7ebd2; border-left:4px solid var(--brand); border-radius:16px; box-shadow:0 18px 42px #1018282e; animation:incoming-in .22s ease-out; }
@keyframes incoming-in { from { opacity:0; transform:translateY(10px); } to { opacity:1; transform:none; } }
.incoming-card-head { display:flex; align-items:center; gap:10px; }
.incoming-tag { color:#0b7a4e; font-size:12px; font-weight:800; letter-spacing:1px; }
.incoming-time { margin-left:auto; color:var(--muted); font-size:12px; }
.incoming-close { width:26px; height:26px; flex:none; border:0; border-radius:50%; background:#f0f1f4; font-size:16px; line-height:1; }
.incoming-close:hover { background:#e6e8ec; }
.incoming-product { display:block; margin-top:10px; font-size:15px; line-height:1.5; }
.incoming-meta { margin-top:8px; display:flex; flex-wrap:wrap; gap:6px 14px; color:#616671; font-size:13px; line-height:1.6; }
.incoming-amount { color:#17181c; font-size:16px; }
.incoming-foot { margin-top:14px; display:flex; align-items:center; justify-content:space-between; gap:10px; }
.incoming-foot small { color:var(--muted); }
.incoming-foot .secondary { min-height:32px; padding:0 14px; }
.incoming-overflow { padding:14px 18px; display:flex; align-items:center; justify-content:space-between; gap:12px; color:#8a4b00; background:#fff8ea; border:1px solid #ffe0b2; border-radius:14px; font-size:13px; }
.incoming-overflow .secondary { min-height:30px; padding:0 12px; }

/* 设置弹窗：dialog 自身 padding:0，内边距要由表单自己留（否则内容贴住圆角边框） */
#incoming-form { padding:26px 26px 22px; }
.incoming-settings { margin-top:22px; display:grid; gap:16px; }
.incoming-option { display:flex; align-items:flex-start; gap:12px; padding:14px 16px; background:#f8f9fb; border:1px solid var(--line); border-radius:12px; cursor:pointer; }
.incoming-option input { width:auto; min-height:auto; margin-top:3px; }
.incoming-option strong,.incoming-option small { display:block; }
.incoming-option small { margin-top:4px; color:var(--muted); line-height:1.6; }
.incoming-settings .customer-note { margin:0; line-height:1.8; }
.incoming-settings .field { max-width:220px; }
