/* ---------------------------------------------------------------------------
 * 재사용 가능 Tab UI 모듈 — RhTabs.create() 가 그리는 DOM 의 스타일.
 *
 * Nexacro 의 <Tab> + <Tabpage> 변환을 위한 reference. IK000121 의 5 탭 변환에서
 * 첫 도입. 향후 IK/INV/QNA 의 Tab 기반 화면들이 동일 모듈 사용.
 * --------------------------------------------------------------------------- */

.rh-tabs {
  display: flex;
  flex-direction: column;
  height: 100%;
  font-family: 'Pretendard', 'Malgun Gothic', sans-serif;
}
.rh-tabs-headers {
  display: flex;
  border-bottom: 2px solid #2c4368;
  background: #fafbfc;
  flex-shrink: 0;
}
.rh-tabs-header {
  padding: 10px 20px;
  background: transparent;
  border: 0;
  border-right: 1px solid #eef0f3;
  font-family: inherit;
  font-size: 13px;
  color: #6d7280;
  cursor: pointer;
  position: relative;
  transition: color 0.12s ease, background 0.12s ease;
}
.rh-tabs-header:hover {
  background: #eceefa;
  color: #1f2a44;
}
.rh-tabs-header.is-active {
  background: #2c4368;
  color: #ffffff;
  font-weight: 600;
}
.rh-tabs-panels {
  flex: 1 1 auto;
  overflow: auto;
  background: #ffffff;
}
.rh-tabs-panel {
  display: none;
  padding: 16px 20px;
}
.rh-tabs-panel.is-active {
  display: block;
}
.rh-tabs-panel-placeholder {
  padding: 32px;
  text-align: center;
  color: #6d7280;
  font-size: 13px;
  background: #fbfbfc;
  border: 1px dashed #b8c0cf;
  border-radius: 4px;
}
.rh-tabs-panel-placeholder strong { color: #2c4368; }