/**
 * 行情頁（stock-tw / stock-unified / us-market-lens）覆寫為紀律之眼暖色調
 * 請與 hub-theme.css 一併引入
 */
body {
  background: var(--bg) !important;
  color: var(--ink) !important;
  font-family: -apple-system, BlinkMacSystemFont, "PingFang TC", "Microsoft JhengHei", "Noto Sans TC", sans-serif !important;
  font-variant-numeric: tabular-nums;
}

.app-header,
.hdr {
  background: var(--paper) !important;
  border-bottom: 2px solid var(--ink) !important;
}

.app-header h1,
.hdr h1,
.app-header .sub,
.hdr .sub {
  color: var(--ink) !important;
}

.app-header .sub,
.hdr .sub {
  color: var(--ink-soft) !important;
}

.refresh-btn,
.btn {
  background: #f5f2ec !important;
  color: var(--accent) !important;
  border: 1px solid var(--line) !important;
  font-weight: 600 !important;
}

.refresh-btn:hover,
.btn:hover {
  background: #ebe6dc !important;
}

.market-tabs,
.tabs {
  background: var(--paper) !important;
  border: 1px solid var(--line) !important;
  border-radius: 10px !important;
  padding: 4px !important;
  box-shadow: var(--shadow) !important;
  overflow-x: auto !important;
  flex-wrap: nowrap !important;
  -webkit-overflow-scrolling: touch;
}

.market-tabs button,
.tabs button {
  color: var(--ink-soft) !important;
  font-weight: 600 !important;
  border-radius: 6px !important;
  flex: 0 0 auto !important;
  white-space: nowrap !important;
}

.market-tabs button.active,
.tabs button.active {
  background: var(--ink) !important;
  color: var(--paper) !important;
  box-shadow: none !important;
}

.top-nav,
.nav-strip {
  background: var(--paper) !important;
  border: 1px solid var(--line) !important;
  color: var(--ink-soft) !important;
  box-shadow: var(--shadow) !important;
}

.top-nav a,
.nav-strip a {
  color: var(--accent) !important;
}

.stock-card,
.mo-section {
  border-color: var(--line) !important;
  box-shadow: var(--shadow) !important;
}

.fin-dash-link {
  background: var(--green-bg) !important;
  color: var(--green) !important;
  border-color: #86efac !important;
}

.fin-dash-link:hover {
  background: #bbf7d0 !important;
}

.price,
.change {
  font-variant-numeric: tabular-nums;
}

/* 響應式版面：手機單欄 → 平板雙欄 → 筆電三欄 */
.page {
  max-width: 100%;
  margin: 0 auto;
  display: grid;
  gap: 12px;
  grid-template-columns: 1fr;
}

.top-nav,
.nav-strip {
  max-width: 100%;
}

@media (min-width: 640px) {
  .page {
    max-width: 720px;
    grid-template-columns: 1fr;
  }
}

@media (min-width: 768px) {
  .page {
    max-width: 960px;
    grid-template-columns: repeat(2, 1fr);
    padding: 16px;
  }

  .top-nav,
  .nav-strip {
    max-width: 960px;
  }
}

@media (min-width: 1024px) {
  .page {
    max-width: 1120px;
    grid-template-columns: repeat(3, 1fr);
  }

  .top-nav,
  .nav-strip {
    max-width: 1120px;
  }
}

@media (max-width: 639px) {
  body.hub-has-bottom-nav .page {
    padding-bottom: calc(var(--hub-bottom-nav-h, 56px) + 8px);
  }
}