/* 品牌：SEASCAPE 博海旅行社 / MLE 馬爾地夫旅遊網（色票取自 wp-mle/mle/theme.json） */
html[data-theme="light"] {
  --brand: #0C5C84;          /* 深天藍：按鈕、連結（WCAG AA） */
  --brand-strong: #094A6B;
  --brand-sky: #1180B8;      /* 天空藍 */
  --brand-soft: #E4F3FB;     /* 淺天藍 */
  --gold: #C9A24B;
  --gold-dark: #73561A;      /* 價格 / highlight */
  --sand: #F8F3E7;
  --ink: #132A38;            /* 深海墨藍 內文 */
  --gray: #5B6E79;
  --line: #DEE8ED;
  --soft: #EFF6FA;
  --bg: #FAFDFF;
  --ok: #157347; --ok-bg: #E3F4EA;
  --warn: #7A5300; --warn-bg: #FFF4D6;
  --err: #A12A2A; --err-bg: #FDECEC;
  --radius: .75rem;
  --shadow: 0 1px 2px rgba(19, 42, 56, .06), 0 4px 16px rgba(19, 42, 56, .06);

  --pico-font-family: -apple-system, BlinkMacSystemFont, "PingFang TC", "Microsoft JhengHei", "Noto Sans TC", "Segoe UI", sans-serif;
  --pico-font-size: 15px;
  --pico-line-height: 1.6;
  --pico-border-radius: .5rem;
  --pico-background-color: var(--bg);
  --pico-color: var(--ink);
  --pico-h1-color: var(--ink); --pico-h2-color: var(--ink); --pico-h3-color: var(--ink);
  --pico-h4-color: var(--ink); --pico-h5-color: var(--ink); --pico-h6-color: var(--ink);
  --pico-muted-color: var(--gray);
  --pico-muted-border-color: var(--line);
  --pico-card-background-color: #fff;
  --pico-card-sectioning-background-color: var(--soft);
  --pico-primary: var(--brand);
  --pico-primary-background: var(--brand);
  --pico-primary-border: var(--brand);
  --pico-primary-underline: rgba(12, 92, 132, .45);
  --pico-primary-hover: var(--brand-strong);
  --pico-primary-hover-background: var(--brand-strong);
  --pico-primary-hover-border: var(--brand-strong);
  --pico-primary-hover-underline: var(--brand-strong);
  --pico-primary-focus: rgba(17, 128, 184, .3);
  --pico-primary-inverse: #fff;
  --pico-form-element-border-color: #C9D8E0;
  --pico-form-element-focus-color: var(--brand-sky);
  --pico-spacing: 1rem;
  --pico-typography-spacing-vertical: 1rem;
}

body { background: var(--bg); min-height: 100vh; display: flex; flex-direction: column; }
main { flex: 1; }
h1, h2, h3, h4, h5 { letter-spacing: .01em; }
h3 { font-size: 1.45rem; margin-bottom: .6rem; }
h5 { font-size: 1.05rem; margin: 1.6rem 0 .6rem; }
a { text-underline-offset: 3px; }
code { font-size: .85em; }

