/*
 * 貓談社諮詢預約：預約頁、我的帳戶、諮詢師後台、管理員後台。
 * 規則（courses 踩雷清單）：全部限定在 .ccb 底下；一律用 px（學院根字級 18px，不用 rem）；手機優先（375px 先驗收、320px 不撐破）。
 * 色票：學院紫 #4E4770、字 #2F2A47、次字 #6B6489、米白 #FBF8F4、淡紫底 #F5EEF5、愛心橘 #ED782B（只當底，字用深色）。
 */
.ccb { --ccb-purple: #4E4770; --ccb-text: #2F2A47; --ccb-sub: #6B6489; --ccb-bg: #FBF8F4; --ccb-soft: #F5EEF5; --ccb-line: #E4DDE8; --ccb-orange: #ED782B; --ccb-orange-soft: #FFF1E6; --ccb-video: #4F6D8A; --ccb-home: #5E7D5E; --ccb-red: #B3261E;
  color: var(--ccb-text); font-size: 16px; line-height: 1.6; max-width: 760px; margin: 0 auto; box-sizing: border-box; }
.ccb *, .ccb *::before, .ccb *::after { box-sizing: border-box; }
/* 學院佈景主題給所有 button 加 letter-spacing: 2px、全大寫：卡片、時間、月曆按鈕的字會被撐開
   （11-15「用包時數，不用付款」在 375 折成「…不用付／款」）。主要按鈕 .btn 有自己的字距（official.css），字距不動；
   全大寫一律拿掉（11-15「寄驗證碼到 email」被轉成 EMAIL） */
