/* ============================================================
   主题覆盖层 —— 参考「欧陆漫游」风格
   浅灰底 + 炭黑卡片 + 荧光黄绿点缀 + 大圆角药丸标签
   必须排在 styles.css / ledger.css / extras.css 之后加载
   ============================================================ */

:root {
  --paper: #ececea;
  --surface: #f4f5f1;
  --ink: #1a1d14;
  --muted: #85897e;
  --line: #e2e3dd;
  --lake: #6f7f1d;
  --lake-soft: #edf5c9;
  --forest: #4e5c22;
  --terracotta: #7a8526;
  --warning: #a8442c;
  --radius-lg: 28px;
  --radius-md: 20px;
  --shadow: 0 18px 40px rgba(26, 29, 20, 0.07);

  --lime: #d8f14e;
  --gold: #d6bf5c;          /* 暗黄：行程 Day 药丸等浅色底上的点缀 */
  --dark-card: #1b1e15;
  --dark-card-soft: #2a2d23;
  --pill: #e4e5e0;
  --pill-ink: #4a4e45;
  --on-dark: #f2f3ee;
  --on-dark-muted: #9aa08d;
}

/* ---------- 全局底色：去掉旧网格线 ---------- */
html { background: var(--paper); }
body {
  background: var(--paper);
  background-size: auto;
}

/* ---------- 顶栏 ---------- */
.topbar {
  border-bottom-color: rgba(26, 29, 20, 0.07);
  background: rgba(236, 236, 234, 0.9);
}
.wordmark { color: var(--ink); }
.topbar nav a { border-radius: 999px; }
.topbar nav a:active { color: var(--ink); background: var(--lime-soft); }

