/* ═════════ 手机端适配（2026-10-01 mobile-1），最后加载 ═════════ */

@media (max-width: 850px) {
  section[id] { scroll-margin-top: 76px; }
}

@media (max-width: 760px) {
  /* section 自身带 .page-width 时，section-pad 会把左右内边距清零，这里补回来 */
  section.page-width.section-pad { padding-inline: 18px; }

  /* ── 评价区：单栏，参照官网手机版 ── */
  .reviews-block { padding: 40px 0; }
  .reviews-block h2 { margin-bottom: 18px; }
  .reviews-layout { grid-template-columns: minmax(0, 1fr); gap: 26px; }
  .reviews-sidebar { gap: 18px; }

  .score-box { grid-template-columns: auto 1fr; align-items: center; column-gap: 16px; row-gap: 2px; }
  .score-box strong { grid-row: 1 / 3; font-size: 56px; }
  .score-box .stars { justify-self: end; font-size: 24px; letter-spacing: 2px; color: #e8a33c; }
  .score-box small { justify-self: end; }

  /* 星级分布与下方「按星级筛选」重复，手机上只留筛选 */
  .histogram { display: none; }

  .dimensions { gap: 12px; padding: 16px 0; }
  .dim-row { font-size: 15px; }

  /* 筛选：标签在左，控件在右 */
  .filter-block:has(.filter-select) { grid-template-columns: auto minmax(0, 1fr); align-items: center; gap: 16px; }
  .filter-select { min-height: 46px; font-size: 15px; }

  /* 星级筛选：横向小标签，可左右滑 */
  .star-filter { position: relative; display: flex; gap: 8px; overflow-x: auto; margin-inline: -18px; padding: 2px 18px 4px; scrollbar-width: none; }
  .star-filter::-webkit-scrollbar { display: none; }
  .star-filter li { position: relative; flex: none; }
  .star-filter label {
    display: inline-flex; align-items: center; gap: 6px; min-height: 40px; padding: 0 14px;
    border: 1px solid var(--line); border-radius: 999px; background: #fff; transition: .18s;
  }
  .star-filter label:has(input:checked) { background: var(--deep); border-color: var(--deep); color: #fff; }
  .star-filter label:has(input:checked) .star-filter-count { color: rgba(255,255,255,.75); }
  .star-filter label:has(input:focus-visible) { outline: 2px solid var(--green); outline-offset: 2px; }
  .star-filter input { position: absolute; opacity: 0; width: 1px; height: 1px; pointer-events: none; }
  .star-filter-bar { display: none; }
  .star-filter-stars { font-size: 13px; }
  .star-filter-count { text-align: left; }

  .verified-note { padding: 14px; background: #fff; border: 1px solid var(--line); }

  /* 评价列表 */
  .reviews-subhead { margin-bottom: 8px; }
  .review { padding: 20px 0; }
  .review-stars { font-size: 20px; gap: 4px; }
  .review-title { font-size: 15.5px; line-height: 1.5; margin: 10px 0 12px; }
  .review-meta { gap: 6px 12px; font-size: 12.5px; }
  /* 第一行：技师 + 项目；第二行：作者 · 日期 · 已验证 */
  .review-meta::before { content: ''; order: 3; flex-basis: 100%; height: 0; }
  .review-meta .review-employee { order: 1; }
  .review-meta .review-bubble { order: 2; line-height: 1.4; }
  .review-meta .review-author { order: 4; }
  .review-meta .review-date { order: 5; }
  .review-meta .review-verified { order: 6; margin-left: auto; }
  .review-reply-toggle { display: inline-flex; align-items: center; min-height: 40px; margin-top: 4px; padding-left: 12px; border-left: 2px solid #e8a33c; color: #c98a1e; text-decoration: none; font-weight: 600; }
  .review-reply { padding: 14px 16px; }

  .pagination { gap: 2px; margin-top: 22px; }
  .page-item { min-width: 40px; min-height: 40px; }

  /* ── 页脚预约按钮：去掉浏览器默认按钮底色 ── */
  .footer-bottom .text-link { border: 0; border-bottom: 1px solid currentColor; background: none; padding: 6px 0; color: #fff; }

  /* ── 门店简介正文 ── */
  .info-description p { font-size: 14.5px; line-height: 1.65; overflow-wrap: anywhere; }

  /* ── 服务详情弹窗：手机上铺满全屏，底部按钮固定 ── */
  .svc-modal-backdrop { padding: 0; }
  .svc-modal { width: 100%; max-height: 100dvh; height: 100dvh; border-radius: 0; }
  .svc-modal-hero { min-height: 220px; }
}

@media (max-width: 380px) {
  section.page-width.section-pad { padding-inline: 14px; }
  .star-filter { margin-inline: -14px; padding-inline: 14px; }
  .score-box strong { font-size: 48px; }
  .score-box .stars { font-size: 20px; }
  .filter-block:has(.filter-select) { grid-template-columns: minmax(0, 1fr); gap: 8px; }
}

/* ═════════ 预约流程（2026-10-01 booking-1）：所有宽度通用 ═════════ */

/* 第一步：分类标签 + 折叠服务 */
.flow-cat-chips { margin: 0 0 14px; }
.flow-picker-item { padding: 0; }
.flow-picker-head {
  width: 100%; display: grid; grid-template-columns: minmax(0, 1fr) auto 22px; align-items: center; gap: 4px 12px;
  margin: 0; padding: 14px 4px; border: 0; background: none; color: var(--ink); text-align: left; cursor: pointer;
}
.flow-picker-head strong { grid-column: 1; }
.flow-picker-head span { grid-column: 1; grid-row: 2; white-space: normal; font-size: 13px; }
.flow-picker-head .flow-picked { color: var(--green); font-weight: 600; }
.flow-picker-chevron { grid-column: 3; grid-row: 1 / 3; font-style: normal; font-size: 18px; color: var(--green); text-align: center; transition: transform .25s; }
.flow-picker-item.open .flow-picker-chevron { transform: rotate(180deg); }
.flow-picker-item.picked .flow-picker-head strong { color: var(--deep); }
.flow-picker-head:focus-visible { outline: 2px solid var(--green); outline-offset: 2px; border-radius: 6px; }
.flow-picker-item .flow-picker-options { padding: 0 4px 14px; }

/* 第二步：休息日置灰 */
.calendar-grid button.off { color: rgba(29,45,37,.28); background: repeating-linear-gradient(135deg, transparent 0 5px, rgba(29,45,37,.05) 5px 6px); cursor: not-allowed; }

/* 第二步：上午 / 下午 / 晚上 */
.slot-hint { margin: 0 0 6px; font-size: 13px; color: rgba(29,45,37,.6); }
.slot-chosen { color: var(--green) !important; font-weight: 700 !important; }
.slot-periods { display: grid; grid-template-columns: repeat(auto-fit, minmax(0, 1fr)); gap: 6px; margin: 0 0 12px; padding: 4px; border-radius: 12px; background: var(--mint); }
.slot-periods button {
  min-height: 42px; border: 0; border-radius: 9px; background: transparent; color: var(--ink);
  font-size: 13.5px; font-weight: 600; cursor: pointer; transition: .18s;
}
.slot-periods button em { margin-left: 6px; font-style: normal; font-weight: 400; font-size: 12px; color: rgba(29,45,37,.55); }
.slot-periods button.active { background: #fff; box-shadow: 0 1px 4px rgba(29,45,37,.12); color: var(--deep); }
.slot-periods button:focus-visible { outline: 2px solid var(--green); outline-offset: 1px; }
.slot-grid .slot-empty { grid-column: 1 / -1; }

/* 手机菜单：语言 */
.mobile-lang { display: flex; gap: 6px; padding: 10px 0 4px; border-top: 1px solid var(--line); margin-top: 6px; }
.mobile-lang button {
  flex: 1; min-height: 42px; border: 1px solid var(--line); border-radius: 999px;
  background: #fff; color: var(--ink); font-size: 13.5px; font-weight: 600; justify-content: center;
}
.mobile-lang button.active { background: var(--deep); border-color: var(--deep); color: #fff; }

@media (max-width: 760px) {
  .flow-cat-chips { margin-inline: -22px; padding-inline: 22px; }
  .flow-picker-item .flow-picker-options { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .slot-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 6px; }
  .slot-grid button { min-height: 44px; padding: 8px 2px; font-size: 14px; }
}
@media (max-width: 380px) {
  .slot-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

/* 预约流程“返回”按钮：去掉浏览器默认按钮底色 */
.flow-v2-actions button.text-link { border: 0; border-bottom: 1px solid currentColor; border-radius: 0; background: none; padding: 6px 0; }