/* TotalMoney AI — TradingView-style light / dark themes */

html {
  scrollbar-gutter: stable;
}

body.page-home-v2,
body.page-tm-v2 {
  overflow-x: clip;
}

.tm-wrap,
.home-wrap {
  overflow-x: clip;
  max-width: 100%;
}

:root,
[data-theme="light"],
[data-theme="dark"] {
  --gradient-primary: linear-gradient(135deg, #07264b 0%, #0f8387 100%);
  --gradient-hero-dark: linear-gradient(135deg, #07264b 0%, #0f8387 100%);
  --accent-brand-deep: #07264b;
  --accent-brand: #0f8387;
  --home-ai-surface: #ffffff;
  --home-ai-surface-border: rgba(15, 131, 135, 0.22);
  --home-ai-text: #0f8387;
  --home-ai-text-muted: rgba(15, 131, 135, 0.78);
  --home-ai-input-bg: #ffffff;
  --home-ai-input-border: rgba(15, 131, 135, 0.35);
  --home-ai-shadow: 0 4px 16px rgba(15, 131, 135, 0.12);
  --accent-icon: #ffd84d;
  /* 스켈레톤 로딩 shimmer (라이트 기본) */
  --skeleton-1: #f0f0f0;
  --skeleton-2: #e0e0e0;
}

[data-theme="dark"] {
  /* Premium finance palette */
  --header-bg: #0a1324;
  /* 스켈레톤 로딩 shimmer (다크) */
  --skeleton-1: #1a1f35;
  --skeleton-2: #252b45;
  --body-bg: #0d172a;
  --card-bg: #111d35;
  --accent-gold: #d4af37;
  --accent-blue: #2a3656;
  --text-primary: #ffffff;
  --text-secondary: #aab4c5;
  --border-color: rgba(212, 175, 55, 0.15);

  /* Legacy token map */
  --bg-primary: var(--body-bg);
  --bg-secondary: var(--card-bg);
  --bg-tertiary: #132038;
  --bg-elevated: #132038;
  --panel-surface: var(--card-bg);
  --hero-surface-end: #0b1528;
  --surface-hover: #152238;
  --loading-bg: var(--body-bg);
  --page-body-top: var(--header-bg);
  --page-body-glow: rgba(42, 54, 86, 0.32);
  --page-body-glow-soft: rgba(212, 175, 55, 0.05);
  --text-title: var(--text-primary);
  --text-body: var(--text-secondary);
  --text-muted-ui: #8a95a8;
  --gradient-primary: linear-gradient(135deg, var(--header-bg) 0%, var(--accent-blue) 55%, #0f2a42 100%);
  --gradient-hero-dark: linear-gradient(180deg, var(--header-bg) 0%, var(--body-bg) 100%);
  --gradient-footer-dark: linear-gradient(180deg, var(--body-bg) 0%, #0a1528 52%, #081220 100%);
  --hero-dark-glow-teal: rgba(15, 131, 135, 0.26);
  --hero-dark-glow-gold: rgba(212, 175, 55, 0.14);
  --hero-elev-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.07), 0 12px 32px rgba(0, 0, 0, 0.46);
  --footer-elev-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05), 0 -14px 40px rgba(0, 0, 0, 0.52);
  --accent-brand-deep: var(--header-bg);
  --accent-brand: var(--accent-gold);
  --accent-icon: var(--accent-gold);
  --accent: var(--accent-gold);
  --accent-secondary: var(--accent-blue);
  --home-ai-surface: linear-gradient(145deg, var(--card-bg) 0%, #162544 100%);
  --home-ai-surface-border: var(--border-color);
  --home-ai-text: var(--text-primary);
  --home-ai-text-muted: var(--text-secondary);
  --home-ai-input-bg: rgba(10, 19, 36, 0.72);
  --home-ai-input-border: var(--border-color);
  --home-ai-shadow: 0 8px 28px rgba(0, 0, 0, 0.4);
  --interactive-hover-border: rgba(212, 175, 55, 0.42);
  --interactive-hover-glow: 0 0 0 1px rgba(212, 175, 55, 0.22), 0 4px 18px rgba(212, 175, 55, 0.1);
  --card-shadow: 0 2px 12px rgba(0, 0, 0, 0.28);
  --up-color: #e24b4a;
  --up: var(--up-color);
  --down-color: #3b82f6;
  --down: var(--down-color);
  --border: var(--border-color);
  --color-border: var(--border-color);
  --sheet-shadow: var(--card-shadow), 0 16px 40px rgba(0, 0, 0, 0.38);
  --body-glow: none;
}

[data-theme="light"] {
  --home-ai-surface: #ffffff;
  --home-ai-surface-border: rgba(15, 131, 135, 0.22);
  --home-ai-text: #0f8387;
  --home-ai-text-muted: rgba(15, 131, 135, 0.78);
  --home-ai-input-bg: #ffffff;
  --home-ai-input-border: rgba(15, 131, 135, 0.35);
  --home-ai-shadow: 0 4px 16px rgba(15, 131, 135, 0.12);
  --bg-primary: #ffffff;
  --bg-secondary: #f0f3fa;
  --bg-tertiary: #e8ecf5;
  --page-body-top: #f0f7f7;
  --page-body-glow: rgba(15, 131, 135, 0.10);
  --page-body-glow-soft: rgba(7, 38, 75, 0.06);
  --text-primary: #131722;
  --text-secondary: #5d606b;
  --accent: #0f8387;
  --accent-secondary: #0a6b6e;
  /* 국내 주식 관례: 상승 빨강 · 하락 초록 */
  --up-color: #e24b4a;
  --up: var(--up-color);
  --down-color: #3b82f6;
  --down: var(--down-color);
  --status-open: #22c55e;
  --border: rgba(0, 0, 0, 0.08);
  --color-border: rgba(0, 0, 0, 0.08);
  --sheet-shadow: 0 2px 10px rgba(0, 0, 0, 0.06), 0 12px 32px rgba(0, 0, 0, 0.08);
  --body-glow: none;
}

body {
  background-color: var(--bg-primary);
  background-image:
    radial-gradient(circle at 0% 0%, var(--page-body-glow) 0%, transparent 32%),
    radial-gradient(circle at 100% 0%, var(--page-body-glow-soft) 0%, transparent 28%),
    linear-gradient(180deg, var(--page-body-top) 0%, var(--bg-primary) 34%);
  background-repeat: no-repeat;
  background-attachment: fixed;
}

[data-theme="dark"] body,
[data-theme="dark"] body.page-tm-v2,
[data-theme="dark"] body.page-home-v2 {
  background-color: var(--body-bg);
  background-image:
    radial-gradient(ellipse 72% 42% at 50% 0%, var(--page-body-glow) 0%, transparent 58%),
    radial-gradient(ellipse 48% 32% at 100% 0%, var(--page-body-glow-soft) 0%, transparent 52%),
    linear-gradient(180deg, var(--header-bg) 0%, var(--body-bg) 32%);
}

/* 다크: 로딩·빈 상태 영역 — 흰(#fff) 플래시 방지 */
[data-theme="dark"] .day-prep,
[data-theme="dark"] .day-prep__inner,
[data-theme="dark"] .daily-detail:has(.day-body.is-empty),
[data-theme="dark"] .rt-loading,
[data-theme="dark"] .page-tm-v2 .tm-main,
[data-theme="dark"] .page-tm-v2 .tm-main > .page,
[data-theme="dark"] .page-tm-v2 .tm-main .page {
  background-color: transparent;
}

[data-theme="dark"] .page-tm-v2 .masthead.masthead--title-only .masthead__title,
[data-theme="dark"] .hub-hero__title {
  color: var(--text-title, #f3f4f6);
}

[data-theme="dark"] .page-tm-v2 .masthead.masthead--title-only .masthead__title {
  color: #ffffff;
}

[data-theme="dark"] .page-tm-v2 .tm-main,
[data-theme="dark"] .page-tm-v2 .tm-main .page,
[data-theme="dark"] .page-tm-v2 .masthead__meta,
[data-theme="dark"] .page-tm-v2 .page-hero-sub {
  color: var(--text-body, #d1d5db);
}

[data-theme="dark"] .page-tm-v2 .masthead__meta span,
[data-theme="dark"] .home-empty,
[data-theme="dark"] .empty-text {
  color: var(--text-muted-ui, #9ca3af);
}

@media (max-width: 768px) {
  [data-theme="dark"] {
    --page-body-glow: rgba(42, 54, 86, 0.24);
    --page-body-glow-soft: rgba(212, 175, 55, 0.04);
  }

  [data-theme="dark"] html,
  [data-theme="dark"] body {
    background-attachment: scroll;
  }

  [data-theme="light"] body {
    background-attachment: scroll;
  }
}

[data-theme="dark"],
[data-theme="light"] {
  --bg: var(--bg-primary);
  --bg-panel: var(--bg-secondary);
  --bg-elevated: var(--bg-tertiary);
  --text: var(--text-primary);
  --text-muted: var(--text-secondary);
  --text-dim: var(--text-secondary);
  --accent-bright: var(--accent);
  --accent-dim: color-mix(in srgb, var(--accent) 14%, transparent);
  --accent-highlight: color-mix(in srgb, var(--accent) 28%, transparent);
  --accent-ring: color-mix(in srgb, var(--accent) 45%, transparent);
  --border-strong: color-mix(in srgb, var(--border) 100%, var(--text-secondary) 25%);
  --star: var(--accent);
  --tag-bg: var(--bg-tertiary);
  --rail-bg: linear-gradient(180deg, var(--bg-tertiary) 0%, var(--bg-secondary) 100%);
  --font-sans: "Noto Sans KR", "Segoe UI", system-ui, -apple-system, sans-serif;
  --font-mono: "JetBrains Mono", "SF Mono", Consolas, "Liberation Mono", monospace;
  --font-display: "Cormorant Garamond", "Times New Roman", serif;
  --radius: 3px;
  --shadow: 0 1px 0 color-mix(in srgb, var(--text-primary) 4%, transparent) inset;
  --surface-bar: var(--bg-secondary);
  --surface-inset: var(--bg-tertiary);
  --sheet-accent-border: color-mix(in srgb, var(--accent) 30%, transparent);
  --sheet-accent-border-strong: color-mix(in srgb, var(--accent) 58%, transparent);
  --sheet-accent-soft: color-mix(in srgb, var(--accent) 12%, transparent);
  --sheet-accent-gradient: linear-gradient(
    180deg,
    color-mix(in srgb, var(--accent) 14%, transparent) 0%,
    var(--bg-secondary) 100%
  );
  --status-pre: var(--accent-secondary);
  --down-surface: color-mix(in srgb, var(--down-color) 10%, transparent);
  --down-border: color-mix(in srgb, var(--down-color) 38%, transparent);
  --down-text: color-mix(in srgb, var(--down-color) 72%, var(--text-primary));
  --up-surface: color-mix(in srgb, var(--up-color) 10%, transparent);
  --up-border: color-mix(in srgb, var(--up-color) 42%, transparent);
  --up-text: color-mix(in srgb, var(--up-color) 82%, var(--text-primary));
  --wait-border: color-mix(in srgb, var(--accent-secondary) 38%, transparent);
  --wait-text: color-mix(in srgb, var(--accent-secondary) 88%, var(--text-primary));
}

[data-theme="dark"] {
  --status-open: #5fd4a4;
  color-scheme: dark;
}

/* Premium dark — cards, borders, interactive gold hover */
[data-theme="dark"] .home-section,
[data-theme="dark"] .home-mini-card,
[data-theme="dark"] .home-brief-card,
[data-theme="dark"] .page-tm-v2 .tm-card,
[data-theme="dark"] .page-tm-v2 .tm-panel,
[data-theme="dark"] .hub-card:not(.hub-card--soon),
[data-theme="dark"] .market-card,
[data-theme="dark"] .market-gauge-card,
[data-theme="dark"] .home-ai-card {
  background: var(--card-bg);
  border: 1px solid var(--border-color);
  box-shadow: var(--card-shadow);
}

[data-theme="dark"] button:not(:disabled):hover,
[data-theme="dark"] .home-hero__btn:hover,
[data-theme="dark"] .home-ai-card__btn:hover,
[data-theme="dark"] .home-rt-tab:hover:not(.is-active),
[data-theme="dark"] .home-nav__home-btn:hover,
[data-theme="dark"] .home-nav__theme:hover,
[data-theme="dark"] .tm-tv-fullscreen-btn:hover {
  border-color: var(--interactive-hover-border);
  box-shadow: var(--interactive-hover-glow);
}

[data-theme="dark"] .home-rt-tab.is-active,
[data-theme="dark"] .home-ai-card__btn,
[data-theme="dark"] .home-nav__logo-box,
[data-theme="dark"] .home-nav__ai-badge {
  border-color: color-mix(in srgb, var(--accent-gold) 35%, transparent);
}

[data-theme="dark"] .home-nav__link[aria-current="page"]::after {
  background: var(--accent-gold);
}

/* 다크: 구 네이비 패널 톤 통일 */
[data-theme="dark"] .day-nav,
[data-theme="dark"] .day-nav__btn,
[data-theme="dark"] .day-nav__today,
[data-theme="dark"] .week-tab,
[data-theme="dark"] .week-tabs,
[data-theme="dark"] .home-rt-tab:not(.is-active),
[data-theme="dark"] .briefing-card,
[data-theme="dark"] .ai-access-gate__card {
  background: var(--card-bg);
  border-color: var(--border-color);
}

[data-theme="dark"] .day-nav__btn:hover,
[data-theme="dark"] .day-nav__today:hover,
[data-theme="dark"] .home-tr:hover,
[data-theme="dark"] .week-tab:hover:not([aria-selected="true"]) {
  background: var(--surface-hover);
}

[data-theme="dark"] .day-nav__date-label,
[data-theme="dark"] #calendar-toggle {
  background: var(--accent-blue);
  border-color: var(--border-color);
  color: var(--text-secondary);
}

[data-theme="dark"] .loading-bar-track {
  background: color-mix(in srgb, var(--accent-gold) 14%, var(--card-bg)) !important;
}

[data-theme="dark"] .loading-bar-inner {
  background: linear-gradient(90deg, transparent, var(--accent-gold), transparent) !important;
}

[data-theme="dark"] .home-th div,
[data-theme="dark"] .home-tr .scode,
[data-theme="dark"] .home-tr__code,
[data-theme="dark"] .home-brief-time,
[data-theme="dark"] .tm-bottom-nav__item {
  color: var(--text-muted-ui);
}

[data-theme="dark"] .home-tr .sname,
[data-theme="dark"] .home-tr .price,
[data-theme="dark"] .home-tr__name,
[data-theme="dark"] .home-tr__price,
[data-theme="dark"] .home-mini-card__title,
[data-theme="dark"] .home-section--realtime .home-tr__name,
[data-theme="dark"] .home-section--realtime .home-tr__price {
  color: var(--text-primary);
}

[data-theme="dark"] .home-brief-text,
[data-theme="dark"] .home-mini-card .mc-row,
[data-theme="dark"] .home-mini-row {
  color: var(--text-secondary);
}

[data-theme="light"] {
  color-scheme: light;
}

/* 등락률 공통 (상승/하락 색은 --up-color / --down-color) */
.delta--pos,
.briefing-change--up,
.crypto-delta--up,
.us-delta--up,
.live-delta--up,
.world-delta--up {
  color: var(--up-color);
}

.delta--neg,
.briefing-change--down,
.crypto-delta--down,
.us-delta--down,
.live-delta--down,
.world-delta--down {
  color: var(--down-color);
}

.delta--flat,
.crypto-delta--flat,
.us-delta--flat,
.live-delta--flat {
  color: var(--text-secondary);
}

.tm-tv-chart-shell {
  background: #ffffff;
  border-radius: 4px;
  overflow: hidden;
}
[data-theme="dark"] .tm-tv-chart-shell {
  background: var(--card-bg);
  border: 1px solid var(--border-color);
}
.tm-tv-chart-toolbar {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  gap: 8px;
  padding: 6px 10px;
  background: inherit;
  border-bottom: 1px solid var(--border);
}
.tm-tv-fullscreen-btn {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 4px 10px;
  border: 1px solid var(--border);
  border-radius: 4px;
  background: var(--surface-bar);
  color: var(--text-muted);
  font-family: "Noto Sans KR", -apple-system, sans-serif;
  font-size: 11px;
  font-weight: 600;
  cursor: pointer;
}
.tm-tv-fullscreen-btn:hover,
.tm-tv-fullscreen-btn:focus-visible {
  color: var(--accent-bright);
  border-color: var(--accent-highlight);
  outline: none;
}

[data-theme="dark"] .tm-tv-fullscreen-btn:hover,
[data-theme="dark"] .tm-tv-fullscreen-btn:focus-visible {
  color: var(--accent-gold);
}

.tm-tv-chart-shell:fullscreen {
  display: flex;
  flex-direction: column;
  width: 100%;
  height: 100%;
  background: var(--body-bg, #131722);
}
.tm-tv-chart-shell:fullscreen .crypto-tv-widget,
.tm-tv-chart-shell:fullscreen .us-tv-widget {
  flex: 1 1 auto;
  height: auto !important;
  min-height: 0;
}
[data-theme="light"] .tm-tv-chart-shell:fullscreen {
  background: #ffffff;
}

/* 모바일·iOS: Fullscreen API 미지원 시 CSS 전체화면 폴백 */
.tm-tv-chart-shell--expanded {
  position: fixed;
  inset: 0;
  z-index: 10050;
  display: flex;
  flex-direction: column;
  width: 100%;
  height: 100%;
  max-width: none;
  border-radius: 0;
  padding: env(safe-area-inset-top, 0) env(safe-area-inset-right, 0) env(safe-area-inset-bottom, 0)
    env(safe-area-inset-left, 0);
  background: var(--body-bg, #131722);
}
.tm-tv-chart-shell--expanded .crypto-tv-widget,
.tm-tv-chart-shell--expanded .us-tv-widget,
.tm-tv-chart-shell--expanded .realtime-tv-widget,
.tm-tv-chart-shell--expanded .ai-tv-widget {
  flex: 1 1 auto;
  width: 100%;
  height: auto !important;
  min-height: 0;
}
[data-theme="light"] .tm-tv-chart-shell--expanded {
  background: #ffffff;
}
html.tm-tv-chart-fs-lock,
html.tm-tv-chart-fs-lock body {
  overflow: hidden;
  overscroll-behavior: none;
}

/* 지표·티커 라이브 상태 표시 */
.tm-live-dot {
  display: inline-block;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  flex-shrink: 0;
  vertical-align: middle;
}
.tm-live-dot--live {
  background: #22c55e;
  box-shadow: 0 0 0 2px color-mix(in srgb, #22c55e 28%, transparent);
  animation: tm-live-pulse 2s ease-in-out infinite;
}
.tm-live-dot--closed {
  background: #ef4444;
  opacity: 0.88;
}
@keyframes tm-live-pulse {
  0%,
  100% {
    opacity: 1;
  }
  50% {
    opacity: 0.55;
  }
}
.tm-indicator-name,
.market-card__name-inner {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-width: 0;
}
.home-ticker__item {
  display: inline-flex;
  align-items: center;
  gap: 5px;
}
@media (max-width: 768px) {
  .tm-tv-fullscreen-btn {
    min-height: 36px;
    padding: 8px 14px;
    font-size: 12px;
  }
}