/* ---------- Hero：炭黑大卡片 ---------- */
.hero {
  margin-top: 10px;
  padding: 30px 24px 26px;
  min-height: 208px;
  border-radius: var(--radius-lg);
  background: var(--dark-card);
  color: var(--on-dark);
  box-shadow: var(--shadow);
  position: relative;
  overflow: hidden;
}
.hero::after {
  content: "";
  position: absolute;
  right: -46px;
  top: -34px;
  width: 210px;
  height: 118px;
  background:
    radial-gradient(circle at 30% 60%, transparent 26px, var(--lime) 27px, var(--lime) 33px, transparent 34px) no-repeat,
    radial-gradient(circle at 74% 26%, transparent 22px, var(--lime) 23px, var(--lime) 29px, transparent 30px) no-repeat;
  opacity: 0.9;
  pointer-events: none;
}
.hero__eyebrow { color: var(--lime); letter-spacing: 0.14em; }
.hero h1 { color: #fff; letter-spacing: -0.045em; position: relative; z-index: 1; }
.hero__date { color: var(--on-dark-muted); position: relative; z-index: 1; }

/* ---------- 航班卡：与 Hero 同一套炭黑 ---------- */
.flight-card { background: var(--dark-card); color: var(--on-dark); }
.flight-card__top { color: var(--lime); }
.flight-card__airlines { color: var(--on-dark-muted); }
.flight-stop__code { color: #fff; }
.flight-stop__city { color: var(--on-dark-muted); }
.flight-stop__dot { border-color: var(--lime); background: var(--dark-card); }
.flight-stop__timing { color: var(--on-dark-muted); }
.flight-stop__timing b { color: var(--on-dark); }
.flight-stop__timing em { color: var(--lime); }
.flight-segment { color: var(--on-dark-muted); }
.flight-segment i { background: rgba(216, 241, 78, 0.45); color: var(--lime); }
.flight-countdown span { color: var(--on-dark-muted); }
.flight-countdown strong { color: var(--lime); }
.flight-card__countdown-row { border-top-color: rgba(255, 255, 255, 0.14); }
.flight-placeholder__eyebrow { color: var(--lime); }
.flight-placeholder p { color: var(--on-dark-muted); }
.flight-placeholder li { border-color: rgba(216, 241, 78, 0.32); color: var(--on-dark); }
.carousel-dot { background: #c9cbbf; }
.carousel-dot.is-active { background: var(--lime); }

/* ---------- 板块标题 ---------- */
.section-kicker { color: var(--muted); letter-spacing: 0.14em; }
.section-heading h2 { letter-spacing: -0.045em; }

/* ---------- 每日行程 ---------- */
.timeline::before { background: var(--line); }
.day-dot { background: var(--day-color, var(--gold)); box-shadow: 0 0 0 1px var(--day-color, var(--gold)); }
.day-card.is-today .day-dot { background: var(--ink); box-shadow: 0 0 0 3px var(--lake-soft); }

.day-meta {
  display: inline-flex;
  align-items: center;
  background: var(--day-color, var(--gold));
  color: var(--day-color-ink, #1a1d14);
  border-radius: 999px;
  padding: 4px 10px;
  font-weight: 800;
  letter-spacing: 0.04em;
}
.day-title { font-weight: 780; letter-spacing: -0.01em; }

.schedule-item::before { background: var(--line); }
.schedule-item::after { border-color: var(--day-color, var(--gold)); background: var(--paper); }
.schedule-time {
  width: 68px;
  padding: 3px 4px;
  border-radius: 8px;
  background: var(--pill);
  color: var(--pill-ink);
  text-align: center;
  font-weight: 750;
}

/* 药丸标签：地图 / 攻略 / 附加链接 */
.schedule-map-link,
.guide-chip,
.extras-link {
  border-color: var(--line);
  background: var(--surface);
  color: var(--ink);
  font-weight: 650;
}
.schedule-map-link:hover,
.guide-chip:hover,
.extras-link:hover { background: #fff; border-color: #d3d5cc; }
.extras-link--book { border-color: var(--ink); background: var(--ink); color: #fff; }
.extras-link--book:hover { background: #2a2d23; }

/* 门票 / 待购条 */
.schedule-ticket,
.schedule-ticket__body p,
.schedule-ticket__content small { color: var(--pill-ink); }
.schedule-ticket { border-color: var(--line); background: #fbfcf8; }
.schedule-ticket summary,
.schedule-ticket__status,
.schedule-ticket__open { color: var(--terracotta); }
.schedule-ticket__check { border-color: #b9bcae; }
.schedule-ticket.is-purchased { border-color: var(--line); background: var(--lake-soft); }

.detail-note {
  border-left-color: var(--lime);
  background: #f6f8e6;
  color: var(--pill-ink);
}
.cost-tag { background: var(--pill); color: var(--pill-ink); border-radius: 999px; }

/* ---------- 门票卡片 ---------- */
.ticket-card { background: var(--surface); border-color: var(--line); }
.ticket-card.is-purchased { background: var(--lake-soft); }
.ticket-card__date { color: var(--terracotta); }
.ticket-badge { color: var(--terracotta); background: #f0f1e3; }
.ticket-badge.is-advance-recommended { color: var(--terracotta); background: var(--lake-soft); }
.ticket-badge.is-purchased { color: var(--forest); background: #e4ecc9; }
.ticket-details > summary { color: var(--terracotta); }
.ticket-actions a { color: var(--terracotta); }
.ticket-actions button,
.todo-form button {
  background: var(--lime);
  color: #1a1d14;
  font-weight: 780;
}
.ticket-uncertainties { background: var(--pill); color: var(--pill-ink); }
.ticket-dialog__links a { border-color: var(--line); background: var(--surface); color: var(--ink); }
.ticket-dialog > header span { color: var(--terracotta); }
.ticket-dialog > header button { color: var(--ink); }
.ticket-dialog__status { color: var(--terracotta); }

/* ---------- 待办 ---------- */
.todo-form input { background: var(--surface); border-color: var(--line); }
.todo-form input:focus { border-color: var(--lake); box-shadow: 0 0 0 3px rgba(111, 127, 29, 0.12); }
.todo-check { border-color: #b9bcae; }
.todo-item.is-complete .todo-check { border-color: var(--forest); background: var(--forest); }
.packing-item input { border-color: #b9bcae; }
.packing-item input:checked { border-color: var(--lime); background: var(--lime); }
.packing-item input:checked::after { color: #1a1d14; }
.packing-progress { background: var(--pill); }
.packing-progress span { background: var(--lime); }

/* ---------- 租车面板（隐藏模块，保险起见同步换肤） ---------- */
.rental-countdown { background: var(--lime); color: #1a1d14; }
.rental-countdown span,
.rental-countdown small { color: rgba(26, 29, 20, 0.72); }
.rental-sub, .rental-stop__label, .rental-stop span, .rental-price { color: var(--on-dark-muted); }
.return-deadline { background: #f0f1e3; color: var(--pill-ink); border-bottom-color: var(--lime); }

/* ---------- 地图 ---------- */
.travel-map-scroll { background: var(--surface); border-color: var(--line); border-radius: 16px; }
#map-dialog { background: var(--paper); }
.map-dialog { background: var(--dark-card); }
.map-dialog::backdrop { background: rgba(20, 22, 16, 0.86); }
.place-map-sheet { background: var(--paper); }
.place-map-sheet button { color: var(--ink); }
.place-map-sheet iframe { background: var(--pill); }
.route-map-button { border-color: var(--line); background: var(--surface); }
.route-map-button span { background: rgba(26, 29, 20, 0.88); }
.route-day-tabs button[aria-pressed="true"] { background: var(--surface); box-shadow: inset 0 0 0 1px var(--line); }

/* ---------- 附加板块（住宿 / 攻略 / 汇率） ---------- */
.stay-card,
.fx-card {
  background: var(--surface);
  border-color: var(--line);
  border-radius: var(--radius-md);
}
.stay-card__badge { background: var(--gold); color: #1a1d14; }
.stay-card__address span { border-color: var(--line); background: var(--pill); color: var(--pill-ink); }
.fx-rate__main strong { color: var(--ink); }
.fx-rate__main span { color: var(--muted); }
.fx-converter output { color: var(--ink); }
.fx-converter input,
.fx-converter select { background: var(--surface); border-color: var(--line); }
.fx-status.is-live { background: var(--lime); color: #1a1d14; }
.fx-status.is-cached { background: var(--pill); color: var(--pill-ink); }
.fx-refresh { background: var(--surface); border-color: var(--line); }
.fx-refresh:hover { background: var(--lime-soft); }
.guide-group__title,
.day-guides__title { color: var(--muted); }

/* ---------- 记账视图 ---------- */
.ledger-avatar { --ledger-avatar-color: var(--dark-card); }

/* ---------- 航班卡：按航段拆分 ---------- */
.flight-card { flex: 0 0 calc(100% - 20px); min-height: 0; }
.flight-card__top span { color: var(--lime); }

.segment-head {
  margin-top: 12px;
  display: flex;
  align-items: baseline;
  gap: 10px;
  flex-wrap: wrap;
}

.segment-flight-no {
  padding: 4px 10px;
  border-radius: 999px;
  background: var(--lime);
  color: #1a1d14;
  font: 800 12px/1.2 ui-monospace, SFMono-Regular, Menlo, monospace;
  letter-spacing: 0.04em;
}

.segment-airline { color: var(--on-dark-muted); font-size: 12px; font-weight: 650; }

.segment-route {
  margin-top: 16px;
  display: grid;
  grid-template-columns: 1fr minmax(96px, 0.9fr) 1fr;
  align-items: center;
  gap: 10px;
}

.segment-endpoint { min-width: 0; }
.segment-endpoint--arrival { text-align: right; }

.segment-city {
  display: block;
  color: #fff;
  font-size: clamp(20px, 5.2vw, 27px);
  font-weight: 800;
  line-height: 1.1;
  letter-spacing: -0.02em;
}

.segment-code {
  display: block;
  margin-top: 4px;
  color: var(--on-dark-muted);
  font: 700 11px/1.3 ui-monospace, SFMono-Regular, Menlo, monospace;
  letter-spacing: 0.1em;
}

.segment-divider {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 5px;
  color: var(--lime);
  font: 700 10px/1 ui-monospace, SFMono-Regular, Menlo, monospace;
  white-space: nowrap;
}

.segment-divider i {
  width: 100%;
  height: 1px;
  background: linear-gradient(90deg, rgba(216, 241, 78, 0.25), rgba(216, 241, 78, 0.75), rgba(216, 241, 78, 0.25));
}

.segment-divider em { font-style: normal; font-size: 12px; }

.segment-times {
  margin: auto 0 0;
  padding-top: 13px;
  border-top: 1px solid rgba(255, 255, 255, 0.14);
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.segment-times div { min-width: 0; }
.segment-times dt {
  color: var(--on-dark-muted);
  font: 700 10px/1.4 ui-monospace, SFMono-Regular, Menlo, monospace;
  letter-spacing: 0.1em;
}

.segment-times dd { margin: 5px 0 0; display: grid; gap: 2px; }
.segment-times dd b { color: var(--on-dark); font-size: 12px; font-weight: 720; letter-spacing: -0.01em; }
.segment-times dd span { color: var(--lime); font: 760 13.5px/1.25 ui-monospace, SFMono-Regular, Menlo, monospace; letter-spacing: -0.01em; }

.segment-layover {
  margin: 12px 0 0;
  padding: 8px 11px;
  border-radius: 12px;
  background: rgba(216, 241, 78, 0.1);
  color: var(--on-dark);
  font-size: 11px;
  line-height: 1.5;
}

@media (min-width: 700px) {
  .flight-card { flex-basis: 62%; }
}

/* ---------- 底部导航栏 ---------- */
.bottom-nav {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 40;
  display: flex;
  justify-content: space-around;
  padding: 6px 8px calc(6px + var(--safe-bottom));
  border-top: 1px solid var(--line);
  background: rgba(236, 236, 234, 0.92);
  -webkit-backdrop-filter: blur(16px);
  backdrop-filter: blur(16px);
}

.bottom-nav a {
  min-width: 48px;
  min-height: 48px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 3px;
  border-radius: 14px;
  color: var(--muted);
  text-decoration: none;
  transition: color 0.16s ease, background 0.16s ease;
}

.bottom-nav svg { width: 21px; height: 21px; }
.bottom-nav span { font-size: 10px; font-weight: 720; letter-spacing: 0.04em; }
.bottom-nav a[aria-current="page"] { color: var(--ink); background: var(--lime-soft); }

body { padding-bottom: calc(66px + var(--safe-bottom)); }

/* ---------- 其它 ---------- */
.accordion { background: var(--surface); }
.accordion summary::after { color: var(--ink); border-color: var(--line); }
.accordion ul { color: var(--pill-ink); }
.drive-note-panel ul { color: var(--pill-ink); }
.drive-note-tabs button[aria-expanded="true"]::after { background: var(--lime); }
.map-dialog, .ticket-dialog, .ledger-confirm-dialog { background: var(--paper); }
.skip-link { background: var(--ink); }
:focus-visible { outline-color: rgba(111, 127, 29, 0.5); }
button:focus-visible, a:focus-visible { outline-color: var(--ink); }
