/* ============================================================
   oppt-check.css — 사업기회관리(#sec-oppt) + Cockpit/갑지점검(#sec-check)
   + 갑지점검 우측 상세 패널(#chkDetail*) 라이트 톤 통일
   - 기존 pipeline.css 의 다크 강제 룰을 대체
   - 다크 모드는 :root[data-theme="dark"] 분기로 원본 톤 복원
   ============================================================ */

/* 섹션 배경 */
#sec-oppt,
#sec-check {
  background: var(--bg-0);
  color: var(--fg);
}

/* 카드(.sc) — 라이트 카드 */
#sec-oppt .sc,
#sec-check .sc {
  background: var(--bg-1) !important;
  border: 1px solid var(--border) !important;
  color: var(--fg) !important;
  box-shadow: var(--shadow-sm);
}
#sec-oppt .sc-t,
#sec-check .sc-t {
  color: var(--fg) !important;
  border-bottom: 1px solid var(--border) !important;
  font-weight: 700;
}

/* AR KPI(.ark) — 라이트 카드 */
#sec-oppt .ark,
#sec-check .ark {
  background: var(--bg-1) !important;
  border: 1px solid var(--border) !important;
  box-shadow: var(--shadow-sm);
}
#sec-oppt .arkv,
#sec-check .arkv { color: var(--fg) !important; }
#sec-oppt .arkl,
#sec-check .arkl { color: var(--fg-muted) !important; }

/* 셀렉트/인풋 */
#sec-oppt select,
#sec-oppt input,
#sec-check select,
#sec-check input {
  background: var(--bg-1) !important;
  color: var(--fg) !important;
  border: 1px solid var(--border-hi) !important;
  border-radius: var(--radius) !important;
  padding: 6px 10px !important;
  font-family: var(--font-sans) !important;
}
#sec-oppt select:focus,
#sec-oppt input:focus,
#sec-check select:focus,
#sec-check input:focus {
  border-color: var(--primary) !important;
  box-shadow: 0 0 0 3px rgba(99,102,241,.15) !important;
  outline: none !important;
}

/* 테이블 헤더 — 라이트 회색 헤더 */
#sec-oppt table th,
#sec-check table th {
  background: var(--bg-2) !important;
  color: var(--fg-muted) !important;
  border-bottom: 2px solid var(--border) !important;
  font-size: 12px !important;
  font-weight: 600;
}
/* 테이블 본문 */
#sec-oppt table td,
#sec-check table td {
  background: var(--bg-1) !important;
  color: var(--fg) !important;
  border-bottom: 1px solid var(--border) !important;
  font-size: 12px !important;
  padding: 6px 10px !important;
}
#sec-oppt table tr:hover td,
#sec-check table tr:hover td {
  background: var(--primary-50) !important;
}

/* empty/loading 텍스트 */
#sec-oppt .empty,
#sec-check .empty,
#sec-oppt .ldwrap,
#sec-check .ldwrap { color: var(--fg-muted) !important; }

/* ============================================================
   Cockpit 우측 상세 패널 (#chkDetail*)
   ============================================================ */
#chkKpi .ark {
  background: var(--bg-1) !important;
  border: 1px solid var(--border) !important;
}

#chkDetail {
  background: var(--bg-1) !important;
  border-left: 2px solid var(--primary) !important;
  box-shadow: -4px 0 20px rgba(15, 23, 42, .08) !important;
}
#chkDetail > div:first-child,
#chkDetail > div:nth-child(2) {
  background: var(--bg-2) !important;
  border-color: var(--border) !important;
}
#chkDetailTitle { color: var(--fg) !important; }
#chkDetailBody  { background: var(--bg-1) !important; color: var(--fg) !important; }
#chkDetailBody table th {
  background: var(--bg-2) !important;
  color: var(--fg-muted) !important;
  border-color: var(--border) !important;
}
#chkDetailBody table td {
  background: var(--bg-1) !important;
  color: var(--fg) !important;
  border-color: var(--border) !important;
}
#chkDetailBody div[style] {
  background: var(--bg-2) !important;
  border-color: var(--border) !important;
  color: var(--fg) !important;
}

