/* ============================================================
   配送助手 MVP · 补充样式（复用 prototype/styles.css 的设计系统）
   ============================================================ */

/* 实时在岗：未打卡行高亮 */
tr.absent-row { background: #FFF8F7; }
tr.absent-row td { border-bottom-color: #F7DAD6; }
tr.leave-row { background: #F7FAFF; }

.live-dot {
  width: 8px; height: 8px; border-radius: 50%; background: var(--green);
  display: inline-block; box-shadow: 0 0 0 0 rgba(16,160,90,.7);
  animation: pulse 2s infinite;
}
@keyframes pulse {
  0%   { box-shadow: 0 0 0 0 rgba(16,160,90,.55); }
  70%  { box-shadow: 0 0 0 8px rgba(16,160,90,0); }
  100% { box-shadow: 0 0 0 0 rgba(16,160,90,0); }
}

/* 模拟打卡面板 */
.sim-panel { background: linear-gradient(180deg,#FFFDF3,#fff); border-color: #F3E6BB; }
.sim-result {
  background: #15171C; color: #E9ECF2; border-radius: 10px; padding: 12px 14px;
  font-family: var(--mono); font-size: 12px; line-height: 1.7; white-space: pre-wrap;
  min-height: 74px; word-break: break-all;
}
.sim-result .ok { color: #7BE0A8; }
.sim-result .bad { color: #FF9B90; }

/* 骑手表：状态点 */
.st { display: inline-flex; align-items: center; gap: 5px; font-size: 12.5px; font-weight: 600; }
.st::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: currentColor; }
.st.on { color: var(--green); }
.st.late { color: var(--orange); }
.st.absent { color: var(--red); }
.st.leave { color: var(--blue); }

/* 骑手端手机页 */
.rider-body {
  background: #F5F6F9; max-width: 480px; margin: 0 auto; min-height: 100vh;
  padding-bottom: 76px; position: relative;
}
.rider-hero {
  background: linear-gradient(150deg,#FFD84D,#FFC400);
  padding: 20px 18px 22px; border-radius: 0 0 22px 22px;
}
.rider-hero .who { font-size: 24px; font-weight: 750; letter-spacing: -.4px; color: #241C00; }
.rider-hero .meta { font-size: 12.5px; color: #6B4E00; opacity: .85; margin-top: 3px; }
.rider-card { background: #fff; border-radius: 14px; margin: 12px; padding: 15px; }
.rider-big-btn {
  height: 58px; border-radius: 14px; display: grid; place-items: center;
  font-size: 18px; font-weight: 700; background: #1B1E24; color: #fff; cursor: pointer;
  user-select: none; transition: transform .08s;
}
.rider-big-btn:active { transform: scale(.985); }
.rider-big-btn.done { background: #fff; color: var(--green); border: 1.5px solid #BFE7D2; }
.rider-big-btn.warn { background: var(--orange); }
.rider-nav {
  position: fixed; bottom: 0; left: 50%; transform: translateX(-50%);
  width: 100%; max-width: 480px; height: 62px; background: #fff;
  border-top: 1px solid var(--line); display: flex; z-index: 20;
}
.rider-nav div { flex: 1; display: grid; place-items: center; gap: 3px; font-size: 10.5px; color: var(--ink3); cursor: pointer; }
.rider-nav div.on { color: var(--ink); font-weight: 650; }
.rider-nav svg { width: 20px; height: 20px; }
.rider-row { display: flex; align-items: center; gap: 10px; padding: 11px 0; border-bottom: 1px solid var(--line2); font-size: 13.5px; }
.rider-row:last-child { border-bottom: 0; }
.rider-kv { display: flex; justify-content: space-between; padding: 7px 0; font-size: 13px; }
.rider-kv .k { color: var(--ink3); }
.rider-kv .v { font-weight: 650; font-variant-numeric: tabular-nums; }
.rider-sec { font-size: 12px; color: var(--ink3); margin: 16px 16px 6px; }

.pick-list { max-height: 190px; overflow-y: auto; border: 1px solid var(--line); border-radius: 10px; }
.pick-item { display: flex; align-items: center; gap: 8px; padding: 8px 11px; font-size: 13px; cursor: pointer; border-bottom: 1px solid var(--line2); }
.pick-item:last-child { border-bottom: 0; }
.pick-item:hover { background: #FAFBFD; }
.pick-item.on { background: var(--brand-bg); font-weight: 650; }

/* 骑手端「申诉」小按钮 */
.rider-mini {
  border: 1px solid var(--line, #E6EAF1);
  background: #fff;
  color: var(--ink2, #4C5566);
  font-size: 12px;
  padding: 4px 10px;
  border-radius: 999px;
  cursor: pointer;
  flex: none;
  transition: .15s;
}
.rider-mini:hover { border-color: var(--brand, #FFC400); background: #FFFDF4; color: var(--ink, #15171C); }
.rider-mini:active { transform: scale(.96); }

/* 出勤分析的筛选控件 */
.inp-inline {
  border: 1px solid var(--line, #E6EAF1);
  border-radius: 8px;
  padding: 6px 10px;
  font-size: 13px;
  color: var(--ink, #15171C);
  background: #fff;
  font-family: inherit;
}
.inp-inline:focus { outline: none; border-color: var(--brand, #FFC400); box-shadow: 0 0 0 3px rgba(255,196,0,.15); }
tr.clickable { cursor: pointer; }
tr.clickable:hover { background: #FFFDF4; }

/* KPI 卡片上的「?」提示 */
.kpi-q {
  display: inline-flex; align-items: center; justify-content: center;
  width: 14px; height: 14px; border-radius: 50%;
  background: var(--line, #E6EAF1); color: var(--ink3, #98A2B3);
  font-size: 10px; font-weight: 700; margin-left: 4px;
  cursor: help; vertical-align: 1px;
}
.kpi-q:hover { background: var(--brand, #FFC400); color: #15171C; }