/* ---------- 頁首 ---------- */
.site-header {
  background: linear-gradient(100deg, #083f5c 0%, var(--brand) 55%, var(--brand-sky) 100%);
  color: #fff; position: sticky; top: 0; z-index: 30;
  box-shadow: 0 2px 10px rgba(8, 63, 92, .25);
}
.site-header .bar { display: flex; align-items: center; gap: 1rem; min-height: 64px; padding: 0 1.25rem; max-width: 1360px; margin: 0 auto; }
.brand { display: flex; align-items: center; gap: .9rem; text-decoration: none; color: #fff; flex-shrink: 0; }
.brand img { height: 38px; width: auto; display: block; }
.brand .product { border-left: 1px solid rgba(255, 255, 255, .35); padding-left: .9rem; font-size: .95rem; font-weight: 600; letter-spacing: .08em; white-space: nowrap; }
.brand .product small { display: block; font-size: .72rem; font-weight: 400; letter-spacing: .04em; opacity: .8; }
.main-nav { margin-left: auto; }
.main-nav ul { display: flex; align-items: center; gap: .45rem; margin: 0; padding: 0; list-style: none; }
.main-nav li { margin: 0; padding: 0; list-style: none; }
.main-nav a { margin: 0; color: rgba(255, 255, 255, .88); text-decoration: none; padding: .45rem .8rem; border-radius: 999px; font-size: .93rem; display: block; }
.main-nav a:hover { color: #fff; background: rgba(255, 255, 255, .12); }
.main-nav a[aria-current="page"] { color: var(--brand); background: #fff; font-weight: 600; }
.main-nav .nav-user { color: rgba(255, 255, 255, .8); font-size: .85rem; padding: 0 .3rem 0 .9rem; margin-left: .4rem; border-left: 1px solid rgba(255, 255, 255, .3); max-width: 16rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.btn-ghost-light { background: transparent !important; border: 1px solid rgba(255, 255, 255, .55) !important; color: #fff !important; padding: .3rem .85rem !important; font-size: .85rem !important; border-radius: 999px !important; margin: 0 !important; width: auto !important; }
.btn-ghost-light:hover { background: rgba(255, 255, 255, .15) !important; }
.nav-toggle { display: none; margin: 0 0 0 auto !important; width: auto !important; background: transparent !important; border: 1px solid rgba(255, 255, 255, .5) !important; color: #fff !important; padding: .3rem .7rem !important; font-size: 1.1rem !important; line-height: 1 !important; }

/* ---------- 頁尾 ---------- */
.site-footer { border-top: 1px solid var(--line); color: var(--gray); font-size: .82rem; text-align: center; padding: 1.4rem 1rem; margin-top: 2.5rem; background: #fff; }
.site-footer strong { color: var(--ink); letter-spacing: .06em; }

main.container { padding-top: 1.75rem; padding-bottom: 1rem; max-width: 1360px; width: 100%; padding-inline: 1.25rem; }  /* 與 header 同寬：內容不超出 logo 到登出按鈕的範圍 */

/* ---------- 共用元件 ---------- */
article { border-radius: var(--radius); box-shadow: var(--shadow); border: 1px solid var(--line); }
article > header { background: var(--soft); border-bottom: 1px solid var(--line); }
.page-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 1rem; flex-wrap: wrap; margin-bottom: 1.2rem; }
.page-head h3 { margin: 0; }
.page-head p { margin: .25rem 0 0; }
.eyebrow { text-transform: uppercase; letter-spacing: .14em; font-size: .72rem; color: var(--brand-sky); font-weight: 700; margin: 0 0 .2rem; }

.flash { padding: .75rem 1rem; border-radius: var(--pico-border-radius); background: var(--ok-bg); color: var(--ok); margin-bottom: 1rem; border-left: 4px solid var(--ok); }
.flash.error, .errors { background: var(--err-bg); color: var(--err); padding: .75rem 1rem; border-radius: var(--pico-border-radius); margin-bottom: 1rem; border-left: 4px solid var(--err); }
.warn { background: var(--warn-bg); color: var(--warn); padding: .75rem 1rem; border-radius: var(--pico-border-radius); margin-bottom: 1rem; border-left: 4px solid var(--gold); }

.badge { display: inline-block; padding: .12rem .55rem; border-radius: 999px; font-size: .75rem; background: var(--soft); color: var(--gray); white-space: nowrap; border: 1px solid var(--line); font-weight: 500; }
.badge.draft, .badge.new, .badge.changed { background: var(--warn-bg); color: var(--warn); border-color: #F1DFA8; }
.badge.approved, .badge.parsed, .badge.ok, .badge.active { background: var(--ok-bg); color: var(--ok); border-color: #BFE3CC; }
.badge.rejected, .badge.missing, .badge.no_availability, .badge.need_more_info { background: var(--err-bg); color: var(--err); border-color: #F3C7C7; }
.badge.demo { background: #EEE9FF; color: #4B3BA8; border-color: #D9D0FF; }
.badge.brand { background: var(--brand-soft); color: var(--brand); border-color: #C6E3F3; }
.badge.gold { background: var(--sand); color: var(--gold-dark); border-color: #EAD9AE; }

.muted { color: var(--gray); font-size: .9rem; }
.price { font-size: 2rem; font-weight: 700; color: var(--gold-dark); font-variant-numeric: tabular-nums; }
.num, .money { font-variant-numeric: tabular-nums; }

.table-wrap { overflow-x: auto; background: #fff; border: 1px solid var(--line); border-radius: var(--radius); margin-bottom: 1.2rem; box-shadow: var(--shadow); }
.table-wrap table { margin: 0; }
table th { background: var(--soft); color: var(--gray); font-size: .78rem; font-weight: 600; letter-spacing: .04em; white-space: nowrap; }
table td, table th { font-size: .88rem; vertical-align: top; border-bottom-color: var(--line); }
table tbody tr:hover td { background: #F7FBFD; }
td.num, th.num { text-align: right; white-space: nowrap; font-variant-numeric: tabular-nums; }
tr.neg td { color: #B03030; }
.diff-old { background: var(--err-bg); }
.diff-new { background: var(--ok-bg); }
.quote-src { font-size: .76rem; color: var(--gray); border-left: 2px solid var(--line); padding-left: .5rem; margin-top: .2rem; }
.quote-src > summary { cursor: pointer; display: flex; max-width: 18rem; white-space: nowrap; list-style: none; }
.quote-src > summary > span { overflow: hidden; text-overflow: ellipsis; min-width: 0; }
.quote-src > summary::-webkit-details-marker { display: none; }
.quote-src > summary::after { content: "· 原文"; color: var(--brand); flex: none; padding-left: .3em; float: none; display: inline; width: auto; height: auto; background: none; transform: none; margin: 0; }
.quote-src[open] > summary::after { content: "· 收合"; transform: none; }
.quote-src > summary:hover { color: var(--brand); }
.quote-src-body { margin-top: .25rem; color: var(--ink); white-space: normal; max-width: 28rem; }
.quote-src-body .muted { font-size: .72rem; word-break: break-all; }
.grid-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 1.2rem; }
.inline-form { display: inline; }
.inline-form button { padding: .25rem .7rem; font-size: .82rem; margin: 0; width: auto; }
details > summary { cursor: pointer; }
pre.json { max-height: 30rem; overflow: auto; font-size: .78rem; background: var(--soft); border-radius: var(--pico-border-radius); }
.empty { text-align: center; color: var(--gray); padding: 2rem 1rem !important; }

/* ---------- 方案卡片 ---------- */
.option-card { background: #fff; border: 1px solid var(--line); border-radius: var(--radius); padding: 1rem 1.15rem; margin-bottom: .9rem; box-shadow: var(--shadow); }
.option-card.selected { border: 2px solid var(--brand-sky); box-shadow: 0 6px 22px rgba(17, 128, 184, .15); }
.option-head { display: flex; justify-content: space-between; align-items: baseline; gap: .8rem; flex-wrap: wrap; }
.option-head .total { font-size: 1.25rem; font-weight: 700; white-space: nowrap; color: var(--gold-dark); font-variant-numeric: tabular-nums; }
.option-title { font-size: 1.05rem; font-weight: 600; }
.option-meta { margin-top: .35rem; display: grid; gap: .2rem; font-size: .88rem; }
.option-meta .label { color: var(--gray); margin-right: .35rem; }
.option-diff { font-size: .8rem; color: var(--gray); text-align: right; }
.options-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); gap: .9rem; }
.options-grid .option-card { margin: 0; display: flex; flex-direction: column; }
.options-grid .option-head { display: contents; }
.options-grid .option-meta { order: 1; flex: 1; }
.options-grid .option-head > div:last-child { order: 2; display: flex; align-items: baseline; justify-content: space-between; gap: .5rem; border-top: 1px dashed var(--line); padding-top: .55rem; margin-top: .7rem; }
.options-grid .option-diff { text-align: right; }

/* ---------- 報價結果 ---------- */
.quote-hero {
  background: linear-gradient(120deg, #083f5c 0%, var(--brand) 50%, var(--brand-sky) 100%);
  color: #fff; border-radius: calc(var(--radius) + .25rem); padding: 1.6rem 1.8rem; margin-bottom: 1.4rem;
  display: grid; grid-template-columns: 1fr auto; gap: 1.2rem 2rem; align-items: end; box-shadow: 0 10px 30px rgba(8, 63, 92, .25);
  position: relative; overflow: hidden;
}
.quote-hero::after { content: ""; position: absolute; right: -60px; top: -60px; width: 220px; height: 220px; border-radius: 50%; background: radial-gradient(circle, rgba(255, 255, 255, .14), transparent 70%); }
.quote-hero h2 { color: #fff; margin: 0 0 .5rem; font-size: 1.6rem; }
.quote-hero .facts { display: flex; flex-wrap: wrap; gap: .5rem 1.4rem; font-size: .92rem; opacity: .95; }
.quote-hero .facts span { white-space: nowrap; }
.quote-hero .facts b { font-weight: 500; opacity: .7; margin-right: .35rem; font-size: .8rem; letter-spacing: .06em; }
.quote-hero .total-box { text-align: right; position: relative; z-index: 1; }
.quote-hero .total-label { font-size: .8rem; opacity: .85; letter-spacing: .06em; }
.quote-hero .total-amount { font-size: 2.4rem; font-weight: 700; line-height: 1.15; color: #fff; font-variant-numeric: tabular-nums; }
.quote-hero .total-amount small { font-size: 1rem; font-weight: 500; margin-right: .3rem; color: #F3DFA9; }
.quote-hero .actions { display: flex; gap: .5rem; justify-content: flex-end; margin-top: .7rem; flex-wrap: wrap; }
.quote-hero .actions a { margin: 0; padding: .45rem 1rem; font-size: .9rem; }
.btn-light { background: #fff !important; color: var(--brand) !important; border-color: #fff !important; }
.btn-outline-light { background: transparent !important; color: #fff !important; border: 1px solid rgba(255, 255, 255, .7) !important; }
.quote-ref { font-size: .8rem; opacity: .8; margin-bottom: .3rem; letter-spacing: .04em; }

/* ---------- 報價表單 ---------- */
.quote-layout { display: grid; grid-template-columns: minmax(0, 1fr) 300px; gap: 1.4rem; align-items: start; }
.form-section { border: 0; padding: 0; margin: 0 0 1.1rem; }
@media (min-width: 1200px) { .form-top { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 0 1.6rem; align-items: start; } }
.form-section legend { font-weight: 700; color: var(--brand); font-size: .82rem; letter-spacing: .12em; margin-bottom: .5rem; padding: 0; }
.guests label small { font-weight: 400; margin-left: .2rem; }
.guests .grid { align-items: end; }  /* 欄寬窄時說明文字折行，成人 / 小孩的加減按鈕仍對齊 */
.stepper { display: flex; align-items: stretch; margin-top: .25rem; }
.stepper input { margin: 0; text-align: center; border-radius: 0; -moz-appearance: textfield; }
.stepper input::-webkit-outer-spin-button, .stepper input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.stepper button { width: 2.8rem; flex: none; margin: 0; padding: 0; font-size: 1.15rem; line-height: 1; }
.stepper button:first-child { border-radius: var(--pico-border-radius) 0 0 var(--pico-border-radius); }
.stepper button:last-child { border-radius: 0 var(--pico-border-radius) var(--pico-border-radius) 0; }
.ages-wrap { background: var(--soft); border: 1px solid var(--line); border-radius: var(--radius); padding: .8rem .9rem .3rem; margin-bottom: .8rem; }
.ages-head { display: flex; flex-wrap: wrap; gap: .2rem .6rem; align-items: baseline; margin-bottom: .55rem; font-size: .9rem; }
.ages-head small { font-size: .78rem; }
.child-ages { display: grid; grid-template-columns: repeat(auto-fill, minmax(9.5rem, 1fr)); gap: .5rem .7rem; }
.child-ages .age-pick { margin: 0; font-size: .82rem; color: var(--gray); }
.child-ages select { margin: .2rem 0 .5rem; }
.room-mode { display: flex; flex-wrap: wrap; gap: .4rem; margin-bottom: .7rem; }
.room-mode label { display: inline-flex; align-items: center; gap: .4rem; white-space: nowrap; width: auto; margin: 0; padding: .4rem .95rem; border: 1px solid var(--line); border-radius: 999px; cursor: pointer; font-size: .9rem; background: #fff; }
.room-mode label:has(input:checked) { border-color: var(--brand); background: var(--brand-soft); color: var(--brand); font-weight: 600; }
.room-mode input[type="radio"] { margin: 0; width: 1.05rem; height: 1.05rem; flex: none; }
.room-mode .rm-hint { font-size: .8rem; font-weight: 400; color: var(--gray); }
.split-box { background: var(--soft); border: 1px solid var(--line); border-radius: var(--radius); padding: .8rem .9rem .4rem; margin-bottom: .9rem; }
.split-row { display: grid; grid-template-columns: 1.8rem minmax(0, 1fr) 12rem; gap: .5rem .8rem; align-items: end; margin-bottom: .2rem; }
.split-row label, .split-row .seg-nights { margin-bottom: var(--pico-spacing); }
.seg-no { width: 1.6rem; height: 1.6rem; border-radius: 50%; background: var(--brand); color: #fff; font-size: .8rem; font-weight: 700; display: inline-flex; align-items: center; justify-content: center; margin-bottom: calc(var(--pico-spacing) + .75rem); }
.seg-room label { margin-bottom: 0; }
.seg-label { display: block; margin-bottom: .25rem; }
.seg-auto { display: flex; align-items: baseline; gap: .3rem; height: calc(1rem * var(--pico-line-height) + var(--pico-form-element-spacing-vertical) * 2 + 2px); padding: 0 .9rem; border: 1px dashed var(--line); border-radius: var(--pico-border-radius); background: #fff; align-items: center; }
.seg-auto b { font-size: 1.05rem; color: var(--brand); }
.seg-auto small { color: var(--gray); font-size: .78rem; }
@media (max-width: 640px) { .split-row { grid-template-columns: 1.6rem minmax(0, 1fr); } .split-row .seg-nights { grid-column: 2; } }
.split-summary { font-size: .85rem; color: var(--brand); font-weight: 600; margin: 0 0 .4rem; }
.guest-summary { font-size: .85rem; color: var(--gray); margin: -.3rem 0 .6rem; }
.side-card { background: var(--sand); border: 1px solid #EBDFC2; border-radius: var(--radius); padding: 1.1rem 1.2rem; font-size: .88rem; position: sticky; top: 84px; }
.side-card h6 { color: var(--gold-dark); margin: 0 0 .5rem; font-size: .9rem; letter-spacing: .06em; }
.side-card ul { margin: 0 0 .8rem; padding-left: 1.1rem; }
.side-card li { margin-bottom: .3rem; }
button[type="submit"].big, .big { font-size: 1.05rem; padding: .75rem 1.2rem; }

/* ---------- 報價說明（側欄） ---------- */
.quote-guide { position: sticky; top: 84px; background: #fff; border: 1px solid var(--line); border-radius: var(--radius); box-shadow: var(--shadow); overflow: hidden; font-size: .88rem; }
.guide-head { display: flex; align-items: center; gap: .7rem; padding: .95rem 1.1rem; color: #fff; background: linear-gradient(115deg, #083f5c, var(--brand) 60%, var(--brand-sky)); }
.guide-head strong { display: block; font-size: 1rem; letter-spacing: .08em; }
.guide-head small { display: block; font-size: .7rem; opacity: .8; letter-spacing: .12em; text-transform: uppercase; }
.guide-badge { display: inline-flex; align-items: center; justify-content: center; width: 2.1rem; height: 2.1rem; border-radius: 50%; background: rgba(255, 255, 255, .16); border: 1px solid rgba(255, 255, 255, .35); }
.guide-steps { list-style: none; margin: 0; padding: 1rem 1.1rem .4rem; counter-reset: none; }
.guide-steps li { list-style: none; display: grid; grid-template-columns: 1.9rem 1fr; gap: .65rem; margin: 0 0 .85rem; position: relative; }
.guide-steps li:not(:last-child)::after { content: ""; position: absolute; left: .93rem; top: 1.95rem; bottom: -.85rem; width: 2px; background: var(--brand-soft); }
.guide-steps .step-no { width: 1.9rem; height: 1.9rem; border-radius: 50%; background: var(--brand-soft); color: var(--brand); font-weight: 700; display: inline-flex; align-items: center; justify-content: center; font-size: .85rem; position: relative; z-index: 1; border: 2px solid #fff; box-shadow: 0 0 0 1px #C6E3F3; }
.guide-steps b { display: block; color: var(--ink); margin-top: .15rem; }
.guide-steps p { margin: .1rem 0 0; color: var(--gray); font-size: .82rem; line-height: 1.5; }
.guide-facts { display: grid; gap: .55rem; padding: .9rem 1.1rem; border-top: 1px solid var(--line); background: var(--soft); }
.fact { display: grid; grid-template-columns: 2rem minmax(0, 1fr); gap: .65rem; align-items: center; }
.fact-icon { box-sizing: border-box; width: 2rem; height: 2rem; border-radius: .55rem; background: #fff; border: 1px solid var(--line); color: var(--brand-sky); display: flex; align-items: center; justify-content: center; flex: none; }
.fact-icon svg { display: block; }
.fact b { display: block; color: var(--ink); font-size: .86rem; }
.fact > div > span { display: block; color: var(--gray); font-size: .78rem; line-height: 1.4; }  /* 只套說明文字，不影響 .fact-icon */
.guide-help { margin: .9rem 1.1rem 1.1rem; padding: .75rem .9rem; background: var(--sand); border-left: 3px solid var(--gold); border-radius: .5rem; }
.guide-help b { color: var(--gold-dark); font-size: .86rem; }
.guide-help p { margin: .2rem 0 0; color: var(--ink); font-size: .8rem; line-height: 1.5; }

/* ---------- 飯店搜尋 / 日期區間 ---------- */
.combo { position: relative; }
.combo-list { position: absolute; z-index: 25; left: 0; right: 0; top: calc(100% - .6rem); margin: 0; padding: .3rem; list-style: none; background: #fff; border: 1px solid var(--line); border-radius: var(--pico-border-radius); box-shadow: 0 10px 28px rgba(19, 42, 56, .14); max-height: 300px; overflow-y: auto; }
.combo-list li { list-style: none; margin: 0; padding: .55rem .7rem; border-radius: .4rem; cursor: pointer; display: flex; justify-content: space-between; align-items: baseline; gap: .8rem; }
.combo-list li small { color: var(--gray); font-size: .75rem; }
.combo-list li:hover, .combo-list li.active { background: var(--brand-soft); color: var(--brand); }
.combo-list li.selected span { font-weight: 600; }
.combo-list li.empty-item { color: var(--gray); cursor: default; }
.combo-list li[data-code] { justify-content: flex-start; align-items: center; }
.combo-list .hs-thumb { width: 52px; height: 36px; object-fit: cover; border-radius: 4px; flex: none; }
.combo-list .hs-name { display: flex; flex-direction: column; line-height: 1.3; }
.combo-list .hs-name b { font-weight: 500; }
.combo-list li.empty-item:hover { background: transparent; color: var(--gray); }
#hotel-search { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' fill='none' stroke='%235B6E79' stroke-width='2' viewBox='0 0 24 24'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='m20 20-3.5-3.5'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: .8rem center; padding-left: 2.5rem; }
#date-range-display { cursor: pointer; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' fill='none' stroke='%235B6E79' stroke-width='2' viewBox='0 0 24 24'%3E%3Crect x='3' y='5' width='18' height='16' rx='2'/%3E%3Cpath d='M16 3v4M8 3v4M3 10h18'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: .8rem center; padding-left: 2.5rem; }
.nights-label { display: block; color: var(--brand); font-weight: 600; margin: -.5rem 0 .6rem; min-height: 1.1em; }
.field-error { display: block; color: var(--err); margin: -.5rem 0 .7rem; }
input.invalid { border-color: var(--err) !important; }
label.mt { margin-top: .3rem; }
.flatpickr-calendar { font-family: var(--pico-font-family); box-shadow: 0 12px 32px rgba(19, 42, 56, .18); border-radius: .75rem; }
.flatpickr-day.selected, .flatpickr-day.startRange, .flatpickr-day.endRange,
.flatpickr-day.selected:hover, .flatpickr-day.startRange:hover, .flatpickr-day.endRange:hover { background: var(--brand); border-color: var(--brand); color: #fff; }
.flatpickr-day.inRange, .flatpickr-day.inRange:hover { background: var(--brand-soft); border-color: var(--brand-soft); box-shadow: -5px 0 0 var(--brand-soft), 5px 0 0 var(--brand-soft); color: var(--ink); }
.flatpickr-day.today { border-color: var(--gold); }
.flatpickr-months .flatpickr-month, .flatpickr-current-month { color: var(--ink); }
.flatpickr-input[readonly] { background-color: #fff; }

/* ---------- AI 解析需求 ---------- */
.ai-box { background: linear-gradient(135deg, #F2F9FD 0%, #FBF7EC 100%); border: 1px solid #CFE5F2; border-radius: var(--radius); padding: 1rem 1.1rem .6rem; margin-bottom: 1.3rem; }
.ai-head { display: flex; align-items: center; gap: .55rem; flex-wrap: wrap; }
details.ai-box { padding: .7rem 1.1rem; }
details.ai-box[open] { padding-bottom: .6rem; }
details.ai-box > summary.ai-head { list-style: none; cursor: pointer; margin: 0; }
details.ai-box > summary.ai-head::-webkit-details-marker { display: none; }
details.ai-box > summary.ai-head::after { display: none; }
.ai-toggle { margin-left: auto; font-size: .82rem; color: var(--brand); font-weight: 600; }
.ai-toggle::after { content: "展開 ▾"; }
details.ai-box[open] .ai-toggle::after { content: "收起 ▴"; }
.ai-body { margin-top: .65rem; }
.ai-head strong { color: var(--ink); }
.ai-head .muted { font-size: .82rem; }
.ai-chip { display: inline-flex; align-items: center; justify-content: center; width: 1.9rem; height: 1.9rem; border-radius: 50%; background: linear-gradient(135deg, var(--brand), var(--brand-sky)); color: #fff; font-weight: 700; font-size: .72rem; letter-spacing: .04em; }
.ai-box textarea { margin-bottom: .55rem; background: #fff; }
.ai-actions { display: flex; align-items: center; gap: .8rem; flex-wrap: wrap; }
.ai-actions button { width: auto; margin: 0; }
.ai-result { background: #fff; border: 1px solid var(--line); border-radius: var(--pico-border-radius); padding: .7rem .9rem; margin-top: .7rem; font-size: .9rem; display: grid; gap: .4rem; }
.ai-missing .badge { margin: .1rem .15rem; }
.ai-ok { color: var(--ok); }
.ai-note { font-size: .75rem; color: var(--gray); margin: .6rem 0 0; }
.ai-filled { background-color: #FFF8E6 !important; border-color: var(--gold) !important; }

/* ---------- 登入頁 ---------- */
body.auth-page { background: radial-gradient(1200px 600px at 10% -10%, rgba(255, 255, 255, .18), transparent 60%), linear-gradient(140deg, #062f45 0%, var(--brand) 45%, var(--brand-sky) 100%); }
body.auth-page .site-header, body.auth-page .site-footer { display: none; }
.auth-wrap { min-height: 100vh; display: flex; align-items: center; justify-content: center; padding: 2rem 1rem; }
.auth-card { width: 100%; max-width: 420px; background: #fff; border-radius: 1rem; box-shadow: 0 20px 60px rgba(4, 30, 45, .35); overflow: hidden; }
.auth-card .auth-head { background: linear-gradient(110deg, #083f5c, var(--brand)); padding: 1.6rem 1.6rem 1.3rem; color: #fff; }
.auth-card .auth-head img { height: 44px; width: auto; display: block; margin-bottom: .9rem; }
.auth-card .auth-head h1 { color: #fff; font-size: 1.25rem; margin: 0; letter-spacing: .08em; }
.auth-card .auth-head p { margin: .25rem 0 0; font-size: .85rem; color: #fff; opacity: .9; }
.auth-card form { padding: 1.4rem 1.6rem .6rem; margin: 0; }
.auth-card .auth-foot { padding: 0 1.6rem 1.3rem; font-size: .78rem; color: var(--gray); text-align: center; }
.auth-card .errors { margin: 1.2rem 1.6rem 0; }

/* 管理員預覽同業平台時的提示列 */
.preview-bar { background: var(--sand); border-bottom: 1px solid #EAD9AE; color: var(--gold-dark); font-size: .85rem; padding: .45rem 1rem; text-align: center; }
.preview-bar a { margin-left: .4rem; }

/* ---------- 後台 ---------- */
.admin-shell { display: grid; grid-template-columns: 216px minmax(0, 1fr); max-width: 1360px; margin: 0 auto; width: 100%; flex: 1; transition: grid-template-columns .18s ease; }
.sidebar { border-right: 1px solid var(--line); background: #fff; padding: .9rem .6rem .5rem; position: sticky; top: var(--head-h, 64px); align-self: start; height: calc(100vh - var(--head-h, 64px)); display: flex; flex-direction: column; }
.sidebar nav { flex: 1; overflow-y: auto; overflow-x: hidden; margin: 0 -.2rem; padding: 0 .2rem; }
.sidebar ul, .sidebar nav ul:first-of-type, .sidebar nav ul:last-of-type { list-style: none; margin: 0; padding: 0; display: grid; gap: 1px; }
.sidebar li { list-style: none; margin: 0; padding: 0; }
.sidebar a { display: flex; align-items: center; gap: .6rem; padding: .38rem .6rem; border-radius: .45rem; margin: 0; color: var(--ink); text-decoration: none; font-size: .86rem; line-height: 1.35; letter-spacing: .02em; white-space: nowrap; }
.sidebar a:hover { background: var(--soft); }
.sidebar a[aria-current="page"] { background: var(--brand-soft); color: var(--brand); font-weight: 600; box-shadow: inset 3px 0 0 var(--brand-sky); }
.sidebar svg { width: 16px; height: 16px; flex: none; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.sidebar .nav-ico { color: var(--gray); }
.sidebar a:hover .nav-ico, .sidebar a[aria-current="page"] .nav-ico { color: inherit; }
.sidebar .nav-label { overflow: hidden; text-overflow: ellipsis; }
.sidebar .nav-ext { margin-left: auto; font-size: .7rem; color: #9AAAB3; }
/* 分組標題（可折疊） */
.sidebar button.group { all: unset; box-sizing: border-box; display: flex; align-items: center; justify-content: space-between; width: 100%; cursor: pointer;
  font-size: .7rem; line-height: 1.2; letter-spacing: .1em; color: #8496A0; font-weight: 600; padding: .3rem .6rem; margin: .9rem 0 .4rem; border-radius: .4rem; }
.sidebar button.group:hover { color: var(--ink); background: var(--soft); }
.sidebar button.group:focus-visible, .sidebar .side-toggle:focus-visible { outline: 2px solid var(--brand-sky); outline-offset: 1px; }
.sidebar button.group .chev { width: 13px; height: 13px; opacity: .7; transition: transform .15s ease; }
.sidebar button.group[aria-expanded="false"] .chev { transform: rotate(-90deg); }
/* 收合 / 展開按鈕 */
.sidebar .side-toggle { all: unset; box-sizing: border-box; display: flex; align-items: center; gap: .6rem; width: 100%; cursor: pointer; padding: .55rem .6rem .3rem; margin-top: .4rem;
  border-top: 1px solid var(--line); color: var(--gray); font-size: .8rem; white-space: nowrap; }
.sidebar .side-toggle:hover { color: var(--brand); }
.sidebar .side-toggle svg { transition: transform .18s ease; }
/* 收合狀態：只留圖示（滑鼠移上去看名稱），分組標題隱藏、所有項目都顯示 */
.nav-collapsed .admin-shell { grid-template-columns: 60px minmax(0, 1fr); }
.nav-collapsed .sidebar { padding: .8rem .5rem .5rem; align-items: center; }
.nav-collapsed .sidebar nav { margin: 0; padding: 0; width: 100%; }
.nav-collapsed .sidebar .nav-label, .nav-collapsed .sidebar .nav-ext, .nav-collapsed .sidebar button.group { display: none; }
.nav-collapsed .sidebar ul, .nav-collapsed .sidebar ul[hidden] { display: grid; justify-items: center; gap: 2px; }
/* 分組之間：一小段置中的分隔線 */
.nav-collapsed .sidebar ul ~ ul { position: relative; margin-top: .5rem; padding-top: .5rem; }
.nav-collapsed .sidebar ul ~ ul::before { content: ""; position: absolute; top: 0; left: 50%; width: 18px; margin-left: -9px; border-top: 1px solid var(--line); }
/* 圖示按鈕：固定 36px 方塊，目前頁面不加左側色條 */
.nav-collapsed .sidebar a { width: 36px; height: 36px; padding: 0; justify-content: center; }
.nav-collapsed .sidebar a[aria-current="page"] { box-shadow: none; }
.nav-collapsed .sidebar .side-toggle { width: 36px; height: 36px; padding: 0; justify-content: center; margin-top: .5rem; border-top: 0; border-radius: .45rem; }
.nav-collapsed .sidebar .side-toggle:hover { background: var(--soft); }
.nav-collapsed .sidebar .side-toggle svg { transform: rotate(180deg); }
.admin-main { padding: 1.6rem 1.8rem 1rem; min-width: 0; }

.kpis { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 1rem; margin-bottom: 1.4rem; }
.kpi { background: #fff; border: 1px solid var(--line); border-radius: var(--radius); padding: 1rem 1.15rem; box-shadow: var(--shadow); border-top: 3px solid var(--brand-sky); }
.kpi.gold { border-top-color: var(--gold); }
.kpi.warnish { border-top-color: #E0A100; }
.kpi .label { font-size: .8rem; color: var(--gray); letter-spacing: .04em; }
.kpi .value { font-size: 2rem; font-weight: 700; color: var(--ink); line-height: 1.2; font-variant-numeric: tabular-nums; }
.kpi a { font-size: .8rem; }

/* ---------- 手機 ---------- */
@media (max-width: 1024px) {
  .admin-shell { grid-template-columns: 1fr; }
  .admin-shell, .nav-collapsed .admin-shell { grid-template-columns: 1fr; }
  .sidebar, .nav-collapsed .sidebar { position: static; height: auto; display: block; border-right: 0; border-bottom: 1px solid var(--line); padding: .5rem .75rem; overflow-x: auto; white-space: nowrap; }
  .sidebar nav { overflow: visible; margin: 0; padding: 0; }
  .sidebar button.group, .sidebar .side-toggle, .sidebar .nav-ext { display: none !important; }
  .sidebar ul, .sidebar ul[hidden], .nav-collapsed .sidebar ul, .nav-collapsed .sidebar ul ~ ul { display: inline-flex; gap: .25rem; margin: 0; padding: 0; border: 0; }
  .nav-collapsed .sidebar ul ~ ul::before { display: none; }
  .sidebar a, .nav-collapsed .sidebar a { width: auto; height: auto; padding: .4rem .7rem; font-size: .85rem; gap: .4rem; }
  .nav-collapsed .sidebar .nav-label { display: inline; }
  .sidebar svg { width: 16px; height: 16px; }
  .sidebar a[aria-current="page"] { box-shadow: none; }
  .admin-main { padding: 1.2rem 1rem; }
  .quote-layout { grid-template-columns: 1fr; }
  .side-card, .quote-guide { position: static; }
  .guide-facts { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 760px) {
  .site-header .bar { flex-wrap: wrap; padding: .5rem 1rem; min-height: 56px; }
  .brand img { height: 30px; }
  .brand .product { font-size: .82rem; padding-left: .7rem; }
  .brand .product small { display: none; }
  .nav-toggle { display: inline-block; }
  .main-nav { display: none; width: 100%; margin: 0; padding-bottom: .5rem; }
  body.nav-open .main-nav { display: block; }
  .main-nav ul { flex-direction: column; align-items: stretch; }
  .main-nav a { border-radius: .5rem; }
  .main-nav .nav-user { padding: .4rem .8rem; margin: 0; border-left: 0; }
  .sidebar { top: 0; }
  .grid-2 { grid-template-columns: 1fr; }
  .price { font-size: 1.6rem; }
  .quote-hero { grid-template-columns: 1fr; padding: 1.3rem 1.2rem; }
  .quote-hero .total-box { text-align: left; }
  .quote-hero .actions { justify-content: flex-start; }
  .quote-hero .total-amount { font-size: 2rem; }
  .options-grid { grid-template-columns: 1fr; }
  .guide-facts { grid-template-columns: 1fr; }
  main.container { padding-top: 1.2rem; }
}

/* 後台燈箱：合約 PDF 預覽、合約文字 */
dialog.lightbox {
  width: min(1100px, 96vw); max-width: none; height: 92vh; max-height: none; margin: auto; padding: 0;
  border: 0; border-radius: var(--radius); background: #fff; color: var(--ink);
  box-shadow: 0 20px 60px rgba(19, 42, 56, .35); display: none; flex-direction: column; overflow: hidden;
  /* 蓋掉 Pico 的 dialog 預設（全螢幕遮罩 + 內容置中） */
  position: fixed; inset: 0; min-width: 0; min-height: 0; align-items: stretch; justify-content: flex-start;
  backdrop-filter: none;
}
dialog.lightbox[open] { display: flex; }
dialog.lightbox::backdrop { background: rgba(8, 30, 44, .6); }
.lightbox-head { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: .6rem 1rem; border-bottom: 1px solid var(--line); background: var(--soft); }
.lightbox-head strong { font-size: .9rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; min-width: 0; }
.lightbox-actions { display: flex; align-items: center; gap: .8rem; flex: none; font-size: .85rem; }
.lightbox-close { margin: 0; padding: .2rem .6rem; width: auto; background: transparent; color: var(--ink); border: 1px solid var(--line); line-height: 1.2; }
.lightbox-close:hover { background: #fff; }
.lightbox-body { flex: 1; min-height: 0; overflow: auto; }
dialog.lightbox[data-kind="pdf"] .lightbox-body { overflow: hidden; }
.lightbox-body iframe { display: block; width: 100%; height: 100%; border: 0; }
.contract-text { padding: 1rem 1.25rem 2rem; font-size: .85rem; }
.ct-page { margin-bottom: 1.5rem; }
.ct-page-title { position: sticky; top: 0; margin: 0 0 .6rem; padding: .35rem 0; background: #fff; border-bottom: 2px solid var(--brand-soft); font-size: .95rem; color: var(--brand); z-index: 1; }
.ct-text { white-space: pre-wrap; line-height: 1.65; margin: 0 0 .9rem; }
.ct-table { font-size: .8rem; margin-bottom: 1rem; }
.ct-table caption { caption-side: top; text-align: left; font-size: .75rem; color: var(--gray); padding-bottom: .25rem; }
.ct-table td, .ct-table th { white-space: pre-line; vertical-align: top; padding: .3rem .5rem; border: 1px solid var(--line); }
.ct-table th[scope="row"] { color: var(--gray); background: var(--soft); font-weight: 500; }
@media (max-width: 640px) {
  dialog.lightbox { width: 100vw; height: 100dvh; border-radius: 0; }
  .lightbox-actions a { display: none; }
}

/* 審核頁：需要確認 + 價格總表 */
.review-concerns { background: var(--warn-bg); border: 1px solid #F0DCA0; border-radius: var(--radius); padding: .8rem 1rem .4rem; margin: 1rem 0 1.5rem; }
.review-concerns h5 { margin: 0 0 .5rem; color: var(--warn); }
.review-concerns ol { margin: 0; padding-left: 1.4rem; font-size: .85rem; }
.review-concerns li { margin-bottom: .35rem; }
.review-concerns .concern-error { color: var(--err); font-weight: 600; }
.review-concerns .concern-info { color: var(--gray); }
.sum-block { margin-bottom: 1.25rem; }
.sum-title { font-weight: 600; font-size: .9rem; margin-bottom: .35rem; }
.sum-table { font-size: .82rem; }
.sum-table th, .sum-table td { padding: .35rem .55rem; vertical-align: top; }
.sum-table thead th { white-space: nowrap; font-size: .75rem; color: var(--gray); }
.sum-table tbody th { font-weight: 500; white-space: nowrap; }
.sum-table td[title] { cursor: help; }
.sum-sub { font-size: .72rem; color: var(--gray); white-space: nowrap; }
.sum-extra { font-size: .75rem; color: var(--gray); min-width: 12rem; }
.sum-inactive { opacity: .55; }
.sum-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)); gap: 0 1.5rem; }
.sum-list { margin: 0; padding-left: 1.1rem; font-size: .82rem; }
.sum-list li { margin-bottom: .25rem; }
.sum-list li[title] { cursor: help; }
.small { font-size: .75rem; font-weight: 400; }
.sum-table th.sum-group { text-align: center; border-bottom: 1px solid var(--line); color: var(--ink); }

/* 表格列尾的小按鈕（例：報價紀錄的明細 / 報價單） */
.row-actions { white-space: nowrap; text-align: right; }
.row-actions [role="button"] + [role="button"] { margin-left: .35rem; }
.btn-sm { padding: .2rem .6rem !important; font-size: .78rem !important; line-height: 1.4; }
.quote-sheet { padding: 1rem 1.25rem 1.5rem; }

/* 固定寬度表格：不左右捲動，過長內容以 … 截斷（滑鼠移上去看完整內容） */
.fit-table { table-layout: fixed; width: 100%; font-size: .85rem; }
.fit-table th, .fit-table td { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; padding: .45rem .5rem; }
.fit-table td.row-actions { overflow: visible; }
.quotes-table .c-id { width: 8.6rem; }
.ref-no { font-size: .68rem; color: var(--gray); letter-spacing: .02em; white-space: nowrap; font-variant-numeric: tabular-nums; }
.filter-bar .grow { flex: 1 1 14rem; }
.qs-ref { font-size: .7rem; color: var(--gray); margin-top: .15rem; letter-spacing: .03em; }
.quotes-table .c-time { width: 7.2rem; }
.quotes-table .c-company { width: 10%; }
.quotes-table .c-hotel { width: 9%; }
.quotes-table .c-stay { width: 7.6rem; }
.quotes-table .c-status { width: 5rem; }
.quotes-table .c-cost, .quotes-table .c-sale { width: 7.5rem; }
.quotes-table .c-act { width: 8.8rem; }
@media (max-width: 1100px) {  /* 窄螢幕收起方案、成本欄（滑到明細看） */
  .quotes-table col.c-plan, .quotes-table col.c-cost { visibility: collapse; width: 0; }
}

/* 報價單（白底文件版面，各區塊以淺色底區分；PDF 同版面） */
.qs { background: #fff; color: var(--ink); border: 1px solid var(--line); border-radius: var(--radius); padding: 1.6rem 1.8rem 1.2rem; max-width: 900px; margin: 0 auto 1rem; box-shadow: var(--shadow); }
.qs-head { display: flex; justify-content: space-between; align-items: center; gap: 1rem; padding-bottom: 1rem; border-bottom: 2px solid var(--brand); margin-bottom: 1.1rem; }
.qs-agency { font-size: 1.4rem; font-weight: 700; color: var(--brand); line-height: 1.3; max-width: 60%; overflow-wrap: anywhere; }
.qs-doc { text-align: right; }
.qs-doc-title { font-size: 1.3rem; font-weight: 700; color: var(--brand); letter-spacing: .08em; }
.qs-doc-title span { font-size: .8rem; font-weight: 500; color: var(--gray); letter-spacing: .12em; margin-left: .3rem; }
.qs-doc-meta { font-size: .78rem; color: var(--gray); line-height: 1.5; }
.qs-sec { border-radius: .6rem; padding: .9rem 1.1rem; margin-bottom: .8rem; }
.qs-info { background: var(--soft); }
.qs-hotel { margin: 0 0 .6rem; font-size: 1.3rem; color: var(--ink); }
.qs-hotel-en { display: block; font-size: .92rem; font-weight: 500; color: var(--gray); margin-top: .15rem; }
.qs-facts { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: .45rem 1.2rem; margin: 0; }
.qs-facts div, .qs-detail div { display: flex; gap: .6rem; }
.qs-facts dt, .qs-detail dt { flex: none; width: 3.6rem; color: var(--gray); font-size: .8rem; padding-top: .1rem; font-weight: 400; }
.qs-facts dd, .qs-detail dd { margin: 0; font-size: .92rem; }
.qs-total { background: var(--sand); border: 1px solid #EBDDB8; display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 1rem 1.6rem; }
.qs-total-plan { min-width: 0; }
.qs-plan-meal { font-size: .92rem; color: var(--ink); margin-bottom: .45rem; }
.qs-plan-type { display: flex; align-items: flex-start; gap: .45rem; font-size: .8rem; color: var(--gray); line-height: 1.45; }
.qs-plan-type .badge { flex: none; }
.qs-per { font-size: .78rem; color: var(--gold-dark); margin-top: .25rem; }
.qs-label { font-size: .75rem; color: var(--gray); letter-spacing: .08em; }
.qs-plan { font-size: 1.15rem; font-weight: 700; margin: .15rem 0 .1rem; line-height: 1.35; }
.qs-sub { font-size: .8rem; color: var(--gray); }
.qs-amount { text-align: right; padding-left: 1.6rem; border-left: 1px solid #EBDDB8; min-width: 13rem; }
.qs-price { font-size: 2rem; font-weight: 700; color: var(--gold-dark); line-height: 1.15; font-variant-numeric: tabular-nums; }
.qs-price small { font-size: .95rem; font-weight: 500; margin-right: .3rem; }
.qs-detail { border: 1px solid var(--line); }
.qs-detail dl { display: grid; gap: .45rem; margin: 0; }
.qs-detail dt { width: 4.5rem; }
.qs-alt { background: #F6F8F9; }
.qs-alt h4 { font-size: .9rem; margin: 0 0 .5rem; color: var(--ink); }
.qs-alt table { width: 100%; margin: 0; font-size: .85rem; background: transparent; }
.qs-alt th { font-size: .75rem; color: var(--gray); font-weight: 500; background: transparent; border-bottom: 1px solid var(--line); padding: .3rem .4rem; }
.qs-alt td { padding: .4rem; border-bottom: 1px solid #E8EEF1; background: transparent; vertical-align: top; }
.qs-alt tr:last-child td { border-bottom: 0; }
.qs-alt td.qs-cheaper { color: var(--ok); }
.qs-switch { text-align: right; white-space: nowrap; width: 1%; }
.qs-switch form { margin: 0; }
.qs-switch button { margin: 0; padding: .2rem .65rem; font-size: .78rem; width: auto; }
.qs-warn { background: var(--warn-bg); color: var(--warn); font-size: .85rem; }
.qs-foot { font-size: .75rem; color: var(--gray); text-align: center; padding-top: .6rem; border-top: 1px solid var(--line); margin-top: .4rem; }
.qs-actions { display: flex; gap: .6rem; justify-content: center; margin-bottom: 1.2rem; }
.qs-actions [role="button"] { margin: 0; }
.quote-sheet .qs { box-shadow: none; border: 0; padding: .4rem .6rem; max-width: none; }
@media (max-width: 640px) {
  .qs { padding: 1rem; }
  .qs-head { flex-direction: column; align-items: flex-start; }
  .qs-doc, .qs-amount { text-align: left; }
  .qs-total { grid-template-columns: 1fr; }
  .qs-amount { border-left: 0; padding-left: 0; border-top: 1px solid #EBDDB8; padding-top: .8rem; min-width: 0; }
  .qs-price { font-size: 1.6rem; }
}

/* 總覽圖表（白底卡片；格線與軸為細灰線，文字用文字色、不用資料色） */
.viz { margin-top: 1.5rem; }
.viz-head { display: flex; justify-content: space-between; align-items: flex-end; gap: 1rem; flex-wrap: wrap; margin-bottom: .8rem; }
.viz-head h5 { margin: 0; }
.viz-head p { margin: .15rem 0 0; }
.viz-range { display: inline-flex; border: 1px solid var(--line); border-radius: .5rem; overflow: hidden; background: #fff; }
.viz-range a { padding: .35rem .8rem; font-size: .82rem; color: var(--gray); text-decoration: none; border-left: 1px solid var(--line); }
.viz-range a:first-child { border-left: 0; }
.viz-range a[aria-current] { background: var(--brand-soft); color: var(--brand); font-weight: 600; }
.viz-tiles { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: .8rem; margin-bottom: .9rem; }
.viz-tiles > div { background: #fff; border: 1px solid var(--line); border-radius: var(--radius); padding: .7rem .9rem; }
.viz-tiles .label { font-size: .78rem; color: var(--gray); }
.viz-tiles .value { font-size: 1.5rem; font-weight: 600; color: var(--ink); }
.viz-tiles .value-sm { font-size: .88rem; font-weight: 500; padding-top: .45rem; }
.viz-card { background: #fff; border: 1px solid var(--line); border-radius: var(--radius); padding: .9rem 1rem; margin-bottom: .9rem; box-shadow: var(--shadow); }
.viz-card-head { display: flex; justify-content: space-between; align-items: center; gap: 1rem; flex-wrap: wrap; margin-bottom: .5rem; font-size: .9rem; }
.viz-legend { display: flex; gap: 1rem; list-style: none; margin: 0; padding: 0; font-size: .8rem; color: var(--ink); }
.viz-legend li { display: flex; align-items: center; gap: .35rem; margin: 0; }
.viz .key { display: inline-block; width: 10px; height: 10px; border-radius: 3px; flex: none; }
.viz-plot { position: relative; }
.viz-plot svg { display: block; width: 100%; height: auto; overflow: visible; }
.viz-plot .grid { stroke: #e1e0d9; stroke-width: 1; }
.viz-plot .axis { stroke: #c3c2b7; stroke-width: 1; }
.viz-plot .tick { fill: #898781; font-size: 10px; font-variant-numeric: tabular-nums; }
.viz-plot .hit { fill: transparent; }
.viz-plot .col { outline: none; cursor: default; }
.viz-plot .col.active .hit { fill: rgba(12, 92, 132, .06); }
.viz-tooltip { position: absolute; background: #fff; border: 1px solid var(--line); border-radius: .5rem; box-shadow: 0 6px 20px rgba(19, 42, 56, .15); padding: .5rem .7rem; font-size: .8rem; min-width: 9rem; pointer-events: none; z-index: 2; }
.tt-head { font-weight: 600; margin-bottom: .3rem; }
.tt-row { display: grid; grid-template-columns: 10px 1fr auto; align-items: center; gap: .45rem; }
.tt-val { font-variant-numeric: tabular-nums; text-align: right; }
.tt-total { border-top: 1px solid var(--line); margin-top: .25rem; padding-top: .25rem; font-weight: 600; }
.viz-empty { margin: .8rem 0; }
.hbars { list-style: none; margin: 0; padding: 0; display: grid; gap: .45rem; }
.hbars li { display: grid; grid-template-columns: minmax(8rem, 15rem) 1fr; align-items: center; gap: .8rem; margin: 0; font-size: .85rem; }
.hbar-label { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.hbar-track { display: flex; align-items: center; gap: .5rem; min-width: 0; }
.hbar { display: block; height: 14px; min-width: 2px; background: #2a78d6; border-radius: 0 4px 4px 0; }
.hbar-value { font-size: .8rem; color: var(--gray); white-space: nowrap; font-variant-numeric: tabular-nums; }
.viz-table summary { font-size: .85rem; color: var(--gray); }
.viz-table .table-wrap { margin-top: .5rem; }

/* 飯店比價 */
.cmp-cond { background: var(--soft); }
.cmp-wrap { margin-top: .8rem; }
.cmp-table { font-size: .9rem; }
.cmp-table th, .cmp-table td { vertical-align: middle; }
.cmp-rank { width: 2.2rem; color: var(--gray); font-variant-numeric: tabular-nums; }
.cmp-price { white-space: nowrap; font-weight: 600; font-size: 1.05rem; }
.cmp-price small { font-weight: 400; color: var(--gray); font-size: .78rem; }
.cmp-table tr.cmp-best td { background: var(--sand); }
.cmp-table tr.cmp-best .cmp-price { color: var(--gold-dark); }
.cmp-failed ul { margin: 0; padding-left: 1.1rem; font-size: .88rem; }
.cmp-failed li { margin-bottom: .3rem; }
.cmp-hotel { display: flex; gap: .7rem; align-items: center; min-width: 15rem; }
.cmp-thumb { flex: none; line-height: 0; }
.cmp-thumb img { width: 80px; height: 55px; object-fit: cover; border-radius: 6px; border: 1px solid var(--line); }
.cmp-name { color: inherit; text-decoration: none; }
.cmp-name:hover { color: var(--brand); text-decoration: underline; }
@media (max-width: 900px) { .cmp-thumb { display: none; } .cmp-hotel { min-width: 10rem; } }
.cmp-tags { display: flex; flex-wrap: wrap; gap: .2rem; margin-top: .25rem; }
.cmp-tags .badge { font-size: .68rem; padding: .05rem .45rem; }

/* 比價類別篩選（勾選，可複選） */
.cat-group { display: flex; gap: .6rem; align-items: baseline; margin-bottom: .55rem; }
.cat-group-name { flex: none; width: 5.5rem; font-size: .82rem; color: var(--gray); }
.cat-chips { display: flex; flex-wrap: wrap; gap: .4rem; }
.cat-chip { display: inline-flex; align-items: center; gap: .35rem; margin: 0; padding: .3rem .75rem .3rem .55rem; border: 1px solid var(--line); border-radius: 999px; background: #fff; font-size: .9rem; cursor: pointer; transition: background .15s, border-color .15s; }
.cat-chip input[type="checkbox"] { margin: 0; width: 1.05em; height: 1.05em; }
.cat-chip:has(input:checked) { background: var(--brand-soft); border-color: var(--brand); color: var(--brand-strong); }
.cat-chip.ai-filled { background: #FFF8E6 !important; border-color: var(--gold) !important; }
.tag-pills .pill.ai-filled span { background: #FFF8E6; border-color: var(--gold); color: var(--ink); }
@media (max-width: 600px) { .cat-group { flex-direction: column; gap: .25rem; } .cat-group-name { width: auto; } }
.tag-form { display: flex; flex-wrap: wrap; align-items: center; gap: .4rem 1rem; margin-bottom: 1rem; }
.tag-form label { margin: 0; }
.tag-form button { width: auto; margin: 0; }

/* 列表「顯示更多」 */
.more-row { text-align: center; margin: .6rem 0 1.2rem; }
.more-row [role="button"], .more-row button { width: auto; margin: 0; }

/* 一列的篩選 / 建立表單：欄位與按鈕底部對齊 */
.filter-bar { display: flex; flex-wrap: wrap; gap: .5rem 1rem; align-items: flex-end; margin-bottom: 1rem; }
.filter-bar > label { flex: 1 1 14rem; margin: 0; }
.filter-bar > label > input:not([type="checkbox"]), .filter-bar > label > select { margin-bottom: 0; }
.filter-bar > label:has(> input[type="checkbox"]) { flex: 0 1 auto; align-self: center; }
.filter-bar > button { flex: 0 0 auto; width: auto; min-width: 7rem; margin: 0; }
.filter-bar > .filter-clear { align-self: center; font-size: .9rem; }
/* 後台飯店列表：小圖 + 中英文名，編輯按鈕靠右 */
.hotel-list td { vertical-align: middle; }
.hotel-list .hl-thumb { width: 88px; padding-right: 0; }
.hotel-list .hl-thumb img, .hotel-list .hl-noimg { display: block; width: 72px; height: 50px; object-fit: cover; border-radius: .45rem; }
.hotel-list .hl-noimg { background: var(--soft); border: 1px solid var(--line); }
.hotel-list .hl-name { text-decoration: none; }
.hotel-list .hl-code { margin-top: .15rem; }
.hotel-list .hl-code code { font-size: .75rem; padding: .05rem .35rem; }
.hotel-list .hl-actions { text-align: right; white-space: nowrap; }
/* 線上報價表單上方：已選定的飯店 */
.hotel-fixed { display: flex; align-items: center; gap: .9rem; padding: .7rem .9rem; margin-bottom: 1.1rem; background: var(--soft); border: 1px solid var(--line); border-radius: var(--radius); }
.hotel-fixed img { width: 96px; height: 66px; object-fit: cover; border-radius: .5rem; flex: none; }
.hotel-fixed .hf-name { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.hotel-fixed .hf-name small { font-size: .75rem; color: var(--gray); letter-spacing: .08em; }
.hotel-fixed .hf-name strong { font-size: 1.1rem; color: var(--brand); }
.hotel-fixed .hf-name span { font-size: .85rem; color: var(--gray); }
.hotel-fixed > a { flex: none; margin: 0; }
@media (max-width: 640px) { .hotel-fixed img { width: 72px; height: 50px; } }

/* ---------- 同業：飯店優惠（列表頁 + 飯店頁） ---------- */
.offer-search { background: #fff; border: 1px solid var(--line); border-radius: var(--radius); padding: .9rem 1rem .7rem; margin-bottom: .8rem; }
.offer-search-row { display: grid; grid-template-columns: minmax(0, 1fr) 11rem auto; gap: .6rem; }
.offer-search-row input, .offer-search-row select, .offer-search-row button { margin: 0; }
.offer-search-row button { width: auto; padding-inline: 1.4rem; }
.history-search .offer-search-row { grid-template-columns: minmax(0, 1fr) auto auto; align-items: center; }
.tag-pills { display: flex; flex-wrap: wrap; gap: .4rem; align-items: center; margin-top: .7rem; }
.tag-pills .pill { margin: 0; cursor: pointer; width: auto; flex: none; }
.tag-pills .pill input { position: absolute; opacity: 0; pointer-events: none; }
.tag-pills .pill span { display: inline-block; padding: .28rem .8rem; border: 1px solid var(--line); border-radius: 999px; font-size: .84rem; background: #fff; color: var(--ink); }
.tag-pills .pill input:checked + span { background: var(--brand); border-color: var(--brand); color: #fff; }
.tag-pills .pill input:focus-visible + span { outline: 2px solid var(--brand); outline-offset: 2px; }
.tag-pills .pill-warn input:checked + span { background: var(--warn); border-color: var(--warn); }
.pill-sep { flex: none; width: 1px; align-self: stretch; background: var(--line); margin: .15rem .25rem; }
.tag-pills .pill-cat span { border-color: #EAD9AE; background: #FFFCF4; }
.tag-pills .pill-cat input:checked + span { background: var(--gold-dark); border-color: var(--gold-dark); color: #fff; }
.tag-pills .clear-link { font-size: .84rem; margin-left: .4rem; white-space: nowrap; }
.filter-note { display: block; margin-top: .5rem; font-size: .74rem; }
.offer-summary { margin: 0 0 .7rem; }
.hotel-offer-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(270px, 1fr)); gap: 1rem; }
.hotel-offer-card { display: flex; flex-direction: column; background: #fff; border: 1px solid var(--line); border-radius: var(--radius); overflow: hidden; color: var(--ink); text-decoration: none; transition: border-color .15s, box-shadow .15s, transform .15s; }
.hotel-offer-card:hover { border-color: var(--brand); box-shadow: var(--shadow); color: var(--ink); transform: translateY(-2px); }
.hoc-img { position: relative; aspect-ratio: 16 / 10; background: var(--soft); }
.hoc-img img { width: 100%; height: 100%; object-fit: cover; display: block; }
.hoc-img .hoc-count { position: absolute; left: .6rem; bottom: .6rem; display: flex; gap: .35rem; }
.hoc-img .hoc-count span { background: rgba(255, 255, 255, .94); color: var(--ink); border-radius: 999px; padding: .15rem .6rem; font-size: .78rem; box-shadow: 0 1px 4px rgba(0, 0, 0, .12); }
.hoc-img .hoc-count b { color: var(--brand); font-size: .92rem; margin-right: .1rem; }
.hoc-soon { position: absolute; top: .6rem; right: .6rem; background: var(--warn); color: #fff; font-size: .72rem; font-weight: 600; border-radius: 999px; padding: .15rem .6rem; }
.hoc-body { padding: .8rem .9rem .75rem; display: flex; flex-direction: column; gap: .2rem; flex: 1; }
.hoc-name { font-weight: 700; font-size: 1.02rem; line-height: 1.35; }
.hoc-en { font-size: .78rem; color: var(--gray); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.hoc-cats { font-size: .78rem; color: var(--gold-dark); margin-top: .15rem; }
.hoc-tags { display: flex; flex-wrap: wrap; gap: .25rem; margin-top: .3rem; }
.hoc-tags .badge { font-size: .68rem; padding: .05rem .45rem; }
.hoc-foot { display: flex; justify-content: space-between; align-items: center; gap: .5rem; margin-top: auto; padding-top: .55rem; font-size: .78rem; }
.hoc-go { margin-left: auto; color: var(--brand); font-weight: 600; font-size: .84rem; }
.back-link { margin: 0 0 .6rem; font-size: .88rem; }
.offer-hotel-head { display: flex; align-items: center; gap: 1rem; margin-bottom: 1rem; }
.offer-hotel-head img { width: 240px; height: 150px; object-fit: cover; border-radius: 10px; border: 1px solid var(--line); flex: none; }
.offer-hotel-head h3 { margin: 0; }
.offer-hotel-head > a, .offer-hotel-head > .head-links { margin-left: auto; white-space: nowrap; align-self: flex-start; }
.head-links { display: flex; flex-direction: column; align-items: flex-end; gap: .3rem; }
.offer-hotel-head .hoc-count { display: flex; flex-wrap: wrap; gap: .2rem .8rem; font-size: .86rem; margin-top: .45rem; align-items: center; }
.offer-hotel-head .hoc-count b { color: var(--brand); font-size: 1.05rem; }
.offer-hotel-head .hoc-cats { margin-top: .3rem; }
.hit-note { font-size: .85rem; color: var(--brand); margin: -.3rem 0 .8rem; }
.offer-sec-title { font-size: .95rem; margin: 1.2rem 0 .6rem; color: var(--ink); }
.offer-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(290px, 1fr)); gap: .9rem; }
.offer-card { margin: 0; padding: 1rem 1.1rem; border: 1px solid var(--line); border-radius: var(--radius); background: #fff; display: flex; flex-direction: column; box-shadow: none; }
.offer-card.is-hit { border: 2px solid var(--brand); }
.offer-card.off { filter: grayscale(1); opacity: .55; background: #fafafa; }
.offer-card.off:hover { opacity: .75; }
.offer-grid .offer-card.off h5, .offer-grid .offer-card.off .offer-head { color: var(--muted); }
.pkg-table tr.off { filter: grayscale(1); opacity: .55; }
.offer-top { display: flex; gap: .35rem; margin-bottom: .45rem; }
.offer-card h5 { margin: 0 0 .25rem; font-size: .98rem; line-height: 1.4; }
.offer-head { margin: 0 0 .6rem; color: var(--brand); font-weight: 600; font-size: .9rem; }
.offer-facts { margin: 0 0 .7rem; display: grid; gap: .3rem; font-size: .82rem; }
.offer-facts div { display: flex; gap: .5rem; }
.offer-facts dt { flex: none; width: 3.2rem; color: var(--gray); font-weight: 400; }
.offer-facts dd { margin: 0; }
.offer-foot { margin-top: auto; display: flex; justify-content: flex-end; }
.offer-foot [role="button"] { margin: 0; }
.offer-packages { border: 1px solid #EBDDB8; border-radius: var(--radius); background: #FFFDF7; padding: .3rem .6rem; }
.pkg-table { font-size: .8rem; margin: 0; background: transparent; }
.pkg-table th { font-size: .72rem; color: var(--gray); font-weight: 500; background: transparent; }
.pkg-table td { vertical-align: top; background: transparent; }
.pkg-table tr.is-hit td { background: var(--brand-soft); }
.pkg-table .nowrap { white-space: nowrap; }
.pkg-table td:nth-child(5) { min-width: 9rem; }
.pkg-perks { color: var(--gray); font-size: .74rem; margin-top: .15rem; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; max-width: 28rem; }
/* 單一飯店優惠頁：入住期間條狀圖（每項優惠一列，套裝合併一列） */
.offer-tl { background: #fff; border: 1px solid var(--line); border-radius: var(--radius); padding: .7rem .9rem .8rem; margin-bottom: 1rem; }
.otl-head { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: .3rem 1rem; }
.otl-head .offer-sec-title { margin: 0 0 .4rem; }
.otl-legend { display: flex; flex-wrap: wrap; align-items: center; gap: .2rem .3rem; font-size: .74rem; color: var(--gray); }
.otl-key { display: inline-block; width: .9rem; height: .55rem; border-radius: 3px; background: var(--brand-sky); margin-left: .5rem; }
.otl-key.pkg { background: var(--gold); }
.otl-key.bo { background: repeating-linear-gradient(135deg, #fff 0 2px, var(--err) 2px 3.5px); border: 1px solid var(--err); }
.otl-key.today { width: 2px; height: .8rem; border-radius: 0; background: var(--err); }
.otl-scroll { overflow-x: auto; overflow-y: hidden; }
.otl { min-width: 640px; }
.otl-row { display: grid; grid-template-columns: 12rem minmax(0, 1fr); align-items: center; min-height: 2.1rem; border-top: 1px solid var(--line); }
.otl-row.otl-axis { border-top: 0; min-height: 1.4rem; }
.otl-label { display: flex; flex-direction: column; padding-right: .7rem; line-height: 1.25; text-decoration: none; color: var(--ink); min-width: 0; position: sticky; left: 0; background: #fff; z-index: 2; }
.otl-label:hover .otl-name { color: var(--brand); text-decoration: underline; }
.otl-name { font-size: .8rem; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.otl-note { font-size: .68rem; color: var(--gray); }
.otl-track { position: relative; height: 100%; min-height: inherit; }
.otl-month { position: absolute; top: 0; bottom: 0; display: flex; align-items: flex-end; padding: 0 0 .15rem .25rem; font-size: .7rem; color: var(--gray); white-space: nowrap; border-left: 1px solid var(--line); }
.otl-month.jan { color: var(--ink); font-weight: 600; border-left-color: #B8CAD3; }
.otl-grid { position: absolute; top: 0; bottom: 0; border-left: 1px solid var(--line); }
.otl-grid.jan { border-left-color: #B8CAD3; }
.otl-past { position: absolute; left: 0; top: 0; bottom: 0; background: rgba(91, 110, 121, .07); }
.otl-bar { position: absolute; top: 50%; height: 1rem; transform: translateY(-50%); background: var(--brand-sky); border-radius: 4px; min-width: 3px; color: #fff; font-size: .66rem; line-height: 1rem; padding: 0 .4rem; white-space: nowrap; overflow: hidden; }
.otl-bar.package { background: var(--gold); color: var(--ink); }
.otl-bo { position: absolute; top: 50%; height: 1.1rem; transform: translateY(-50%); min-width: 3px; background: repeating-linear-gradient(135deg, rgba(255, 255, 255, .9) 0 2px, var(--err) 2px 3.5px); border: 1px solid var(--err); border-radius: 3px; }
.otl-today { position: absolute; top: -1px; bottom: -1px; border-left: 2px solid var(--err); z-index: 1; }
.otl-axis .otl-today { display: none; }
@media (max-width: 640px) {
  .offer-search-row { grid-template-columns: 1fr; }
  .offer-hotel-head img { width: 100%; height: auto; aspect-ratio: 16 / 10; }
  .offer-hotel-head { flex-wrap: wrap; }
  .offer-hotel-head > a, .offer-hotel-head > .head-links { margin-left: 0; }
  .head-links { flex-direction: row; gap: 1rem; }
  .otl { min-width: 560px; }
  .otl-row { grid-template-columns: 7.5rem minmax(0, 1fr); }
  .offer-tl { padding-inline: .7rem; }
}

/* ---------- 後台：優惠管理 ---------- */
.om-actions { display: flex; gap: .5rem; flex-wrap: wrap; }
.om-actions [role="button"] { margin: 0; }
.om-draft { display: flex; justify-content: space-between; align-items: center; gap: 1rem; flex-wrap: wrap; background: var(--warn-bg); border: 1px solid #F1DFA8; border-radius: var(--radius); padding: .8rem 1rem; margin-bottom: .8rem; }
.om-draft [role="button"] { margin: 0; white-space: nowrap; }
.om-base { color: var(--gray); }
.om-legend { color: var(--gray); margin-bottom: .8rem; }
.om-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); gap: .9rem; }
.om-card { margin: 0; padding: .95rem 1.05rem; border: 1px solid var(--line); border-radius: var(--radius); background: #fff; display: flex; flex-direction: column; gap: .5rem; box-shadow: none; }
.om-card.is-off { background: #FAFBFC; }
.om-card.is-off h5, .om-card.is-off .om-what { color: var(--gray); }
.om-card header { margin: 0; padding: 0; background: none; border: 0; }
.om-badges { display: flex; flex-wrap: wrap; gap: .3rem; align-items: center; margin-bottom: .35rem; }
.om-src { margin-left: auto; font-size: .72rem; color: var(--gray); border-bottom: 1px dotted var(--gray); cursor: help; }
.om-card h5 { margin: 0 0 .15rem; font-size: .98rem; line-height: 1.4; }
.om-what { color: var(--brand); font-weight: 600; font-size: .86rem; }
.om-card .offer-facts { margin: 0; }
.om-foot { margin-top: auto; display: flex; flex-wrap: wrap; gap: .4rem; align-items: flex-start; padding-top: .5rem; border-top: 1px solid var(--line); }
.om-foot > a[role="button"] { margin: 0; }
.om-pop { margin: 0; }
.om-pop > summary { margin: 0; list-style: none; }
.om-pop > summary::-webkit-details-marker { display: none; }
.om-pop > summary::after { display: none !important; }
.om-pop[open] { flex-basis: 100%; order: 10; }
.om-pop form { margin-top: .5rem; padding: .7rem .8rem; background: var(--soft); border: 1px solid var(--line); border-radius: var(--pico-border-radius); font-size: .85rem; }
.om-pop form label { margin-bottom: .5rem; }
.om-pop form input { margin-bottom: .2rem; }
.om-pop-danger form { background: var(--err-bg); border-color: #F3C7C7; }
.offer-form { max-width: 860px; }
.label-text { display: block; font-size: .85rem; margin: .3rem 0 .3rem; }
.check-row { display: flex; flex-wrap: wrap; gap: .3rem 1.1rem; margin-bottom: .8rem; font-size: .88rem; }
.check-row label { margin: 0; width: auto; }
.inline-check { display: inline-flex; align-items: center; gap: .4rem; margin-top: 1.9rem; }

/* 飯店知識（同業平台 /portal/wiki） */
.wiki-ask .ai-body { margin-top: .65rem; }
.wiki-answer { display: block; font-size: .92rem; line-height: 1.7; }
.wiki-answer-body > :last-child { margin-bottom: 0; }
.wiki-answer-body ul, .wiki-answer-body ol { margin-bottom: .5rem; }
.wiki-sources { margin-top: .7rem; padding-top: .55rem; border-top: 1px dashed var(--line); font-size: .84rem; }
.wiki-hit-list { list-style: none; padding: 0; margin: 0; display: grid; gap: .45rem; }
.wiki-group-name { font-size: .8rem; font-weight: 700; color: var(--gold-dark); letter-spacing: .06em; margin-bottom: .4rem; }
.wiki-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; flex-wrap: wrap; margin-bottom: 1rem; }
.wiki-head h3 { margin: 0; }
.wiki-actions { display: flex; gap: .5rem; }
.wiki-actions [role="button"] { margin: 0; }
.wiki-body { background: #fff; padding: 1.2rem 1.4rem; line-height: 1.75; font-size: .94rem; }
.wiki-body h2 { font-size: 1.08rem; color: var(--brand); margin: 1.6rem 0 .6rem; padding-bottom: .3rem; border-bottom: 2px solid var(--brand-soft); }
.wiki-body h2:first-child { margin-top: 0; }
.wiki-body h3 { font-size: .98rem; margin: 1.1rem 0 .4rem; }
.wiki-body blockquote { margin: .8rem 0; padding: .6rem .9rem; background: var(--brand-soft); border-left: 4px solid var(--brand-sky); border-radius: 0 var(--pico-border-radius) var(--pico-border-radius) 0; font-style: normal; }
.wiki-body blockquote p { margin: 0; }
.wiki-body blockquote p + p { margin-top: .3rem; }
.wiki-body table { display: block; overflow-x: auto; max-width: 100%; }
.wiki-body td, .wiki-body th { white-space: normal; min-width: 6rem; }
@media (max-width: 640px) { .wiki-body { padding: .9rem 1rem; } }

/* 飯店知識關聯圖（static/wiki-graph.js） */
.wiki-graph { --wg-hotel: var(--brand); --wg-faq: var(--gold); --wg-compare: #1F8A70; position: relative; background: radial-gradient(900px 420px at 50% 40%, #FFFFFF 0%, #F3F9FC 70%, #EAF4F9 100%); border: 1px solid var(--line); border-radius: var(--radius); overflow: hidden; box-shadow: var(--shadow); }
.wg-bar { display: flex; justify-content: space-between; align-items: center; gap: .6rem; flex-wrap: wrap; padding: .6rem .8rem; border-bottom: 1px solid var(--line); background: rgba(255, 255, 255, .85); }
.wg-legend, .wg-zoom { display: flex; gap: .35rem; flex-wrap: wrap; }
.wiki-graph .wg-bar button { width: auto; margin: 0; padding: .22rem .7rem; font-size: .8rem; border-radius: 999px; background: #fff; color: var(--ink); border: 1px solid var(--line); }
.wiki-graph .wg-zoom button { min-width: 2rem; padding-inline: .5rem; }
.wg-chip i { display: inline-block; width: .65rem; height: .65rem; border-radius: 50%; margin-right: .35rem; vertical-align: -.02rem; }
.wg-chip.kind-hotel i { background: var(--wg-hotel); }
.wg-chip.kind-faq i { background: var(--wg-faq); }
.wg-chip.kind-compare i { background: var(--wg-compare); }
.wiki-graph .wg-chip[aria-pressed="false"] { opacity: .45; text-decoration: line-through; }
.wiki-graph svg { display: block; width: 100%; height: auto; max-height: 640px; touch-action: none; cursor: grab; user-select: none; }
.wiki-graph svg:active { cursor: grabbing; }
.wg-lines line { stroke: #9FBFD0; stroke-opacity: .5; stroke-width: 1.2; transition: stroke-opacity .15s; }
.wg-lines line.is-on { stroke: var(--brand-sky); stroke-opacity: .95; stroke-width: 2; }
.wg-lines line.is-hidden { display: none; }
.wg-node { cursor: pointer; outline: none; }
/* 立體效果：球體漸層（JS 產生 radialGradient）、--d 為深度（1 = 最靠近），遠的淡、近的清楚 */
.wg-node { opacity: calc(.38 + .62 * var(--d, 1)); }
.wg-node circle { stroke: rgba(255, 255, 255, .95); stroke-width: 2; transition: r .15s; }
.wg-ball.kind-hotel stop { stop-color: var(--wg-hotel); }
.wg-ball.kind-faq stop { stop-color: var(--wg-faq); }
.wg-ball.kind-compare stop { stop-color: var(--wg-compare); }
.wg-ball.kind-hotel .wg-hi { stop-color: color-mix(in srgb, #fff 55%, var(--wg-hotel)); }
.wg-ball.kind-faq .wg-hi { stop-color: color-mix(in srgb, #fff 55%, var(--wg-faq)); }
.wg-ball.kind-compare .wg-hi { stop-color: color-mix(in srgb, #fff 55%, var(--wg-compare)); }
.wg-ball.kind-hotel .wg-lo { stop-color: color-mix(in srgb, #000 35%, var(--wg-hotel)); }
.wg-ball.kind-faq .wg-lo { stop-color: color-mix(in srgb, #000 30%, var(--wg-faq)); }
.wg-ball.kind-compare .wg-lo { stop-color: color-mix(in srgb, #000 35%, var(--wg-compare)); }
.wg-node text { font-size: 13px; font-weight: 600; fill: var(--ink); paint-order: stroke; stroke: rgba(255, 255, 255, .92); stroke-width: 4px; stroke-linejoin: round; pointer-events: none; transition: opacity .15s; }
.wg-node.wg-minor text { font-size: 11px; font-weight: 500; opacity: 0; }
.wiki-graph.wg-zoomed .wg-node.wg-minor text { opacity: 1; }
.wiki-graph.wg-focus .wg-node { opacity: .18; }
.wiki-graph.wg-focus .wg-lines line:not(.is-on) { stroke-opacity: .08; }
.wiki-graph .wg-node.is-on { opacity: 1; }
.wiki-graph .wg-node.is-on text { opacity: 1; }
.wg-node:focus-visible circle { stroke: var(--ink); stroke-width: 3; }
.wiki-graph.hide-hotel .wg-node.kind-hotel, .wiki-graph.hide-faq .wg-node.kind-faq, .wiki-graph.hide-compare .wg-node.kind-compare { display: none; }
.wg-tip { position: absolute; left: .8rem; top: 3.3rem; background: rgba(8, 63, 92, .92); color: #fff; font-size: .8rem; padding: .3rem .7rem; border-radius: 999px; pointer-events: none; max-width: calc(100% - 1.6rem); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.wg-hint { font-size: .75rem; color: var(--gray); margin: 0; padding: .5rem .8rem .65rem; border-top: 1px solid var(--line); background: rgba(255, 255, 255, .85); }
@media (prefers-reduced-motion: reduce) { .wg-node circle, .wg-node text, .wg-lines line { transition: none; } }
.wg-rings path { fill: none; stroke: #B9D6E4; stroke-width: 1.2; stroke-dasharray: 3 6; }
.wg-lines path { fill: none; stroke: #8FB5C9; stroke-opacity: calc(.14 + .4 * var(--d, 1)); stroke-width: 1.1; transition: stroke-opacity .15s; }
.wg-lines path.is-on { stroke: var(--brand-sky); stroke-opacity: .95; stroke-width: 2; stroke-dasharray: 6 5; animation: wg-flow 1s linear infinite; }
@keyframes wg-flow { to { stroke-dashoffset: -11; } }
@media (prefers-reduced-motion: reduce) { .wg-lines path.is-on { animation: none; stroke-dasharray: none; } }
.wg-lines path.is-hidden { display: none; }
.wiki-graph.wg-focus .wg-lines path:not(.is-on) { stroke-opacity: .06; }

/* 飯店知識：搜尋下方左右版面（左關聯圖、右閱讀區），仿舊版 viz.html */
.wiki-split { display: grid; grid-template-columns: minmax(0, 3fr) minmax(360px, 2fr); height: clamp(560px, calc(100vh - 120px), 860px); border: 1px solid var(--line); border-radius: var(--radius); overflow: hidden; box-shadow: var(--shadow); background: #fff; margin-bottom: 1.4rem; }
.wiki-split .wiki-graph { display: flex; flex-direction: column; min-width: 0; border: 0; border-right: 1px solid var(--line); border-radius: 0; box-shadow: none; background: radial-gradient(70% 60% at 50% 55%, #FFFFFF 0%, #EEF7FB 55%, #DCEEF6 100%); }
.wiki-split .wiki-graph svg { flex: 1; min-height: 0; height: 100%; max-height: none; }
.wg-stats { display: flex; gap: .4rem; flex-wrap: wrap; padding: .5rem .8rem 0; font-size: .76rem; color: var(--gray); }
.wg-stats span { background: rgba(255, 255, 255, .9); border: 1px solid var(--line); border-radius: 6px; padding: .12rem .5rem; }
.wg-stats b { color: var(--ink); }
.wg-stats .wg-stat-hit { border-color: var(--gold); background: #FFF8E6; }
.wiki-split .wg-tip { top: auto; bottom: 2.9rem; }
.wiki-graph.wg-search .wg-node:not(.is-hit):not(.is-selected) { opacity: .25; }
.wiki-graph.wg-search .wg-node.is-hit text { opacity: 1; }
.wg-node.is-hit circle { stroke: var(--gold); stroke-width: 3.5; }
.wg-node.is-selected circle { stroke: var(--ink); stroke-width: 3.5; }
.wiki-graph .wg-node.is-selected, .wiki-graph .wg-node.is-selected text { opacity: 1; }
.wiki-side { display: flex; flex-direction: column; min-width: 0; min-height: 0; scroll-margin-top: 80px; }
.wiki-side .wiki-search { margin: 0; padding: .75rem 1.1rem; border-bottom: 1px solid var(--line); background: #fff; }
/* 一體式搜尋列：白色圓角外框、左側放大鏡、按鈕嵌在框內；聚焦時外框變品牌色 */
.wiki-search .offer-search-row { display: flex; align-items: center; gap: .3rem; padding: .25rem; background: #fff; border: 1px solid var(--line); border-radius: 999px; box-shadow: 0 1px 2px rgba(15, 45, 70, .05); transition: border-color .15s, box-shadow .15s; }
.wiki-search .offer-search-row:focus-within { border-color: var(--brand); box-shadow: 0 0 0 3px var(--brand-soft); }
.wiki-search .offer-search-row input[type=search] { flex: 1; min-width: 0; height: 2.35rem; margin: 0; padding-block: 0; border: 0; border-radius: 999px; background-color: transparent; box-shadow: none; font-size: .92rem; }
.wiki-search .offer-search-row input[type=search]:focus { box-shadow: none; border: 0; }
.wiki-search .offer-search-row button { flex: none; height: 2.35rem; padding: 0 1.15rem; border-radius: 999px; font-size: .88rem; }
.wiki-panel { flex: 1; min-height: 0; scroll-margin-top: 80px; overflow-y: auto; padding: 1.2rem 1.4rem 1.4rem; background: #fff; scrollbar-color: #B8CCD6 transparent; }
.wiki-panel[aria-busy="true"] { opacity: .55; transition: opacity .15s; }
.wiki-empty { color: var(--gray); font-size: .88rem; background: var(--soft); border-radius: var(--pico-border-radius); padding: .7rem .9rem; margin-bottom: 1rem; }
.wiki-panel-head { display: flex; justify-content: space-between; align-items: baseline; gap: .6rem; margin-bottom: .6rem; font-size: .9rem; }
.wiki-panel-head a { font-size: .82rem; }
.wiki-results { margin-bottom: 1.2rem; padding-bottom: .9rem; border-bottom: 1px dashed var(--line); }
.wiki-hit-list li { list-style: none; border: 1px solid var(--line); border-radius: var(--pico-border-radius); padding: .5rem .75rem; }
.wiki-hit-list a { text-decoration: none; display: flex; align-items: center; gap: .4rem; }
.wiki-hit-list .small { margin-top: .15rem; font-size: .8rem; }
.wg-kind-dot { display: inline-block; width: .6rem; height: .6rem; border-radius: 50%; flex: none; margin-right: .35rem; vertical-align: .05rem; }
.wg-kind-dot.kind-hotel { background: var(--brand); }
.wg-kind-dot.kind-faq { background: var(--gold); }
.wg-kind-dot.kind-compare { background: #1F8A70; }
.wiki-index-sec { margin-bottom: 1.1rem; }
.wiki-index-sec h4 { font-size: .9rem; margin: 0 0 .45rem; display: flex; align-items: center; }
.wiki-index-sec .wiki-group-name { margin: .5rem 0 .25rem; }
.wiki-index-list { list-style: none; padding: 0; margin: 0; display: grid; gap: .1rem; }
.wiki-index-list li { list-style: none; margin: 0; }
.wiki-index-list a { display: block; padding: .3rem .55rem; border-radius: 6px; font-size: .88rem; color: var(--ink); text-decoration: none; }
.wiki-index-list a:hover { background: var(--brand-soft); color: var(--brand); }
.wiki-index-list small { display: block; font-size: .72rem; color: var(--gray); }
.wiki-back { width: auto; margin: 0 0 .8rem; padding: .25rem .8rem; font-size: .82rem; border-radius: 999px; background: #fff; color: var(--brand); border: 1px solid var(--line); }
.wiki-panel .wiki-head h3 { font-size: 1.35rem; }
.wiki-panel .wiki-body { padding: 0; border: 0; box-shadow: none; }
.wiki-single .wiki-body { padding: 1.2rem 1.4rem; border: 1px solid var(--line); border-radius: var(--radius); box-shadow: var(--shadow); }
.wiki-backlinks { margin-top: 1.4rem; padding-top: .8rem; border-top: 1px solid var(--line); }
.wiki-backlinks h4 { font-size: .88rem; color: var(--gray); margin: 0 0 .4rem; }
.wiki-backlinks ul { margin: 0; padding-left: 1.1rem; font-size: .88rem; }
@media (max-width: 900px) {
  .wiki-split { grid-template-columns: minmax(0, 1fr); height: auto; }
  .wiki-split .wiki-graph { border-right: 0; border-bottom: 1px solid var(--line); }
  .wiki-split .wiki-graph svg { height: 440px; flex: none; }
  .wiki-panel { overflow: visible; padding: 1rem; }
  .wiki-side { display: contents; }  /* 手機上下排列時搜尋仍在關聯圖上方，不用先捲過整張圖 */
  .wiki-side .wiki-search { order: -1; padding: .7rem .9rem; }
}

/* 後台上傳合約：上傳前比對結果 */
.upload-check { margin: .25rem 0 .75rem; font-size: .9rem; }
.upload-check:empty { display: none; }
.upload-check > div { border-left: 3px solid var(--line); padding: .3rem .6rem; margin: .35rem 0; border-radius: .25rem; }
.upload-check ul { margin: .2rem 0 0; padding-left: 1.1rem; }
.upload-check li { margin: 0; list-style: disc; }
.upload-check .check-ok { border-color: var(--ok); background: var(--ok-bg); }
.upload-check .check-warn { border-color: var(--warn); background: var(--warn-bg); }
.upload-check .check-err { border-color: var(--err); background: var(--err-bg); }

/* ---------- 飯店頁上方 ---------- */
.hd-head { display: flex; align-items: center; gap: 1.1rem; flex-wrap: wrap; background: #fff; border: 1px solid var(--line); border-radius: var(--radius); box-shadow: var(--shadow); padding: 1rem 1.2rem; margin-bottom: 1rem; }
.hd-thumb { width: 120px; height: 82px; object-fit: cover; border-radius: .55rem; flex: none; }
.hd-title { flex: 1; min-width: 14rem; }
.hd-title h3 { margin: .3rem 0 .1rem; }
.hd-title p { margin: 0; }
.hd-badges { display: flex; gap: .4rem; flex-wrap: wrap; }
.hd-head-actions { display: flex; gap: .5rem; flex-wrap: wrap; align-items: center; }
.hd-head-actions [role="button"], .hd-head-actions button { margin: 0; width: auto; }
.hd-stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: .8rem; margin-bottom: 1rem; }
.hd-stat { display: flex; flex-direction: column; background: #fff; border: 1px solid var(--line); border-top: 3px solid var(--brand-sky); border-radius: var(--radius); padding: .75rem 1rem; box-shadow: var(--shadow); color: var(--ink); text-decoration: none; transition: border-color .15s, transform .15s; }
.hd-stat:hover { border-color: var(--brand-sky); transform: translateY(-1px); }
.hd-stat.gold { border-top-color: var(--gold); }
.hd-stat.warnish { border-top-color: #E0A100; background: #FFFCF2; }
.hd-stat .label { font-size: .8rem; color: var(--gray); letter-spacing: .04em; }
.hd-stat .value { font-size: 1.6rem; font-weight: 700; line-height: 1.25; font-variant-numeric: tabular-nums; }
.hd-stat .sub { font-size: .78rem; color: var(--gray); }
.hd-panel { background: #fff; border: 1px solid var(--line); border-radius: var(--radius); padding: .9rem 1.2rem; margin-bottom: 1rem; }
.hd-panel h4 { font-size: .95rem; margin: 0 0 .7rem; color: var(--gray); letter-spacing: .04em; }
.hd-panel .tag-form { margin-bottom: .4rem; }
.hd-panel > p:last-child { margin: 0; }
.hd-tools { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: .7rem; }
.hd-tool { display: flex; flex-direction: column; gap: .15rem; padding: .7rem .9rem; border: 1px solid var(--line); border-radius: .6rem; background: var(--soft); color: var(--ink); text-decoration: none; transition: background .15s, border-color .15s; }
.hd-tool:hover { background: var(--brand-soft); border-color: var(--brand-sky); }
.hd-tool strong { color: var(--brand); }
.hd-tool span { font-size: .8rem; color: var(--gray); }
.hd-chips { display: flex; flex-wrap: wrap; gap: .4rem; }
.hd-chip { display: inline-flex; align-items: center; gap: .3rem; margin: 0; padding: .2rem .7rem; border: 1px solid var(--line); border-radius: 999px; font-size: .88rem; cursor: pointer; background: #fff; }
.hd-chip:has(input:checked) { background: var(--brand-soft); border-color: var(--brand-sky); color: var(--brand); }
.hd-chip input { margin: 0; }
.hd-jump { display: flex; gap: .4rem; flex-wrap: wrap; border-bottom: 1px solid var(--line); padding-bottom: .5rem; margin: 1.4rem 0 0; }
.hd-jump a { padding: .25rem .8rem; border-radius: 999px; font-size: .88rem; text-decoration: none; background: var(--soft); }
.hd-jump a:hover { background: var(--brand-soft); }
@media (max-width: 640px) { .hd-thumb { width: 88px; height: 60px; } .hd-head { padding: .8rem; } .hd-head-actions { width: 100%; } .hd-stats { grid-template-columns: 1fr 1fr; gap: .6rem; } .hd-stat .value { font-size: 1.3rem; } }

/* ---------- 修改價格資料（表單編輯） ---------- */
.vf-bar { display: flex; gap: .8rem; align-items: center; flex-wrap: wrap; margin: .4rem 0 .6rem; }
.vf-bar[hidden], .vf-bar [hidden] { display: none !important; }
.vf-tabs { display: inline-flex; border: 1px solid var(--line); border-radius: 999px; padding: 3px; background: var(--soft); }
.vf-tabs button { margin: 0; width: auto; padding: .3rem 1.1rem; border: 0; border-radius: 999px; background: transparent; color: var(--gray); font-size: .9rem; }
.vf-tabs button[aria-selected="true"] { background: #fff; color: var(--brand); font-weight: 600; box-shadow: var(--shadow); }
#vf-filter { flex: 1; min-width: 14rem; margin: 0; }
.vf-status { min-height: 1.2em; margin: 0 0 .5rem; font-size: .85rem; color: var(--warn); }
.vf-json { font-family: ui-monospace, monospace; font-size: .8rem; }
.vf-json[hidden], #vf[hidden] { display: none; }
.vf-sec { background: #fff; border: 1px solid var(--line); border-radius: var(--radius); padding: .2rem 1rem; margin-bottom: .7rem; }
.vf-sec > summary { font-weight: 700; padding: .6rem 0; color: var(--ink); }
.vf-sec[open] > summary { border-bottom: 1px solid var(--line); margin-bottom: .7rem; }
.vf-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: .1rem .8rem; align-items: end; }
.vf-field { display: flex; flex-direction: column; margin: 0 0 .55rem; font-size: .88rem; }
.vf-field input, .vf-field select, .vf-field textarea { margin: 0; padding: .35rem .55rem; font-size: .88rem; height: auto; }
.vf-field textarea { resize: vertical; }
.vf-label { font-size: .76rem; color: var(--gray); margin-bottom: .15rem; }
.vf-wide { grid-column: 1 / -1; }
.vf-check { display: inline-flex; align-items: center; gap: .3rem; margin: 0 0 .55rem; font-size: .88rem; }
.vf-check input { margin: 0; }
.vf-checks { display: flex; flex-wrap: wrap; gap: .1rem 1rem; }
.vf-checks .vf-check { margin: 0 0 .2rem; }
.vf-all { font-weight: 600; }
.vf-changed { border-color: var(--gold) !important; background: var(--sand) !important; }
.vf-item { border: 1px solid var(--line); border-radius: .55rem; margin-bottom: .45rem; background: var(--bg); }
.vf-item > summary, .vf-sub summary { display: flex; align-items: center; gap: .6rem; padding: .45rem .7rem; cursor: pointer; font-size: .9rem; }
.vf-item[open] > summary { border-bottom: 1px dashed var(--line); }
.vf-item > .vf-obj { padding: .7rem .8rem .2rem; }
.vf-sum { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.vf-tools { display: inline-flex; gap: .3rem; flex: none; }
.vf-mini { margin: 0; width: auto; padding: .1rem .55rem; font-size: .75rem; border-radius: .4rem; background: #fff; color: var(--brand); border: 1px solid var(--line); }
.vf-mini:hover { border-color: var(--brand-sky); }
.vf-del { color: var(--err); }
.vf-row { display: flex; gap: .6rem; align-items: end; flex-wrap: wrap; }
.vf-row .vf-field { min-width: 9rem; flex: 1; }
.vf-row .vf-grow { flex: 1 1 100%; }
.vf-row .vf-grow:has(input[type="date"]) { flex: 0 1 12rem; }
.vf-row .vf-tools { margin-bottom: .6rem; }
.vf-add { width: auto; margin: .2rem 0 .7rem; padding: .25rem .8rem; font-size: .82rem; }
.vf-sub > details { border-left: 3px solid var(--brand-soft); padding-left: .6rem; }
.vf-sub > details > summary { padding-left: 0; color: var(--gray); }
.vf-sub > details > .vf-obj { padding-top: .4rem; }
.vf-rest > summary { font-size: .8rem; color: var(--gray); margin: .1rem 0 .5rem; cursor: pointer; }
.vf-top { padding-bottom: .3rem; }