/* 점검 입력 박스 (.einp) */
.einp {
  width: 100%;
  background: var(--bg-1);
  border: 1px solid var(--border-hi);
  color: var(--fg);
  padding: 6px 10px;
  border-radius: var(--radius);
  font-size: 12px;
  outline: none;
  font-family: var(--font-mono);
}
.einp:focus {
  border-color: var(--primary);
  box-shadow: 0 0 0 3px rgba(99,102,241,.15);
}

/* OCM 클릭 가능 셀 (사업기회 셀 모달 트리거) */
td.ocm-cell {
  cursor: pointer;
  transition: background .15s;
}
td.ocm-cell:hover {
  background: var(--primary-50) !important;
  outline: 1px solid var(--primary-200);
  outline-offset: -1px;
}

/* 3개월 전망 표의 모든 숫자 데이터셀 hover */
.gtbl td.nm {
  transition: background .15s, outline-color .15s;
}
.gtbl td.nm:hover {
  background: var(--primary-50) !important;
  outline: 1px solid var(--primary-200);
  outline-offset: -1px;
}

/* ============================================================
   Dark 모드 — 원본 다크 톤 복원
   ============================================================ */
:root[data-theme="dark"] #sec-oppt,
:root[data-theme="dark"] #sec-check {
  background: #060d1a;
  color: #e2e8f0;
}
:root[data-theme="dark"] #sec-oppt .sc,
:root[data-theme="dark"] #sec-check .sc,
:root[data-theme="dark"] #sec-oppt .ark,
:root[data-theme="dark"] #sec-check .ark,
:root[data-theme="dark"] #chkKpi .ark {
  background: #101d38 !important;
  border-color: #1a2e55 !important;
  color: #ffffff !important;
}
:root[data-theme="dark"] #sec-oppt .sc-t,
:root[data-theme="dark"] #sec-check .sc-t,
:root[data-theme="dark"] #sec-oppt .arkv,
:root[data-theme="dark"] #sec-check .arkv,
:root[data-theme="dark"] #chkDetailTitle { color: #ffffff !important; }
:root[data-theme="dark"] #sec-oppt .arkl,
:root[data-theme="dark"] #sec-check .arkl { color: #e2e8f0 !important; }

:root[data-theme="dark"] #sec-oppt select,
:root[data-theme="dark"] #sec-oppt input,
:root[data-theme="dark"] #sec-check select,
:root[data-theme="dark"] #sec-check input,
:root[data-theme="dark"] .einp {
  background: #0d1835 !important;
  color: #e2e8f0 !important;
  border-color: #1a2e55 !important;
}

:root[data-theme="dark"] #sec-oppt table th,
:root[data-theme="dark"] #sec-check table th,
:root[data-theme="dark"] #chkDetailBody table th {
  background: #1e3a5f !important;
  color: #ffffff !important;
  border-color: #1e3666 !important;
}
:root[data-theme="dark"] #sec-oppt table td,
:root[data-theme="dark"] #sec-check table td,
:root[data-theme="dark"] #chkDetailBody table td {
  background: #101d38 !important;
  color: #ffffff !important;
  border-color: #1a2e55 !important;
}
:root[data-theme="dark"] #sec-oppt table tr:hover td,
:root[data-theme="dark"] #sec-check table tr:hover td {
  background: #142240 !important;
}

:root[data-theme="dark"] #chkDetail {
  background: #091224 !important;
  border-left-color: #1e3666 !important;
  box-shadow: -4px 0 20px rgba(0,0,0,.6) !important;
}
:root[data-theme="dark"] #chkDetail > div:first-child,
:root[data-theme="dark"] #chkDetail > div:nth-child(2) {
  background: #060d1a !important;
  border-color: #1a2e55 !important;
}
:root[data-theme="dark"] #chkDetailBody {
  background: #091224 !important;
  color: #e2e8f0 !important;
}
:root[data-theme="dark"] #chkDetailBody div[style] {
  background: #101d38 !important;
  border-color: #1a2e55 !important;
  color: #e2e8f0 !important;
}

:root[data-theme="dark"] td.ocm-cell:hover {
  background: rgba(103,232,249,.15) !important;
  outline-color: rgba(103,232,249,.5);
}

:root[data-theme="dark"] .gtbl td.nm:hover {
  background: rgba(103,232,249,.15) !important;
  outline-color: rgba(103,232,249,.5);
}
