/* ============================================================
   SafeAcademy 통합 고대비 테마 CSS — theme.css
   다크/라이트 모드 모든 화면에서 텍스트 가독성 보장
   ============================================================ */

/* ── CSS 변수 기본값 (다크모드) ── */
:root {
  --sa-text:        #f1f5f9;
  --sa-text-sub:    #cbd5e1;
  --sa-text-muted:  #94a3b8;
  --sa-bg-panel:    rgba(15, 23, 42, 0.92);
  --sa-bg-item:     rgba(30, 41, 59, 0.9);
  --sa-border:      #38bdf8;
  --sa-accent:      #38bdf8;
  --sa-accent2:     #00ff9d;
  --sa-danger:      #ef4444;
  --sa-warn:        #f59e0b;
}

/* ── 라이트 모드 변수 재정의 ── */
.light, body.light {
  --sa-text:        #0f172a;
  --sa-text-sub:    #1e293b;
  --sa-text-muted:  #475569;
  --sa-bg-panel:    rgba(255, 255, 255, 0.97);
  --sa-bg-item:     #f1f5f9;
  --sa-border:      #2563eb;
  --sa-accent:      #2563eb;
  --sa-accent2:     #059669;
  --sa-danger:      #dc2626;
  --sa-warn:        #d97706;
}

/* ══════════════════════════════════════════
   DARK MODE — 패널·텍스트 가독성 강제
   ══════════════════════════════════════════ */

/* 패널 공통 */
body:not(.light) .ui-panel,
body:not(.light) .ctrl-panel,
body:not(.light) .chart-panel,
body:not(.light) .status-panel,
body:not(.light) .log-panel,
body:not(.light) #configPanel,
body:not(.light) #boardingPanel,
body:not(.light) [class*="-panel"] {
  color: var(--sa-text) !important;
}

/* 패널 안 모든 텍스트 */
body:not(.light) .ui-panel *,
body:not(.light) .ctrl-panel *,
body:not(.light) .chart-panel *,
body:not(.light) .status-panel *,
body:not(.light) #configPanel *,
body:not(.light) #boardingPanel * {
  color: var(--sa-text);
}

/* 레이블·소제목 */
body:not(.light) label,
body:not(.light) .sum-lbl,
body:not(.light) .hud-lbl,
body:not(.light) small,
body:not(.light) .sub-text {
  color: var(--sa-text-sub) !important;
}

/* 버튼 */
body:not(.light) .btn {
  color: var(--sa-text) !important;
  background: rgba(30, 41, 59, 0.9) !important;
  border-color: #475569 !important;
}
body:not(.light) .btn:hover {
  background: rgba(56, 189, 248, 0.15) !important;
  border-color: #38bdf8 !important;
  color: #38bdf8 !important;
}

/* select, input */
body:not(.light) select,
body:not(.light) input[type="text"],
body:not(.light) input[type="number"],
body:not(.light) input[type="range"] {
  color: var(--sa-text) !important;
  background: #1e293b !important;
  border-color: #475569 !important;
}

/* 상태 텍스트 */
body:not(.light) #statusText { color: #00ff9d !important; }
body:not(.light) .sum-val    { color: var(--sa-text) !important; }
body:not(.light) .sum-val.highlight { color: #38bdf8 !important; }

/* 패널 헤더 */
body:not(.light) .panel-header,
body:not(.light) .panel-header *,
body:not(.light) .log-header,
body:not(.light) .log-header * {
  color: var(--sa-text) !important;
}

/* 탑승 리스트 */
body:not(.light) #liveStatusList div {
  background: rgba(30,41,59,0.8) !important;
  color: var(--sa-text) !important;
  border-color: #334155 !important;
}
body:not(.light) #liveStatusList b  { color: #38bdf8 !important; }
body:not(.light) #liveStatusList span { color: var(--sa-text-sub) !important; }

/* ══════════════════════════════════════════
   LIGHT MODE — 패널·텍스트 가독성 강제
   ══════════════════════════════════════════ */

body.light {
  color: #0f172a !important;
}

/* 패널 공통 */
body.light .ui-panel,
body.light .ctrl-panel,
body.light .chart-panel,
body.light .status-panel,
body.light .log-panel,
body.light #configPanel,
body.light #boardingPanel,
body.light [class*="-panel"] {
  background: var(--sa-bg-panel) !important;
  color: var(--sa-text) !important;
  border-color: var(--sa-border) !important;
}

/* 패널 안 모든 텍스트 */
body.light .ui-panel *,
body.light .ctrl-panel *,
body.light .chart-panel *,
body.light .status-panel *,
body.light #configPanel *,
body.light #boardingPanel * {
  color: var(--sa-text) !important;
}

