/* 任务详情页通用样式（对齐 `任务详情-temp.html` 视觉体系）
 * 引入顺序建议：organizer-common.css -> design-tokens.css -> task-detail-common.css -> 页面局部 style
 */

/* 底栏 #grab-dock DOM 规范与 .preview-wrap 叠放：见 organizer-common.css（.preview-wrap > .grab-bottom-dock） */
/* 滑动条轨道 / 拇指 / 提示文案：已在 organizer-common.css 统一，此处不再重复覆盖 */

/*
 * grab-dock 默认顶栏透明 + ::before 渐变；改为顶栏与弧底均为同一主色实底（无渐变拼接）。
 */
body.organizer-app .phone-shell--sub:has(> .frame.frame--grab-dock)::before {
  height: var(--grab-dock-hero-bg-height);
  background: var(--primary);
  border-radius: 0 0 var(--grab-dock-hero-curve-rx) var(--grab-dock-hero-curve-rx) / 0 0 var(--grab-dock-hero-curve-ry)
    var(--grab-dock-hero-curve-ry);
  box-shadow: var(--shadow-brand-soft);
}

body.organizer-app .phone-shell--sub:has(> .frame.frame--grab-dock) > header.sub-nav.sub-nav--gradient {
  background: var(--primary);
  border-bottom: none;
  box-shadow: none;
}

/* 与任务卡 detail-card__head 一致：区块标题下 var(--split) 分隔线（覆盖 grab-dock 对 .detail-section-title 的去线） */
body.organizer-app .frame--grab-dock .detail-card--section > .detail-section-title {
  border-bottom: 1px solid var(--split);
  padding-bottom: var(--task-detail-section-title-pad-bottom);
  margin-bottom: var(--task-detail-section-title-margin-bottom);
}

/* 标题行：主标题 + 右侧灰色副提示（与单独标题同一底部分割线） */
.detail-card--section > .detail-section-title-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  flex-wrap: wrap;
  margin: 0 0 12px;
  padding-bottom: 10px;
  border-bottom: 1px solid var(--split);
}

.detail-card--section > .detail-section-title-row > .detail-section-title {
  margin: 0;
  padding-bottom: 0;
  border-bottom: none;
  flex: 1 1 auto;
  min-width: 0;
}

.detail-card--section > .detail-section-title-row > .detail-section-subhint {
  margin: 0;
  flex: 0 1 auto;
  max-width: min(240px, 58%);
  text-align: right;
  font-size: 12px;
  line-height: 1.45;
  color: var(--text-3);
}

body.organizer-app .frame--grab-dock .detail-card--section > .detail-section-title-row {
  padding-bottom: var(--task-detail-section-title-pad-bottom);
  margin: 0 0 var(--task-detail-section-title-margin-bottom) 0;
}

body.organizer-app .frame--grab-dock .detail-card--section > .detail-section-title-row > .detail-section-title {
  margin-bottom: 0;
}

/* 组队信息卡内：组队模式说明提示条（位于「所需人数」行上方，与半屏 tip-banner 同源样式） */
#team-card .team-card__mode-tip,
#pure-sn-team .team-card__mode-tip {
  margin: 0 0 12px;
}

/* 纯收纳主详情 `#pure-sn-team`：队员视角（`data-pure-view="member"` + `aria-label` 由 sync 写入） */
#pure-sn-team[data-pure-view="member"] #pure-sn-btn-edit-way {
  display: none !important;
}
#pure-sn-team[data-pure-view="member"] .pure-sn-team__pick-actions {
  display: none !important;
}
#pure-sn-team[data-pure-view="member"] .detail-row__value--team-way {
  justify-content: flex-start;
}
#pure-sn-team[data-pure-view="member"] .detail-row__value--team-way #pure-sn-fact-way {
  flex: 1 1 auto;
  white-space: normal;
}

/* 组队信息卡：右侧数值列左对齐；组队方式行中文案靠左、操作按钮仍靠右（队长详情 #team-card + 纯收纳主详情 #pure-sn-team） */
#team-card .detail-row__value,
#pure-sn-team.pure-sn-team .detail-row__value {
  text-align: left;
}

/* 组队方式行：左标签与右侧「文案 + 按钮」垂直居中对齐在同一基线高度 */
#team-card .detail-row--team-way-row,
#pure-sn-team.pure-sn-team .detail-row--team-way-row {
  align-items: center;
}

