/* ===== 服务管理 - 洗护设置 ===== */
    .service-groom-settings-page {
      height: 100%; background: #f3f5f7; padding: 14px 16px 0;
      display: flex; flex-direction: column; overflow: hidden;
    }
    .service-groom-settings-page[data-sgs-tab="groomer"] { padding-bottom: 14px; }
    .sgs-card {
      flex: 1; min-height: 0; background: #fff; border-radius: 8px;
      display: flex; flex-direction: column; overflow: hidden;
    }

    /* ===== 美容师设置页头部（从洗护单进入的子页） ===== */
    .gmr-head {
      flex-shrink: 0; height: 48px; display: flex; align-items: center;
      justify-content: space-between; gap: 16px; padding: 0 20px;
      border-bottom: 1px solid #edf0f2;
    }
    .gmr-breadcrumb { display: flex; align-items: center; gap: 7px; color: #9aa0a8; font-size: 12.5px; }
    .gmr-breadcrumb button {
      border: none; background: transparent; padding: 0; cursor: pointer;
      color: #2f7d5b; font-size: 12.5px; font-family: inherit;
    }
    .gmr-breadcrumb button:hover { text-decoration: underline; }
    .gmr-breadcrumb strong { color: #4b5563; font-weight: 500; }
    .gmr-back {
      flex-shrink: 0; height: 30px; padding: 0 14px; border-radius: 6px;
      border: 1px solid #e4e7eb; background: #fff; color: #4b5563;
      font-size: 12.5px; font-family: inherit; cursor: pointer; transition: all .15s;
    }
    .gmr-back:hover { border-color: var(--brand); color: var(--brand); }

    /* ===== 门店级开关条：客户指定美容师（正式产品默认关闭；demo 默认开启） ===== */
    .gmr-feature {
      flex-shrink: 0; display: flex; align-items: center; gap: 16px;
      padding: 11px 20px; border-bottom: 1px solid #edf0f2; background: #fbfcfd;
    }
    .gmr-feature-main { flex: 1; min-width: 0; }
    .gmr-feature-title {
      display: flex; align-items: center; gap: 8px;
      font-size: 13.5px; font-weight: 600; color: #2f343b;
    }
    .gmr-feature-state {
      display: inline-flex; align-items: center; height: 20px; padding: 0 9px;
      border-radius: 10px; background: #f2f4f6; color: #6b7280;
      font-size: 11.5px; font-weight: 400;
    }
    .gmr-feature[data-enabled="1"] .gmr-feature-state { background: #e8f5ee; color: #3a9a6a; }
    .gmr-feature-desc { margin-top: 3px; font-size: 12px; color: #8f97a3; line-height: 1.5; }
    .gmr-switch { position: relative; flex-shrink: 0; display: inline-flex; cursor: pointer; }
    .gmr-switch input {
      position: absolute; inset: 0; width: 100%; height: 100%; margin: 0;
      opacity: 0; cursor: pointer;
    }
    .gmr-switch-track {
      display: block; position: relative; width: 46px; height: 24px;
      border-radius: 150px; background: #d7dce1; transition: background .18s;
    }
    .gmr-switch-track::after {
      content: ''; position: absolute; top: 2px; left: 2px;
      width: 20px; height: 20px; border-radius: 50%; background: #fff;
      box-shadow: 0 1px 3px rgba(15, 23, 42, .22); transition: transform .18s;
    }
    .gmr-switch input:checked + .gmr-switch-track { background: var(--brand); }
    .gmr-switch input:checked + .gmr-switch-track::after { transform: translateX(22px); }
    .gmr-switch input:focus-visible + .gmr-switch-track { box-shadow: 0 0 0 3px rgba(76, 175, 130, .25); }

    /* ===== Tab 栏 ===== */
    .sgs-tabs {
      flex-shrink: 0; height: 52px; display: flex; align-items: center; gap: 6px;
      padding: 0 20px; border-bottom: 1px solid #edf0f2;
    }
    .sgs-tab {
      position: relative; height: 100%; padding: 0 20px; border: none; background: transparent;
      color: #4b5563; font-size: 14px; font-family: inherit; cursor: pointer;
    }
    .sgs-tab:hover { color: var(--brand); }
    .sgs-tab.active { color: #111827; font-weight: 700; }
    .sgs-tab.active::after {
      content: ''; position: absolute; left: 20px; right: 20px; bottom: -1px; height: 2px;
      border-radius: 2px; background: var(--brand);
    }
    .sgs-panels { flex: 1; min-height: 0; display: flex; }
    .sgs-panel { display: none; flex: 1; min-width: 0; min-height: 0; }
    .sgs-panel.active { display: flex; flex-direction: column; }
    .sgs-panel-scroll { flex: 1; min-height: 0; overflow: auto; padding: 24px 36px 28px; }
    .sgs-panel-scroll.groomer {
      display: flex; flex-direction: column; padding: 16px 32px 0; overflow: hidden;
    }

    /* ===== Tab 1: 美容师列表（卡片网格，单行 4 张） ===== */
    .sgs-groomer-grid {
      flex: 1; min-height: 0; overflow-y: auto; overflow-x: hidden;
      display: grid; grid-template-columns: repeat(4, minmax(0, 1fr));
      gap: 12px; padding: 2px 2px 14px; align-content: start;
    }
    /* 默认单行 4 张；仅在窄视口降列，保证演示大屏一律 4 列 */
    @media (max-width: 1024px) { .sgs-groomer-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
    @media (max-width: 768px) { .sgs-groomer-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
    /* 筛选后一个都不剩时的整行占位（网格子项，跨满一行；隐藏时不占位） */
    .sgs-groomer-empty {
      grid-column: 1 / -1; padding: 46px 0; text-align: center;
      color: #c3c8cf; font-size: 13px;
    }
    .gm-card {
      background: #fff; border: 1px solid #e7ebef; border-radius: 10px;
      padding: 13px 14px; display: flex; flex-direction: column; gap: 11px;
      transition: box-shadow .16s, border-color .16s;
    }
    .gm-card:hover { border-color: #cfe3d8; box-shadow: 0 4px 14px rgba(15, 23, 42, .07); }
    .gm-card.is-busy { border-color: #f2ddb8; background: #fffdf8; }
    .gm-card.is-busy .sgs-groomer-avatar { background: #fff3e0; color: #c87d00; }
    .gm-head { display: flex; align-items: center; gap: 10px; }
    .gm-ident { flex: 1; min-width: 0; }
    .gm-name {
      font-size: 15px; font-weight: 600; color: #1f2937;
      white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
    }
    .gm-check {
      width: 15px; height: 15px; accent-color: var(--brand); cursor: pointer;
      flex-shrink: 0; align-self: flex-start; margin-top: 1px;
    }
    .sgs-groomer-avatar {
      width: 38px; height: 38px; border-radius: 50%; flex-shrink: 0;
      background: #eaf7ef; color: #3a9a6a; font-size: 15px; font-weight: 700;
      display: flex; align-items: center; justify-content: center;
    }
    /* 名字正下方一行放「接单状态 + 当前工作状态」：两者都是当前状态的短标签，跟着名字走 */
    .gm-tags { display: flex; align-items: center; gap: 6px; flex-wrap: nowrap; margin-top: 5px; }
    .gm-work {
      display: inline-flex; align-items: center; justify-content: center; height: 24px;
      padding: 0 8px; border-radius: 3px; font-size: 12px;
      background: #fff5e6; color: #c87d00;
    }
    /* 右上角「请假」标签：临时休息不是常驻信息，没设休息就整块不占位（显隐由 inline style 控制） */
    .gm-leave {
      flex-shrink: 0; display: inline-flex; align-items: center; height: 22px; padding: 0 9px;
      border-radius: 11px; background: #fff8ee; border: 1px solid #f3ddb8;
      color: #c87d00; font-size: 11.5px; white-space: nowrap;
    }
    /* 当日已被预约的时段明细：一行两个「序号 + 时段 + 宠物名」，最多 5 行（10 格）。
       常规 4~6 单只占 2~3 行，比单行排布矮一半；超出上限时最后一格收成「还有 N 条」。 */
    .gm-bookings { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 4px 6px; }
    .gm-bk {
      display: flex; align-items: center; gap: 5px; height: 24px; padding: 0 6px;
      border-radius: 4px; background: #f6f8fa; font-size: 11.5px; color: #4b5563;
    }
    .gm-bk.serving { background: #fffaf2; }
    .gm-bk i {
      flex-shrink: 0; width: 14px; height: 14px; border-radius: 50%; font-size: 9.5px; font-style: normal;
      display: inline-flex; align-items: center; justify-content: center;
      background: #e6effc; color: #5f7cff;
    }
    .gm-bk.serving i { background: #ffe9c9; color: #c87d00; }
    .gm-bk-time { flex-shrink: 0; font-size: 11px; font-variant-numeric: tabular-nums; }
    .gm-bk-pet {
      flex: 1; min-width: 0; color: #1f2937;
      white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
    }
    .gm-bk-more { justify-content: center; background: transparent; color: #8a9099; font-size: 11px; }
    .gm-bk-empty { grid-column: 1 / -1; display: flex; align-items: center; height: 24px; font-size: 12px; color: #b8bfc6; }
    .gm-actions { display: flex; gap: 6px; padding-top: 11px; border-top: 1px solid #f2f4f6; }
    .gm-actions .sg-action { flex: 1; height: 28px; border-radius: 14px; }
    .sgs-status {
      display: inline-flex; align-items: center; justify-content: center; height: 24px;
      min-width: 56px; padding: 0 8px; border-radius: 3px; font-size: 12px;
    }
    .sgs-status.on { background: #ecfff1; color: var(--brand); }
    .sgs-status.idle { background: #fff5e6; color: #c87d00; }
    .sgs-status.off { background: #f2f4f6; color: #9aa0a8; }
    /* 卡片不再用单一「占用标签」——当前状态（可接单/服务中/请假）与预约明细分层表达 */
    .sgs-form {
      width: 100%; max-width: 1600px; display: flex; flex-direction: column; gap: 26px;
    }
    .sgs-row {
      display: grid; grid-template-columns: 170px minmax(0, 1fr); align-items: flex-start;
      column-gap: 28px; margin-bottom: 0;
    }
    .sgs-label {
      min-height: 40px; display: flex; align-items: center; justify-content: flex-end;
      font-size: 14px; color: #111827;
    }
    .sgs-input-group {
      width: 460px; height: 40px; display: grid; grid-template-columns: 1fr 48px;
      border: 1px solid #d9dce0; border-radius: 20px; overflow: hidden; background: #fff;
    }
    .sgs-input-group input {
      border: none; outline: none; padding: 0 18px; font-size: 14px; color: #111827; font-family: inherit;
    }
    .sgs-input-suffix {
      display: flex; align-items: center; justify-content: center; background: #f1f2f4;
      border-left: 1px solid #d9dce0; color: #111827; font-size: 14px;
    }
    .sgs-week-select {
      min-height: 42px; max-width: 720px; display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
      border: 1px solid #dfe3e8; border-radius: 22px; padding: 6px 42px 6px 12px; background: #fff;
      position: relative;
    }
    .sgs-week-select::after {
      content: ''; position: absolute; right: 18px; top: 50%; transform: translateY(-35%);
      border-left: 5px solid transparent; border-right: 5px solid transparent; border-top: 6px solid #b6bcc5;
    }
    .sgs-week-chip {
      height: 28px; display: inline-flex; align-items: center; gap: 6px; padding: 0 10px;
      border-radius: 15px; background: #f0f2f4; color: #6b7280; font-size: 14px;
      box-shadow: inset 0 0 0 1px #e4e7eb;
    }
    .sgs-week-chip .x {
      width: 18px; height: 18px; border-radius: 50%; background: #d8dde3; color: #8f97a3;
      display: inline-flex; align-items: center; justify-content: center; font-size: 14px; line-height: 1;
    }
    .sgs-section-card {
      max-width: 960px; background: #f7f9fb; border: 1px solid #e7ebef; border-radius: 8px;
      overflow: hidden;
    }
    .sgs-template-panel {
      max-width: 960px; display: flex; flex-direction: column; gap: 14px;
    }
    .sgs-template-grid {
      display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px;
    }
    .sgs-template-card {
      min-height: 92px; border: 1px solid #dfe3e8; border-radius: 10px; background: #fff;
      padding: 14px; display: flex; flex-direction: column; gap: 8px; cursor: pointer;
      position: relative;
    }
    .sgs-template-card.active {
      border-color: #71bf8f; background: #f1fbf5; box-shadow: 0 0 0 2px rgba(113, 191, 143, .12);
    }
    .sgs-template-card.active::after {
      content: '当前使用'; position: absolute; right: 10px; top: 10px; height: 22px; padding: 0 8px;
      border-radius: 11px; background: #71bf8f; color: #fff; font-size: 12px; display: flex; align-items: center;
    }
    .sgs-template-name { font-size: 14px; font-weight: 700; color: #111827; padding-right: 58px; }
    .sgs-template-desc { font-size: 12px; color: #6b7280; line-height: 1.45; }
    .sgs-template-preview {
      border: 1px solid #e7ebef; border-radius: 10px; background: #fff; overflow: hidden;
    }
    .sgs-template-view { display: none; }
    .sgs-template-view.active { display: block; }
    .sgs-template-view.custom.active { width: 560px; }
    .sgs-template-preview-head {
      min-height: 48px; padding: 12px 16px; display: flex; align-items: center; justify-content: space-between;
      border-bottom: 1px solid #e7ebef; gap: 16px;
    }
    .sgs-template-preview-title { font-size: 14px; font-weight: 700; color: #111827; }
    .sgs-template-preview-tip { font-size: 12px; color: #6b7280; line-height: 1.5; text-align: right; }
    .sgs-hour-grid {
      display: grid; grid-template-columns: repeat(8, minmax(0, 1fr)); gap: 8px;
      padding: 14px 16px; background: #f7f9fb;
    }
    .sgs-hour-chip {
      height: 34px; border-radius: 6px; background: #fff; border: 1px solid #e4e7eb;
      display: flex; align-items: center; justify-content: center; color: #333942; font-size: 13px;
    }
    .sgs-capacity-row {
      display: flex; align-items: center; gap: 12px; padding: 14px 16px; border-top: 1px solid #e7ebef;
      background: #fff; font-size: 14px; color: #111827;
    }
    .sgs-capacity-input {
      width: 118px; height: 36px; border: 1px solid #dfe3e8; border-radius: 18px;
      padding: 0 14px; outline: none; font-size: 14px;
    }
    .sgs-template-note {
      color: #8f97a3; font-size: 12px; line-height: 1.5;
    }
    .sgs-template-detail-grid {
      display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px;
    }
    .sgs-template-detail-card {
      border: 1px solid #e7ebef; border-radius: 10px; background: #fff; overflow: hidden;
      min-height: 210px;
    }
    .sgs-template-view.custom .sgs-template-detail-card {
      width: 560px; min-height: auto;
    }
    .sgs-template-detail-head {
      padding: 12px 14px; background: #f7f9fb; border-bottom: 1px solid #e7ebef;
      display: flex; align-items: flex-start; justify-content: space-between; gap: 14px;
    }
    .sgs-template-detail-copy { min-width: 0; }
    .sgs-template-detail-title { font-size: 14px; font-weight: 700; color: #111827; }
    .sgs-template-detail-desc { margin-top: 6px; font-size: 12px; color: #6b7280; line-height: 1.55; }
    .sgs-add-custom-slot {
      flex-shrink: 0; height: 32px; padding: 0 14px; border: none; border-radius: 16px;
      background: #71bf8f; color: #fff; font-size: 13px; cursor: pointer;
      box-shadow: 0 2px 6px rgba(113, 191, 143, .28);
    }
    .sgs-template-slot-list { padding: 12px 14px; display: flex; flex-direction: column; gap: 10px; }
    .sgs-template-slot {
      min-height: 34px; display: grid; grid-template-columns: 1fr 84px; align-items: center;
      gap: 10px; font-size: 13px; color: #333942;
    }
    .sgs-template-slot-time {
      height: 34px; border: 1px solid #e4e7eb; border-radius: 17px; display: flex;
      align-items: center; justify-content: center; background: #fff;
    }
    .sgs-template-slot-count {
      height: 34px; border: 1px solid #e4e7eb; border-radius: 17px; display: flex;
      align-items: center; justify-content: center; color: #6b7280; background: #fff;
    }
    .sgs-custom-slot-table {
      width: 100%; border-collapse: collapse; background: #fff; font-size: 13px;
    }
    .sgs-custom-slot-table.compact {
      width: 560px; table-layout: fixed;
    }
    .sgs-custom-slot-table th {
      height: 42px; background: #f1f4f7; color: #111827; font-weight: 600;
      padding: 0 12px; text-align: left; border-right: 1px solid #e7ebef;
    }
    .sgs-custom-slot-table.compact th:nth-child(1),
    .sgs-custom-slot-table.compact td:nth-child(1) { width: 250px; }
    .sgs-custom-slot-table.compact th:nth-child(2),
    .sgs-custom-slot-table.compact td:nth-child(2) { width: 150px; }
    .sgs-custom-slot-table.compact th:nth-child(3),
    .sgs-custom-slot-table.compact td:nth-child(3) { width: 90px; text-align: left; }
    .sgs-custom-slot-table th:nth-child(2),
    .sgs-custom-slot-table td:nth-child(2) { width: 112px; }
    .sgs-custom-slot-table th:nth-child(3),
    .sgs-custom-slot-table td:nth-child(3) { width: 64px; text-align: center; }
    .sgs-custom-slot-table td {
      height: 54px; padding: 0 12px; border-top: 1px solid #e7ebef; color: #333942;
    }
    .sgs-custom-time-range {
      width: 220px; height: 34px; border: 1px solid #dfe3e8; border-radius: 17px; padding: 0 10px;
      display: grid; grid-template-columns: 1fr 24px 1fr; align-items: center; background: #fff;
    }
    .sgs-custom-time-picker {
      grid-template-columns: 80px 24px 80px;
    }
    .sgs-time-select {
      width: 100%; height: 32px; border: none; outline: none; background: transparent;
      color: #111827; font-size: 13px; font-family: inherit; cursor: pointer;
    }
    .sgs-custom-time-range .to { text-align: center; color: #333942; }
    .sgs-custom-count {
      width: 76px; height: 34px; border: 1px solid #dfe3e8; border-radius: 17px;
      padding: 0 10px; outline: none; font-size: 13px;
    }
    .sgs-section-head {
      height: 52px; display: flex; align-items: center; justify-content: space-between;
      padding: 0 18px; background: #fff; border-bottom: 1px solid #e7ebef;
    }
    .sgs-section-title { font-size: 14px; font-weight: 700; color: #111827; }
    .sgs-add-slot {
      height: 34px; padding: 0 18px; border: none; border-radius: 17px;
      background: #71bf8f; color: #fff; font-size: 14px; cursor: pointer;
    }
    .sgs-slot-table { width: 100%; border-collapse: collapse; background: #fff; font-size: 14px; }
    .sgs-slot-table th {
      height: 48px; background: #f1f4f7; color: #111827; font-weight: 600;
      padding: 0 20px; text-align: left; border-right: 1px solid #e7ebef;
    }
    .sgs-slot-table th:nth-child(2), .sgs-slot-table td:nth-child(2) { width: 220px; }
    .sgs-slot-table th:nth-child(3), .sgs-slot-table td:nth-child(3) { width: 100px; text-align: center; }
    .sgs-slot-table td {
      height: 70px; padding: 0 20px; border-top: 1px solid #e7ebef; color: #333942;
    }
    .sgs-time-range {
      width: 390px; height: 38px; border: 1px solid #dfe3e8; border-radius: 20px;
      display: grid; grid-template-columns: 34px 1fr 32px 1fr; align-items: center;
      padding: 0 14px; color: #333942; background: #fff;
    }
    .sgs-time-range svg { color: #aeb5bf; }
    .sgs-time-range .to { text-align: center; color: #333942; }
    .sgs-count-input {
      width: 140px; height: 38px; border: 1px solid #dfe3e8; border-radius: 20px;
      padding: 0 14px; font-size: 14px; color: #333942; outline: none;
    }
    .sgs-delete-link { color: #58a5ff; cursor: pointer; font-size: 14px; }
    .sgs-radio-line { min-height: 40px; display: flex; align-items: center; gap: 22px; font-size: 14px; color: #111827; }
    .sgs-row.report-advice {
      align-items: flex-start; margin-top: 8px; padding-top: 8px;
    }
    .sgs-radio {
      display: inline-flex; align-items: center; gap: 8px; cursor: pointer;
    }
    .sgs-radio-dot {
      width: 16px; height: 16px; border-radius: 50%; border: 1px solid #d6d9de;
      display: inline-flex; align-items: center; justify-content: center; background: #fff;
    }
    .sgs-radio.active .sgs-radio-dot { border-color: #71bf8f; }
    .sgs-radio.active .sgs-radio-dot::after {
      content: ''; width: 8px; height: 8px; border-radius: 50%; background: #71bf8f;
    }
    .sgs-suggestion-box {
      width: 100%; min-height: 350px; background: #f5f7f9; border-radius: 4px;
      padding: 26px; display: flex; flex-direction: column;
    }
    .sgs-add-btn {
      align-self: flex-start; height: 40px; padding: 0 22px; border: none; border-radius: 20px;
      background: #71bf8f; color: #fff; font-size: 14px; font-weight: 600; cursor: pointer;
      margin-bottom: 12px;
    }
    .sgs-table { width: 100%; border-collapse: collapse; background: #fff; font-size: 14px; }
    .sgs-table th {
      height: 58px; background: #f1f4f7; color: #111827; font-weight: 600;
      padding: 0 20px; text-align: left; border-right: 1px solid #edf0f2;
    }
    .sgs-table th:nth-child(1) { width: 76px; text-align: center; }
    .sgs-table th:nth-child(3) { width: 190px; text-align: center; }
    .sgs-empty {
      height: 186px; display: flex; align-items: center; justify-content: center;
      color: #c3c8cf; font-size: 14px; border-top: 1px solid #edf0f2;
    }
    .sgs-empty-icon {
      width: 76px; height: 48px; margin-right: 10px; color: #d7dbe0;
    }
    .sgs-footer {
      height: 68px; flex-shrink: 0; display: none; align-items: center; justify-content: center;
      gap: 60px; background: #fff; border-top: 1px solid #edf0f2;
    }
    .service-groom-settings-page[data-sgs-tab="settings"] .sgs-footer { display: flex; }
    .sgs-footer-btn {
      min-width: 138px; height: 44px; border-radius: 22px; border: 1px solid #d9dce0;
      background: #fff; color: #111827; font-size: 15px; cursor: pointer;
    }
    .sgs-footer-btn.save {
      border-color: transparent; background: linear-gradient(90deg, #9bd7b4, #69b887);
      color: #fff;
    }

    /* 表格单元格样式 */
    .cell-id { color: var(--blue); cursor: pointer; font-size: 12.5px; }
    .cell-id:hover { text-decoration: underline; }
    .cell-tag {
      display: inline-block;
      padding: 1px 5px;
      border-radius: 3px;
      font-size: 11px;
      margin-top: 2px;
    }
    .tag-expired { background: #fff5e6; color: #c87d00; }
    .cell-link { color: var(--blue); cursor: pointer; font-size: 12.5px; }
    .cell-link:hover { text-decoration: underline; }
    .cell-duration { font-size: 12.5px; color: var(--text-secondary); }
    .sort-icon { font-size: 10px; color: var(--text-muted); cursor: pointer; margin-left: 2px; }

    /* 服务状态 */
    .cell-status {
      display: inline-block;
      padding: 2px 8px;
      border-radius: 10px;
      font-size: 12px;
    }
    .status-pending { background: #fff5e6; color: #c87d00; }
    .status-confirmed { background: #e8f0fb; color: #2a6bc4; }
    .status-completed { background: #e8f5ee; color: #3a9a6a; }
    .status-cancelled { background: #f2f4f3; color: var(--text-muted); }

    /* 操作按钮 */
    .cell-actions { display: flex; gap: 6px; }
    .action-btn {
      padding: 3px 8px;
      border-radius: 3px;
      font-size: 12px;
      cursor: pointer;
      transition: all .15s;
    }
    /* .btn-complete / .btn-report / .btn-more / .btn-view 的配色统一在
       assets/web-ops-camera.css 定义（品牌绿主操作），此处不再重复声明。 */

    /* ===== 美容师：从店员中挑人 + 释放占用 ===== */
    .sg-picker-hint {
      font-size: 13px; color: #4b5563; line-height: 1.7; padding: 10px 12px;
      background: #f6faf8; border: 1px solid #e2efe8; border-radius: 6px; margin-bottom: 12px;
    }
    .sg-picker-hint b { color: var(--brand); font-weight: 500; }
    /* 提示框里的「去创建店员账号」跳转按钮：线框小圆角，hover 反白 */
    .sg-picker-hint-btn {
      display: inline-flex; align-items: center; height: 28px; padding: 0 13px;
      margin-top: 8px; border-radius: 14px; border: 1px solid var(--brand);
      background: #fff; color: var(--brand); font-size: 12.5px; line-height: 1;
      cursor: pointer; transition: background .15s, color .15s;
    }
    .sg-picker-hint-btn:hover { background: var(--brand); color: #fff; }
    .sg-picker-list { display: flex; flex-direction: column; gap: 8px; max-height: 320px; overflow-y: auto; }
    .sg-pool-item {
      display: flex; align-items: center; gap: 10px; padding: 9px 12px;
      border: 1px solid var(--border-light); border-radius: 8px; cursor: pointer;
      transition: all .15s;
    }
    .sg-pool-item:hover { border-color: var(--brand); background: #f8fcfa; }
    .sg-pool-item input { width: 15px; height: 15px; accent-color: var(--brand); cursor: pointer; flex-shrink: 0; }
    .sg-pool-avatar {
      width: 30px; height: 30px; border-radius: 50%; flex-shrink: 0;
      background: #eaf7ef; color: #3a9a6a; font-size: 13px;
      display: flex; align-items: center; justify-content: center;
    }
    .sg-pool-meta { flex: 1; min-width: 0; }
    .sg-pool-name { font-size: 13px; font-weight: 500; color: #1f2937; }
    .sg-picker-empty { font-size: 13px; color: var(--text-muted); text-align: center; padding: 28px 0; }
    #sg-release-modal .form-input { width: 100%; box-sizing: border-box; }
    .sg-rel-target {
      padding: 12px 14px; border-radius: 8px; background: #f6faf8;
      border: 1px solid #e2efe8; margin-bottom: 16px;
    }
    .sg-rel-title { font-size: 14px; font-weight: 500; color: #1f2937; }
    .sg-rel-occ { font-size: 13px; color: #4b5563; margin-top: 6px; }
    .sg-rel-note { font-size: 12px; color: var(--text-muted); margin-top: 6px; line-height: 1.6; }
    .sg-rel-reasons { display: flex; gap: 8px; flex-wrap: wrap; }
    .sg-rel-chip {
      padding: 4px 12px; border: 1px solid var(--border); border-radius: 14px;
      font-size: 12.5px; color: var(--text-secondary); background: #fff;
      cursor: pointer; user-select: none; transition: all .15s;
    }
    .sg-rel-chip:hover { border-color: var(--brand); color: var(--brand); }
    .sg-rel-chip.active { border-color: var(--brand); color: #fff; background: var(--brand); }
    .sg-rel-trace {
      margin-top: 14px; padding-top: 12px; border-top: 1px dashed var(--border-light);
      font-size: 12px; color: var(--text-muted);
    }

    /* 卡片操作里的危险按钮（删除美容师）：弱化成中性小按钮、靠最右，红只在悬停时出现 */
    .gm-actions .sg-action.danger {
      flex: 0 0 auto; padding: 0 11px;
      border-color: #e4e8ec; color: #9aa0a8; box-shadow: none;
    }
    .gm-actions .sg-action.danger:hover { background: #fff5f5; border-color: #f0bdbd; color: #d64545; }

    /* 删除美容师（二次确认） */
    #sg-groomer-del-modal .modal-body { padding: 18px 20px; }
    .sg-del-target { display: flex; align-items: center; gap: 10px; }
    .sg-del-avatar {
      width: 38px; height: 38px; border-radius: 50%; flex-shrink: 0;
      background: #fdecec; color: #d64545; font-size: 15px; font-weight: 600;
      display: flex; align-items: center; justify-content: center;
    }
    .sg-del-meta { min-width: 0; }
    .sg-del-name { font-size: 14px; font-weight: 500; color: #1f2937; }
    .sg-del-sub { font-size: 12.5px; color: var(--text-muted); margin-top: 3px; }
    .sg-del-warn {
      margin-top: 14px; padding: 10px 12px; border-radius: 8px;
      background: #fff8f8; border: 1px solid #f6dede;
      font-size: 12px; color: #a85757; line-height: 1.7;
    }

    /* ===== 占用释放记录页（service-groomer-records）：单表 + 美容师/关键字筛选 ===== */
    .sgs-panel-scroll.records {
      display: flex; flex-direction: column; padding: 16px 24px 0; overflow: hidden;
    }
    .gmrec-select {
      height: 34px; padding: 0 10px; border: 1px solid #dfe3e8; border-radius: 17px;
      background: #fff; color: #4b5563; font-size: 12.5px; font-family: inherit;
      outline: none; cursor: pointer; min-width: 132px;
    }
    .gmrec-select:hover { border-color: var(--brand); }
    .gmrec-hint { color: #9aa0a8; font-size: 12px; white-space: nowrap; }
    .gmrec-panel { flex: 1; min-height: 0; overflow: auto; }
    .gmrec-table { width: 100%; border-collapse: collapse; }
    .gmrec-table th {
      position: sticky; top: 0; z-index: 2; height: 36px; padding: 0 10px;
      text-align: left; background: #f7f8fa; border-bottom: 1px solid #eef0f2;
      color: #4b5563; font-size: 12px; font-weight: 500; white-space: nowrap;
    }
    .gmrec-table td {
      padding: 9px 10px; border-bottom: 1px solid #f2f4f6;
      font-size: 12.5px; color: #2f343b; vertical-align: middle;
    }
    .gmrec-table tbody tr:hover { background: #f8fbf9; }
    .gmrec-time { color: #8a9099; font-size: 12px; white-space: nowrap; }
    .gmrec-time b { color: #1f2937; font-weight: 500; }
    .gmrec-strong { font-weight: 500; color: #1f2937; white-space: nowrap; }
    .gmrec-order { color: var(--brand); font-weight: 500; }
    .gmrec-note { color: #8a9099; font-size: 12px; }
    .gmrec-tag {
      display: inline-flex; align-items: center; height: 22px; padding: 0 8px;
      border-radius: 11px; background: #f4f6f8; color: #4b5563; font-size: 12px;
    }
    .gmrec-empty { padding: 46px 0; text-align: center; color: #9aa0a8; font-size: 13px; }

    /* ===== 洗护单列表：13 列密度 + 服务人员列 ===== */
    #page-service .data-table th { padding: 9px 10px; font-size: 12px; }
    #page-service .data-table td { padding: 9px 10px; font-size: 12.5px; }
    #page-service .status-pending { background: #e8f5ee; color: #3a9a6a; }
    .status-tab-badge {
      display: inline-block; min-width: 16px; height: 16px; line-height: 16px; padding: 0 5px;
      margin-left: 2px; border-radius: 8px; background: #fdece8; color: #d4552f;
      font-size: 11px; text-align: center; vertical-align: 1px;
    }
    .cell-empty { color: var(--text-muted); }
    .cell-staff { line-height: 1.4; }
    .cs-line { display: flex; align-items: center; gap: 4px; font-size: 12px; white-space: nowrap; }
    .cs-line i {
      font-style: normal; color: var(--text-muted); font-size: 11px;
      background: #f4f6f7; border-radius: 3px; padding: 0 4px;
    }
    .cs-line .cs-name { color: var(--text-primary); }
    .cs-line .cs-name.none { color: var(--text-muted); }
    .cs-tag {
      font-size: 10.5px; color: #c87d00; background: #fff5e6;
      border-radius: 3px; padding: 0 4px; margin-left: 2px;
    }
    .tag-modified { background: #eef4ff; color: #2a6bc4; }

    /* ===== 预约详情弹窗 ===== */
    .svc-detail-box { width: 700px; max-width: calc(100vw - 40px); }
    .svc-detail-box .modal-body { max-height: 68vh; overflow-y: auto; padding: 14px 18px 16px; }
    .svc-detail-box .modal-footer { gap: 8px; }
    /* 「释放占用」固定靠左，页脚其余按钮保持右对齐 */
    .svc-detail-box .modal-footer .svc-d-free-btn { margin-right: auto; }

    /* 客户卡 */
    .svc-d-head {
      position: relative; display: flex; align-items: center; gap: 12px;
      background: #fff; border: 1px solid #e9edf0; border-radius: 10px;
      padding: 14px 16px; min-height: 78px;
    }
    .svc-d-avatar {
      width: 48px; height: 48px; border-radius: 10px; flex-shrink: 0;
      background: linear-gradient(140deg, #eef3f6, #dde6eb); color: #b7c3cb;
      font-size: 18px; font-weight: 600;
      display: flex; align-items: center; justify-content: center;
    }
    .svc-d-cust { flex: 1; min-width: 0; padding-right: 84px; }
    .svc-d-name {
      font-size: 15px; font-weight: 700; color: var(--brand);
      white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
    }
    .svc-d-sub { display: flex; align-items: center; gap: 16px; margin-top: 7px; font-size: 12.5px; color: #5b6472; }
    .svc-d-sub-item { display: inline-flex; align-items: center; gap: 5px; min-width: 0; }
    .svc-d-sub-item svg { color: #9aa4ad; flex-shrink: 0; }

    /* 状态印章 */
    .svc-d-stamp {
      position: absolute; right: 16px; top: 50%; margin-top: -25px;
      width: 78px; height: 50px; flex-shrink: 0;
      display: flex; align-items: center; justify-content: center;
      transform: rotate(-12deg); transform-origin: center;
      font-size: 14px; font-weight: 600; letter-spacing: 1px;
      border: 2px solid currentColor; border-radius: 50%;
      color: var(--brand); background: transparent;
    }
    .svc-d-stamp::after {
      content: ''; position: absolute; inset: 3px;
      border: 1px solid currentColor; border-radius: 50%; opacity: .45;
    }
    .svc-d-stamp.st-confirm { color: #d9a13a; }
    .svc-d-stamp.st-pending { color: #3a9a6a; }
    .svc-d-stamp.st-serving { color: #2a6bc4; }
    .svc-d-stamp.st-completed { color: #8a939c; }
    .svc-d-stamp.st-cancelled { color: #b8bfc6; }

    /* 预约内容卡：一个预约号可含多只宠物，每只宠物可含多项服务 */
    .svc-d-card {
      border: 1px solid #e9edf0; border-radius: 10px;
      padding: 14px 16px 0; margin-top: 12px; background: #fff;
    }
    .svc-d-content-hd { display: flex; align-items: center; gap: 10px; }
    .svc-d-content-title { flex: 1; min-width: 0; font-size: 13.5px; font-weight: 700; color: var(--text-primary); }
    .svc-d-content-sum { flex-shrink: 0; font-size: 12px; color: var(--text-muted); }

    /* 单只宠物一块，多宠物之间用浅虚线分隔 */
    .svc-d-pet { display: flex; align-items: flex-start; gap: 12px; padding: 12px 0; }
    .svc-d-pet + .svc-d-pet { border-top: 1px dashed #eef1f3; }
    .svc-d-pet-avatar {
      width: 44px; height: 44px; border-radius: 8px; flex-shrink: 0;
      background: linear-gradient(140deg, #f2f5f7, #e0e7ea); color: #b7c3cb;
      font-size: 16px; font-weight: 600;
      display: flex; align-items: center; justify-content: center;
    }
    .svc-d-pet-info { flex: 1; min-width: 0; }
    .svc-d-pet-hd { display: flex; align-items: baseline; gap: 10px; }
    .svc-d-pet-name {
      flex: 1; min-width: 0; font-size: 14px; font-weight: 700; color: var(--text-primary);
      white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
    }
    .svc-d-pet-breed { font-size: 12px; font-weight: 400; color: var(--text-muted); margin-left: 8px; }
    .svc-d-pet-total { flex-shrink: 0; font-size: 12.5px; color: var(--text-secondary); }
    .svc-d-pet-total b { color: var(--brand); font-weight: 700; }
    /* 服务明细：名称（+规格）左对齐，单价右对齐 */
    .svc-d-svc-list { margin-top: 7px; display: flex; flex-direction: column; gap: 5px; }
    .svc-d-svc { display: flex; align-items: baseline; gap: 12px; font-size: 12.5px; }
    .svc-d-svc-name {
      flex: 1; min-width: 0; color: var(--text-primary);
      white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
    }
    .svc-d-svc-spec { font-style: normal; color: var(--text-muted); margin-left: 8px; }
    .svc-d-svc-price { flex-shrink: 0; color: var(--text-secondary); }
    .svc-d-pet-sum { margin-top: 7px; font-size: 12px; color: var(--text-muted); }
    .svc-d-meta {
      display: grid; grid-template-columns: minmax(0, .85fr) minmax(0, 1.4fr) minmax(0, .85fr);
      gap: 12px; margin-top: 14px; padding: 13px 0;
      border-top: 1px solid #eef1f3;
      font-size: 12.5px; color: var(--text-primary);
    }
    .svc-d-meta > span { display: flex; align-items: center; gap: 6px; min-width: 0; }
    .svc-d-meta svg { color: #9aa4ad; flex-shrink: 0; }
    .svc-d-meta i { font-style: normal; color: var(--text-muted); }
    .svc-d-meta b { color: var(--brand); font-weight: 600; white-space: nowrap; }

    /* 通用区块 */
    .svc-d-block {
      border: 1px solid #e9edf0; border-radius: 10px;
      padding: 14px 16px; margin-top: 12px;
    }
    .svc-d-block-title {
      font-size: 13.5px; font-weight: 700; color: var(--text-primary);
      display: flex; align-items: center; gap: 8px;
    }
    .svc-d-block-title > span { flex: 1; min-width: 0; }
    .svc-d-block-tip { font-size: 11.5px; font-weight: 400; color: var(--text-muted); }
    .svc-link-btn {
      border: none; background: transparent; padding: 0; cursor: pointer;
      font-size: 12.5px; font-weight: 400; color: #2f7d5b; flex-shrink: 0;
    }
    .svc-link-btn:hover { text-decoration: underline; }

    /* 服务指派人员 */
    .svc-d-staff { display: flex; flex-direction: column; margin-top: 13px; }
    .svc-d-staff-rows { display: flex; flex-direction: column; gap: 10px; }
    .svc-d-staff-row { display: flex; align-items: center; gap: 10px; }
    .svc-d-staff-label { width: 76px; flex-shrink: 0; font-size: 12.5px; color: var(--text-muted); }
    .svc-pill {
      flex: 1; min-width: 0; height: 36px; border-radius: 150px;
      display: flex; align-items: center; padding: 0 16px;
      border: 1px solid #dfe6ea; background: #fff;
      font-size: 13px; color: var(--text-primary);
      overflow: hidden; white-space: nowrap; text-overflow: ellipsis;
    }
    .svc-pill.readonly { background: #f5f7f8; border-color: #e8edef; color: #6b7280; }
    .svc-pill.none { color: var(--text-muted); }
    .svc-reassign-btn {
      flex-shrink: 0; height: 36px; padding: 0 22px; border-radius: 150px;
      border: 1px solid #2f7d5b; background: #fff; color: #2f7d5b;
      font-size: 13px; font-weight: 500; cursor: pointer;
      transition: background .15s, color .15s;
    }
    .svc-reassign-btn:hover { background: #2f7d5b; color: #fff; }

    /* 「实际服务人」圆角框：作为菜单的定位锚点 */
    .svc-assign-anchor { position: relative; flex: 1; min-width: 0; display: flex; }

    /* 贴着圆角框下沿滑出的美容师菜单（浮层，不下推下方内容） */
    .svc-assign-panel {
      position: absolute; top: calc(100% + 6px); left: 0; right: 0; z-index: 40;
      max-height: 0; overflow: hidden; opacity: 0;
      border: 1px solid transparent; border-radius: 10px; background: #fff;
      transform: translateY(-4px);
      transition: max-height .26s ease, opacity .18s ease,
                  transform .2s ease, border-color .18s ease;
    }
    .svc-assign-panel.open {
      max-height: 268px; opacity: 1; transform: translateY(0);
      border-color: #dfe6ea; box-shadow: 0 10px 26px rgba(15, 23, 42, .13);
    }
    .svc-assign-panel-list { max-height: 240px; overflow-y: auto; }
    .svc-assign-opt {
      display: flex; align-items: center; gap: 10px; padding: 10px 14px;
      border-bottom: 1px solid #f2f5f6; cursor: pointer; transition: background .15s;
    }
    .svc-assign-opt:last-child { border-bottom: none; }
    .svc-assign-opt:hover { background: #f7fbf9; }
    .svc-assign-opt.current { background: #eef8f2; }
    .svc-assign-opt.current .svc-assign-name { color: var(--brand); font-weight: 600; }
    .svc-assign-avatar {
      width: 26px; height: 26px; border-radius: 50%; flex-shrink: 0;
      background: #eaf7ef; color: #3a9a6a; font-size: 12px;
      display: flex; align-items: center; justify-content: center;
    }
    .svc-assign-name { flex: 1; font-size: 13px; color: var(--text-primary); }
    .svc-assign-flag { font-size: 11.5px; color: var(--text-muted); }
    /* 该美容师已休假（长期停用 / 当天该时段休息）：置灰 + 禁止光标 + 抑制 hover，且不可指派。
       旗标写「休假」而不是「休息」：后者读起来像「这会儿闲着」，跟可选的「空闲」正好容易看反。 */
    .svc-assign-opt.is-rest { background: #fafbfc; cursor: not-allowed; }
    .svc-assign-opt.is-rest:hover { background: #fafbfc; }
    .svc-assign-opt.is-rest .svc-assign-avatar { background: #f2f4f6; color: #b4bac2; }
    .svc-assign-opt.is-rest .svc-assign-name { color: #b4bac2; }
    .svc-assign-opt.is-rest .svc-assign-flag { color: #c87d00; }
    /* 该美容师在这个时段已有单（服务中 / 已预约）：置灰提示，但仍可指派（原单需另行改派），
       旗标用蓝字区分于休假的橙字，hover 保留反馈以示可点 */
    .svc-assign-opt.is-busy { background: #fafbfc; }
    .svc-assign-opt.is-busy .svc-assign-avatar { background: #f2f4f6; color: #9aa0a8; }
    .svc-assign-opt.is-busy .svc-assign-name { color: #9aa0a8; }
    .svc-assign-opt.is-busy .svc-assign-flag { color: #3a85c4; }
    /* 选中态优先于灰态：一个「被占 / 休息」的人也可能被选中（只提示不拦截），
       此时不能让灰字灰底盖掉选中反馈（同特异性时后加载者胜，所以这段必须放在灰态之后） */
    .svc-assign-opt.current { background: #eef8f2; }
    .svc-assign-opt.current .svc-assign-avatar { background: #eaf7ef; color: #3a9a6a; }
    .svc-assign-opt.current .svc-assign-name { color: var(--brand); font-weight: 600; }
    .svc-assign-opt.current .svc-assign-flag { color: var(--brand); }

    /* ===== 派单弹窗（确认接单必选 / 完成前兜底） ===== */
    /* 美容师选项复用 .svc-assign-opt，这里只加摘要与列表容器 */
    .sva-sum {
      padding: 9px 12px;
      border-radius: 6px;
      background: #f7f9fa;
      border: 1px solid #eef1f3;
      margin-bottom: 12px;
    }
    .sva-sum-main { font-size: 13px; color: var(--text-primary); line-height: 1.6; }
    .sva-sum-sub { margin-top: 3px; font-size: 12px; color: var(--text-muted); line-height: 1.6; }
    .sva-warn { margin-left: 6px; color: #c87d00; }
    .sva-list {
      border: 1px solid #e8ecef;
      border-radius: 8px;
      overflow: hidden;
      max-height: 258px;
      overflow-y: auto;
    }

    .svc-d-remark { font-size: 12.5px; color: var(--text-secondary); margin-top: 8px; line-height: 1.7; }
    .svc-d-remark .none { color: var(--text-muted); }
    .svc-d-foot-row {
      display: flex; align-items: center; gap: 20px; margin-top: 14px;
      font-size: 12.5px; color: var(--text-muted);
    }
    .svc-d-color {
      display: inline-block; width: 13px; height: 13px; border-radius: 3px;
      background: var(--brand); vertical-align: -2px; margin-left: 6px;
    }
    .svc-d-logs { margin-top: 10px; display: flex; flex-direction: column; gap: 7px; }
    .svc-d-log { display: flex; gap: 10px; font-size: 12px; line-height: 1.7; }
    .svc-d-log-time { color: var(--text-muted); flex-shrink: 0; }
    .svc-d-log-text { color: var(--text-secondary); }

    /* ===== 新建 / 编辑洗护单：服务人员与名额提示 ===== */
    .svc-quota-tip {
      margin-top: 8px; padding: 7px 10px; border-radius: 6px; font-size: 12px; line-height: 1.6;
      background: #fff8e8; border: 1px solid #f6e0b5; color: #a8700a;
    }
    .svc-quota-tip.ok { background: #f2f9f5; border-color: #d5eade; color: #3a9a6a; }
    .svc-quota-tip strong { font-weight: 500; }
    .svc-form-must {
      display: inline-block; margin-left: 8px; font-size: 11.5px;
      color: #c87d00; background: #fff5e6; border-radius: 3px; padding: 0 5px;
    }
    .svc-edit-banner {
      margin: 0 0 16px; padding: 9px 12px; border-radius: 6px;
      background: #eef4ff; border: 1px solid #d8e5fa; color: #2a6bc4; font-size: 12.5px; line-height: 1.6;
    }

    /* ===================================================================
       洗护单列表：对齐线上系统视觉
       全部规则限定在 #page-service 内（且在 web-ops-service.css 之后加载），
       不会影响 camera / boarding / report / order 等共用同名类的页面。
       =================================================================== */
    #page-service.page.active { min-height: 100%; background: #fff; }
    #page-service .service-main { padding: 12px 16px 0; gap: 0; background: #fff; }

    /* 视图切换 → 白底绿字 / 选中绿底白字（对齐线上系统） */
    #page-service .view-tabs {
      align-self: flex-start; display: inline-flex; align-items: center; gap: 6px;
      border-bottom: none; background: transparent; border-radius: 0; padding: 0;
      margin-bottom: 10px;
    }
    #page-service .view-tab {
      height: 30px; padding: 0 16px; display: inline-flex; align-items: center;
      border: 1px solid #d5e6dc; margin-bottom: 0; border-radius: 6px;
      font-size: 13px; color: var(--brand); background: #fff;
    }
    #page-service .view-tab:hover { color: var(--brand-dark); border-color: var(--brand); }
    #page-service .view-tab.active {
      background: var(--brand); border-color: var(--brand); color: #fff;
      font-weight: 500; border-bottom-color: var(--brand);
    }

    /* 筛选区：小圆角控件（对齐线上系统） */
    #page-service .filter-bar { gap: 8px; margin-bottom: 10px; }
    #page-service .filter-search,
    #page-service .filter-select,
    #page-service .filter-date-range {
      height: 30px; border-radius: 6px; border: 1px solid #e2e6ea;
      padding: 0 10px; font-size: 12.5px; color: #4b5563; gap: 6px; background: #fff;
    }
    #page-service .filter-search { color: #a3a9b2; }
    #page-service .filter-search input { width: 158px; font-size: 12.5px; }
    #page-service .filter-chevron { color: #a3a9b2; }
    #page-service .filter-select:hover { border-color: var(--brand); }
    #page-service .filter-date-range { color: #4b5563; gap: 7px; }
    #page-service .filter-date-text { color: #4b5563; }
    #page-service .filter-range-arrow { color: #b6bcc5; }
    #page-service .filter-calendar { color: #a3a9b2; }
    #page-service .filter-btn-query,
    #page-service .filter-btn-groomer,
    #page-service .filter-btn-export,
    #page-service .filter-btn-add {
      height: 30px; border-radius: 6px; padding: 0 15px; font-size: 12.5px;
      display: inline-flex; align-items: center; cursor: pointer;
      transition: all .15s; white-space: nowrap;
    }
    #page-service .filter-btn-query,
    #page-service .filter-btn-add { background: var(--brand); color: #fff; border: 1px solid var(--brand); }
    #page-service .filter-btn-query:hover,
    #page-service .filter-btn-add:hover { background: var(--brand-dark); border-color: var(--brand-dark); }
    #page-service .filter-btn-export {
      background: #fff; border: 1px solid #9dd3b3; color: var(--brand);
    }
    #page-service .filter-btn-export:hover { background: #f2f9f5; }
    /* 线框按钮：美容师设置（导出左侧） */
    #page-service .filter-btn-groomer {
      background: #fff; border: 1px solid #cfd6dd; color: #4b5563;
    }
    #page-service .filter-btn-groomer:hover { border-color: var(--brand); color: var(--brand); }

    /* 状态 tab → 纯文字，选中绿底白字（对齐线上系统） */
    #page-service .status-tabs {
      border-bottom: none; gap: 4px; margin-bottom: 8px; flex-wrap: wrap; align-items: center;
    }
    #page-service .status-tab {
      height: 28px; padding: 0 12px; display: inline-flex; align-items: center;
      border: 1px solid transparent; border-radius: 5px; background: transparent;
      color: #4b5563; font-size: 12.5px; margin-bottom: 0; border-bottom-width: 1px;
    }
    #page-service .status-tab:hover { color: var(--brand); background: #f5f8f6; border-color: transparent; }
    #page-service .status-tab.active {
      background: var(--brand); border-color: var(--brand); color: #fff; font-weight: 500;
    }
    #page-service .status-tab-badge {
      display: inline-block; min-width: 0; height: auto; line-height: 1; padding: 0;
      margin-left: 3px; border-radius: 0; background: transparent; color: #e5544b;
      font-size: 11.5px; vertical-align: baseline;
    }
    #page-service .status-tab.active .status-tab-badge { color: #fff; }

    /* 表格：表头吸顶 + 操作列固定，其余列横向滚动 */
    #page-service .service-main .data-table-wrap {
      border: none; border-radius: 0; background: #fff;
      overflow: auto;
    }
    #page-service .service-main .data-table {
      min-width: 1420px; font-size: 12.5px; white-space: nowrap;
    }
    #page-service .service-main .data-table thead { background: #f5f7f9; }
    #page-service .service-main .data-table th {
      position: sticky; top: 0; z-index: 2;
      height: 36px; padding: 0 10px; background: #f5f7f9;
      border-bottom: 1px solid #eceff2; color: #6b7280;
      font-size: 12px; font-weight: 500;
    }
    #page-service .service-main .data-table td {
      padding: 8px 10px; border-bottom: 1px solid #f2f4f6;
      font-size: 12.5px; color: #2f343b;
    }
    #page-service .service-main .data-table tbody tr:hover { background: #f8fbf9; }

    /* 操作列固定在右侧；其他字段横向滚动 */
    #page-service .service-main .data-table th:last-child,
    #page-service .service-main .data-table td:last-child {
      position: sticky; right: 0; width: 232px; min-width: 232px;
      background: #fff;
      box-shadow: inset 1px 0 0 #edf0f2, -8px 0 8px -8px rgba(15, 23, 42, .10);
    }
    #page-service .service-main .data-table th:last-child { background: #f5f7f9; z-index: 3; }
    #page-service .service-main .data-table tbody tr:hover td:last-child { background: #f8fbf9; }

    /* 单元格内部排版 */
    #page-service .svc-time,
    #page-service .svc-created { line-height: 1.4; font-size: 12px; color: #9aa0a8; }
    #page-service .svc-time b,
    #page-service .svc-created b { font-weight: 500; color: #2f343b; }
    #page-service .cell-id { color: var(--brand); font-weight: 500; font-size: 13px; }
    #page-service .cell-id:hover { text-decoration: none; }
    #page-service .cell-tag { margin-top: 3px; padding: 0 5px; border-radius: 3px; font-size: 11px; line-height: 16px; }
    #page-service .cell-link { color: var(--brand); font-size: 12.5px; }
    #page-service .cell-link:hover { text-decoration: none; }

    /* 状态标签配色（对齐截图：待确认=橙、待服务=绿、服务中=蓝、已完成/已取消=灰） */
    #page-service .cell-status { border-radius: 4px; padding: 1px 7px; font-size: 11.5px; line-height: 18px; }
    #page-service .status-confirm { background: #fff4e5; color: #c87d00; }
    #page-service .status-pending { background: #eaf7ef; color: #3a9a6a; }
    #page-service .status-serving { background: #e9f1fb; color: #2a6bc4; }
    #page-service .status-completed { background: #f1f7f3; color: #4a9a72; }
    #page-service .status-cancelled { background: #f4f5f6; color: #9aa0a8; }

    /* 操作按钮：浅色小按钮（对齐线上系统） */
    #page-service .cell-actions { gap: 6px; align-items: center; }
    #page-service .action-btn {
      height: 22px; padding: 0 8px; border-radius: 4px; font-size: 11.5px;
      display: inline-flex; align-items: center; line-height: 1;
      border: 1px solid transparent; transition: all .15s;
    }
    #page-service .btn-view,
    #page-service .btn-edit,
    #page-service .btn-report,
    #page-service .btn-complete,
    #page-service .btn-confirm,
    #page-service .btn-start { background: #eaf7ef; border-color: #eaf7ef; color: #3a9a6a; }
    #page-service .btn-view:hover,
    #page-service .btn-edit:hover,
    #page-service .btn-report:hover,
    #page-service .btn-complete:hover,
    #page-service .btn-confirm:hover,
    #page-service .btn-start:hover { background: #dcefe5; border-color: #cfe7da; color: #338a5d; }
    #page-service .btn-more { background: #f4f5f6; border-color: #f4f5f6; color: #6b7280; }
    #page-service .btn-more:hover { background: #eaedef; color: #4b5563; }
    #page-service .btn-cancel-order { background: #fdeeec; border-color: #fdeeec; color: #d4552f; padding: 0 8px; }
    #page-service .btn-cancel-order:hover { background: #fbdfdb; color: #c04a28; }

    /* 分页（覆盖共用 pagination 样式，仅作用本页） */
    #page-service .pagination { justify-content: flex-end; padding: 10px 4px; gap: 5px; align-items: center; }
    #page-service .pagination-total { font-size: 12.5px; color: #8a9099; margin-right: 10px; }
    #page-service .page-btn {
      min-width: 24px; height: 24px; border-radius: 4px; border: 1px solid #e4e7eb;
      font-size: 12.5px; color: #4b5563; background: #fff;
    }
    #page-service .page-btn.active {
      background: var(--brand); border-color: var(--brand); color: #fff;
    }
    #page-service .page-btn-go {
      background: transparent; color: var(--brand); padding: 0 6px; font-size: 12.5px;
    }
    #page-service .page-btn-go:hover { background: transparent; color: var(--brand-dark); }
    #page-service .page-input { width: 34px; height: 26px; border-radius: 4px; font-size: 12.5px; }
    #page-service .pagination-to,
    #page-service .pagination-unit { font-size: 12.5px; color: #8a9099; }

    /* ===== 美容师「可约时间设置」（临时休息 / 长期停用） ===== */
    /* 「休息设置」是卡片主操作：居中 + 红框红字（与删除按钮互换视觉权重） */
    .gm-actions .sg-action.rest { border-color: #f0bdbd; color: #d64545; box-shadow: 0 1px 3px rgba(15, 23, 42, .06); }
    .gm-actions .sg-action.rest:hover { background: #fff5f5; border-color: #e59a9a; }

    .sg-rest-box { width: 880px; max-width: 94vw; }
    #sg-rest-modal .modal-body { padding: 16px 20px 18px; }
    /* 长期停用开关并入标题栏：标题 →「长期停用」→ 开关 → 状态标签 → 说明标签，一行走完 */
    #sg-rest-modal .modal-header { gap: 10px; }
    .sg-rest-offbar { flex: 1; min-width: 0; display: flex; align-items: center; gap: 10px; }
    .sg-rest-offbar-label { font-size: 13px; color: #5b6472; }
    .sg-rest-off-state {
      display: inline-flex; align-items: center; height: 20px; padding: 0 8px;
      border-radius: 10px; background: #f2f4f6; color: #9aa0a8; font-size: 11.5px;
    }
    /* 已停用是「得有人手动捞回来」的状态，给橙色回执；未停用保持静默灰 */
    .sg-rest-off-state.is-off { background: #fff5e6; color: #c87d00; }
    .sg-rest-off-hint {
      display: inline-flex; align-items: center; height: 20px; padding: 0 8px;
      border: 1px solid #e6e9ec; border-radius: 10px; color: #8a9099; font-size: 11.5px;
    }
    .sg-rest-switch { position: relative; display: inline-flex; flex-shrink: 0; cursor: pointer; }
    .sg-rest-switch input { position: absolute; opacity: 0; width: 0; height: 0; }
    .sg-rest-switch-track {
      position: relative; display: block; width: 40px; height: 22px;
      border-radius: 11px; background: #d9dee3; transition: background .18s;
    }
    .sg-rest-switch-track::after {
      content: ''; position: absolute; top: 2px; left: 2px; width: 18px; height: 18px;
      border-radius: 50%; background: #fff; transition: left .18s;
    }
    .sg-rest-switch input:checked + .sg-rest-switch-track { background: var(--brand); }
    .sg-rest-switch input:checked + .sg-rest-switch-track::after { left: 20px; }

    .sg-rest-grid { display: grid; gap: 6px; align-items: center; }
    .sg-rest-hd {
      display: flex; flex-direction: column; align-items: center; gap: 1px;
      padding-bottom: 4px; font-size: 12px; color: #4b5563;
    }
    .sg-rest-hd-date { align-items: flex-start; padding-left: 2px; }
    .sg-rest-hd-name { font-size: 12.5px; color: #1f2937; }
    .sg-rest-hd-time { font-size: 11.5px; color: #9aa0a8; }
    .sg-rest-date { padding-left: 2px; font-size: 13px; color: #1f2937; }
    .sg-rest-cell {
      height: 34px; padding: 0; border-radius: 8px; font-family: inherit; font-size: 12.5px;
      background: #d9f0e6; color: #2f8f63; border: 1px solid #c3e6d6;
      cursor: pointer; transition: background .15s, border-color .15s;
    }
    .sg-rest-cell:hover { background: #cbeadb; }
    .sg-rest-cell.rest { background: #fff; color: #5b6472; border: 1px dashed #c9cfd6; }
    .sg-rest-cell.rest:hover { border-color: #9aa0a8; }
    .sg-rest-cell.past {
      background: #f6f7f8; color: #b8bfc6; border: 1px dashed #e4e7eb; pointer-events: none;
    }
    .sg-rest-day {
      height: 34px; border-radius: 8px; font-family: inherit; font-size: 12.5px;
      background: #fff; color: #2f343b; border: 1px solid #dfe3e8;
      cursor: pointer; transition: all .15s;
    }
    .sg-rest-day:hover { border-color: var(--brand); color: var(--brand); }
    .sg-rest-foot {
      display: flex; align-items: center; justify-content: space-between;
      margin-top: 14px; padding-top: 12px; border-top: 1px solid #f2f4f6;
    }
    .sg-rest-tip { font-size: 12px; color: #9aa0a8; }
    .sg-rest-hint {
      margin-right: auto; max-width: 460px; padding: 5px 12px; border-radius: 14px;
      background: #f7f9fa; border: 1px solid #edf0f2; color: #4b5563; font-size: 12px;
      overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
    }
    .sg-rest-hint.is-empty { color: #b8bfc6; }