/* 레이블 */
body.light label,
body.light .sum-lbl,
body.light .hud-lbl,
body.light small,
body.light .sub-text {
  color: var(--sa-text-muted) !important;
}

/* 버튼 */
body.light .btn {
  color: #0f172a !important;
  background: #e2e8f0 !important;
  border-color: #94a3b8 !important;
  font-weight: 700 !important;
}
body.light .btn:hover {
  background: #dbeafe !important;
  border-color: #2563eb !important;
  color: #1d4ed8 !important;
}
body.light .btn.active {
  background: #2563eb !important;
  color: #fff !important;
  border-color: #2563eb !important;
}

/* select, input */
body.light select,
body.light input[type="text"],
body.light input[type="number"],
body.light input[type="range"] {
  color: #0f172a !important;
  background: #f8fafc !important;
  border: 1px solid #94a3b8 !important;
}

/* 상태 텍스트 */
body.light #statusText   { color: #059669 !important; }
body.light .sum-val      { color: #0f172a !important; }
body.light .sum-val.highlight { color: #2563eb !important; }
body.light .sum-lbl      { color: #475569 !important; }

/* 패널 헤더 */
body.light .panel-header,
body.light .panel-header div,
body.light .panel-header h2,
body.light .panel-header span {
  color: #0f172a !important;
  border-bottom-color: #cbd5e1 !important;
}
body.light .toggle-icon  { color: #475569 !important; }

/* 로그 패널 */
body.light .log-panel    { color: #1d4ed8 !important; background: rgba(241,245,249,0.95) !important; }
body.light .log-header   { background: rgba(226,232,240,0.9) !important; color: #0f172a !important; }
body.light .log-header * { color: #0f172a !important; }

/* 탑승 리스트 */
body.light #liveStatusList div {
  background: #f8fafc !important;
  color: #0f172a !important;
  border: 1px solid #e2e8f0 !important;
  border-left: 3px solid #3b82f6 !important;
}
body.light #liveStatusList b    { color: #0f172a !important; }
body.light #liveStatusList span { color: #1e293b !important; font-weight: 700; }

/* top-summary 바 */
body.light .top-summary  { background: rgba(255,255,255,0.97) !important; }
body.light .top-summary * { color: #0f172a !important; }

/* 차트 바 */
body.light .bar          { background: #3b82f6 !important; }
body.light .bar.danger   { background: #dc2626 !important; }

/* 버스 레이블 */
body.light .bus-label {
  background: rgba(255,255,255,0.97) !important;
  color: #0f172a !important;
  border-color: #2563eb !important;
  text-shadow: none !important;
}
body.light .bus-label * { color: #0f172a !important; text-shadow: none !important; }
body.light .bus-label b  { color: #2563eb !important; }

/* HUD 체크박스 레이블 */
body.light #labelOptions label { color: #0f172a !important; }

/* 설정 패널 슬라이더 값 */
body.light #busCountVal,
body.light #speedVal { color: #1d4ed8 !important; font-weight: 900 !important; }

/* 로그인 오버레이 */
body.light .login-overlay,
body.light .login-box     { background: #f8fafc !important; color: #0f172a !important; }
body.light .login-input   { background: #fff !important; color: #0f172a !important; border-color: #94a3b8 !important; }
body.light .login-label   { color: #1e293b !important; }

/* ── 공통: inline style로 박힌 흰색 글자 방어 (라이트) ── */
body.light [style*="color:#e2e8f0"],
body.light [style*="color: #e2e8f0"],
body.light [style*="color:#94a3b8"],
body.light [style*="color: #94a3b8"],
body.light [style*="color:#cbd5e1"],
body.light [style*="color: #cbd5e1"],
body.light [style*="color:white"],
body.light [style*="color: white"],
body.light [style*="color:#fff"],
body.light [style*="color: #fff"],
body.light [style*="color:#f3f4f6"],
body.light [style*="color: #f3f4f6"] {
  color: #1e293b !important;
}
/* 단, 버튼 내 흰 글자는 유지 (active 버튼) */
body.light .btn.active [style*="color:white"],
body.light .btn.active [style*="color:#fff"] {
  color: #fff !important;
}

/* ── 공통: inline style로 박힌 어두운 글자 방어 (다크) ── */
body:not(.light) [style*="color:#1e293b"],
body:not(.light) [style*="color: #1e293b"],
body:not(.light) [style*="color:#0f172a"],
body:not(.light) [style*="color: #0f172a"],
body:not(.light) [style*="color:#475569"],
body:not(.light) [style*="color: #475569"] {
  color: var(--sa-text-sub) !important;
}

/* ── 지도 타일 필터 ── */
body:not(.light) .leaflet-tile-pane {
  filter: invert(100%) hue-rotate(180deg) brightness(88%) contrast(115%) !important;
}
body.light .leaflet-tile-pane {
  filter: none !important;
}