#team-card .detail-row__value--team-way,
#pure-sn-team.pure-sn-team .detail-row__value--team-way {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: flex-start;
  gap: 8px;
  flex-wrap: nowrap;
  min-width: 0;
  text-align: left;
  word-break: normal;
}

#team-card .detail-row__value--team-way #team-way,
#pure-sn-team.pure-sn-team .detail-row__value--team-way #pure-sn-fact-way {
  flex: 1 1 auto;
  min-width: 0;
  text-align: left;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  line-height: 1.45;
}

/* 覆盖 organizer-common 中 .btn-secondary 的 block + 100% 高，与文案同一水平线、右侧小 pill */
/* 组队信息 · 所需人数：跳转绑定收纳师（文案 + 右侧箭头） */
#team-card a.detail-row__value--bind-link,
#pure-sn-team.pure-sn-team a.detail-row__value--bind-link,
section.detail-card--section[aria-label*="组队信息"] a.detail-row__value--bind-link {
  text-decoration: none;
  color: inherit;
  width: 100%;
  min-width: 0;
  align-items: center;
  -webkit-tap-highlight-color: transparent;
}

#team-card a.detail-row__value--bind-link:active,
#pure-sn-team.pure-sn-team a.detail-row__value--bind-link:active,
section.detail-card--section[aria-label*="组队信息"] a.detail-row__value--bind-link:active {
  opacity: 0.82;
}

/* 右箭头：队长卡 / 纯收纳主详情 / 队员与绑定等组队信息区复用 */
.detail-row__bind-chevron {
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--text-3);
  margin-left: 4px;
}

.detail-row__bind-chevron svg {
  display: block;
}

/* 绑定态组队卡：网格 team-fact 内的「所需人数」跳转 */
.team-fact__v.team-fact__v--bind-link {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 6px;
  text-decoration: none;
  color: inherit;
  -webkit-tap-highlight-color: transparent;
}

.team-fact__v.team-fact__v--bind-link:active {
  opacity: 0.82;
}

.team-fact__v--bind-link .team-fact__v-main {
  min-width: 0;
}

#team-card .detail-row__value--team-way button.btn-secondary.btn-secondary--inline,
#pure-sn-team.pure-sn-team .detail-row__value--team-way button.btn-secondary.btn-secondary--inline {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: auto !important;
  max-width: none;
  margin-left: auto;
  margin-top: 0;
  height: 28px !important;
  min-height: 0 !important;
  padding: 0 10px !important;
  line-height: 1 !important;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 600;
  white-space: nowrap;
  box-sizing: border-box;
  -webkit-tap-highlight-color: transparent;
}

/* 区块标题下灰色小字（紧跟 .detail-section-title，独立一行时在标题下方） */
.detail-card--section > .detail-section-subhint {
  margin: -6px 0 14px;
  font-size: 12px;
  line-height: 1.45;
  color: var(--text-3);
}

/* 主信息卡：标题区与首行（预约时间）之间分隔线（覆盖 grab-dock 对 head 的去线） */
body.organizer-app .frame--grab-dock .detail-card--task .detail-card__head {
  border-bottom: 1px solid var(--split);
}

/* 任务信息卡：右侧主文案 13px（覆盖 organizer-common 默认 14px） */
body.organizer-app .frame--grab-dock .detail-card--task .detail-row__value,
body.organizer-app .frame--grab-dock .detail-card--task .detail-row__text-main {
  font-size: var(--task-detail-main-value-fs);
}

/* 搬出/搬入等带地图图标行：多行地址时与图标顶部对齐（覆盖 icon-act 内垂直居中） */
body.organizer-app .frame--grab-dock .detail-card--task .detail-row__value--with-icon {
  align-items: flex-start;
}
body.organizer-app .frame--grab-dock .detail-card--task .detail-row__value--with-icon .detail-row__text-main {
  align-self: flex-start;
}
body.organizer-app .frame--grab-dock .detail-card--task .detail-row__value--with-icon .detail-row__icon-stack {
  display: inline-flex;
  gap: var(--task-detail-icon-stack-gap);
  flex-shrink: 0;
  align-self: flex-start;
  align-items: flex-start;
}
body.organizer-app .frame--grab-dock .detail-card--task .detail-row__value--with-icon .detail-row__icon-act {
  align-items: flex-start;
  justify-content: center;
  padding-top: var(--task-detail-icon-act-padding-top);
}