.ccb button { text-transform: none; }
.ccb button:not(.btn) { letter-spacing: normal; }
.ccb .ccb-nw { white-space: nowrap; } /* 這幾個字不拆開（窄螢幕折行時整組換到下一行） */
/* 沒登入用包時數：Email 欄位標題和輸入框之間的提示（Wei 11-15 要醒目、字少） */
.ccb .ccb-pkmail-tip { display: flex; gap: 8px; align-items: flex-start; margin: 2px 0 8px; padding: 10px 12px; background: var(--gold-soft, #F4EAD6); border: 1px solid var(--lux-gold, #C9962B); border-radius: 10px; color: var(--lux-cocoa, #3E3033); line-height: 1.5; }
.ccb .ccb-pkmail-tip .i { flex: none; width: 20px; height: 20px; margin-top: 2px; color: var(--gold-ink, #8A6416); }
.ccb .ccb-pkmail-tip b { display: block; font-size: 16px; }
.ccb .ccb-pkmail-tip div > span { display: block; font-size: 14px; }
/* 確認信「開啟 LINE 確認預約」的小頁（?ccb_line=代號，11-15）：電腦 QR code 大一點、代號＋複製 */
.ccb.cb-book .ccb-linepage .ccb-qr { width: 220px; max-width: 70%; margin: 14px 0; }
.ccb .ccb-linecode { display: flex; align-items: center; flex-wrap: wrap; gap: 6px 12px; margin: 12px 0 0; padding: 12px 14px; background: #fff; border: 1px solid var(--lux-rule, #E6DACB); border-radius: 12px; }
.ccb .ccb-linecode span { font-size: 14px; color: var(--muted, #6B6158); }
.ccb .ccb-linecode b { font-size: 22px; letter-spacing: 1px; font-variant-numeric: tabular-nums; color: var(--lux-cocoa, #3E3033); }
.ccb .ccb-linecode .btn { margin-left: auto; }
.ccb h3 { font-size: 20px; margin: 28px 0 10px; color: var(--ccb-text); line-height: 1.4; }
.ccb h4 { font-size: 17px; margin: 18px 0 8px; }
.ccb a { color: var(--ccb-purple); text-decoration: underline; }
.ccb-muted { color: var(--ccb-sub); }
.ccb-small { font-size: 14px; }
.ccb-warn { color: #B4561C; font-weight: 600; }
.ccb-good { color: #24572F; font-weight: 700; }
.ccb-loading { color: var(--ccb-sub); padding: 24px 0; }
.ccb-list { margin: 8px 0 14px; padding-left: 20px; }
.ccb-list li { margin: 4px 0; }
.ccb-error { background: #FDECEA; color: var(--ccb-red); border-radius: 10px; padding: 10px 14px; margin: 10px 0; font-size: 15px; }
.ccb-ok { background: #E8F3EA; color: #24572F; border-radius: 10px; padding: 10px 14px; margin: 10px 0; }
.ccb-empty, .ccb-note { background: var(--ccb-soft); border-radius: 12px; padding: 14px 16px; margin: 10px 0; }
.ccb-note { font-size: 15px; }
.ccb-note.ccb-soon { background: #FFF1E6; border: 1px solid #F3C9A6; } /* 72 小時內的時段（Wei 11-09） */
.cb-book p.ccb-note { padding: 12px 14px; margin: 10px 0; } /* official.css 把 .cb-book p 的 padding、margin 歸零（Vivian 11-11：文字貼框線） */
.cb-book p.ccb-note.ccb-soon { margin: 0 0 18px; line-height: 1.6; }
body:has(#ccb-book) #ast-scroll-top { display: none !important; } /* 預約頁：學院的「回到頂部」在手機蓋到選項（Vivian 11-11）；其他頁照學院設定 */
.ccb-hp { position: absolute !important; left: -9999px !important; width: 1px; height: 1px; opacity: 0; }

/* 按鈕 */
.ccb-btn { display: inline-flex; align-items: center; justify-content: center; gap: 6px; min-height: 44px; padding: 8px 16px; border-radius: 999px; border: 1px solid var(--ccb-purple); background: #fff; color: var(--ccb-purple) !important; font-size: 15px; font-weight: 600; line-height: 1.3; cursor: pointer; text-decoration: none !important; margin: 4px 6px 4px 0; }
.ccb-btn:hover { background: var(--ccb-soft); }
.ccb-btn:disabled { opacity: .55; cursor: default; }
.ccb-btn.is-on { background: var(--ccb-purple); color: #fff !important; }
.ccb-btn-primary { background: var(--ccb-purple); color: #fff !important; }
.ccb-btn-primary:hover { background: #3E3860; }
.ccb-btn-ghost { border-color: var(--ccb-line); color: var(--ccb-sub) !important; }
.ccb-btn-danger { border-color: var(--ccb-red); color: var(--ccb-red) !important; }
.ccb-btn-line { background: #06C755; border-color: #06C755; color: #fff !important; }
.ccb-btn-block { display: flex; width: 100%; margin: 12px 0 6px; font-size: 17px; min-height: 52px; }
.ccb-btn-sm { min-height: 34px; padding: 4px 12px; font-size: 14px; }
.ccb-link { background: none; border: 0; padding: 0; color: var(--ccb-purple); text-decoration: underline; cursor: pointer; font-size: 14px; }
.ccb-actions { display: flex; flex-wrap: wrap; align-items: center; margin: 10px 0; }

/* 步驟 */
.ccb-step { margin: 0 0 22px; }
.ccb-step-title { display: flex; align-items: center; gap: 10px; font-size: 19px !important; margin: 22px 0 12px !important; }
.ccb-step-title span { flex: none; width: 30px; height: 30px; border-radius: 50%; background: var(--ccb-purple); color: #fff; display: inline-flex; align-items: center; justify-content: center; font-size: 15px; }
.ccb-cards { display: grid; grid-template-columns: 1fr; gap: 10px; }
.ccb-card { display: flex; flex-direction: column; align-items: flex-start; gap: 2px; text-align: left; padding: 14px 16px; border: 2px solid var(--ccb-line); border-radius: 14px; background: #fff; color: var(--ccb-text); cursor: pointer; font-size: 15px; line-height: 1.5; min-height: 64px; width: 100%; }
.ccb-card strong { font-size: 17px; }
.ccb-card span { color: var(--ccb-sub); font-size: 14px; }
.ccb-card:hover { border-color: #BA8CB9; }
.ccb-card.is-picked { border-color: var(--ccb-purple); background: var(--ccb-soft); box-shadow: 0 0 0 1px var(--ccb-purple) inset; }
.ccb-card.ccb-mode-video.is-picked { border-color: var(--ccb-video); background: #EEF3F7; box-shadow: 0 0 0 1px var(--ccb-video) inset; }
.ccb-card.ccb-mode-home.is-picked { border-color: var(--ccb-home); background: #EEF4EC; box-shadow: 0 0 0 1px var(--ccb-home) inset; }
@media (min-width: 600px) {
  .ccb-cards { grid-template-columns: repeat(3, 1fr); }
  .ccb-cards-2 { grid-template-columns: repeat(2, 1fr); }
}

/* 月曆 */
.ccb-cal { background: #fff; border: 1px solid var(--ccb-line); border-radius: 14px; padding: 12px; }
.ccb-cal-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 8px; }
.ccb-cal-nav { width: 44px; height: 44px; border-radius: 50%; border: 1px solid var(--ccb-line); background: #fff; color: var(--ccb-purple); font-size: 22px; cursor: pointer; }
.ccb-cal-nav:disabled { opacity: .3; cursor: default; }
.ccb-cal-grid { display: grid; grid-template-columns: repeat(7, 1fr); gap: 4px; text-align: center; }
/* 最窄的手機（320px）：7 格 × 最小 38px 比卡片寬，週日那欄會壓到框外 → 卡片內距、格距縮小（11-15） */
@media (max-width: 359px) { .ccb-cal { padding: 8px; } .ccb-cal-grid { grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 2px; } .ccb-cal-day { min-height: 34px; } }
.ccb-cal-wd { font-size: 13px; color: var(--ccb-sub); padding: 4px 0; }
.ccb-cal-day { display: flex; align-items: center; justify-content: center; aspect-ratio: 1 / 1; min-height: 38px; border-radius: 10px; font-size: 15px; color: #B9B3C6; border: 0; background: none; padding: 0; }
button.ccb-cal-day.is-open { background: var(--ccb-soft); color: var(--ccb-purple); font-weight: 700; cursor: pointer; }
button.ccb-cal-day.is-open:hover { background: #E9DDEA; }
button.ccb-cal-day.is-picked { background: var(--ccb-purple); color: #fff; }
.ccb-dot { display: inline-block; width: 10px; height: 10px; border-radius: 3px; background: var(--ccb-soft); border: 1px solid #BA8CB9; vertical-align: middle; }
.ccb-times { margin-top: 14px; }
.ccb-times-title { font-weight: 700; margin: 0 0 8px; }
.ccb-time-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 8px; }
.ccb-time { min-height: 48px; border-radius: 12px; border: 2px solid var(--ccb-purple); background: #fff; color: var(--ccb-purple); font-size: 16px; font-weight: 700; cursor: pointer; padding: 6px 10px; }
.ccb-time:hover, .ccb-time.is-picked { background: var(--ccb-purple); color: #fff; }

/* 表單 */
.ccb-summary { display: grid; grid-template-columns: 1fr 1fr; gap: 8px 14px; background: var(--ccb-soft); border-radius: 14px; padding: 14px 16px; margin: 0 0 14px; }
.ccb-summary > div { display: flex; flex-direction: column; }
.ccb-summary span { font-size: 13px; color: var(--ccb-sub); }
.ccb-summary strong { font-size: 16px; }
.ccb-summary .ccb-link { grid-column: 1 / -1; justify-self: start; }
.ccb-field { margin: 0 0 12px; }
.ccb-field label, .ccb-form-grid label, .ccb-form-row label { display: block; font-size: 15px; font-weight: 600; margin-bottom: 4px; }
.ccb input[type=text], .ccb input[type=email], .ccb input[type=tel], .ccb input[type=number], .ccb input[type=date], .ccb input[type=time], .ccb input[type=datetime-local], .ccb input[type=url], .ccb input[type=password], .ccb input[type=search], .ccb select, .ccb textarea {
  width: 100%; max-width: 100%; min-height: 46px; padding: 8px 12px; border: 1px solid #CFC6D6; border-radius: 10px; background: #fff; color: var(--ccb-text); font-size: 16px; line-height: 1.4; }
.ccb textarea { min-height: 80px; }
.ccb input:focus, .ccb select:focus, .ccb textarea:focus { outline: 2px solid #BA8CB9; outline-offset: 1px; }
.ccb-pro .pro-url, .ccb .pro-url { display: block; font-size: 13px; color: var(--p-sub, #6b5f58); word-break: break-all; }
.ccb .pro-link-preview { display: block; font-size: 13px; color: var(--p-sub, #6b5f58); word-break: break-all; margin-top: 4px; }
.ccb .pro-link-preview b { color: var(--p-ink, #3E3033); }
.ccb .ccb-form .ccb-prefill { display: flex; gap: 8px; align-items: flex-start; margin: 0 0 18px; padding: 10px 12px; border-radius: 12px; background: #F6F1E8; font-size: 15px; line-height: 1.5; }
.ccb .ccb-prefill .i { flex: none; margin-top: 3px; }
.ccb-rules { background: #fff; border: 1px solid var(--ccb-line); border-radius: 12px; padding: 4px 14px; margin: 14px 0; font-size: 15px; }
.ccb-check { display: flex !important; gap: 8px; align-items: flex-start; font-weight: 400 !important; margin: 8px 0; }
.ccb-check input { width: 20px; height: 20px; margin-top: 3px; flex: none; }
.ccb-inline { display: inline-flex !important; align-items: center; gap: 6px; font-weight: 400 !important; margin: 4px 12px 4px 0 !important; }
.ccb-inline input { width: 18px; height: 18px; min-height: 0; }

/* 完成 */
.ccb-done { background: #fff; border: 1px solid var(--ccb-line); border-radius: 16px; padding: 20px 18px; }
.ccb-done h3 { margin-top: 4px; }
.ccb-done-icon { width: 52px; height: 52px; border-radius: 50%; background: #E8F3EA; color: #24572F; font-size: 28px; display: flex; align-items: center; justify-content: center; }
.ccb-done .ccb-btn { margin-top: 6px; }

/* 我的諮詢 */
.ccb-pkgs { display: grid; grid-template-columns: 1fr; gap: 10px; }
@media (min-width: 600px) { .ccb-pkgs { grid-template-columns: 1fr 1fr; } }
.ccb-pkg, .ccb-bk { background: #fff; border: 1px solid var(--ccb-line); border-radius: 14px; padding: 12px 14px; margin: 0 0 10px; }
.ccb-pkg.is-dim { opacity: .65; }
.ccb-pkg-head, .ccb-bk-head { display: flex; justify-content: space-between; align-items: center; gap: 8px; flex-wrap: wrap; }
.ccb-pkg-left { font-size: 18px; margin: 6px 0 2px; }
.ccb-pkg-left strong { color: var(--ccb-purple); font-size: 22px; }
.ccb details summary { cursor: pointer; color: var(--ccb-purple); font-size: 15px; padding: 6px 0; }
.ccb-badge { display: inline-block; font-size: 13px; font-weight: 600; padding: 2px 10px; border-radius: 999px; background: var(--ccb-soft); color: var(--ccb-purple); white-space: nowrap; }
.ccb-badge-pending { background: var(--ccb-orange-soft); color: #B4561C; }
.ccb-badge-completed { background: #E8F3EA; color: #24572F; }
.ccb-badge-cancelled, .ccb-badge-expired { background: #EEE; color: #666; }

/* 後台（諮詢師、管理員） */
.ccb-tabs { display: flex; gap: 4px; overflow-x: auto; border-bottom: 1px solid var(--ccb-line); margin: 8px 0 14px; -webkit-overflow-scrolling: touch; }
.ccb-tabs a, .ccb-tabs button { flex: none; padding: 10px 14px; border: 0; background: none; font-size: 15px; color: var(--ccb-sub); text-decoration: none; border-bottom: 3px solid transparent; cursor: pointer; min-height: 44px; }
.ccb-tabs .is-on { color: var(--ccb-purple); border-bottom-color: var(--ccb-purple); font-weight: 700; }
.ccb-pro-head { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 6px; }
.ccb-pro-head strong { font-size: 20px; }
.ccb-bk > summary { list-style: none; color: var(--ccb-text); }
.ccb-bk > summary::-webkit-details-marker { display: none; }
.ccb-form-row { display: flex; flex-wrap: wrap; gap: 10px; align-items: flex-end; margin: 10px 0; }
.ccb-form-row > label { flex: 1 1 180px; margin: 0; }
.ccb .ccb-form-row > select, .ccb .ccb-form-row > input { width: auto; flex: 1 1 150px; }
.ccb-form-row > .ccb-btn { flex: none; }
.ccb-form-grid { display: grid; grid-template-columns: 1fr; gap: 10px 16px; margin: 10px 0; }
.ccb-form-grid h4, .ccb-form-grid .ccb-picker-wrap, .ccb-form-grid > p, .ccb-form-grid > button { grid-column: 1 / -1; }
@media (min-width: 700px) { .ccb-form-grid { grid-template-columns: 1fr 1fr; } }
.ccb-wrow { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; padding: 8px 0; border-bottom: 1px dashed var(--ccb-line); }
.ccb-wrow select { width: 110px; flex: none; }
.ccb-wrow input[type=time] { width: 160px; flex: none; }
.ccb-table { width: 100%; border-collapse: collapse; font-size: 14px; margin: 8px 0 16px; background: #fff; }
.ccb-table th, .ccb-table td { border-bottom: 1px solid var(--ccb-line); padding: 8px 6px; text-align: left; vertical-align: top; }
.ccb-table th { color: var(--ccb-sub); font-weight: 600; white-space: nowrap; }
.ccb-table-click tbody tr { cursor: pointer; }
.ccb-table-click tbody tr:hover { background: var(--ccb-soft); }
@media (max-width: 600px) { .ccb-table { display: block; overflow-x: auto; white-space: nowrap; } }
.ccb-detail { display: grid; grid-template-columns: 1fr; gap: 16px; }
@media (min-width: 1000px) { .ccb-admin .ccb-detail { grid-template-columns: 3fr 2fr; } }
.ccb-action-pane:not(:empty) { background: #fff; border: 1px solid var(--ccb-line); border-radius: 12px; padding: 4px 14px 10px; }
.ccb-log { padding-left: 18px; font-size: 14px; }
.ccb-log li { margin: 0 0 8px; }
.ccb-linemsg pre { white-space: pre-wrap; background: #F6F6F6; border-radius: 10px; padding: 10px 12px; font-size: 14px; font-family: inherit; }
.ccb-slot-days { max-height: 320px; overflow-y: auto; border: 1px solid var(--ccb-line); border-radius: 10px; padding: 6px 10px; background: #fff; }
.ccb-slot-day { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; padding: 4px 0; }
.ccb-slot-day > span { width: 110px; flex: none; font-size: 14px; }
.ccb-slot-days .ccb-time { min-height: 34px; font-size: 14px; padding: 2px 10px; border-width: 1px; }
.ccb-box { background: #fff; border: 1px solid var(--ccb-line); border-radius: 12px; padding: 4px 14px; margin: 14px 0; }
.ccb-login { max-width: 420px; margin: 20px auto; text-align: center; background: #fff; border: 1px solid var(--ccb-line); border-radius: 16px; padding: 22px 18px; }
.ccb-toast { position: fixed; left: 50%; bottom: 24px; transform: translateX(-50%); background: #2F2A47; color: #fff; padding: 10px 18px; border-radius: 999px; font-size: 15px; z-index: 100000; max-width: calc(100% - 32px); box-shadow: 0 4px 16px rgba(0,0,0,.2); }
.ccb-toast.is-bad { background: #B3261E; }
.ccb-admin { max-width: 1200px; margin: 0; }
.ccb-calrow { display: flex !important; margin: 6px 0 !important; }
.ccb-caldot { display: inline-block; width: 12px; height: 12px; border-radius: 3px; margin-right: 2px; flex: none; }
.ccb-minutes { background: #FFF8F1; border: 1px solid #F3D9C2; border-radius: 12px; padding: 12px 14px; margin: 10px 0; }
.ccb-min-label { display: block; font-weight: 700; font-size: 16px; margin-bottom: 6px; }
.ccb-min-quick { display: grid; grid-template-columns: repeat(4, 1fr); gap: 6px; margin-bottom: 8px; }
.ccb-min-quick .ccb-btn { margin: 0; width: 100%; }
.ccb-min-preview { background: #fff; border-radius: 10px; padding: 8px 12px; margin: 8px 0; font-size: 15px; }
.ccb-report { background: #F5F7FA; border: 1px solid #DCE3EC; border-radius: 12px; padding: 12px 14px; margin: 10px 0; }
.ccb-report input[type=file] { width: 100%; font-size: 15px; padding: 8px 0; }
.ccb-wdays { display: grid; grid-template-columns: 1fr; gap: 8px; }
@media (min-width: 700px) { .ccb-wdays { grid-template-columns: 1fr 1fr; } }
.ccb-wday { background: #fff; border: 1px solid var(--ccb-line); border-radius: 12px; padding: 8px 12px; }
.ccb-wday-head { display: flex; justify-content: space-between; align-items: center; }
.ccb-wday-head strong { font-size: 17px; }
.ccb-wday-head .ccb-btn { margin: 0; }
.ccb-wslot { display: flex; flex-wrap: nowrap; gap: 6px; align-items: center; padding: 6px 0; border-top: 1px dashed var(--ccb-line); }
.ccb .ccb-wslot input[type=time] { width: 128px; flex: none; padding: 6px 8px; min-height: 42px; }
.ccb-wslot .ccb-wmodes { display: flex; flex: 1 1 auto; flex-wrap: wrap; }
.ccb-wslot .ccb-inline { margin: 0 6px 0 0 !important; }
.ccb-wslot-del { flex: none; margin-left: auto; width: 36px; height: 36px; border-radius: 50%; border: 1px solid var(--ccb-line); background: #fff; color: var(--ccb-sub); font-size: 20px; line-height: 1; cursor: pointer; }
.ccb-wslot-del:hover { border-color: var(--ccb-red); color: var(--ccb-red); }
.ccb-wday-none { display: block; padding: 4px 0 2px; }
.ccb-time .ccb-tw { display: block; font-size: 12px; font-weight: 400; opacity: .8; }
.ccb-tz { margin: 8px 0 16px; }
.ccb-home-area:not([hidden]) { display: block; margin-top: 8px; font-weight: 600; }
.ccb-modeform .ccb-inline { display: flex !important; }
.ccb-tzbar { font-size: 14px; margin: 0 0 10px; color: var(--ccb-sub); }
.ccb-tzbar strong { color: var(--ccb-text); }
.ccb-tzbar .ccb-field { margin: 0; }
.ccb-mailframe { width: 100%; height: 640px; border: 1px solid var(--ccb-line); border-radius: 10px; background: #fff; margin-top: 8px; }

/* ── 預約頁＝官網預約流程的樣式（official.css 的 .cb-book／.cb-flow）；這裡只放外掛自己多出來的部分 ── */
/* 滿版：佈景主題的內容欄（區塊佈景主題會用 !important 置中）不能把預約頁夾窄 */
.ccb.cb-book { max-width: 100vw !important; margin: 0 0 0 calc(50% - 50vw) !important; color: var(--text);
  --ccb-purple: var(--lux-cocoa); --ccb-text: var(--lux-cocoa); --ccb-sub: #6B6158; --ccb-soft: #F4EAD6; --ccb-line: var(--lux-rule); }
.ccb.cb-book .ccb-loading { max-width: 1140px; margin: 0 auto; padding: 24px 16px; }
.ccb.cb-book .fine a, .ccb.cb-book .lead a, .ccb.cb-book .ccb-form a, .ccb.cb-book .next a, .ccb.cb-book .ccb-empty a, .ccb.cb-book .sec p a { color: var(--gold-ink); text-decoration: underline !important; text-underline-offset: 3px; }
.ccb.cb-book .btn { text-decoration: none !important; }
.ccb.cb-book .sec h2 { margin-bottom: 14px; }
.ccb.cb-book .sec-sub { margin: -4px 0 14px; color: var(--muted); font-size: 15px; }
.ccb.cb-book .ccb-h1 { font-size: 26px; margin: 18px 0 6px; }
/* 視訊／到府：「選日期和時間」標題下面整排分段切換，選中的實心深色底（Wei 11-15 要更明顯） */
.ccb.cb-book .ccb-modeseg-w { margin: 4px 0 18px; }
.ccb.cb-book p.ccb-modeseg-h { margin: 0 0 8px; font-size: 15px; font-weight: 700; color: var(--lux-cocoa); }
.ccb .ccb-modeseg { display: grid; grid-template-columns: 1fr 1fr; gap: 4px; padding: 4px; background: #fff; border: 1px solid var(--lux-rule); border-radius: 14px; }
.ccb .ccb-modeseg-b { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px; min-width: 0; min-height: 66px; margin: 0; padding: 10px 8px; border: 0; border-radius: 10px; background: transparent; color: var(--lux-cocoa); font: inherit; text-align: center; cursor: pointer; }
.ccb .ccb-modeseg-b:hover, .ccb .ccb-modeseg-b:focus { background: var(--gold-soft); color: var(--lux-cocoa); }
.ccb .ccb-modeseg-b b { display: flex; align-items: center; gap: 6px; font-size: 18px; line-height: 1.3; }
.ccb .ccb-modeseg-b b .i { width: 20px; height: 20px; color: var(--gold-ink); }
.ccb .ccb-modeseg-b span { font-size: 13px; line-height: 1.4; color: var(--muted); font-variant-numeric: tabular-nums; }
.ccb .ccb-modeseg-b.is-on, .ccb .ccb-modeseg-b.is-on:hover, .ccb .ccb-modeseg-b.is-on:focus { background: var(--lux-cocoa); color: #fff; box-shadow: 0 2px 6px rgba(62, 48, 51, .18); }
.ccb .ccb-modeseg-b.is-on b .i { color: #fff; }
.ccb .ccb-modeseg-b.is-on span { color: rgba(255, 255, 255, .86); }
/* 沒登入用包時數：email 驗證碼（Wei 11-15） */
.ccb.cb-book .ccb-vcode { margin: 16px 0 4px; padding: 14px 16px; background: #fff; border: 1px solid var(--lux-gold); box-shadow: 0 0 0 1px var(--lux-gold); border-radius: 12px; }
.ccb.cb-book p.ccb-vcode-h { display: flex; gap: 8px; align-items: flex-start; margin: 0 0 10px; font-size: 15px; line-height: 1.6; }
.ccb-vcode-h .i { width: 20px; height: 20px; margin-top: 2px; color: var(--gold-ink); }
.ccb-vcode-h b { overflow-wrap: anywhere; }
.ccb.cb-book .ccb-vcode .ccb-field { margin: 0; }
.ccb.cb-book .ccb-vcode input#ccb-vcode-in { max-width: 220px; font-size: 22px; letter-spacing: 6px; font-variant-numeric: tabular-nums; }
.ccb.cb-book p.ccb-vcode-more { margin: 10px 0 0; font-size: 14px; color: var(--muted); }
.ccb-vcode-more .ccb-link { font-size: 14px; color: var(--gold-ink); text-decoration: underline; text-underline-offset: 3px; }
.ccb-vcode-more .ccb-link:disabled { color: var(--muted); text-decoration: none; cursor: default; }
.ccb.cb-book p.ccb-vcode-tip { margin: 6px 0 0; font-size: 13px; color: var(--muted); line-height: 1.6; }
/* 沒登入從包時數連結進來：不用付款的說明（取代單次／包時數二選一） */
.ccb.cb-book .ccb-pkgsafe { max-width: 640px; background: #fff; border: 1px solid var(--lux-gold); box-shadow: 0 0 0 1px var(--lux-gold); border-radius: 12px; }
.ccb.cb-book p.ccb-pkgsafe-h { display: flex; align-items: center; gap: 8px; margin: 0; padding: 14px 16px 0; font-size: 18px; color: var(--lux-cocoa); }
.ccb-pkgsafe-h .i { width: 22px; height: 22px; color: var(--gold-ink); }
.ccb.cb-book .ccb-alt { padding-top: 0; }
.ccb.cb-book .ccb-alt .fine { margin-top: 0; }
.ccb-alt .ccb-link { font-size: 13px; color: var(--gold-ink); text-decoration: underline; text-underline-offset: 3px; }
@media (max-width: 359px) { .ccb .ccb-modeseg-b { padding: 10px 4px; } .ccb .ccb-modeseg-b b { font-size: 16px; gap: 4px; } .ccb .ccb-modeseg-b span { font-size: 12px; } }
.ccb.cb-book .ccb-cal { border-color: var(--lux-rule); }
.ccb.cb-book button.ccb-cal-day.is-open { background: var(--gold-soft); color: var(--lux-cocoa); }
.ccb.cb-book button.ccb-cal-day.is-open:hover { background: #EBD9B4; }
.ccb.cb-book button.ccb-cal-day.is-picked { background: var(--lux-cocoa); color: #fff; }
.ccb.cb-book .ccb-dot { background: var(--gold-soft); border-color: var(--lux-gold); }
.ccb.cb-book .ccb-time { border-width: 1px; border-radius: 8px; }
.ccb.cb-book { padding-bottom: 24px; }
.ccb.cb-book .ccb-summary { grid-template-columns: 1fr; background: #fff; border: 1px solid var(--lux-rule); }
.ccb.cb-book .ccb-form input:not([type="checkbox"]), .ccb.cb-book .ccb-form select, .ccb.cb-book .ccb-form textarea { border-color: var(--lux-rule); border-radius: 8px; background: #fff; }
.ccb.cb-book .ccb-rules { margin: 16px 0 6px; }
.ccb.cb-book .ccb-form .btn-wide { margin-top: 14px; }
.ccb.cb-book .ccb-form .fine { margin-top: 10px; }
/* 有包時數：選用包時數或單次預約 */
.ccb-form input[readonly] { background: #F4F1EC; color: var(--muted); }
.ccb-gone { margin-top: 18px; }
.ccb-gone > summary { cursor: pointer; color: var(--muted); padding: 6px 0; }
.ccb-bill { padding: 16px 18px 18px; font-size: 16px; color: var(--lux-cocoa); }
.ccb-bill-h { margin: 0 0 12px; font-size: 15px; color: var(--muted); }
.ccb-bill-h b { color: var(--lux-cocoa); }
.ccb-bill-row { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; padding: 7px 0; }
.ccb-bill-row b { font-weight: 500; white-space: nowrap; font-variant-numeric: tabular-nums; }
.ccb-bill-row small { display: block; margin-top: 2px; font-size: 14px; color: var(--muted); }
.ccb-bill-row.is-total { margin-top: 6px; padding-top: 12px; border-top: 1px solid var(--lux-rule); font-weight: 700; }
.ccb-bill-row.is-total b { font-size: 22px; font-weight: 700; line-height: 1.2; }
.ccb-bill p.ccb-bill-sub { margin: 18px 0 8px; font-size: 14px; color: var(--muted); }
.ccb-bill-split { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-top: 14px; }
.ccb-bill-sub + .ccb-bill-split { margin-top: 0; }
.ccb-bill-part { display: flex; flex-direction: column; gap: 2px; padding: 10px 12px; border: 1px solid var(--lux-rule); border-radius: 10px; background: #FAF7F2; }
.ccb-bill-part small { font-size: 14px; color: var(--muted); }
.ccb-bill-part span { font-size: 15px; }
.ccb-bill-part b { font-size: 17px; font-weight: 700; font-variant-numeric: tabular-nums; }
.ccb-bill-part.is-owe { border-color: var(--lux-gold); background: var(--gold-soft); }
.ccb-bill p.ccb-bill-due { margin: 12px 0 0; font-size: 14px; color: var(--muted); }
/* 費用頁：付尾款按鈕上面的包時數提醒（Wei 11-13：方案在下面，手機看不到） */
.ccb.cb-book a.ccb-nudge { display: flex; align-items: center; gap: 10px; margin-top: 12px; padding: 12px 14px; background: #fff; border: 1px solid var(--lux-gold); border-radius: 12px; color: var(--lux-cocoa) !important; text-decoration: none !important; line-height: 1.5; }
.ccb-nudge > .i { width: 22px; height: 22px; color: var(--gold-ink); }
.ccb-nudge-t { flex: 1; min-width: 0; }
.ccb-nudge-t b { display: block; font-size: 16px; }
.ccb-nudge-t small { display: block; font-size: 14px; color: var(--muted); }
.ccb-nudge-go { flex: none; display: inline-flex; align-items: center; gap: 2px; font-size: 14px; font-weight: 700; color: var(--gold-ink); white-space: nowrap; }
.ccb-nudge-go .i { width: 16px; height: 16px; }
@media (max-width: 359px) { .ccb-nudge-go { font-size: 0; } .ccb-nudge-go .i { width: 20px; height: 20px; } } /* 最窄的手機只留箭頭，字才不會折成四行 */
.ccb-paypick { display: grid; grid-template-columns: 1fr; gap: 10px; }
.ccb-paycard { display: flex; flex-direction: column; gap: 2px; text-align: left; padding: 14px 16px; border: 1px solid var(--lux-rule); border-radius: 12px; background: #fff; color: var(--lux-cocoa); cursor: pointer; font: inherit; }
.ccb-paycard b { font-size: 17px; }
.ccb-paycard span { font-size: 14px; color: var(--muted); }
.ccb-paycard.is-on { border-color: var(--lux-gold); box-shadow: 0 0 0 1px var(--lux-gold); }
/* 方案卡片看得出可以按（Wei 11-15「按鈕可以更明顯」，1.0.77）：金色框、陰影、底部深色按鈕 */
.ccb .ccb-paycard { border: 1.5px solid var(--lux-gold, #c9a46a); box-shadow: 0 2px 10px rgba(62, 48, 51, .08); transition: transform .1s, box-shadow .15s; }
.ccb .ccb-paycard:hover, .ccb .ccb-paycard:focus-visible { box-shadow: 0 4px 16px rgba(62, 48, 51, .16); }
.ccb .ccb-paycard:active { transform: translateY(1px); }
.ccb .ccb-paycard:disabled { opacity: .6; cursor: progress; }
.ccb .ccb-paycard-go { display: flex; align-items: center; justify-content: center; gap: 6px; margin-top: 12px; padding: 11px 14px; border-radius: 999px; background: var(--ink, #3e3033); color: #fff; font-style: normal; font-weight: 700; font-size: 16px; line-height: 1.2; }
.ccb .ccb-paycard-go svg { width: 18px; height: 18px; flex: none; }
.ccb .ccb-paycard:hover .ccb-paycard-go, .ccb .ccb-paycard:focus-visible .ccb-paycard-go { background: var(--ink-deep, #2a2023); }
.ccb.cb-book p.ccb-pkg-badge { display: inline-block; margin: 0 0 14px; padding: 5px 14px; border-radius: 999px; background: var(--lux-gold); color: #fff; font-size: 15px; font-weight: 700; line-height: 1.5; }
.ccb.cb-book p.ccb-pkg-more { margin: 14px 0 0; }
.ccb-paycard span b.ccb-pkg-rate { font-size: 15px; color: var(--lux-cocoa); }
.ccb.cb-book p.ccb-pkg-more a { display: inline-flex; align-items: center; gap: 2px; color: var(--gold-ink); font-weight: 700; text-decoration: underline; text-underline-offset: 3px; }
.ccb.cb-book p.ccb-pkg-more .i { width: 16px; height: 16px; }
/* 沒帶諮詢師進來：諮詢師卡 */
.ccb-whos { display: grid; grid-template-columns: 1fr; gap: 14px; }
.ccb-who { padding: 16px; background: #fff; border: 1px solid var(--lux-rule); border-radius: 14px; }
.ccb-who h2 { font-size: 22px; }
.ccb-who h2::after { display: none !important; }
.ccb-who h2 small { font-size: 15px; font-weight: 400; margin-left: 8px; color: var(--muted); font-family: var(--f); }
.ccb-who-modes { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 12px; }
/* 完成頁：這次預約的時間 */
.ccb.cb-book .ccb-donebox { display: flex; gap: 10px; align-items: flex-start; margin-top: 14px; padding: 12px 14px; background: #fff; border: 1px solid var(--lux-rule); border-radius: 12px; font-size: 15px; line-height: 1.6; }
.ccb-donebox .i { width: 20px; height: 20px; flex: none; margin-top: 2px; }
@media (min-width: 700px) {
  .ccb-paypick, .ccb-whos { grid-template-columns: 1fr 1fr; }
}
/* 桌機：月曆和表單不要拉到整個版面寬 */
.ccb.cb-book .ccb-tzbar, .ccb.cb-book .ccb-picker, .ccb.cb-book #ccb-step-form .shell > * { max-width: 640px; }
@media (min-width: 700px) {
  .ccb.cb-book .ccb-cal-day { aspect-ratio: auto; height: 46px; }
}

/* ── 預約問題 ── */
/* 預約頁：是／否用兩顆大按鈕（手機好按） */
.ccb fieldset.ccb-q { border: 0; padding: 0; margin: 0 0 14px; min-width: 0; }
.ccb fieldset.ccb-q legend { padding: 0; margin-bottom: 6px; font-size: 15px; font-weight: 600; line-height: 1.5; }
.ccb-yesno { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; max-width: 420px; }
.ccb-yesno label { display: flex; align-items: center; justify-content: center; gap: 6px; min-height: 44px; border: 1px solid var(--ccb-line); border-radius: 8px; background: #fff; font-weight: 600; cursor: pointer; margin: 0; }
.ccb-yesno input { width: 18px; height: 18px; margin: 0; }
.ccb-yesno label:has(input:checked) { border-color: var(--ccb-purple); box-shadow: 0 0 0 1px var(--ccb-purple); }
.ccb-check.ccb-q { line-height: 1.6; margin: 4px 0 14px; }
.ccb-hint { display: block; font-size: 13px; font-weight: 400; color: var(--ccb-sub); margin-top: 2px; }
/* 後台：題目編輯 */
.ccb-qlist { margin: 6px 0 14px; padding-left: 22px; }
.ccb-qlist li { margin: 4px 0; }
.ccb-qcard { border: 1px solid var(--ccb-line); border-radius: 12px; padding: 12px 14px; margin: 0 0 10px; background: #fff; }
.ccb-qcard-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 6px; }
.ccb-qcard-head .ccb-btn { margin: 0 0 0 4px; min-height: 36px; }
.ccb-qcard > label { display: block; font-size: 14px; font-weight: 600; margin: 0 0 8px; }
.ccb-qcard > label[hidden] { display: none; }
.ccb-qcard textarea { min-height: 56px; }
.ccb-qcard .ccb-form-row { align-items: center; margin: 4px 0; }
.ccb-qcard .ccb-form-row > label.ccb-inline { flex: none; font-weight: 400; }
.ccb-qmodes { display: inline-flex; flex-wrap: wrap; gap: 4px 10px; align-items: center; font-size: 14px; }
.ccb-qmodes label { font-weight: 400 !important; }
.ccb.cb-book .flow-hero .btn-row { margin-top: 14px; }
/* 預約問題分兩區：是／否題目、送出前打勾確認（Wei 10-28：選項要統一） */
.ccb .ccb-form-h { font-size: 17px; font-weight: 700; margin: 22px 0 10px; color: var(--ccb-text); }
.ccb.cb-book h3.ccb-form-h { font-family: var(--f) !important; font-weight: 700 !important; letter-spacing: .02em !important; }
.ccb-confirms { margin: 18px 0 6px; padding: 12px 14px; border: 1px solid var(--ccb-line); border-radius: 12px; background: #fff; }
.ccb-confirms .ccb-form-h { margin: 0 0 6px; font-size: 15px; }
.ccb-confirms .ccb-check { margin: 8px 0; line-height: 1.6; }
.ccb-report .ccb-nth { flex: 0 1 170px !important; }
/* 最近可以約：一按就選好（月曆上要翻頁找的日期少按幾下） */
.ccb-soon { margin: 0 0 14px; }
.ccb-soon-h { font-weight: 700; margin: 0 0 8px; }
.ccb-soon-list { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.ccb-soon-btn { display: flex; flex-direction: column; align-items: flex-start; justify-content: center; min-height: 56px; padding: 6px 12px; border: 1px solid var(--ccb-line); border-radius: 8px; background: #fff; color: var(--ccb-text); font: inherit; font-size: 14px; line-height: 1.4; text-align: left; cursor: pointer; }
.ccb-soon-btn b { font-size: 17px; }
.ccb-soon-btn:hover { border-color: var(--ccb-purple); }
.ccb-soon-btn.is-picked { background: var(--ccb-purple); border-color: var(--ccb-purple); color: #fff; }
.ccb-soon .ccb-small { margin: 8px 0 0; }
@media (min-width: 700px) { .ccb-soon-list { grid-template-columns: repeat(4, 1fr); } }
/* 送出前檢查：缺的欄位標紅，提示寫在欄位下面 */
.ccb .is-bad input:not([type=radio]):not([type=checkbox]), .ccb .is-bad select, .ccb .is-bad textarea { border-color: var(--ccb-red) !important; }
.ccb .is-bad .ccb-yesno label { border-color: #E3A8A3; }
.ccb label.ccb-check.is-bad input { outline: 2px solid var(--ccb-red); outline-offset: 1px; }
.ccb-field-err { color: var(--ccb-red); font-size: 14px; font-weight: 600; margin: 6px 0 0; }
.ccb-check + .ccb-field-err { margin: -4px 0 10px 28px; }
.ccb-mailfix { font-size: 14px; margin: 6px 0 0; color: var(--ccb-sub); }
.ccb-mailfix .ccb-link { font-size: 14px; font-weight: 700; }
/* 諮詢師後台：今天、明天的預約 */
.ccb-badge-today { background: var(--ccb-orange-soft); color: #B4561C; }
.ccb-bk .ccb-meet { margin: 0 0 4px; }
/* 從付款頁按上一頁回來：剛才那筆還沒付款 */
.ccb-pending { background: #fff; border: 1px solid var(--lux-gold, var(--ccb-line)); border-radius: 12px; padding: 12px 14px; margin: 0 0 14px; }
.ccb-pending p { margin: 0 0 8px; }
.ccb-pending .btn-row { margin: 8px 0 0; display: flex; flex-wrap: wrap; gap: 8px; }

/* ══ 諮詢師後台 /pro/（10-28 重做：Wei「手機、電腦版都不好用」）══
 * 手機：分頁鈕固定在上面，預約是卡片，點了在原地展開；電腦（≥960px）：左邊清單、右邊詳細，班表分兩欄。
 * 顏色跟預約頁（官網 B 方案）一致：可可色主按鈕、金色只點綴、細框線。 */
.ccb { --p-gap: 12px; --p-ink: #3E3033; --p-sub: #6B6158; --p-line: #E6DDD1; --p-bg: #FBF7F1; --p-gold: #C9962B; --p-gold-soft: #F7EBD3; --p-ok: #23774A; --p-ok-soft: #E4F1E8; --p-warn: #A2541A; --p-warn-soft: #FCEBDC; }
.ccb.ccb-pro { --ccb-purple: var(--p-ink); --ccb-text: var(--p-ink); --ccb-sub: var(--p-sub); --ccb-line: var(--p-line); --ccb-soft: var(--p-gold-soft);
  max-width: 1120px; font-family: "Noto Sans TC", "PingFang TC", "Microsoft JhengHei", system-ui, sans-serif; padding-bottom: 32px; }
.ccb-pro .ccb-btn-primary:hover { background: #2C2224; }
.ccb-pro .ccb-btn { border-radius: 10px; }
.ccb-pro .ccb-btn-block { min-height: 48px; font-size: 16px; margin: 12px 0 0; }
.ccb-pro .ccb-link { color: var(--p-ink); font-weight: 600; }
.ccb-pro p { margin: 0 0 8px; }
.pro-top { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin: 0 0 12px; flex-wrap: wrap; }
.pro-pills { display: flex; gap: 6px; flex-wrap: wrap; justify-content: flex-end; }
.pro-gpill.is-link { background: #fff; color: var(--p-ink); box-shadow: inset 0 0 0 1px var(--p-line); }
a.pro-gpill { text-decoration: none; display: inline-flex; align-items: center; }
.pro-hello { font-size: 22px; font-weight: 700; margin: 0 !important; color: var(--p-ink); }
.pro-gpill { border: 0; border-radius: 999px; padding: 6px 12px; font-size: 13px; font-weight: 700; cursor: pointer; white-space: nowrap; }
.pro-gpill.is-ok { background: var(--p-ok-soft); color: var(--p-ok); }
.pro-gpill.is-warn { background: var(--p-warn-soft); color: var(--p-warn); }
/* 導覽（Wei 11-04）：手機＝固定在螢幕最下面（拇指點得到）；電腦（960 以上）＝左側欄，見下面 */
.pro-tabs { position: fixed; left: 0; right: 0; bottom: 0; z-index: 9990; display: grid; grid-template-columns: repeat(5, 1fr); gap: 2px; margin: 0; padding: 4px 6px calc(4px + env(safe-area-inset-bottom)); background: rgba(255, 255, 255, .97); border-top: 1px solid var(--p-line); box-shadow: 0 -2px 14px rgba(62, 48, 51, .08); }
.pro-tabs button { position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 3px; min-height: 54px; padding: 4px 0; border: 0; border-radius: 12px; background: none; color: var(--p-sub); font-size: 12px; font-weight: 700; line-height: 1.1; cursor: pointer; white-space: nowrap; }
.pro-tabs button.is-on { color: var(--p-ink); background: var(--p-bg); }
.pro-tabs button.is-on .pro-ti { stroke-width: 2.2; }
.pro-ti { width: 24px; height: 24px; flex: none; }
.pro-tabs .pro-count { position: absolute; top: 3px; left: calc(50% + 5px); margin: 0; }
.pro-dot { position: absolute; top: 6px; left: calc(50% + 9px); width: 8px; height: 8px; border-radius: 50%; background: var(--p-warn); }
.ccb.ccb-pro-app { padding-bottom: calc(84px + env(safe-area-inset-bottom)); padding-left: max(16px, env(safe-area-inset-left)); padding-right: max(16px, env(safe-area-inset-right)); } /* 手機左右留白（Vivian 11-09：卡片貼齊螢幕邊緣） */
.ccb-pro.is-typing .pro-tabs { display: none; } /* 手機打字時收起來，不擋輸入框 */
/* 手機下方選單（Wei 11-13 更明顯 → 11-14 白底還是「不清楚、不明顯」，選 C「品牌紫底＋白色選中」，跟會員中心底部列同一套）：
   紫底 #4e4770（跟學院「查看」按鈕同一個紫）、沒選到白字 85%、圖示 26px；選到的那格白底紫字 */
@media (max-width: 959.98px) {
  .pro-tabs { background: #4e4770; border-top: 0; box-shadow: 0 -6px 20px rgba(40, 30, 60, .3); padding: 8px 8px calc(6px + env(safe-area-inset-bottom)); }
  .pro-tabs button, .pro-tabs button:hover, .pro-tabs button:focus { min-height: 58px; color: rgba(255, 255, 255, .85); background: none; font-size: 13px; }
  .pro-tabs .pro-ti { width: 26px; height: 26px; stroke-width: 2; }
  .pro-tabs button.is-on, .pro-tabs button.is-on:hover, .pro-tabs button.is-on:focus { color: #4e4770; background: #fff; box-shadow: none; }
  .pro-tabs button.is-on .pro-ti { stroke-width: 2.2; }
  .pro-tabs .pro-count { box-shadow: 0 0 0 2px #4e4770; }
  .pro-tabs .pro-dot { background: #ffd28a; }
  .ccb.ccb-pro-app { padding-bottom: calc(96px + env(safe-area-inset-bottom)); }
}
.ccb-pro-page .ccb-toast { bottom: calc(80px + env(safe-area-inset-bottom)); }
.pro-hello small { display: none; }
@media (min-width: 960px) {
  .ccb.ccb-pro-app { padding-bottom: 32px; padding-left: 0; padding-right: 0; }
  .ccb-pro-page .ccb-toast { bottom: 24px; }
  .pro-app { display: grid; grid-template-columns: 208px minmax(0, 1fr); gap: 24px; align-items: start; }
  .pro-side { position: sticky; top: calc(var(--ccb-top, 0px) + 16px); }
  .pro-side .pro-top { display: block; margin: 0 0 14px; }
  .pro-hello small { display: block; margin-top: 2px; font-size: 12.5px; font-weight: 600; color: var(--p-sub); }
  .pro-side .pro-pills { display: grid; justify-content: stretch; gap: 6px; margin-top: 12px; }
  .pro-side .pro-gpill { padding: 8px 12px; text-align: left; white-space: normal; }
  .pro-tabs { position: static; grid-template-columns: 1fr; gap: 2px; padding: 6px; background: #EFE8DE; border: 0; border-radius: 14px; box-shadow: none; }
  .pro-tabs button { flex-direction: row; justify-content: flex-start; gap: 10px; min-height: 44px; padding: 0 12px; border-radius: 10px; font-size: 15px; }
  .pro-tabs button.is-on { background: #fff; box-shadow: 0 1px 3px rgba(62, 48, 51, .14); }
  .pro-ti { width: 20px; height: 20px; }
  .pro-tabs .pro-count, .pro-dot { position: static; margin-left: auto; }
  .ccb-pro.is-typing .pro-tabs { display: grid; }
}
.pro-count { display: inline-block; min-width: 18px; height: 18px; padding: 0 5px; margin-left: 4px; border-radius: 9px; background: var(--p-warn); color: #fff; font-size: 11px; line-height: 18px; vertical-align: 2px; }
.pro-h { display: block; font-size: 14px; font-weight: 700; color: var(--p-sub); letter-spacing: .03em; margin: 18px 0 8px !important; }
.pro-h.is-warn { color: var(--p-warn); }
.pro-listcol > .pro-h:first-child { margin-top: 0 !important; }
.pro-day { font-size: 14px; font-weight: 700; margin: 12px 0 6px !important; color: var(--p-ink); }
.pro-day b { color: var(--p-warn); margin-right: 6px; }
.pro-empty { color: var(--p-sub); background: #fff; border: 1px dashed var(--p-line); border-radius: 12px; padding: 18px; text-align: center; }
.pro-hint { font-size: 13px; color: var(--p-sub); line-height: 1.6; margin: 8px 0 0 !important; }
.pro-sub { font-size: 13px; font-weight: 700; color: var(--p-sub); margin: 14px 0 6px !important; }
.pro-card { background: #fff; border: 1px solid var(--p-line); border-radius: 14px; padding: 14px; margin: 0 0 var(--p-gap); }

/* 預約卡 */
.pro-bk { display: grid; grid-template-columns: 60px minmax(0, 1fr) auto 14px; gap: 10px; align-items: center; width: 100%; min-height: 62px; margin: 0 0 8px; padding: 10px 12px 10px 14px; text-align: left; background: #fff; border: 1px solid var(--p-line); border-radius: 12px; color: var(--p-ink); font: inherit; cursor: pointer; }
.pro-bk::after { content: ''; width: 8px; height: 8px; border-right: 2px solid #A99C90; border-bottom: 2px solid #A99C90; transform: rotate(-45deg); justify-self: center; }
.pro-bk:hover { border-color: #CDBFAE; }
.pro-bk.is-on { border-color: var(--p-ink); box-shadow: 0 0 0 1px var(--p-ink); }
.pro-bk.is-todo { border-left: 4px solid var(--p-warn); }
.pro-bk.is-dim { opacity: .55; }
.pro-bk-when b { display: block; font-size: 18px; line-height: 1.2; font-variant-numeric: tabular-nums; }
.pro-bk-when small, .pro-bk-who small { display: block; font-size: 12.5px; color: var(--p-sub); line-height: 1.35; margin-top: 2px; }
.pro-bk-who b { display: block; font-size: 16px; line-height: 1.3; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pro-bk-tags { display: flex; flex-direction: column; align-items: flex-end; gap: 4px; }
.pro-bk-tags .ccb-badge, .pro-dtags .ccb-badge { font-size: 12px; padding: 1px 8px; }
.ccb-badge-today { background: var(--p-warn-soft); color: var(--p-warn); }
.pro-past > summary { cursor: pointer; list-style: none; }
.pro-past > summary::-webkit-details-marker { display: none; }
.pro-past > summary::after { content: ' ▾'; }
.pro-past[open] > summary::after { content: ' ▴'; }

/* 一筆預約的詳細 */
.pro-detail { background: #fff; border: 1px solid var(--p-ink); border-radius: 14px; padding: 14px; margin: -2px 0 12px; }
.pro-dtitle { font-size: 21px; font-weight: 700; margin: 0 !important; line-height: 1.3; }
.pro-dmeta { color: var(--p-sub); font-size: 14px; margin: 2px 0 0 !important; }
.pro-dtags { margin: 6px 0 0 !important; display: flex; flex-wrap: wrap; gap: 4px; }
.pro-acts { display: flex; flex-wrap: wrap; gap: 8px; margin: 12px 0; }
.pro-act { flex: 1 1 0; min-width: 84px; display: inline-flex; align-items: center; justify-content: center; min-height: 44px; padding: 6px 10px; border: 1px solid var(--p-line); border-radius: 10px; background: #fff; color: var(--p-ink) !important; font-size: 14px; font-weight: 700; text-decoration: none !important; }
.pro-act:hover { border-color: var(--p-ink); }
.pro-act.is-main { flex-basis: 100%; background: var(--p-ink); border-color: var(--p-ink); color: #fff !important; font-size: 16px; min-height: 48px; }
.pro-dl { display: grid; grid-template-columns: 56px minmax(0, 1fr); gap: 6px 12px; margin: 4px 0 0; font-size: 15px; }
.pro-dl dt { color: var(--p-sub); font-size: 13px; padding-top: 2px; font-weight: 400; }
.pro-dl dd { margin: 0; overflow-wrap: anywhere; }
.pro-dl dd a { text-decoration: underline; text-underline-offset: 2px; }
.pro-qa { margin: 14px 0 0; padding: 4px 12px 8px; background: var(--p-bg); border-radius: 10px; }
.pro-qa .pro-sub { margin-top: 8px !important; }
.pro-qa-row { display: flex; justify-content: space-between; align-items: flex-start; gap: 10px; padding: 6px 0; border-top: 1px dashed var(--p-line); font-size: 14px; line-height: 1.5; }
.pro-qa-row:first-of-type { border-top: 0; }
.pro-qa-v { flex: none; font-size: 13px; padding: 0 10px; border-radius: 999px; background: #fff; border: 1px solid var(--p-line); line-height: 22px; }
.pro-qa-v.is-yes { background: var(--p-ok-soft); color: var(--p-ok); border-color: transparent; }
.pro-qa-v.is-no { background: #EEE8E2; color: var(--p-sub); border-color: transparent; }
.pro-qa-row.is-long { display: block; }
.pro-qa-row.is-long .pro-qa-v { display: block; margin-top: 4px; border-radius: 8px; font-weight: 400; line-height: 1.5; padding: 4px 10px; }

/* 要做的事：填分鐘、傳 LINE、報告、改期 */
.ccb .pro-task { margin: 14px 0 0; padding: 14px; background: #fff; border: 1px solid var(--p-line); border-radius: 12px; }
.ccb .pro-task.is-now { border-color: var(--p-gold); background: #FFFBF3; }
.ccb .pro-task .pro-task { margin-top: 10px; padding: 0; border: 0; background: none; }
.pro-task-h { font-size: 16px; font-weight: 700; margin: 0 0 10px !important; color: var(--p-ink); }
.pro-money { font-size: 15px; }
.pro-links { display: flex; flex-wrap: wrap; gap: 6px 16px; margin: 6px 0 0 !important; }
.ccb .ccb-min-quick { display: grid; grid-template-columns: repeat(4, 1fr); gap: 6px; margin-bottom: 10px; }
.ccb .ccb-min-quick .ccb-btn { margin: 0; width: 100%; min-height: 44px; font-size: 16px; border-radius: 10px; }
.ccb .ccb-min-quick input { min-height: 44px; text-align: center; padding: 4px; border-radius: 10px; }
.ccb .ccb-min-preview { background: #fff; border: 1px solid var(--p-line); border-radius: 10px; padding: 10px 12px; margin: 0 0 8px; font-size: 15px; line-height: 1.6; }
.pro-note > summary { font-size: 14px; color: var(--p-sub); cursor: pointer; padding: 4px 0; }
.pro-note input { margin-top: 6px; }
.ccb .ccb-linemsg pre { white-space: pre-wrap; background: var(--p-bg); border: 1px solid var(--p-line); border-radius: 10px; padding: 10px 12px; font-size: 14px; font-family: inherit; margin: 0; line-height: 1.7; }
.ccb .ccb-report.pro-task { background: #fff; }
.pro-file { display: flex; flex-direction: column; background: var(--p-bg); border-radius: 10px; padding: 8px 12px; margin: 0 0 10px !important; overflow-wrap: anywhere; }
.pro-file small { color: var(--p-sub); font-size: 12.5px; }
.pro-filebtn { position: relative; display: flex; align-items: center; justify-content: center; min-height: 52px; padding: 8px 14px; border: 1.5px dashed var(--p-gold); border-radius: 10px; background: #FFFBF3; color: var(--p-ink); font-weight: 700; text-align: center; cursor: pointer; overflow-wrap: anywhere; }
.pro-filebtn input { position: absolute; inset: 0; width: 100%; height: 100%; opacity: 0; cursor: pointer; }
.pro-report-row { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-top: 10px; }
.ccb .pro-report-row .ccb-nth { display: inline-flex !important; align-items: center; gap: 6px; font-weight: 400; margin: 0; flex: none !important; }
.ccb .pro-report-row .ccb-nth input { width: 64px; min-height: 40px; text-align: center; padding: 4px; }
.pro-report-row .ccb-btn { margin: 0; }
.pro-more { margin: 14px 0 0; display: grid; gap: 8px; }
.pro-more .ccb-btn { width: 100%; margin: 0; }
.pro-choice { display: grid; gap: 8px; margin: 0 0 6px; }
/* 改買包時數的期限：兩個選項分開、框內留白（Wei 11-15「當天／24 小時格子太擠」） */
.pro-topwin { display: grid; gap: 12px; margin: 14px 0 16px; }
.pro-topwin .pro-radio { padding: 14px 16px; gap: 12px; }
.pro-topwin .pro-radio small { margin-top: 4px; }
.pro-radio { display: flex !important; align-items: flex-start; gap: 10px; padding: 10px 12px; border: 1px solid var(--p-line); border-radius: 10px; background: #fff; cursor: pointer; font-weight: 400 !important; margin: 0 !important; }
.pro-radio:has(input:checked) { border-color: var(--p-ink); box-shadow: 0 0 0 1px var(--p-ink); }
.pro-radio input { width: 18px; height: 18px; margin: 3px 0 0; flex: none; }
.pro-radio:has(input:disabled) { opacity: .55; cursor: not-allowed; }
.pro-radio.is-off { opacity: 1; background: var(--p-bg); } .pro-radio.is-off b, .pro-radio.is-off input { opacity: .5; } .pro-radio.is-off small { color: var(--p-warn); font-weight: 600; } /* 不能選的原因要看得清楚（Vivian 11-09） */
.ccb-wslot.is-bad { outline: 2px solid var(--ccb-red); outline-offset: 2px; border-radius: 8px; }
.pro-radio b { display: block; font-size: 15px; }
.pro-radio small { display: block; font-size: 13px; color: var(--p-sub); line-height: 1.5; }
.ccb .pro-field { display: block; font-size: 14px; font-weight: 600; margin: 10px 0 0; }
.ccb .pro-field input { margin-top: 4px; }
.pro-picked { font-weight: 700; margin: 10px 0 0 !important; }
.pro-row2 { display: grid; grid-template-columns: 1fr 2fr; gap: 8px; margin-top: 12px; }
.pro-row2 .ccb-btn { margin: 0; min-height: 48px; }
.ccb-pro .ccb-slot-days { max-height: 260px; }

/* 班表：一段一個可收合區塊 */
.pro-sec { background: #fff; border: 1px solid var(--p-line); border-radius: 14px; margin: 0 0 var(--p-gap); }
.pro-sec > summary { position: relative; display: flex; flex-direction: column; gap: 2px; padding: 14px 44px 14px 16px; cursor: pointer; list-style: none; }
.pro-sec > summary::-webkit-details-marker { display: none; }
.pro-sec > summary::after { content: ''; position: absolute; right: 20px; top: 50%; width: 8px; height: 8px; margin-top: -6px; border-right: 2px solid #A99C90; border-bottom: 2px solid #A99C90; transform: rotate(45deg); transition: transform .15s; }
.pro-sec[open] > summary::after { transform: rotate(-135deg); margin-top: -2px; }
.pro-sec-t { font-size: 16px; font-weight: 700; color: var(--p-ink); }
.pro-sec-v { font-size: 13.5px; color: var(--p-sub); line-height: 1.5; }
.pro-sec-b { padding: 0 16px 16px; border-top: 1px solid var(--p-line); }
.pro-sec-b > .pro-hint:first-child { margin-top: 12px !important; }
.ccb .pro-form label, .ccb .pro-sec-b .ccb-home-area { display: block; font-size: 14px; font-weight: 600; margin: 12px 0 0; }
.ccb .pro-form label input, .ccb .pro-form label select, .ccb .pro-form label textarea { margin-top: 4px; }
.ccb .pro-form label small { display: block; font-weight: 400; color: var(--p-sub); font-size: 12.5px; margin-top: 3px; }
.pro-grid2 { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 0 10px; }
.pro-grid2 > * { min-width: 0; }
/* iPhone Safari：日期、時間欄位有內建最小寬度、文字置中，兩欄並排會擠在一起、超出卡片（Wei 11-13 手機截圖） */
.ccb input, .ccb select, .ccb textarea { box-sizing: border-box; }
.ccb input[type=date], .ccb input[type=time], .ccb input[type=datetime-local] { display: block; min-width: 0; -webkit-appearance: none; appearance: none; text-align: left; }
.ccb input[type=date]::-webkit-date-and-time-value, .ccb input[type=time]::-webkit-date-and-time-value, .ccb input[type=datetime-local]::-webkit-date-and-time-value { text-align: left; }
.pro-grid2 > label, .pro-grid2 > .pro-field { margin-top: 12px !important; }
.pro-field > span:first-child { display: block; font-size: 14px; font-weight: 600; margin-bottom: 4px; }
.pro-checks { display: flex; flex-wrap: wrap; gap: 4px 12px; min-height: 46px; align-items: center; }
.ccb .pro-checks .ccb-inline { margin: 0 !important; font-weight: 400 !important; }
.ccb .pro-toggle { display: flex !important; align-items: center; gap: 10px; padding: 10px 12px; border: 1px solid var(--p-line); border-radius: 10px; margin: 10px 0 0 !important; cursor: pointer; }
.ccb .pro-toggle input { width: 20px; height: 20px; margin: 0; flex: none; }
.pro-toggle small { display: block; font-weight: 400; color: var(--p-sub); font-size: 13px; }
.pro-sec .ccb-wdays { grid-template-columns: 1fr; margin-top: 12px; }
.pro-sec .ccb-wday { padding: 8px 12px; }
.ccb .ccb-wslot input[type=time] { width: 150px; flex: none; }
.ccb .pro-sec .ccb-wslot-del { width: 40px; height: 40px; }
.pro-list { display: grid; gap: 0; margin: 12px 0 0; border: 1px solid var(--p-line); border-radius: 12px; overflow: hidden; background: #fff; }
.pro-list-row { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 10px 12px; border: 0; border-top: 1px solid var(--p-line); background: #fff; width: 100%; text-align: left; font: inherit; color: var(--p-ink); }
.pro-list-row:first-child { border-top: 0; }
.pro-list-row b { font-size: 15px; }
.pro-list-row small { display: block; font-size: 13px; color: var(--p-sub); }
.pro-list-row .ccb-btn { margin: 0; flex: none; }
.pro-list-row.is-link { cursor: pointer; }
.pro-list-row.is-link:hover { background: var(--p-bg); }
.pro-list-row.is-link .pro-amt::after { content: ' ›'; color: #A99C90; }
.pro-amt { flex: none; font-variant-numeric: tabular-nums; }
.ccb-pro .ccb-qlist { font-size: 14px; }
.ccb-pro .ccb-qcard { border-color: var(--p-line); }

/* 收入 */
.pro-seg { display: flex; gap: 6px; overflow-x: auto; margin: 0 0 12px; padding-bottom: 2px; -webkit-overflow-scrolling: touch; }
.pro-seg button { flex: none; min-height: 40px; padding: 0 16px; border: 1px solid var(--p-line); border-radius: 999px; background: #fff; color: var(--p-sub); font-size: 15px; font-weight: 700; cursor: pointer; }
.pro-seg button.is-on { background: var(--p-ink); border-color: var(--p-ink); color: #fff; }
.pro-stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
.pro-stats > div { background: #fff; border: 1px solid var(--p-line); border-radius: 12px; padding: 10px 12px; }
.pro-stats span { display: block; font-size: 12.5px; color: var(--p-sub); }
.pro-stats b { display: block; font-size: 18px; font-variant-numeric: tabular-nums; margin-top: 2px; overflow-wrap: anywhere; }

/* 日曆 */
.pro-gstate { font-size: 18px; font-weight: 700; margin: 0 !important; }
.pro-gstate.is-ok { color: var(--p-ok); }
.pro-gstate.is-warn { color: var(--p-warn); }
.pro-card .pro-acts { margin-bottom: 0; }
.pro-card .pro-acts .ccb-btn { margin: 0; }
.pro-bullets { margin: 0; padding-left: 20px; font-size: 14px; line-height: 1.7; }
.pro-bullets li { margin: 4px 0; }
.ccb-cals .pro-task-h { margin-top: 4px !important; }
.ccb-cals .pro-choice + .pro-task-h { margin-top: 18px !important; }

/* 電腦版：左清單右詳細、班表兩欄 */
@media (min-width: 960px) {
  .pro-split { display: grid; grid-template-columns: minmax(340px, 400px) minmax(0, 1fr); gap: 20px; align-items: start; }
  .pro-detailcol { position: sticky; top: 64px; max-height: calc(100vh - 80px); overflow-y: auto; border-radius: 14px; }
  .admin-bar .pro-detailcol { top: 96px; max-height: calc(100vh - 112px); }
  .pro-detailcol .pro-detail { margin: 0; padding: 20px; border-color: var(--p-line); box-shadow: 0 2px 12px rgba(62, 48, 51, .06); }
  .pro-detailcol .pro-empty { margin: 0; padding: 60px 20px; }
  .pro-detailcol .pro-act.is-main { flex-basis: auto; flex-grow: 2; }
  .pro-pane-schedule .ccb-pane-cols, .pro-sched { display: grid; grid-template-columns: 1fr 1fr; gap: 0 16px; align-items: start; }
  .pro-top { max-width: none; }
  .pro-grid-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 0 16px; align-items: start; }
}
.ccb-pro h3.pro-h, .ccb-pro .pro-past > summary.pro-h { font-size: 15px !important; line-height: 1.4 !important; font-family: inherit !important; }
.pro-bk.is-on::after { transform: rotate(45deg); }
@media (min-width: 960px) { .pro-bk.is-on::after { transform: rotate(-45deg); } }
@media (min-width: 960px) { .pro-detailcol .ccb-min-quick { grid-template-columns: repeat(8, 1fr); } }
.ccb .pro-sec > summary { padding: 14px 44px 14px 16px; color: var(--p-ink); font-size: 16px; }
.ccb .pro-past > summary { padding: 0; color: var(--p-sub); }
.pro-stats { grid-template-columns: .7fr 1fr 1fr; }
.pro-stats > div { padding: 10px; min-width: 0; }
.pro-stats b { font-size: 16px; white-space: nowrap; overflow-wrap: normal; }
@media (min-width: 600px) { .pro-stats b { font-size: 20px; } .pro-stats > div { padding: 12px 14px; } }
/* 學院佈景主題給按鈕 2px 字距＋全大寫：後台的卡片、分頁都是按鈕，要還原 */
.ccb.ccb-pro button, .ccb.ccb-pro .ccb-btn, .ccb.ccb-pro .pro-act, .ccb.ccb-pro input, .ccb.ccb-pro select { letter-spacing: normal !important; text-transform: none !important; }
.pro-bk { grid-template-columns: 64px minmax(0, 1fr) auto 14px; }
.pro-bk-when small { white-space: nowrap; }
/* 窄手機：標籤（尾款未付、今天…）移到名字下面，名字才不會被擠成一個字一行 */
@media (max-width: 420px) {
  .pro-bk { grid-template-columns: 60px minmax(0, 1fr) 14px; gap: 2px 10px; }
  .pro-bk-when { grid-row: 1 / span 2; }
  .pro-bk-who { grid-column: 2; grid-row: 1; }
  .pro-bk-tags { grid-column: 2; grid-row: 2; flex-direction: row; flex-wrap: wrap; justify-content: flex-start; align-items: center; }
  .pro-bk::after { grid-column: 3; grid-row: 1 / span 2; }
}
.pro-more-acc { border-top: 1px solid var(--p-line); padding: 12px 0 4px; margin-top: 8px; }
.pro-more-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; overflow-wrap: anywhere; }
.pro-more-head .ccb-btn { margin: 0; flex: none; }
.ccb-more > .ccb-more-list > .ccb-btn-block { margin-top: 14px; }
.ccb .ccb-linemsg .ccb-btn-block + .ccb-btn-block { margin-top: 8px; }
/* 報告上傳後「給飼主的 LINE 訊息」：標題和複製鈕同一行（11-15） */
.ccb .ccb-reportmsg { margin-top: 12px; }
.ccb .ccb-linemsg pre { overflow-wrap: anywhere; } /* 雲端、學院的長網址在手機上要能斷行 */
.ccb .ccb-reportshare { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 10px; margin: 4px 0 10px; } /* 舊上傳的報告：「產生下載連結」（1.0.69） */
.ccb .ccb-reportmsg .pro-task-h { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
/* 查飼主、過往預約 */
.pro-search { margin: 0 0 8px; }
.ccb .pro-search input { min-height: 44px; border-radius: 10px; border-color: var(--p-line); background: #fff; padding-left: 14px; }
.pro-search-res .pro-list { margin: 0 0 12px; }
/* 查預約紀錄收成查飼主底下一行字，不跟「幫飼主預約」搶（Rumi 11-05：按鈕太雜） */
.ccb .pro-histq { background: none; border: 0; margin: 0 0 10px; }
.ccb .pro-histq > summary { flex-direction: row; align-items: baseline; gap: 8px; padding: 2px 28px 2px 2px; font-size: 14px; }
.ccb .pro-histq > summary::after { right: 8px; }
.pro-histq .pro-sec-t { font-size: 14px; }
.pro-histq .pro-sec-v { font-size: 12.5px; }
.pro-histq[open] .pro-sec-b { margin-top: 6px; padding-top: 2px; background: #fff; border: 1px solid var(--p-line); border-radius: 14px; }
.pro-search-res .pro-hint { margin: 0 0 12px !important; }
.pro-hist { margin: 14px 0 0; }
.pro-hist .pro-list { margin-top: 0; }
.pro-hist-open { flex: 1; min-width: 0; display: block; text-align: left; background: none; border: 0; padding: 0; font: inherit; color: var(--p-ink); cursor: pointer; }
.pro-hist-open b { font-size: 15px; }
.pro-hist-open:hover b { text-decoration: underline; }
.ccb-ics .ccb-note { font-size: 13.5px; margin: 10px 0; }
.ccb-ics .pro-note ol { margin: 6px 0 4px; }
.ccb-ics-list .pro-list { margin: 10px 0 0; }
.pro-privacy { margin-top: 14px !important; padding-top: 12px; border-top: 1px solid var(--p-line); font-size: 12.5px !important; line-height: 1.6; }

/* ---------- 管理員後台（學院後台「諮詢預約」；Wei 10-28：UI／UX 也要好用）：沿用諮詢師後台的樣式 ---------- */
.adm-tabs { display: flex; align-items: center; gap: 4px; overflow-x: auto; margin: 10px 0 16px; padding: 4px; background: #EFE8DE; border-radius: 12px; -webkit-overflow-scrolling: touch; }
.adm-tabs a { flex: none; padding: 9px 14px; border-radius: 9px; color: var(--p-sub); font-size: 14px; font-weight: 700; text-decoration: none; }
.adm-tabs a:hover { color: var(--p-ink); }
.adm-tabs a.is-on { background: #fff; color: var(--p-ink); box-shadow: 0 1px 3px rgba(62, 48, 51, .14); }
.adm-tabs a:focus { box-shadow: none; outline: 2px solid var(--p-gold); outline-offset: -2px; }
.adm-tabs-ext { display: flex; gap: 0; margin-left: auto; flex: none; }
.adm-tabs-ext a { font-weight: 400; font-size: 13px; padding: 9px 10px; }
.adm-filter { margin: 0 0 14px; }
.adm-filter-row { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.adm-filter-row .pro-seg { margin: 0; flex: none; }
.ccb .adm-filter-row select { width: auto; min-height: 40px; flex: 1 1 130px; max-width: 200px; border-radius: 999px; border-color: var(--p-line); background-color: #fff; padding: 0 30px 0 14px; font-size: 14px; }
.ccb-pro .adm-hint { margin: -4px 0 8px !important; }
.wp-admin .pro-detailcol { top: 48px; max-height: calc(100vh - 64px); }
.adm-detail .pro-dtags .ccb-badge { font-size: 12px; padding: 1px 8px; }
.adm-money dt { white-space: nowrap; }
.ccb .adm-money dd { line-height: 1.6; }
.adm-order { display: block; font-size: 12.5px; color: var(--p-sub); }
.adm-acts { display: grid; grid-template-columns: repeat(auto-fill, minmax(130px, 1fr)); gap: 8px; }
.ccb .adm-acts .ccb-btn { margin: 0; min-height: 44px; border-color: var(--p-line); font-size: 14px; }
.ccb .adm-acts .ccb-btn:hover { border-color: var(--p-ink); }
.ccb .adm-acts .ccb-btn.is-on { border-color: var(--p-ink); box-shadow: 0 0 0 1px var(--p-ink); }
.ccb .adm-acts .adm-danger { color: #B3261E !important; }
.ccb-pro .ccb-action-pane:not(:empty) { margin: 12px 0 0; padding: 12px 14px 14px; border: 1px solid var(--p-line); border-radius: 12px; background: var(--p-bg); }
.adm-pane-h { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.adm-pane-h .pro-task-h { margin: 0 !important; }
.ccb .adm-close { font-size: 13px; font-weight: 400; color: var(--p-sub); }
.ccb-pro .pro-choice .ccb-btn { margin: 0; width: 100%; }
.ccb-pro .ccb-action-pane .ccb-inline { display: flex !important; align-items: center; gap: 8px; font-weight: 400 !important; }
.ccb-pro .ccb-action-pane .ccb-inline input { width: 18px; height: 18px; margin: 0; }
.adm-dl { grid-template-columns: 64px minmax(0, 1fr); }
.adm-hist { margin-top: 4px; }
.adm-log { margin-top: 14px; }
.adm-log .ccb-log { margin: 6px 0 0; }
.adm-back { margin: 0 0 10px !important; }
.adm-back a { color: var(--p-ink); font-weight: 700; text-decoration: none; }
.adm-one .pro-detail { border-color: var(--p-line); margin: 0; }
.pro-list-row > span:first-child { min-width: 0; }
.adm-crow { flex: 1; min-width: 0; color: var(--p-ink) !important; text-decoration: none !important; }
.adm-crow b { display: block; font-size: 16px; }
.adm-crow small { display: block; margin-top: 2px; }
.adm-clist { margin: 0 0 12px; }
.adm-clist .pro-list-row { padding: 12px 14px; }
.adm-clist .pro-list-row:hover { background: var(--p-bg); }
/* 諮詢師清單：每位下面列給飼主的預約連結（11-15） */
.adm-citem { border-top: 1px solid var(--p-line); }
.adm-citem:first-child { border-top: 0; }
.adm-citem > .pro-list-row { border-top: 0; }
.adm-clinks { padding: 0 14px 14px; }
.adm-clinks-h { margin: 0; font-size: 13px; font-weight: 700; color: var(--p-sub); }
.adm-clinks-h .ccb-warn { font-weight: 600; }
.adm-clinks .pro-list { margin-top: 6px; }
.adm-clist .adm-clinks .pro-list-row { padding: 8px 10px; }
.adm-clist .adm-clinks .pro-list-row:hover { background: #fff; }
.adm-clinks .pro-list-row > div { min-width: 0; }
.ccb .ccb-copy { min-height: 40px; min-width: 64px; } /* 預約連結的「複製」：手機好按 */
.adm-ctitle { margin: 0 0 12px !important; }
.adm-cform .pro-task:first-child { margin-top: 0; }
.adm-csave { max-width: 320px; }
.adm-adv { margin-top: 14px; }
.adm-remove { margin-top: 16px; }
.ccb-admin .ccb-sched { margin-top: 4px; }
a.pro-list-row { color: var(--p-ink) !important; text-decoration: none !important; }
.adm-pkrow .pro-amt { text-align: right; }
.adm-pkrow .pro-amt b { display: block; font-size: 16px; }
.adm-pkrow .pro-amt small, .adm-pk .pro-amt small { display: block; }
.adm-pkrow .pro-amt::after { content: '' !important; }
.adm-pkrow b .ccb-badge, .adm-pk .pro-dtitle .ccb-badge { font-size: 12px; padding: 1px 8px; vertical-align: 2px; }
.adm-pk-left { display: flex; align-items: baseline; flex-wrap: wrap; gap: 4px 8px; margin: 12px 0; padding: 12px 14px; background: var(--p-bg); border-radius: 12px; }
.adm-pk-left span { color: var(--p-sub); font-size: 14px; }
.adm-pk-left b { font-size: 26px; font-variant-numeric: tabular-nums; }
.adm-pk-left small { color: var(--p-sub); font-size: 13px; }
.adm-pk .pro-detail { margin: 0 0 12px; border-color: var(--p-line); }
.adm-pk .pro-sec { margin: 0 0 8px; }
@media (min-width: 960px) { .adm-pk { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 16px; align-items: start; } }
.adm-pkg-new { margin-top: 16px; }
.adm-new { max-width: 720px; }
.adm-new .pro-task:first-child { margin-top: 0; }
.adm-new .pro-task-h { font-size: 17px; }
.adm-find { margin: 6px 0 4px; }
.adm-find .pro-amt { color: var(--p-ink); font-weight: 700; font-size: 14px; }
.adm-loglist .pro-list-row b { font-weight: 400; font-size: 14.5px; line-height: 1.5; }
.adm-loglist .pro-list-row[hidden] { display: none; }
.ccb-admin .adm-settings { background: #fff; border: 1px solid var(--p-line); border-radius: 14px; padding: 4px 18px 0; }
.ccb-admin .adm-settings h4 { margin: 18px 0 0; padding-top: 16px; border-top: 1px solid var(--p-line); font-size: 16px; color: var(--p-ink); }
.ccb-admin .adm-settings h4:first-child { border-top: 0; padding-top: 10px; }
.ccb-admin .adm-settings > label { font-size: 14px; font-weight: 600; }
.ccb-admin .adm-settings .ccb-inline { font-weight: 400; }
.adm-savebar { grid-column: 1 / -1; position: sticky; bottom: 0; margin: 16px -18px 0; padding: 10px 18px 14px; background: linear-gradient(rgba(255,255,255,.6), #fff 30%); border-radius: 0 0 14px 14px; }
.adm-savebar .ccb-btn { margin: 0; max-width: 320px; }
.ccb-admin .ccb-pane > h3 { margin-top: 24px; }
/* 設定頁側欄 */
.adm-side { display: flex; gap: 6px; overflow-x: auto; position: sticky; top: 0; z-index: 20; margin: 0 0 12px; padding: 8px 0; background: #f0f0f1; -webkit-overflow-scrolling: touch; }
.adm-side button { flex: none; min-height: 36px; padding: 0 14px; border: 1px solid var(--p-line); border-radius: 999px; background: #fff; color: var(--p-sub); font-size: 14px; font-weight: 700; cursor: pointer; }
.adm-side button.is-on { background: var(--p-ink); border-color: var(--p-ink); color: #fff; }
.adm-settings h4, .adm-qsec > h3 { scroll-margin-top: 70px; }
.adm-qsec { margin-top: 16px; padding: 4px 18px 14px; background: #fff; border: 1px solid var(--p-line); border-radius: 14px; }
.adm-qsec > h3 { font-size: 16px; margin: 14px 0 6px; }
@media (min-width: 783px) { .adm-side { top: 32px; } .adm-settings h4, .adm-qsec > h3 { scroll-margin-top: 100px; } }
@media (min-width: 960px) {
  .adm-set { display: grid; grid-template-columns: 170px minmax(0, 1fr); gap: 20px; align-items: start; }
  .adm-side { flex-direction: column; overflow: visible; top: 48px; padding: 0; margin: 0; background: none; }
  .adm-side button { width: 100%; text-align: left; border: 0; border-radius: 9px; background: none; min-height: 40px; }
  .adm-side button:hover { background: #fff; color: var(--p-ink); }
  .adm-side button.is-on { background: #fff; color: var(--p-ink); box-shadow: 0 1px 3px rgba(62, 48, 51, .14); }
  .adm-settings h4, .adm-qsec > h3 { scroll-margin-top: 56px; }
}
.pro-rules { display: grid; grid-template-columns: 1fr; gap: 0 12px; }
@media (min-width: 600px) { .pro-rules { grid-template-columns: 1fr 1fr; } }
.ccb .pro-form label small.ccb-week-load { color: var(--p-ink); font-weight: 600; }
/* 到府範圍：預約頁填地址時的提示 */
.ccb-area-msg:empty { display: none; }
.ccb .ccb-area-ok { display: flex; align-items: center; gap: 6px; margin: 6px 0 0; color: #23774A; font-size: 14px; }
.ccb .ccb-area-ok .i { width: 16px; height: 16px; flex: none; }
.ccb .ccb-area-hint { margin: 6px 0 0; color: #A2541A; font-size: 14px; }
/* 到府範圍：諮詢師後台勾縣市、行政區 */
.ccb-areas { display: grid; grid-template-columns: 1fr; gap: 0; margin: 12px 0 0; border: 1px solid var(--p-line); border-radius: 12px; overflow: hidden; background: #fff; }
.ccb-area-c { border-top: 1px solid var(--p-line); }
.ccb-area-c:first-child { border-top: 0; }
.ccb-area-h { display: flex; align-items: center; gap: 8px; padding: 8px 12px; min-height: 44px; }
.ccb .ccb-area-h .ccb-inline { flex: 1; display: flex !important; align-items: center; gap: 8px; margin: 0 !important; font-size: 15px; font-weight: 700 !important; }
.ccb .ccb-area-h input, .ccb .ccb-area-ds input { width: 18px; height: 18px; margin: 0; flex: none; }
.ccb-area-n { font-size: 13px; color: var(--p-sub); }
.ccb .ccb-area-h .ccb-link { font-size: 13px; padding: 4px 0; }
.ccb-area-ds { display: none; grid-template-columns: repeat(auto-fill, minmax(96px, 1fr)); gap: 4px 10px; padding: 4px 12px 12px 38px; }
.ccb-area-c.is-open .ccb-area-ds { display: grid; }
.ccb .ccb-area-ds .ccb-inline { display: flex !important; align-items: center; gap: 6px; margin: 0 !important; font-size: 14px; font-weight: 400 !important; min-height: 32px; }
/* 到府地址：縣市、區選單＋路名門牌 */
.ccb-addr-row { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin: 0 0 8px; }
.ccb .ccb-addr-area { margin: 0 0 8px; font-size: 13.5px; line-height: 1.6; }
.ccb fieldset.ccb-addr { border: 0; padding: 0; margin: 0 0 14px; min-width: 0; }
.ccb fieldset.ccb-addr legend { padding: 0; margin-bottom: 6px; font-size: 15px; font-weight: 600; line-height: 1.5; }
.ccb fieldset.ccb-addr select { width: 100%; min-width: 0; }
.ccb-passes { margin-top: 16px; }
.pro-pass-acts { display: flex; gap: 6px; flex: none; }
.pro-pass-acts .ccb-btn { margin: 0; }
.ccb .pro-newbk { margin: 0 0 12px; min-height: 44px; border-style: dashed; }
.pro-newmode { grid-template-columns: 1fr 1fr; }
.ccb .pro-newform .pro-sub { margin-top: 16px !important; }
.ccb .pro-findbox { margin: 16px 0 0; padding: 12px 14px; border-radius: 12px; background: var(--p-gold-soft); }
.pro-find { margin: 6px 0 0; }
.pro-find .pro-amt { color: var(--p-ink); font-weight: 700; font-size: 14px; }
.ccb .ccb-addr-fee { margin: 0 0 8px; padding: 8px 12px; border-radius: 10px; background: #FFF6E5; font-size: 14.5px; line-height: 1.6; }
.ccb-feeform { align-items: end; margin-bottom: 4px; }
.ccb-feeform label { margin: 0 !important; }
.ccb-feeform.pro-row2 { grid-template-columns: minmax(0, 1fr) auto; align-items: start; }
.ccb .ccb-feeform .ccb-btn { margin: 26px 0 0; min-height: 46px; }

/* 包時數客戶 */
.pro-pkgs .pro-pk + .pro-pk { border-top: 1px solid var(--p-line); }
.pro-pkgs .pro-list-row { border-top: 0; }
.pro-pkgs .pro-list-row small + small { margin-top: 1px; }
.pro-pkgs .pro-amt { text-align: right; }
.pro-pkgs .pro-amt b { display: block; font-size: 16px; }
.pro-pkgs .pro-amt small { display: block; }
.pro-pkgs .pro-list-row.is-on { background: var(--p-bg); }
.pro-pk-more { padding: 4px 12px 14px; background: var(--p-bg); }
.pro-pk-more .pro-acts { margin-bottom: 4px; }
.pro-pkgs b .ccb-badge { font-size: 11.5px; padding: 0 7px; vertical-align: 2px; }
.pro-pane-bookings, .pro-main > .ccb-pane { min-width: 0; }
@media (max-width: 360px) { .pro-tabs button, .pro-tabs button:hover, .pro-tabs button:focus { font-size: 11px; } .pro-ti, .pro-tabs .pro-ti { width: 22px; height: 22px; } }

/* 左側欄、右邊詳細停在網站固定選單列下面（--ccb-top 由 console.js 量） */
@media (min-width: 960px) {
  .ccb.ccb-pro .pro-detailcol { top: calc(var(--ccb-top, 0px) + 16px); max-height: calc(100vh - var(--ccb-top, 0px) - 32px); }
}

/* 今天下一場 */
.pro-next { margin: 0 0 12px; padding: 12px; border-radius: 14px; background: var(--p-gold-soft); border: 1px solid #EBD3A4; }
.pro-next-h { font-size: 13px; font-weight: 700; color: var(--p-warn); margin: 0 0 6px !important; }
.pro-next-main { display: block; width: 100%; padding: 0; margin: 0 0 10px; border: 0; background: none; text-align: left; color: var(--p-ink); font: inherit; cursor: pointer; }
.pro-next-main b { display: block; font-size: 18px; line-height: 1.3; }
.pro-next-main small { display: block; font-size: 13px; color: var(--p-sub); margin-top: 2px; }
.pro-next .pro-act { width: 100%; }
/* 管理員：分頁列固定在上面、不出現捲軸 */
.ccb-admin .adm-tabs { position: sticky; top: var(--ccb-top, 0px); z-index: 30; scrollbar-width: none; }
.ccb-admin .adm-tabs::-webkit-scrollbar { display: none; }
.adm-pkstats { margin: 0 0 4px; }

/* 管理員預覽別位諮詢師的後台 */
.pro-preview { display: flex; flex-wrap: wrap; gap: 2px 8px; align-items: baseline; margin: 0 0 10px; padding: 10px 14px; border-radius: 12px; background: #FCEBDC; color: #7A3A10; font-size: 14px; border: 1px dashed #E0A06E; }
.pro-preview b { font-size: 15px; }
.ccb .pro-viewas { display: flex !important; align-items: center; gap: 8px; margin: 0 0 10px !important; font-size: 13px; font-weight: 600; color: var(--p-sub); }
.ccb .pro-viewas select { width: auto; min-height: 36px; padding: 0 28px 0 10px; font-size: 14px; border-radius: 999px; }

.pro-pkmoves { margin: 8px 0 0; }
.pro-pkmoves > summary { font-size: 14px; color: var(--p-ink); font-weight: 700; cursor: pointer; padding: 6px 0; }
.pro-pkmoves .pro-list { margin-top: 4px; }
.pro-pkmoves .pro-list-row b { font-size: 14px; }
.pro-pkmoves .pro-amt { font-size: 14px; }

/* ---------- 收入（10-29：年份＋12 個月、點一筆在原地看飼主資料） ---------- */
.inc-yhead { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin: 0 0 10px; }
.ccb .inc-ysel { width: auto; flex: none; min-height: 40px; padding: 0 32px 0 12px; border: 1px solid var(--p-line); border-radius: 10px; background: #fff; font: inherit; font-weight: 700; color: var(--p-ink); }
.inc-ysum { margin: 0; text-align: right; font-size: 13px; color: var(--p-sub); line-height: 1.5; }
.inc-ysum b { color: var(--p-ink); font-size: 15px; }
.inc-months { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 6px; margin: 0 0 16px; }
@media (min-width: 600px) { .inc-months { grid-template-columns: repeat(6, minmax(0, 1fr)); } }
@media (min-width: 1000px) { .inc-months { grid-template-columns: repeat(12, minmax(0, 1fr)); } }
.inc-m { display: flex; align-items: center; justify-content: center; min-width: 0; min-height: 40px; padding: 0 6px; font-weight: 700; font-size: 15px; border: 1px solid var(--p-line); border-radius: 10px; background: #fff; font-family: inherit; color: var(--p-ink); text-align: center; cursor: pointer; }
.inc-m span { font-size: 13px; color: var(--p-sub); display: flex; gap: 3px; align-items: center; white-space: nowrap; }
.inc-m i { font-style: normal; font-size: 11px; padding: 0 4px; border-radius: 4px; background: var(--p-bg); }
.inc-m b { font-size: 14px; font-variant-numeric: tabular-nums; white-space: nowrap; }
.inc-m small { font-size: 12px; color: var(--p-sub); }
.inc-m.is-on { border-color: var(--p-ink); box-shadow: inset 0 0 0 1px var(--p-ink); }
.inc-m.is-on span, .inc-m.is-on small { color: var(--p-ink); }
.inc-mh { margin-top: 0; }
.inc-tier { margin: 8px 0 0; font-size: 13px; color: var(--p-sub); }
.inc-filt { margin-top: 14px; }
.inc-filt button { min-height: 34px; padding: 0 12px; font-size: 14px; }
.inc-day { margin: 0 0 12px; }
.inc-dh { margin: 0 0 4px; font-size: 13px; font-weight: 700; color: var(--p-sub); }
.inc-day .pro-list { border: 1px solid var(--p-line); border-radius: 12px; overflow: hidden; }
.inc-row + .inc-row { border-top: 1px solid var(--p-line); }
.inc-row .inc-row-h { border-top: 0; }
.inc-row .inc-row-h.is-on { background: var(--p-bg); }
.inc-row .inc-row-h.is-on .pro-amt::after { content: ' ⌄'; }
.inc-t { display: inline-block; min-width: 3.2em; margin-right: 6px; color: var(--p-sub); font-weight: 400; font-variant-numeric: tabular-nums; }
.inc-detail { padding: 4px 12px 12px; background: var(--p-bg); }
.inc-detail .pro-dl { grid-template-columns: 64px minmax(0, 1fr); font-size: 14px; }
.inc-detail .pro-links { margin: 8px 0 0; }
.pro-histq .pro-grid2 { margin-bottom: 8px; }

.ccb .hq-custom[hidden] { display: none; }

/* 包時數：中等寬度兩排（Wei 10-29），每位飼主一張卡；960 以上改左清單右詳細（11-04 包很多時好讀），清單一欄 */
@media (min-width: 900px) and (max-width: 959px) {
  .pro-pkgs { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; align-items: start; border: 0; border-radius: 0; overflow: visible; background: none; }
  .pro-pkgs .pro-pk, .pro-pkgs .pro-pk + .pro-pk { border: 1px solid var(--p-line); border-radius: 12px; overflow: hidden; background: #fff; }
}

/* 收入日曆（Wei 11-04）：週一開始，有收入的日子寫金額，點一天下面只列那天 */
.inc-cal { margin: 4px 0 14px; padding: 8px; border: 1px solid var(--p-line); border-radius: 14px; background: #fff; }
.inc-cw, .inc-cg { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 4px; }
.inc-cw span { text-align: center; font-size: 12px; font-weight: 700; color: var(--p-sub); padding: 2px 0 4px; }
.inc-cd { display: flex; flex-direction: column; align-items: center; justify-content: flex-start; gap: 1px; min-height: 48px; padding: 5px 1px 4px; border: 0; border-radius: 10px; background: none; color: var(--p-sub); font: inherit; cursor: default; }
.inc-cd b { font-size: 14px; font-weight: 600; line-height: 1.2; }
.inc-cd small { font-size: 11px; font-weight: 700; line-height: 1.2; color: var(--p-ink); font-variant-numeric: tabular-nums; white-space: nowrap; letter-spacing: -.02em; }
.inc-cd.has { background: var(--p-gold-soft); color: var(--p-ink); cursor: pointer; }
.inc-cd.has:hover { background: #F1DFBC; }
.inc-cd.is-today b { display: inline-block; min-width: 22px; border-radius: 11px; background: var(--p-ink); color: #fff; }
.inc-cd.is-on { background: var(--p-ink); color: #fff; }
.inc-cd.is-on small { color: #fff; }
.inc-cd:disabled { opacity: 1; }
.inc-pick { display: flex; align-items: baseline; gap: 8px; flex-wrap: wrap; margin: 0 0 6px !important; }
.inc-pick span { color: var(--p-sub); font-size: 14px; }
.inc-pick .ccb-link { margin-left: auto; }
@media (min-width: 960px) { .inc-cd { min-height: 58px; } .inc-cd small { font-size: 12px; } }

/* 督導（Wei 11-04） */
.inc-sup { margin: 0 0 14px; }
.inc-supline { display: flex; justify-content: space-between; gap: 8px; margin: 0 0 8px !important; }
.inc-supgiv { margin: 0 0 12px; }
.inc-supmode { display: grid; grid-template-columns: 1fr 1fr; gap: 4px; margin: 4px 0 0; padding: 4px; border-radius: 12px; background: #EFE8DE; overflow: visible; }
.inc-supmode label { display: block; margin: 0; cursor: pointer; }
.inc-supmode input { position: absolute; opacity: 0; pointer-events: none; }
.inc-supmode span { display: block; padding: 10px 6px; border-radius: 9px; text-align: center; font-weight: 700; color: var(--p-sub); }
.inc-supmode input:checked + span { background: #fff; color: var(--p-ink); box-shadow: 0 1px 3px rgba(62, 48, 51, .14); }
.inc-supmode input:focus-visible + span { outline: 2px solid var(--p-ink); }
.inc-talk, .inc-supset { margin-top: 14px; }
.inc-talkfee:empty { display: none; }

/* 包時數很多時（Wei 11-04）：一次一組、排序、一頁 30 包 */
.pk-grp { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 4px; padding: 4px; margin: 0 0 10px; border-radius: 12px; background: #EFE8DE; }
.pk-grp button { display: flex; flex-direction: column; align-items: center; gap: 1px; min-height: 50px; padding: 6px 2px; border: 0; border-radius: 9px; background: none; color: var(--p-sub); font: inherit; font-size: 13px; font-weight: 700; line-height: 1.2; cursor: pointer; white-space: nowrap; }
.pk-grp button b { font-size: 16px; }
.pk-grp button.is-on { background: #fff; color: var(--p-ink); box-shadow: 0 1px 3px rgba(62, 48, 51, .14); }
.pk-bar { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin: -4px 0 10px; font-size: 13.5px; }
.pk-sort { display: flex; align-items: center; gap: 6px; margin: 0; font-size: 13.5px; color: var(--p-sub); white-space: nowrap; }
.ccb .pk-sort select { min-height: 36px; width: auto; padding: 4px 28px 4px 10px; font-size: 14px; }
.pk-urgent { color: var(--p-warn); font-weight: 700; }
.pk-moreb { margin-top: 10px !important; }
.pk-left { display: flex; align-items: baseline; gap: 8px; margin: 6px 0 10px !important; }
.pk-left b { font-size: 24px; }
.pk-left small { color: var(--p-sub); }
@media (min-width: 960px) {
  .pro-listcol .pro-pkgs .pro-list-row.is-on { background: var(--p-gold-soft); }
  .pro-detailcol .pk-left { margin-top: 0 !important; }
}

/* 月結（Wei 11-04） */
.inc-settle { margin: 0 0 14px; padding: 14px; border-radius: 14px; border: 1px solid var(--p-line); background: #fff; }
.inc-settle.is-pending { background: var(--p-gold-soft); border-color: #EBD3A4; }
.inc-settle.is-warn { background: var(--p-warn-soft); border-color: #F0C9A8; }
.inc-settle.is-done { background: var(--p-ok-soft); border-color: #C7E2CF; }
.inc-settle-h { font-size: 16px; font-weight: 700; margin: 0 0 4px !important; }
.inc-settle-h b { font-size: 20px; }
.inc-settle .pro-acts { margin-top: 8px; }
.inc-dispute { margin-top: 10px; }

/* 上下疊的卡片、收合區塊（Wei 11-14 手機看「格子太近」：文字客服跟「另外扣時」、預約以外的收入跟「回報其他收入」黏在一起）：
   放進同一個容器 .pro-stack，間距只由容器的 gap 決定（--p-gap），卡片本身不帶上下 margin，各分頁一致。
   標題放在 stack 裡時補回原本的上 18／下 8（第一個標題的上方由前一塊的 12px＋6px 湊成 18）；預約卡點開的詳細（手機）照舊貼在那張卡下面 6px。 */
.pro-stack { display: flex; flex-direction: column; gap: var(--p-gap); min-width: 0; }
.ccb .pro-stack > * { margin-top: 0 !important; margin-bottom: 0 !important; }
.ccb .pro-stack > .pro-h { margin: 6px 0 -4px !important; }
.ccb .pro-stack > .pro-bk + .pro-detail { margin-top: -6px !important; }
.pro-pk-more > .pro-stack { margin-top: var(--p-gap); }

/* 問卷連結帶走（1.0.50，我的諮詢也用） */
.ccb .ccb-forms-take { font-size: 14px; font-weight: 700; text-decoration: underline; text-underline-offset: 3px; background: none; border: 0; padding: 0; cursor: pointer; color: inherit; }

/* 24 小時制時間（1.0.50，Wei 11-14「直接改成24小時制」）：日期＋時、分兩個下拉，不會出現上午／下午 */
.ccb .ccb-t24 { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin-top: 4px; }
.ccb .ccb-t24 .t24-d { flex: 1 1 150px; width: auto; min-width: 0; max-width: 220px; margin: 0; }
.ccb .ccb-t24 select { flex: none; width: 70px; min-width: 0; margin: 0; padding: 6px 4px 6px 10px; } /* 瀏覽器自己的箭頭會吃寬度：寬 70、右邊內距小 */
.ccb .ccb-t24 .t24-tm { display: inline-flex; align-items: center; gap: 4px; flex: none; }
.ccb .ccb-t24 .t24-sep, .ccb .ccb-t24 .t24-h, .ccb .ccb-t24 .t24-m { white-space: nowrap; }
.ccb .pro-grid2 > .pro-span2 { grid-column: 1 / -1; }
.ccb .ccb-t24 .t24-sep { font-weight: 700; color: var(--ccb-sub); }
.ccb .ccb-wslot .ccb-t24 { flex: none; margin-top: 0; flex-wrap: nowrap; }
.ccb .ccb-wslot .ccb-t24 { gap: 3px; }
.ccb .ccb-wslot .ccb-t24 select { min-height: 42px; }
.ccb .ccb-wslot .ccb-inline { white-space: nowrap; }
@media (max-width: 360px) { .ccb-wslot { flex-wrap: wrap; } }
.ccb .pro-field > small { display: block; font-weight: 400; color: var(--p-sub, #6b5f58); font-size: 12.5px; margin-top: 3px; }
/* 以前的諮詢（舊系統紀錄）：有舊報告的列給下載鈕（1.0.74） */
.ccb .ccb-legacy-list { padding-left: 18px; }
.ccb .ccb-legacy-list li { margin: 0 0 10px; }
.ccb .ccb-legacy-rep { margin-top: 6px; }
