/* ============================================================================
   追单日期（2026-10-23 新增面板 #panel-chase）
   风格对齐全站：白卡片 + 中性灰 + 品牌玫红强调色；卡片网格自适应，不做横向滚动。
============================================================================ */
.cs-wrap{display:flex;flex-direction:column;gap:18px;}
.cs-toolbar{display:flex;flex-direction:column;gap:12px;padding:14px 16px;border:1px solid var(--line);border-radius:14px;background:var(--canvas);box-shadow:var(--shadow-sm);}
/* ── 追单账号 chips（程程/七七/若若 × 企微/个微）── */
.cs-accounts{display:flex;flex-wrap:wrap;align-items:center;gap:8px;}
.cs-accounts-label{font-size:12px;font-weight:700;color:var(--ink-soft);flex:none;}
.cs-acct{border:1px solid var(--line);background:#fff;color:var(--ink);border-radius:999px;padding:6px 14px;font:inherit;font-size:12.5px;font-weight:700;cursor:pointer;transition:.15s;}
.cs-acct:hover{color:var(--brand);border-color:#fecdd3;background:#fff7ed;}
.cs-acct.active{background:linear-gradient(135deg,#fff7ed,#fff1f2);color:var(--brand);border-color:var(--brand);box-shadow:0 4px 12px rgba(225,29,72,.14);}
body[data-theme="dark"] .cs-acct{background:rgba(15,23,42,.6);color:#cbd5e1;border-color:rgba(148,163,184,.25);}
body[data-theme="dark"] .cs-acct.active{background:rgba(249,115,22,.2);color:#fdba74;border-color:rgba(251,146,60,.5);}
body[data-theme="dark"] .cs-accounts-label{color:#94a3b8;}
/* 组头「复制日期」按钮 */
.cs-copy-date{margin-left:auto;border:1px solid var(--line);background:#fff;color:var(--ink-soft);border-radius:8px;padding:3px 10px;font:inherit;font-size:11.5px;font-weight:700;cursor:pointer;transition:.15s;}
.cs-copy-date:hover{color:var(--brand);border-color:#fecdd3;}
body[data-theme="dark"] .cs-copy-date{background:rgba(15,23,42,.6);color:#cbd5e1;border-color:rgba(148,163,184,.25);}
/* 账号记录徽章：企微(蓝)/个微(绿) */
.cs-kind.is-qi{background:#eff6ff;color:#1d4ed8;}
body[data-theme="dark"] .cs-kind.is-qi{background:rgba(59,130,246,.18);color:#93c5fd;}
body[data-theme="dark"] .cs-kind.is-ge{background:rgba(139,92,246,.2);color:#c4b5fd;}
.cs-form{display:flex;flex-wrap:wrap;gap:12px;align-items:flex-end;}
.cs-form .field{display:flex;flex-direction:column;gap:6px;min-width:0;}
.cs-form label{font-size:12px;font-weight:700;color:var(--ink-soft);}
.cs-form input,.cs-form select{border:1px solid var(--line);border-radius:10px;padding:9px 12px;font:inherit;font-size:14px;color:var(--ink);background:#fff;min-width:0;}
.cs-form input:focus,.cs-form select:focus{outline:none;border-color:var(--brand);box-shadow:0 0 0 3px rgba(225,29,72,.12);}
.cs-form #cs-contact{min-width:200px;}
.cs-form #cs-require{min-width:220px;flex:1;}
.cs-filters{display:flex;gap:8px;flex-wrap:wrap;}
.cs-filters button{border:1px solid var(--line);background:#fff;color:var(--ink-soft);border-radius:999px;padding:6px 14px;font:inherit;font-size:12.5px;font-weight:700;cursor:pointer;transition:.15s;}
.cs-filters button:hover{color:var(--brand);border-color:#fecdd3;}
.cs-filters button.active{background:linear-gradient(135deg,#fff7ed,#fff1f2);color:var(--brand);border-color:rgba(249,115,22,.28);}

.cs-list{display:flex;flex-direction:column;gap:18px;min-width:0;}
/* 2026-10-24 用户指令④：日历与清单**左右并排**，日历占比 ① 再调小 → 0.8 : 1（≈44% / 56%）
   ⚠️ 窄屏（≤1180）自动退回上下堆叠，否则 7 列格子会挤成一条 */
.cs-split{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1fr);gap:18px;align-items:start;}
@media (max-width:1180px){ .cs-split{grid-template-columns:minmax(0,1fr);} }
.cs-group{border:1px solid var(--line);border-radius:14px;background:var(--canvas);padding:12px 14px 14px;box-shadow:var(--shadow-sm);}
.cs-group.is-overdue{border-color:#fecaca;background:linear-gradient(180deg,#fff5f5 0%,#fffafb 100%);}
.cs-group-head{display:flex;align-items:center;gap:10px;}
.cs-date{font-size:13.5px;font-weight:800;color:var(--ink);}
.cs-count{font-style:normal;font-size:11.5px;font-weight:700;color:var(--ink-soft);background:#f1f5f9;border-radius:999px;padding:1px 8px;}
.cs-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:12px;margin-top:12px;}

.cs-card{position:relative;display:flex;flex-direction:column;border:1px solid var(--line);border-radius:12px;background:#fff;padding:12px 14px;cursor:pointer;transition:transform .16s ease,border-color .16s ease,box-shadow .16s ease;}
.cs-card:hover{transform:translateY(-2px);border-color:#fecdd3;box-shadow:0 10px 22px rgba(225,29,72,.12);}
.cs-card:focus-visible{outline:none;border-color:var(--brand);box-shadow:0 0 0 3px rgba(225,29,72,.16);}
/* 卡片第一行：归属账号 + 顾客联系方式类型（两种徽章并排） */
.cs-tags{display:flex;flex-wrap:wrap;gap:6px;align-self:flex-start;}
.cs-kind{font-size:11px;font-weight:700;line-height:1.7;padding:0 8px;border-radius:999px;white-space:nowrap;}
/* 个微账号：紫色，与「微信名」的绿色区分开 */
.cs-kind.is-ge{background:#f5f3ff;color:#6d28d9;}
.cs-kind.is-phone{background:#ecfeff;color:#0e7490;}
.cs-kind.is-wechat{background:#ecfdf5;color:#047857;}
.cs-contact{margin-top:8px;font-size:16px;font-weight:800;color:var(--ink);line-height:1.35;word-break:break-all;}
/* 「要求」= 独立的一行信息（与联系方式分开，不与联系方式混排） */
.cs-require{margin-top:8px;display:flex;gap:8px;align-items:flex-start;background:#fff7ed;border:1px solid #fed7aa;border-radius:10px;padding:6px 10px;}
.cs-require b{flex:none;font-size:11px;font-weight:800;color:#c2410c;background:#ffedd5;border-radius:6px;padding:1px 6px;line-height:1.7;}
.cs-require span{font-size:12.5px;line-height:1.5;color:#9a3412;word-break:break-word;}
.cs-actions{margin-top:10px;display:flex;gap:8px;}
.cs-act{border:1px solid var(--line);background:#fff;color:var(--ink-soft);border-radius:8px;padding:4px 10px;font:inherit;font-size:11.5px;font-weight:700;cursor:pointer;transition:.15s;}
.cs-act:hover{border-color:var(--brand);color:var(--brand);}
.cs-act.is-del:hover{border-color:#fca5a5;color:#b91c1c;}
/* 追单次数按钮（2026-10-24 取代「标记完成」）：没追过 = 中性灰；追过 ≥1 次 = 淡玫红 */
.cs-act.is-chase.on{background:linear-gradient(135deg,#fff7ed,#fff1f2);border-color:rgba(249,115,22,.32);color:var(--brand);}
/* 追过的卡片只加一点点玫红描边做提示，不像原来的「已完成」那样整卡灰掉 + 划掉号码 */
.cs-card.is-chased{border-color:#fecdd3;}
.cs-empty{padding:26px 16px;text-align:center;color:var(--ink-soft);font-size:13px;background:#fafafa;border:1px dashed var(--line);border-radius:12px;}

body[data-theme="dark"] .cs-toolbar,
body[data-theme="dark"] .cs-group{background:rgba(15,23,42,.6);border-color:rgba(148,163,184,.18);box-shadow:none;}
/* ⚠️ 深色下逾期组要用「高不透明度深红底」：透明度低会把底层浅色画布透出来（浅粉发白） */
body[data-theme="dark"] .cs-group.is-overdue{background:linear-gradient(180deg,rgba(88,18,18,.78) 0%,rgba(64,16,16,.68) 100%);border-color:rgba(248,113,113,.36);}
body[data-theme="dark"] .cs-card{background:rgba(30,41,59,.72);border-color:rgba(148,163,184,.18);}
body[data-theme="dark"] .cs-card:hover{border-color:rgba(251,113,133,.5);box-shadow:0 10px 22px rgba(0,0,0,.3);}
body[data-theme="dark"] .cs-form input{background:rgba(15,23,42,.7);color:#e5e7eb;border-color:rgba(148,163,184,.25);}
body[data-theme="dark"] .cs-date,
body[data-theme="dark"] .cs-contact{color:#e5e7eb;}
body[data-theme="dark"] .cs-form select{background:rgba(15,23,42,.7);color:#e5e7eb;border-color:rgba(148,163,184,.25);}
body[data-theme="dark"] .cs-count{background:rgba(148,163,184,.16);color:#cbd5e1;}
body[data-theme="dark"] .cs-kind.is-phone{background:rgba(34,211,238,.16);color:#a5f3fc;}
body[data-theme="dark"] .cs-kind.is-wechat{background:rgba(16,185,129,.18);color:#6ee7b7;}
body[data-theme="dark"] .cs-require{background:rgba(249,115,22,.14);border-color:rgba(251,146,60,.35);}
body[data-theme="dark"] .cs-require b{background:rgba(249,115,22,.22);color:#fdba74;}
body[data-theme="dark"] .cs-require span{color:#fed7aa;}
body[data-theme="dark"] .cs-filters button,
body[data-theme="dark"] .cs-act{background:rgba(15,23,42,.6);color:#cbd5e1;border-color:rgba(148,163,184,.25);}
body[data-theme="dark"] .cs-filters button.active{background:rgba(249,115,22,.2);color:#fdba74;border-color:rgba(251,146,60,.4);}
body[data-theme="dark"] .cs-act.is-chase.on{background:rgba(249,115,22,.16);border-color:rgba(251,146,60,.4);color:#fdba74;}
body[data-theme="dark"] .cs-card.is-chased{border-color:rgba(251,113,133,.42);}
body[data-theme="dark"] .cs-empty{background:rgba(148,163,184,.08);color:#94a3b8;border-color:rgba(148,163,184,.25);}
@media (max-width:640px){
  .cs-cards{grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:10px;}
  .cs-form #cs-contact,.cs-form #cs-require{min-width:100%;}
}

/* ══ 大月历（2026-10-24：替换原「追单天数 · 追单日期」阶梯表）════════════════════
   每格 = 一天：日期数字 + 当天追单人数；今天红字、有人的浅红底、选中的实心红 */
.cs-cal{border:1px solid #fed7aa;border-radius:16px;background:linear-gradient(180deg,#fffdfb,#fff8f4);padding:14px 16px 16px;}
.cs-cal-head{display:flex;align-items:center;gap:10px;margin-bottom:12px;}
.cs-cal-title{font-size:17px;font-weight:800;color:var(--ink);letter-spacing:.5px;font-variant-numeric:tabular-nums;}
.cs-cal-nav{width:30px;height:30px;display:inline-flex;align-items:center;justify-content:center;border:1px solid var(--line);border-radius:9px;background:#fff;color:var(--ink-soft);font:inherit;font-size:17px;line-height:1;cursor:pointer;transition:.15s;}
.cs-cal-nav:hover{color:var(--brand);border-color:#fecdd3;background:#fff1f2;}
.cs-cal-today{margin-left:auto;border:1px solid #fecdd3;background:#fff;color:var(--brand);border-radius:999px;padding:5px 13px;font:inherit;font-size:12px;font-weight:800;cursor:pointer;transition:.15s;}
.cs-cal-today:hover{background:#fff1f2;}
.cs-cal-tip{font-size:11.5px;line-height:1.6;color:var(--ink-soft);margin-bottom:10px;}
.cs-cal-week{display:grid;grid-template-columns:repeat(7,1fr);gap:7px;margin-bottom:8px;}
.cs-cal-week span{text-align:center;font-size:11px;font-weight:800;color:var(--ink-soft);letter-spacing:.5px;}
.cs-cal-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:7px;}
/* 半宽后格子变小：min-height 96→78、圆角/内距略收，一行仍放得下「27号 / 261027 / 第28天 / N人」 */
.cs-cal-day{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;min-height:68px;padding:6px 3px;border:1px solid var(--line);border-radius:11px;background:#fff;font:inherit;cursor:pointer;transition:transform .14s ease,border-color .14s ease,box-shadow .14s ease;}
.cs-cal-day:hover{transform:translateY(-1px);border-color:#fecdd3;box-shadow:0 8px 18px rgba(225,29,72,.1);}
.cs-cal-day:focus-visible{outline:none;border-color:var(--brand);box-shadow:0 0 0 3px rgba(225,29,72,.16);}
.cs-cal-num{font-size:17px;font-weight:800;line-height:1;color:var(--ink);font-variant-numeric:tabular-nums;}
/* 2026-10-24 用户指令②：日期写成「24号」——「号」字小一号、字重略轻，不抢数字 */
.cs-cal-num em{font-style:normal;font-size:.66em;font-weight:700;margin-left:1px;opacity:.78;}
/* 六位码的显示行**已下线**（2026-10-24）：码统一在右边清单的 📋 261024 按钮上显示 + 复制 */
.cs-cal-day.is-other{opacity:.34;}
.cs-cal-day.has-items{border-color:#fecdd3;background:linear-gradient(180deg,#fff,#fff5f6);}
.cs-cal-count{font-style:normal;font-size:10.5px;font-weight:800;line-height:1.75;color:#be123c;background:#ffe4e6;border-radius:999px;padding:0 8px;font-variant-numeric:tabular-nums;}
/* 格子里的「第N天」档位标签：与回访日程表同口径，每天自动跟着日历挪 */
.cs-cal-tag{font-size:10px;font-weight:800;line-height:1.7;color:#ea580c;background:#ffedd5;border:1px solid #fed7aa;border-radius:6px;padding:0 6px;font-variant-numeric:tabular-nums;white-space:nowrap;}
.cs-cal-day.is-today{border-color:rgba(225,29,72,.45);padding-top:15px;}
.cs-cal-day.is-today .cs-cal-num{color:var(--brand);}
/* 「今天」角标：日期带上「号」字后数字更宽，2026-10-24 起给今天格加 padding-top 让出这条角标的位置，
   否则会和「24号」的「号」叠在一起（截图里会看成「24号天」） */
.cs-cal-day.is-today::after{content:"今天";position:absolute;top:3px;right:5px;font-size:9px;font-weight:800;line-height:1.2;color:var(--brand);}
/* 选中：**柔和玫红**（2026-10-24 用户指令③「点击以后的色彩不用太鲜艳」——
   原来是实心 #e11d48→#f43f5e 高饱和渐变，扎眼；现在改成淡红底 + 玫红描边 + 深玫红字） */
.cs-cal-day.is-picked{border-color:#fb7185;background:linear-gradient(180deg,#fff5f6,#ffe9ec);box-shadow:0 6px 16px rgba(225,29,72,.10);}
.cs-cal-day.is-picked .cs-cal-num{color:#be123c;}
.cs-cal-day.is-picked::after{color:#e11d48;}
.cs-cal-day.is-picked .cs-cal-count{background:#fff;color:#be123c;border:1px solid #fecdd3;}
/* 选中格上：码 / 档位标签同步转深玫红，别用白字（现在是浅底） */
.cs-cal-day.is-picked .cs-cal-tag{background:#fff;border-color:#fecdd3;color:#c2410c;}

/* 选中某天后，清单顶部那条：10月24日 周六 · 今天 ｜ 3 人 ｜ 复制日期 ｜ 返回全部 */
.cs-picked{display:flex;align-items:center;gap:10px;flex-wrap:wrap;border:1px solid #fecdd3;background:linear-gradient(135deg,#fff7ed,#fff1f2);border-radius:12px;padding:9px 14px;margin-bottom:4px;}
.cs-picked-date{font-size:14px;font-weight:800;color:var(--brand);}
.cs-picked-clear{margin-left:auto;border:1px solid var(--line);background:#fff;color:var(--ink-soft);border-radius:8px;padding:3px 10px;font:inherit;font-size:11.5px;font-weight:700;cursor:pointer;transition:.15s;}
.cs-picked-clear:hover{color:var(--brand);border-color:#fecdd3;}

/* 深色模式 */
body[data-theme="dark"] .cs-cal{background:linear-gradient(180deg,rgba(30,41,59,.72),rgba(15,23,42,.62));border-color:rgba(251,146,60,.3);}
body[data-theme="dark"] .cs-cal-title{color:#e5e7eb;}
body[data-theme="dark"] .cs-cal-nav{background:rgba(15,23,42,.6);color:#cbd5e1;border-color:rgba(148,163,184,.25);}
body[data-theme="dark"] .cs-cal-nav:hover{background:rgba(249,115,22,.18);color:#fdba74;border-color:rgba(251,146,60,.4);}
body[data-theme="dark"] .cs-cal-today{background:rgba(15,23,42,.6);color:#fdba74;border-color:rgba(251,146,60,.4);}
body[data-theme="dark"] .cs-cal-week span{color:#94a3b8;}
/* ⚠️ 说明文字用 var(--ink-soft)，暗色下会变成深灰压在深底上 → 单独提亮 */
body[data-theme="dark"] .cs-cal-tip{color:#94a3b8;}
body[data-theme="dark"] .cs-cal-day{background:rgba(15,23,42,.55);border-color:rgba(148,163,184,.2);}
body[data-theme="dark"] .cs-cal-day.has-items{background:linear-gradient(180deg,rgba(88,18,18,.42),rgba(64,16,16,.34));border-color:rgba(251,113,133,.34);}
body[data-theme="dark"] .cs-cal-num{color:#e5e7eb;}
body[data-theme="dark"] .cs-cal-day.is-today .cs-cal-num{color:#fb7185;}
body[data-theme="dark"] .cs-cal-day.is-today::after{color:#fb7185;}
body[data-theme="dark"] .cs-cal-count{background:rgba(251,113,133,.22);color:#fecdd3;}
body[data-theme="dark"] .cs-cal-tag{background:rgba(249,115,22,.18);border-color:rgba(251,146,60,.38);color:#fdba74;}
/* 暗色选中：同样收敛 —— 低饱和**深酒红**底 + 淡粉字（用半透明玫红叠深底会发紫，所以给实色） */
body[data-theme="dark"] .cs-cal-day.is-picked{background:linear-gradient(180deg,#5b1027,#3f0a1c);border-color:rgba(251,113,133,.55);box-shadow:none;}
body[data-theme="dark"] .cs-cal-day.is-picked .cs-cal-num{color:#fecdd3;}
body[data-theme="dark"] .cs-cal-day.is-picked::after{color:#fda4af;}
body[data-theme="dark"] .cs-cal-day.is-picked .cs-cal-count{background:rgba(255,255,255,.9);color:#9f1239;border-color:transparent;}
body[data-theme="dark"] .cs-cal-day.is-picked .cs-cal-tag{background:rgba(255,255,255,.9);border-color:transparent;color:#9a3412;}
/* ⚠️ 暗色下这块面板本身仍是**浅色玻璃**（.panel 用 rgba(255,255,255,.58) 渐变 + backdrop-filter），
   所以「选中日」那条**保持浅色样式**：深色半透明底叠在浅底上会变成浅橙，字就看不清了。
   同理，条里的「N 人」徽章要把 .cs-count 的暗色覆盖顶回去，否则浅灰字压浅底 = 看不见 */
body[data-theme="dark"] .cs-picked .cs-count{background:#fff;color:#be123c;}
body[data-theme="dark"] .cs-picked-clear{background:rgba(15,23,42,.6);color:#cbd5e1;border-color:rgba(148,163,184,.25);}

@media (max-width:900px){
  .cs-cal-day{min-height:68px;padding:5px 2px;}
  .cs-cal-num{font-size:15px;}
  .cs-cal-grid,.cs-cal-week{gap:5px;}
}
@media (max-width:640px){
  .cs-cal{padding:10px 10px 12px;border-radius:12px;}
  .cs-cal-day{min-height:54px;border-radius:9px;gap:3px;}
  .cs-cal-num{font-size:14px;}
  .cs-cal-count{font-size:9.5px;padding:0 6px;}
  .cs-cal-day.is-today::after{display:none;}
}