/* 任务进度：药丸统一白底 + 描边（含当前步） */
.task-detail-progress {
  display: grid;
  grid-template-columns: repeat(var(--task-detail-progress-cols), minmax(0, 1fr));
  gap: var(--task-detail-grid-gap);
  margin-bottom: 0;
}
.task-detail-progress span,
.task-detail-progress a.task-detail-progress__link {
  margin: 0;
  padding: var(--task-detail-pill-padding-y) var(--task-detail-pill-padding-x);
  font-size: var(--task-detail-dense-fs);
  line-height: var(--task-detail-dense-line-height);
  text-align: center;
  color: var(--text-2);
  background: var(--card);
  border-radius: var(--radius-sm);
  border: 1px solid var(--page-bg);
  height: var(--task-detail-pill-height);
  display: flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
}
.task-detail-progress a.task-detail-progress__link {
  text-decoration: none;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}
.task-detail-progress a.task-detail-progress__link:active {
  opacity: 0.92;
}

/* 与抢单列表 grab-card--v2 徽章同源；标题与标签同一行，标签靠右 */
.detail-card--task .detail-card__head-row {
  align-items: center;
}
.detail-card--task .detail-card__head .detail-card__tags.grab-card--v2 {
  margin-top: 0;
  flex-shrink: 0;
  flex-wrap: nowrap;
  align-items: center;
  gap: 6px;
}
.detail-card--task .detail-card__tag-with-action {
  display: inline-flex;
  align-items: center;
  gap: 2px;
  flex-shrink: 0;
}
.detail-card--task .detail-card__tag-with-action .detail-row__icon-act {
  width: 28px;
  height: 28px;
  padding: 0;
  color: var(--primary);
}

/* 任务列表/详情共用：绑定徽标（中性紫，避免与主色抢单/指派冲突） */
body.organizer-app .grab-card--v2 .grab-card__badge--bound,
body.organizer-app .detail-card__tags.grab-card--v2 .grab-card__badge--bound {
  color: #6d28d9;
  background: rgba(109, 40, 217, 0.1);
  border-color: rgba(109, 40, 217, 0.22);
}

.task-detail-main__foot-pills {
  display: flex;
  flex-wrap: wrap;
  gap: var(--task-detail-foot-pills-gap);
  padding: var(--task-detail-foot-pills-padding-top) 0 var(--task-detail-foot-pills-padding-bottom);
  border-top: 1px solid var(--split);
  margin-top: var(--task-detail-foot-pills-margin-top);
}

/* 主信息卡底部里程 pill：与 grab-card--v2 统计条视觉一致（类选择器在卡外无效，故在此复刻语义） */
.task-detail-main__foot-pills .grab-card__stat-pill {
  display: inline-flex;
  align-items: center;
  gap: var(--task-detail-stat-pill-gap);
  background: var(--page-bg);
  color: var(--text-2);
  font-size: var(--task-detail-dense-fs);
  padding: var(--task-detail-stat-pill-padding-y) var(--task-detail-stat-pill-padding-x);
  border-radius: var(--radius-xs);
}

.task-detail-op-grid {
  display: grid;
  grid-template-columns: repeat(var(--task-detail-op-cols), minmax(0, 1fr));
  gap: var(--task-detail-grid-gap);
  margin-bottom: 0;
}

/* 与 .task-detail-progress span 同网格、同色、同字号与药丸尺寸 */
.task-detail-op-grid .btn-secondary {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  box-sizing: border-box;
  margin: 0;
  padding: var(--task-detail-pill-padding-y) var(--task-detail-pill-padding-x);
  height: var(--task-detail-pill-height);
  min-height: var(--task-detail-pill-height);
  font-size: var(--task-detail-dense-fs);
  font-weight: var(--font-weight-normal);
  line-height: var(--task-detail-dense-line-height);
  text-align: center;
  color: var(--text-2);
  background: var(--card);
  border: 1px solid var(--page-bg);
  border-radius: var(--radius-sm);
}

.task-detail-fee-block {
  font-size: var(--task-detail-dense-fs);
  color: var(--text-2);
  line-height: var(--task-detail-fee-line-height);
  margin: 0;
}
.task-detail-fee-block ol {
  margin: var(--task-detail-fee-ol-margin-top) 0 0;
  padding-left: 1.25em;
}
.task-detail-fee-block li {
  margin-bottom: var(--task-detail-fee-li-margin-bottom);
}
.task-detail-fee-foot {
  border-top: none;
  padding-top: 0;
  margin-top: var(--task-detail-fee-foot-margin-top);
}