/* ============================================================
   SMARTC&S overrides — re-skin dbc / dash_table / dcc.Dropdown
   internals with tokens. Scoped under .app-shell so legacy pages
   are unaffected until the shell wraps them (Phase 2). Supersedes
   the old assets/style.css (removed in Phase 8).
   ============================================================ */

/* ---- dash DataTable ---- */
.app-shell .dash-table-container .dash-spreadsheet-container .dash-spreadsheet-inner table { font-family: var(--font-sans); }
.app-shell .dash-table-container .dash-header,
.app-shell .dash-table-container .dash-header div {
  background: var(--ink-100);
  color: var(--fg2);
  font-weight: var(--fw-semibold);
  font-size: var(--text-xs);
  letter-spacing: 0.04em;
  text-transform: uppercase;
  border-bottom: none !important;   /* 머리글 밑줄 없음(사용자 지시 2026-09-11) — 칸·글자 상자 둘 다 */
}
.app-shell .dash-table-container .dash-cell {
  border-bottom: 1px solid var(--line-1) !important;
  border-left: none !important;
  border-right: none !important;
  font-size: var(--text-sm);
  color: var(--fg1);
}
.app-shell .dash-table-container .dash-cell.ds-mono-cell,
.app-shell .dash-table-container td[data-dash-column$="]"] .ds-mono { font-family: var(--font-mono); font-variant-numeric: tabular-nums; }
.app-shell .dash-table-container .dash-row:hover .dash-cell { background: var(--ink-50) !important; }
.app-shell .dash-table-container .dash-row.row--selected .dash-cell { background: var(--blue-50) !important; }

/* ---- dcc.Dropdown ---- */
.app-shell .Select-control {
  border: 1px solid var(--line-2) !important;
  border-radius: var(--r-sm) !important;
  font-family: var(--font-sans);
  min-height: 38px;
}
.app-shell .is-focused:not(.is-open) > .Select-control {
  border-color: var(--blue-500) !important;
  box-shadow: 0 0 0 3px var(--focus-ring) !important;
}
.app-shell .Select-menu-outer {
  border: 1px solid var(--line-1) !important;
  border-radius: var(--r-sm) !important;
  box-shadow: var(--shadow-md);
  font-family: var(--font-sans);
}
.app-shell .VirtualizedSelectFocusedOption,
.app-shell .Select-option.is-focused { background: var(--blue-50) !important; }
.app-shell .Select-value-label, .app-shell .Select-placeholder { color: var(--fg1) !important; }

/* ---- dbc buttons inside shell default to ghost-neutral unless given .ds-btn ---- */
.app-shell .btn { border-radius: var(--r-sm); }

/* ---- dcc.Slider on brand ---- */
.app-shell .rc-slider-track { background: var(--blue-500); }
.app-shell .rc-slider-handle { border-color: var(--blue-500); }
.app-shell .rc-slider-handle:hover { border-color: var(--blue-600); }
.app-shell .rc-slider-dot-active { border-color: var(--blue-500); }

/* ---- dbc Modal ---- */
.app-shell .modal-content, .ds-modal .modal-content { border: 1px solid var(--line-1); border-radius: var(--r-md); box-shadow: var(--shadow-lg); }
.ds-modal .modal-header { border-bottom: 1px solid var(--line-1); }
.ds-modal .modal-footer { border-top: 1px solid var(--line-1); }

/* ---- dbc Tabs → segmented look ---- */
.app-shell .nav-tabs { border-bottom: 1px solid var(--line-1); }
.app-shell .nav-tabs .nav-link { color: var(--fg2); border: none; font-size: var(--text-sm); font-weight: var(--fw-medium); }
.app-shell .nav-tabs .nav-link.active { color: var(--blue-700); border-bottom: 2px solid var(--blue-500); background: transparent; }