/*
 * ========================================================
 *  DK Medical Solutions — Clinical Blue & Clean Theme
 *  Version: 1.0.0
 *  Based on: Siemens Healthineers / Philips Healthcare B2B UI Standards
 *
 *  [적용 원칙]
 *  - 기존 HTML 구조(class명, id, 물리적 위치) 일절 수정 없음
 *  - 오직 시각적 스타일(색상·폰트·테두리·그림자)만 덮어씌움
 *  - !important 로 기존 인라인·Tailwind 스타일 안전하게 오버라이드
 * ========================================================
 */

/* ─────────────────────────────────────────
   0. Pretendard 웹폰트 (CDN)
   ───────────────────────────────────────── */
@import url('https://cdn.jsdelivr.net/gh/orioncactus/pretendard@v1.3.9/dist/web/variable/pretendardvariable.min.css');

/* ─────────────────────────────────────────
   1. CSS 변수 (Design Token)
   ───────────────────────────────────────── */
:root {
  /* 메인 팔레트 */
  --cb-navy:         #0d2952;   /* 짙은 네이비 — 사이드바 로고, 주요 헤더 */
  --cb-navy-mid:     #1a4480;   /* 중간 네이비 — Level 1 메뉴, 강조 요소 */
  --cb-navy-light:   #2e6eb0;   /* 밝은 네이비 — 호버, 활성 링크 */
  --cb-sky:          #0096c7;   /* 스카이 블루 — 포인트 컬러, 활성 메뉴 왼쪽 바 */
  --cb-teal:         #00b4d8;   /* 틸 — 뱃지, 강조 레이블 */

  /* 중성 배경 */
  --cb-bg-page:      #f4f7fb;   /* 전체 페이지 배경 */
  --cb-bg-card:      #ffffff;   /* 카드·패널 배경 */
  --cb-bg-sidebar:   #F8FAFC;   /* 사이드바 배경 */
  --cb-bg-header-row:#eef3fa;   /* 테이블 헤더 행 배경 */
  --cb-bg-row-hover: #e8f1fb;   /* 테이블 행 호버 */
  --cb-bg-row-sel:   #cfe2ff;   /* 테이블 행 선택 */
  --cb-bg-sub-menu:  #112d5a;   /* 사이드바 서브메뉴 배경 */

  /* 테두리 */
  --cb-border-light: #d4dff0;   /* 연한 쿨그레이 테두리 */
  --cb-border-mid:   #b0c4de;   /* 중간 테두리 */

  /* 텍스트 */
  --cb-text-primary: #0d2952;   /* 제목·레이블 */
  --cb-text-body:    #2d3d55;   /* 본문 */
  --cb-text-muted:   #6b7c99;   /* 보조 설명 */
  --cb-text-white:   #ffffff;

  /* 상태 색 */
  --cb-success:      #1a8a5a;
  --cb-warning:      #d97706;
  --cb-danger:       #c0392b;
  --cb-info:         #0077b6;

  /* 폰트 */
  --cb-font:         'Pretendard Variable', 'Pretendard', 'Malgun Gothic', '맑은 고딕', sans-serif;

  /* 반경 */
  --cb-radius-sm:    4px;
  --cb-radius-md:    6px;
  --cb-radius-lg:    10px;

  /* 그림자 */
  --cb-shadow-card:  0 1px 4px rgba(13,41,82,.10), 0 0 0 1px rgba(13,41,82,.05);
  --cb-shadow-popup: 0 8px 32px rgba(13,41,82,.18);
}

/* ─────────────────────────────────────────
   2. 전역 폰트 & 기본 리셋
   ───────────────────────────────────────── */
html, body,
p, span, div, section, article, aside, header, footer, nav,
input, button, select, textarea, label,
table, th, td, caption,
h1, h2, h3, h4, h5, h6,
a, strong, b, em,
.font-bold, .font-semibold, .font-extrabold {
  font-family: var(--cb-font) !important;
  -webkit-font-smoothing: antialiased !important;
  -moz-osx-font-smoothing: grayscale !important;
  letter-spacing: -0.01em !important;
}

/* FontAwesome 아이콘은 폰트패밀리 변경 금지 */
i, .fa, .fa-solid, .fa-regular, .fa-brands,
[class^="fa-"], [class*=" fa-"] {
  font-family: 'Font Awesome 6 Free', 'Font Awesome 6 Brands', sans-serif !important;
}

body {
  background-color: var(--cb-bg-page) !important;
  color: var(--cb-text-body) !important;
}

/* ─────────────────────────────────────────
   3. 스크롤바 (전역)
   ───────────────────────────────────────── */
::-webkit-scrollbar          { width: 6px; height: 6px; }
::-webkit-scrollbar-track    { background: transparent; }
::-webkit-scrollbar-thumb    { background: var(--cb-border-mid); border-radius: 3px; }
::-webkit-scrollbar-thumb:hover { background: var(--cb-navy-light); }

/* ─────────────────────────────────────────
   4. 사이드바 (index.html — aside#sidebar) [Light Slate Theme]
   ───────────────────────────────────────── */
#sidebar, aside#sidebar {
  background-color: var(--cb-bg-sidebar) !important;
  border-right: 1px solid #E2E8F0 !important;
  box-shadow: 2px 0 16px rgba(0,0,0,0.02) !important;
}

/* 로고 영역 */
#main-logo, #sidebar .h-16, aside#sidebar > div:first-child {
  background-color: #FFFFFF !important;
  border-bottom: 1px solid #E2E8F0 !important;
}
#main-logo span {
  color: #0F172A !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  letter-spacing: -0.02em !important;
}
#main-logo i {
  color: #3B82F6 !important;
}

/* ★ 사이드바 nav 배경 초기화 */
#sidebar nav, #sidebar nav .menu-group, #sidebar nav .submenu-content {
  background-color: transparent !important;
}

#sidebar .menu-btn, #sidebar nav .menu-btn {
  background-color: transparent !important;
  color: #64748B !important;
  border-radius: var(--cb-radius-sm) !important;
  transition: all .15s ease !important;
}


/* Level 1 대메뉴 버튼 */
#sidebar nav > .menu-group > .menu-btn {
  background-color: #F4F7FB !important;
  margin-bottom: 2px !important;
  border-left: 3px solid #3e7eb9 !important;
  border-radius: 6px !important;
}
#sidebar nav > .menu-group > .menu-btn span {
  color: #334155 !important;
  font-size: 15px !important;
  font-weight: 700 !important;
}
#sidebar nav > .menu-group > .menu-btn i {
  color: #64748B !important;
}
#sidebar nav > .menu-group > .menu-btn:hover {
  background-color: #E2E8F0 !important;
}

/* Level 1 submenu-content 컨테이너 */
#sidebar nav > .menu-group > .submenu-content {
  background-color: transparent !important;
}

/* Level 2 그룹 버튼 */
#sidebar nav > .menu-group > .submenu-content > .menu-group > .menu-btn {
  background-color: #EAF0F6 !important;
  border-left: 2px solid #95bbde !important;
  border-radius: 4px !important;
  color: #64748B !important;
  margin: 1px 0 !important;
}
#sidebar nav > .menu-group > .submenu-content > .menu-group > .menu-btn span {
  color: #475569 !important;
  font-size: 15px !important;
  font-weight: 600 !important;
}
#sidebar nav > .menu-group > .submenu-content > .menu-group > .menu-btn i {
  color: #CBD5E1 !important;
}
#sidebar nav > .menu-group > .submenu-content > .menu-group > .menu-btn:hover {
  background-color: #DFE8F2 !important;
}

/* Level 3 그룹 버튼 */
#sidebar .submenu-content .submenu-content > .menu-group > .menu-btn {
  background-color: #DFE8F2 !important;
  border-left: 2px solid #7393B3 !important;
  border-radius: 3px !important;
  color: #64748B !important;
  margin: 1px 0 !important;
}
#sidebar .submenu-content .submenu-content > .menu-group > .menu-btn span {
  color: #475569 !important;
  font-size: 15px !important;
  font-weight: 600 !important;
}
#sidebar .submenu-content .submenu-content > .menu-group > .menu-btn:hover {
  background-color: #D1E0F0 !important;
}

/* Level 2 하위 submenu-content */
#sidebar .submenu-content .submenu-content {
  background-color: transparent !important;
}

/* Level 4 최하위 링크 a 태그 */
#sidebar .submenu-content a {
  background-color: #FFFFFF !important;
  color: #64748B !important;
  font-size: 15px !important;
  font-weight: 500 !important;
  border-radius: var(--cb-radius-sm) !important;
  transition: all .12s !important;
  display: block !important;
  margin-bottom: 2px !important;
}
#sidebar .submenu-content a:hover {
  background-color: #D1E0F0 !important;
  color: #1e3a8a !important;
  font-weight: 600 !important;
}
#sidebar .submenu-content a.active {
  background-color: #D1E0F0 !important;
  color: #1e3a8a !important;
  border-left: 3px solid #3e7eb9 !important;
  font-weight: 700 !important;
}

/* Hover overriding tailwind */
/* 비활성화 - 개별 메뉴 버튼의 Hover 우선 적용 */
#sidebar .menu-btn:focus, #sidebar nav button:focus {
  outline: none;
}

/* 하단 푸터 영역 */
#sidebar .border-t, #sidebar > div:last-child {
  background-color: #FFFFFF !important;
  border-top: 1px solid #E2E8F0 !important;
  color: #94A3B8 !important;
}


/* ─────────────────────────────────────────
   5. 상단 탭 바 (iframe tabs)
   ───────────────────────────────────────── */
#tab-bar,
[id*="tab-bar"],
.tab-bar {
  background-color: var(--cb-bg-card) !important;
  border-bottom: 1px solid var(--cb-border-light) !important;
}

/* 탭 버튼 */
#tab-bar button,
.tab-bar button {
  font-size: 12px !important;
  font-weight: 500 !important;
  color: var(--cb-text-muted) !important;
  border-bottom: 2px solid transparent !important;
  transition: color .15s, border-color .15s !important;
}
#tab-bar button.active,
#tab-bar button[data-active="true"],
.tab-bar button.active {
  color: var(--cb-navy-mid) !important;
  border-bottom-color: var(--cb-sky) !important;
  font-weight: 700 !important;
}

/* ─────────────────────────────────────────
   6. 페이지 헤더 바
      (각 pages/*.html 최상단 헤더 div)
   ───────────────────────────────────────── */
/* 일반적인 헤더 패턴 */
body > .bg-white.rounded-lg.shadow-sm,
body > div > .bg-white.rounded-lg.shadow-sm,
body > div.bg-white.rounded-lg,
.page-header {
  background-color: var(--cb-bg-card) !important;
  border: 1px solid var(--cb-border-light) !important;
  box-shadow: var(--cb-shadow-card) !important;
  border-radius: var(--cb-radius-md) !important;
}

/* 헤더 타이틀 (border-l-4 패턴) */
h2[class*="border-l-4"],
.text-sm[class*="border-l-4"] {
  font-size: 14px !important;
  font-weight: 700 !important;
  color: var(--cb-text-primary) !important;
  border-left-color: var(--cb-sky) !important;
}

/* ─────────────────────────────────────────
   7. 데이터 그리드 — 테이블 공통
   ───────────────────────────────────────── */
table {
  border-collapse: collapse !important;
  font-size: 13px !important;
}

/* 헤더 셀 */
th {
  background-color: var(--cb-bg-header-row) !important;
  color: var(--cb-text-primary) !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  letter-spacing: 0.01em !important;
  border: 1px solid var(--cb-border-light) !important;
  padding: 7px 8px !important;
  white-space: nowrap !important;
  text-align: center !important;
  vertical-align: middle !important;
}

/* 본문 셀 */
td {
  border: 1px solid var(--cb-border-light) !important;
  color: var(--cb-text-body) !important;
  font-size: 13px !important;
  padding: 5px 8px !important;
  vertical-align: middle !important;
  text-align: center !important;
}

/* 짝수 행 배경 (Zebra) */
tbody tr:nth-child(even) > td {
  background-color: rgba(237,244,252,.45) !important;
}

/* 호버 행 */
tbody tr:hover > td {
  background-color: var(--cb-bg-row-hover) !important;
  cursor: pointer !important;
}

/* 선택된 행 */
tbody tr.selected > td,
tbody tr.row-selected > td,
#grid-body tr.selected > td,
#grid-body tr.detail-selected > td {
  background-color: var(--cb-bg-row-sel) !important;
  color: var(--cb-navy) !important;
  font-weight: 600 !important;
}

/* 스티키 헤더 */
thead tr {
  position: sticky !important;
  top: 0 !important;
  z-index: 5 !important;
}

/* ─────────────────────────────────────────
   8. 입력 컨트롤 (input, select, textarea)
   ───────────────────────────────────────── */
input[type="text"],
input[type="number"],
input[type="date"],
input[type="email"],
input[type="password"],
input[type="search"],
select,
textarea,
.f-ctrl {
  font-family: var(--cb-font) !important;
  font-size: 13px !important;
  color: var(--cb-text-body) !important;
  background-color: #ffffff !important;
  border: 1px solid var(--cb-border-light) !important;
  border-radius: var(--cb-radius-sm) !important;
  padding: 4px 8px !important;
  height: 28px !important;
  outline: none !important;
  transition: border-color .15s, box-shadow .15s !important;
}
input:focus, select:focus, textarea:focus, .f-ctrl:focus {
  border-color: var(--cb-sky) !important;
  box-shadow: 0 0 0 2px rgba(0,150,199,.15) !important;
}
input:read-only, input[readonly],
.f-ctrl[readonly], .f-ctrl[disabled] {
  background-color: #f0f4f9 !important;
  color: var(--cb-text-muted) !important;
}
textarea { height: auto !important; resize: vertical !important; }

/* ─────────────────────────────────────────
   9. 버튼 시스템
   ───────────────────────────────────────── */
/* 9-1. 신규 (Primary — Indigo/Navy) */
button[id*="btn-new"],
button[id*="btn-add"],
.dk-btn-primary {
  background-color: var(--cb-navy-mid) !important;
  color: #ffffff !important;
  border: none !important;
  border-radius: var(--cb-radius-sm) !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  padding: 5px 12px !important;
  cursor: pointer !important;
  transition: background-color .15s !important;
}
button[id*="btn-new"]:hover,
button[id*="btn-add"]:hover {
  background-color: var(--cb-navy) !important;
}

/* 9-2. 수정 (Warning — Amber) */
button[id*="btn-edit"],
button[id*="btn-group-edit"] {
  background-color: #fffbeb !important;
  color: #92400e !important;
  border: 1px solid #fcd34d !important;
  border-radius: var(--cb-radius-sm) !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  padding: 5px 12px !important;
  cursor: pointer !important;
  transition: background-color .15s !important;
}
button[id*="btn-edit"]:hover,
button[id*="btn-group-edit"]:hover {
  background-color: #fef9c3 !important;
}

/* 9-3. 저장 (Success — Teal) */
button[id*="btn-save"],
button[id*="btn-group-save"] {
  background-color: #ecfdf5 !important;
  color: var(--cb-success) !important;
  border: 1px solid #6ee7b7 !important;
  border-radius: var(--cb-radius-sm) !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  padding: 5px 12px !important;
  cursor: pointer !important;
  transition: background-color .15s !important;
}
button[id*="btn-save"]:hover,
button[id*="btn-group-save"]:hover {
  background-color: #d1fae5 !important;
}

/* 9-4. 삭제 (Danger — Red) */
button[id*="btn-delete"],
button[id*="btn-group-delete"],
button[id*="btn-cancel"] {
  background-color: #fff5f5 !important;
  color: var(--cb-danger) !important;
  border: 1px solid #fca5a5 !important;
  border-radius: var(--cb-radius-sm) !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  padding: 5px 12px !important;
  cursor: pointer !important;
  transition: background-color .15s !important;
}
button[id*="btn-delete"]:hover,
button[id*="btn-cancel"]:hover {
  background-color: #fee2e2 !important;
}

/* 9-5. 조회 (Info — Clinical Blue) */
button[id*="btn-search"],
button[id*="doSearch"] {
  background-color: var(--cb-navy-mid) !important;
  color: #ffffff !important;
  border: none !important;
  border-radius: var(--cb-radius-sm) !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  padding: 5px 12px !important;
  cursor: pointer !important;
  transition: background-color .15s !important;
}
button[id*="btn-search"]:hover {
  background-color: var(--cb-navy) !important;
}

/* 9-6. 엑셀 (Green) */
button[id*="btn-excel"],
button[id*="excel"],
button[id*="excelDown"] {
  background-color: #f0fdf4 !important;
  color: #166534 !important;
  border: 1px solid #86efac !important;
  border-radius: var(--cb-radius-sm) !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  padding: 5px 12px !important;
  cursor: pointer !important;
  transition: background-color .15s !important;
}
button[id*="btn-excel"]:hover {
  background-color: #dcfce7 !important;
}

/* 9-7. 초기화 버튼 */
button[id*="btn-reset"],
button[onclick*="doReset"],
button[onclick*="resetFilters"] {
  background-color: #f8fafc !important;
  color: var(--cb-text-muted) !important;
  border: 1px solid var(--cb-border-light) !important;
  border-radius: var(--cb-radius-sm) !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  padding: 5px 12px !important;
  cursor: pointer !important;
}

/* ─────────────────────────────────────────
   10. 섹션 구분 레이블
       (.sec-label, .section-label 등)
   ───────────────────────────────────────── */
.sec-label,
.section-label,
.form-section-title,
[class*="sec-label"],
span[class*="border-l-"] {
  font-size: 13px !important;
  font-weight: 700 !important;
  color: var(--cb-navy-mid) !important;
  border-left: 3px solid var(--cb-sky) !important;
  padding-left: 8px !important;
  margin-bottom: 6px !important;
  display: block !important;
}

/* ─────────────────────────────────────────
   11. 상태 뱃지 (status-badge)
   ───────────────────────────────────────── */
.status-badge,
span[class*="status-"] {
  font-size: 11px !important;
  font-weight: 700 !important;
  border-radius: 20px !important;
  padding: 2px 10px !important;
  display: inline-flex !important;
  align-items: center !important;
  letter-spacing: 0 !important;
}
/* 개별 상태 색상 재정의 */
.status-입고완료, .status-출고완료, .status-완료, .status-승인 {
  background: #d1fae5 !important; color: #065f46 !important;
}
.status-입고대기, .status-의뢰, .status-대기 {
  background: #dbeafe !important; color: #1e40af !important;
}
.status-취소, .status-반려, .status-삭제 {
  background: #fee2e2 !important; color: #991b1b !important;
}
.status-부분, .status-가출고, .status-진행 {
  background: #fef3c7 !important; color: #92400e !important;
}

/* ─────────────────────────────────────────
   12. 카드·패널 공통
   ───────────────────────────────────────── */
.bg-white.rounded-lg,
.bg-white.rounded-md,
.bg-white.shadow-sm {
  background-color: var(--cb-bg-card) !important;
  border: 1px solid var(--cb-border-light) !important;
  box-shadow: var(--cb-shadow-card) !important;
  border-radius: var(--cb-radius-md) !important;
}

/* ─────────────────────────────────────────
   13. 그리드 서브헤더 (목록 타이틀 바)
   ───────────────────────────────────────── */
.bg-gray-50.border-b,
.bg-gray-100.border-b {
  background-color: #f0f5fb !important;
  border-bottom: 1px solid var(--cb-border-light) !important;
}

/* ─────────────────────────────────────────
   14. 스플리터 (상하 분리)
   ───────────────────────────────────────── */
.splitter {
  background: linear-gradient(to bottom, var(--cb-border-light), var(--cb-border-mid), var(--cb-border-light)) !important;
}
.splitter:hover {
  background: linear-gradient(to bottom, rgba(0,150,199,.3), var(--cb-sky), rgba(0,150,199,.3)) !important;
}

/* ─────────────────────────────────────────
   15. 페이지네이션
   ───────────────────────────────────────── */
[id*="page-info"],
[class*="pagination"] button,
[class*="pager"] button {
  font-size: 12px !important;
  color: var(--cb-text-muted) !important;
}
[class*="pagination"] button.active,
[class*="pager"] button.active {
  background-color: var(--cb-navy-mid) !important;
  color: #ffffff !important;
  border-radius: var(--cb-radius-sm) !important;
}

/* ─────────────────────────────────────────
   16. 모달·팝업
   ───────────────────────────────────────── */
[id*="modal"],
[id*="popup"],
[class*="modal"],
[class*="popup"] {
  border-radius: var(--cb-radius-lg) !important;
  box-shadow: var(--cb-shadow-popup) !important;
  border: 1px solid var(--cb-border-light) !important;
}
[id*="modal"] h2,
[id*="popup"] h2,
[id*="modal"] h3,
[id*="popup"] h3 {
  color: var(--cb-navy) !important;
  font-weight: 700 !important;
  font-size: 15px !important;
}

/* ─────────────────────────────────────────
   17. 반응형 — 좁은 화면
   ───────────────────────────────────────── */
@media (max-width: 1280px) {
  table, th, td { font-size: 12px !important; }
  button { font-size: 11px !important; }
}

/* ─────────────────────────────────────────
   18. 테이블 셀 내부 입력 요소
       조회 모드 → 박스(테두리/배경) 제거
       수정·편집 모드 → 박스 복원
   ───────────────────────────────────────── */

/* ① 조회 모드 기본: td 안 모든 input / select / textarea 박스 제거 */
table tbody td input,
table tbody td input[type="text"],
table tbody td input[type="number"],
table tbody td input[type="date"],
table tbody td input[type="search"],
table tbody td select,
table tbody td textarea,
#grid-body td input,
#grid-body td select,
#grid-body td textarea,
.detail-table td input,
.detail-table td select {
  border: none !important;
  background: transparent !important;
  box-shadow: none !important;
  border-radius: 0 !important;
  outline: none !important;
  padding: 0 4px !important;
  height: auto !important;
  min-height: 0 !important;
  cursor: default !important;
  /* select 드롭다운 화살표도 숨김 */
  -webkit-appearance: none !important;
  -moz-appearance: none !important;
  appearance: none !important;
}

/* ② 포커스(사용자가 클릭하여 직접 편집 시작) → 박스 복원 */
table tbody td input:focus,
table tbody td select:focus,
table tbody td textarea:focus,
#grid-body td input:focus,
#grid-body td select:focus,
.detail-table td input:focus,
.detail-table td select:focus {
  border: 1px solid var(--cb-sky) !important;
  background: #ffffff !important;
  box-shadow: 0 0 0 2px rgba(0,150,199,.18) !important;
  border-radius: var(--cb-radius-sm) !important;
  padding: 3px 6px !important;
  height: 26px !important;
  cursor: text !important;
  -webkit-appearance: auto !important;
  -moz-appearance: auto !important;
  appearance: auto !important;
}

/* ③ 편집 행 전체(.editing / .row-editing) → 박스 복원 */
table tbody tr.editing td input,
table tbody tr.editing td select,
table tbody tr.editing td textarea,
table tbody tr.row-editing td input,
table tbody tr.row-editing td select,
#grid-body tr.editing td input,
#grid-body tr.editing td select {
  border: 1px solid var(--cb-border-light) !important;
  background: #ffffff !important;
  box-shadow: none !important;
  border-radius: var(--cb-radius-sm) !important;
  padding: 3px 6px !important;
  height: 26px !important;
  cursor: text !important;
  -webkit-appearance: auto !important;
  -moz-appearance: auto !important;
  appearance: auto !important;
}

/* ④ 체크박스 / 라디오는 항상 원래 모습 유지 */
table tbody td input[type="checkbox"],
table tbody td input[type="radio"],
#grid-body td input[type="checkbox"],
#grid-body td input[type="radio"] {
  border: revert !important;
  background: revert !important;
  box-shadow: revert !important;
  appearance: auto !important;
  -webkit-appearance: auto !important;
  -moz-appearance: auto !important;
  width: 14px !important;
  height: 14px !important;
  cursor: pointer !important;
  padding: 0 !important;
}

/* ⑤ 폼 영역(기본정보·상세정보 패널) 내 입력 요소는 항상 박스 유지
      — table 밖의 .f-ctrl, form 안 input/select는 영향받지 않도록 제외 */
.f-ctrl,
form input,
form select,
form textarea,
[id*="form"] input,
[id*="form"] select {
  border: 1px solid var(--cb-border-light) !important;
  background: #ffffff !important;
  border-radius: var(--cb-radius-sm) !important;
  padding: 4px 8px !important;
  height: 28px !important;
  -webkit-appearance: auto !important;
  -moz-appearance: auto !important;
  appearance: auto !important;
}

/* ═══════════════════════════════════════════
   ★ 고도화 패치 — v1.1
   ═══════════════════════════════════════════ */

/* ─────────────────────────────────────────
   19. 액션 버튼 완전 통일화 (V1.2+ 전역 대응)
       (신규/수정/저장/삭제/조회/엑셀 계열)
   ───────────────────────────────────────── */

/* 19-0. 버튼 공통 베이스 (ID가 없더라도 모든 우측화면 버튼 통제) */
html body button[id^="btn-"],
html body button[id*="-btn-"],
html body button[onclick],
html body #right-pane button:not(.close-btn),
html body div[class*="bg-white"] button:not(.close-btn) {
  font-family: var(--cb-font) !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  letter-spacing: -0.01em !important;
  line-height: 1 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 4px !important;
  padding: 5px 12px !important;
  height: 28px !important;
  border-radius: 5px !important;
  cursor: pointer !important;
  transition: background-color .15s ease, filter .12s ease, transform .08s ease !important;
  white-space: nowrap !important;
  box-shadow: 0 1px 2px 0 rgba(0,0,0,0.05) !important;
}
html body button[id^="btn-"]:active,
html body button[onclick]:active {
  transform: translateY(1px) !important;
  filter: brightness(.95) !important;
}

/* 19-1. 신규 — 강조 인디고 (Primary Action) */
html body button[id$="-new"],
html body button[id="btn-new"],
html body button[id="btn-group-new"],
html body button[id="btn-add"],
html body button[id="btn-item-add"],
html body button[onclick*="Add"] {
  background-color: #1a4480 !important;
  color: #ffffff !important;
  border: none !important;
}
html body button[onclick*="Add"]:hover,
html body button[id$="-new"]:hover { background-color: #0d2952 !important; }

/* 19-2. 수정 — 앰버 (Caution) */
html body button[id$="-edit"],
html body button[id="btn-edit"],
html body button[id="btn-group-edit"],
html body button[onclick*="Edit"] {
  background-color: #fffbeb !important;
  color: #78350f !important;
  border: 1px solid #f59e0b !important;
}
html body button[onclick*="Edit"]:hover,
html body button[id$="-edit"]:hover { filter: brightness(.96) !important; }

/* 19-3. 저장 — 에메랄드 (Positive Action) */
html body button[id$="-save"],
html body button[id="btn-save"],
html body button[id="btn-group-save"] {
  background-color: #059669 !important;
  color: #ffffff !important;
  border: none !important;
}
html body button[id$="-save"]:hover,
html body button[id="btn-save"]:hover { background-color: #047857 !important; }

/* 19-4. 삭제 — 레드 (Destructive) */
html body button[id$="-delete"],
html body button[id="btn-delete"],
html body button[id="btn-group-delete"] {
  background-color: #fff5f5 !important;
  color: #b91c1c !important;
  border: 1px solid #fca5a5 !important;
}
html body button[id$="-delete"]:hover,
html body button[id="btn-delete"]:hover { background-color: #fee2e2 !important; }

/* 19-5. 조회 / 검색 — 네이비 (Primary Query) */
html body button[id="btn-search"],
html body button[id$="-search"],
html body button[id*="btnSearch"],
html body button[id*="doSearch"],
html body button[onclick*="Search"],
html body button[onclick*="filter"] {
  background-color: #1a4480 !important;
  color: #ffffff !important;
  border: none !important;
}
html body button[id="btn-search"]:hover,
html body button[onclick*="Search"]:hover,
html body button[onclick*="filter"]:hover { background-color: #0d2952 !important; }

/* 19-6. 확정 / 완료 처리 — 틸 그린 */
html body button[id="btn-confirm"],
html body button[id$="-confirm"],
html body button[id="btn-approve"],
html body button[id="btn-complete"],
html body button[onclick*="Approve"],
html body button[onclick*="Confirm"] {
  background-color: #0d9488 !important;
  color: #ffffff !important;
  border: none !important;
}
html body button[id="btn-confirm"]:hover { background-color: #0f766e !important; }

/* 19-7. 확정취소 / 반려 / 반려취소 — 오렌지 (Warning Reverse) */
html body button[id="btn-confirm-cancel"],
html body button[id$="-confirm-cancel"],
html body button[id="btn-reject"],
html body button[id$="-reject"],
html body button[id="btn-reject-cancel"],
html body button[id$="-reject-cancel"] {
  background-color: #fff7ed !important;
  color: #c2410c !important;
  border: 1px solid #fb923c !important;
}
html body button[id="btn-confirm-cancel"]:hover,
html body button[id="btn-reject"]:hover,
html body button[id="btn-reject-cancel"]:hover { background-color: #ffedd5 !important; }

/* 19-8. 엑셀다운로드 — 그린 라인 */
html body button[id="btn-excel"],
html body button[id="btn-excel-download"],
html body button[id$="-excel"],
html body button[id*="excel-download"],
html body button[id*="excelDown"],
html body button[onclick*="excelDown"],
html body button[onclick*="excel"] {
  background-color: #f0fdf4 !important;
  color: #15803d !important;
  border: 1px solid #86efac !important;
}
html body button[id="btn-excel"]:hover,
html body button[onclick*="excel"]:hover { background-color: #dcfce7 !important; }

/* 19-9. 엑셀업로드 — 인디고 라인 */
html body button[id="btn-excel-upload"],
html body button[id*="excel-upload"],
html body button[id*="excelUp"] {
  background-color: #eef2ff !important;
  color: #3730a3 !important;
  border: 1px solid #a5b4fc !important;
}
html body button[id="btn-excel-upload"]:hover { background-color: #e0e7ff !important; }

/* 19-10. 엑셀양식/템플릿 — 틸 라인 */
html body button[id="btn-excel-template"],
html body button[id*="template"],
html body button[id*="양식"] {
  background-color: #f0fdfa !important;
  color: #0f766e !important;
  border: 1px solid #5eead4 !important;
}
html body button[id="btn-excel-template"]:hover { background-color: #ccfbf1 !important; }

/* 19-11. 출력 / PDF / 인쇄 — 다크 슬레이트 */
html body button[id="btn-print"],
html body button[id="btn-pdf"],
html body button[id$="-print"],
html body button[id$="-pdf"],
html body button[onclick*="Print"],
html body button[onclick*="Pdf"],
html body button[onclick*="pdf"] {
  background-color: #1e293b !important;
  color: #ffffff !important;
  border: none !important;
}
html body button[id="btn-print"]:hover,
html body button[id="btn-pdf"]:hover { background-color: #0f172a !important; }

/* 19-12. 초기화 */
button[id="btn-reset"],
button[id$="-reset"] {
  background-color: #f8fafc !important;
  color: #475569 !important;
  border: 1px solid #cbd5e1 !important;
}

/* ─────────────────────────────────────────
   20. 데이터 그리드 폰트 & 행 간격 완벽 통일
   ───────────────────────────────────────── */

/* 20-1. 컬럼 헤더 */
table thead th,
#grid-body ~ * thead th,
.detail-table thead th,
table > thead > tr > th {
  font-family: var(--cb-font) !important;
  font-size: 12px !important;
  font-weight: 700 !important;           /* Semi-Bold */
  letter-spacing: 0.02em !important;
  color: #0d2952 !important;
  background-color: #eef3fa !important;
  border: 1px solid #d4dff0 !important;
  padding: 0 8px !important;
  height: 32px !important;              /* 헤더 행 높이 고정 */
  line-height: 32px !important;
  white-space: nowrap !important;
  text-align: center !important;
  vertical-align: middle !important;
  user-select: none !important;
}

/* 20-2. 데이터 본문 셀 — 헤더와 동일 높이 */
table tbody td,
.detail-table tbody td,
table > tbody > tr > td {
  font-family: var(--cb-font) !important;
  font-size: 12.5px !important;
  font-weight: 400 !important;           /* Regular */
  letter-spacing: -0.01em !important;
  color: #1e2d45 !important;
  border: 1px solid #dde8f4 !important;
  padding: 0 8px !important;
  height: 32px !important;              /* 데이터 행 높이 — 헤더와 동일 */
  line-height: 32px !important;
  white-space: nowrap !important;
  vertical-align: middle !important;
  text-align: center !important;
}

/* 20-3. 좌측 정렬이 자연스러운 텍스트 셀 */
table tbody td.td-left,
table tbody td[class*="text-left"],
.detail-table td.td-left {
  text-align: left !important;
  padding-left: 10px !important;
}

/* 20-4. 행 Zebra 강화 */
table tbody tr:nth-child(even) > td {
  background-color: rgba(238,243,250,.55) !important;
}
table tbody tr:hover > td {
  background-color: #dbeafe !important;
  cursor: pointer !important;
}

/* 20-5. 선택 행 */
table tbody tr.selected > td,
table tbody tr.row-selected > td,
#grid-body tr.selected > td {
  background-color: #bfdbfe !important;
  color: #0d2952 !important;
  font-weight: 600 !important;
}

/* ─────────────────────────────────────────
   21. 가로 스크롤 확장 (데이터 전체 표출)
   ───────────────────────────────────────── */

/* 21-1. 테이블 래퍼에 가로 스크롤 */
.table-container,
.overflow-auto,
[id*="grid-wrap"],
[id*="table-wrap"],
[class*="table-container"] {
  overflow-x: auto !important;
  overflow-y: auto !important;
  -webkit-overflow-scrolling: touch !important;
}

/* 21-2. table 자체는 min-content 넓이 유지 */
table {
  min-width: max-content !important;
  width: 100% !important;
}

/* 21-3. td·th 줄바꿈 완전 금지 */
th, td {
  white-space: nowrap !important;
  overflow: visible !important;
  text-overflow: unset !important;
}

/* 21-4. 예외: 비고/메모 컬럼은 줄바꿈 허용 */
td.td-note,
td[class*="note"],
td[class*="memo"],
td[class*="remark"] {
  white-space: normal !important;
  min-width: 160px !important;
  max-width: 300px !important;
  word-break: break-word !important;
}

/* ─────────────────────────────────────────
   22. 상태 Badge — 동적 색상 팔레트
       (CSS 속성 선택자로 텍스트 내용 기반 자동 배색)
   ───────────────────────────────────────── */

/* 22-0. Badge 베이스 공통 */
.status-badge,
td span[class*="status-"],
td .badge,
td [class*="badge-"] {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-family: var(--cb-font) !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  letter-spacing: 0 !important;
  padding: 2px 8px !important;
  border-radius: 20px !important;
  line-height: 1.4 !important;
  white-space: nowrap !important;
}

/* ─── 22-1. 완료 계열 — 에메랄드 그린 ─── */
.status-완료,    .status-입고완료, .status-출고완료,
.status-이동완료, .status-반납완료, .status-처리완료,
.status-정상,    .status-승인,    .badge-완료,
.badge-입고완료, .badge-출고완료, .badge-이동완료 {
  background: #d1fae5 !important;
  color: #065f46 !important;
  border: 1px solid #6ee7b7 !important;
}

/* ─── 22-2. 대기/의뢰 계열 — 코발트 블루 ─── */
.status-대기,  .status-의뢰,  .status-접수,
.status-입고대기, .status-출고대기, .status-확인중,
.badge-대기,   .badge-의뢰,   .badge-접수 {
  background: #dbeafe !important;
  color: #1e3a8a !important;
  border: 1px solid #93c5fd !important;
}

/* ─── 22-3. 진행/임시 계열 — 앰버 옐로우 ─── */
.status-진행,    .status-임시입고, .status-임시이동,
.status-가출고,  .status-부분,    .status-검토중,
.badge-진행,    .badge-임시입고, .badge-가출고 {
  background: #fef3c7 !important;
  color: #92400e !important;
  border: 1px solid #fcd34d !important;
}

/* ─── 22-4. 취소/반려/에러 계열 — 레드 ─── */
.status-취소,  .status-반려,  .status-불량,
.status-오류,  .status-삭제,  .badge-취소,
.badge-반려,   .badge-불량 {
  background: #fee2e2 !important;
  color: #991b1b !important;
  border: 1px solid #fca5a5 !important;
}

/* ─── 22-5. 반품/반납 — 마젠타 핑크 ─── */
.status-반품완료, .status-반납완료,
.badge-반품,     .badge-반납 {
  background: #fce7f3 !important;
  color: #9d174d !important;
  border: 1px solid #f9a8d4 !important;
}

/* ─── 22-6. 이동/전출 — 바이올렛 ─── */
.status-이동중,  .status-출고중,
.badge-이동,    .badge-출고중 {
  background: #ede9fe !important;
  color: #5b21b6 !important;
  border: 1px solid #c4b5fd !important;
}

/* ─── 22-7. 미확인/신규 미처리 — 쿨 그레이 ─── */
.status-미확인, .status-미처리,
.status-없음,  .badge-미확인 {
  background: #f1f5f9 !important;
  color: #475569 !important;
  border: 1px solid #cbd5e1 !important;
}

/* ─── 22-8. JS 동적 배지 삭제 (tr 버그 방지) ─── */
/* HTML의 tr 컨테이너 요소가 data-status 속성을 데이터 저장용으로 사용할 때,
   tr 전체가 inline-flex 블록으로 깨져 간트차트처럼 보이는 현상을 막기 위해
   27번 섹션의 .status-* 클래스로 역할을 완전히 이관했습니다. */

/* ═══════════════════════════════════════════
   ★ 고도화 패치 — v1.2 (전체 누락 보완)
   ═══════════════════════════════════════════ */

/* ─────────────────────────────────────────
   23. 검색 조건 영역 완전 통일
       (.f-label / .f-ctrl — 전 페이지 공통 패턴)
   ───────────────────────────────────────── */

/* 23-1. 검색 레이블 */
.f-label,
label.f-label,
span.f-label,
div.f-label {
  font-family: var(--cb-font) !important;
  font-size: 11.5px !important;
  font-weight: 700 !important;
  letter-spacing: 0 !important;
  color: #334155 !important;
  white-space: nowrap !important;
  display: block !important;
  margin-bottom: 2px !important;
}

/* 23-2. 검색 입력 컨트롤 */
.f-ctrl,
input.f-ctrl,
select.f-ctrl,
textarea.f-ctrl {
  font-family: var(--cb-font) !important;
  font-size: 12px !important;
  font-weight: 400 !important;
  color: #1e2d45 !important;
  background-color: #ffffff !important;
  border: 1px solid #c9d9ef !important;
  border-radius: 4px !important;
  padding: 3px 8px !important;
  height: 28px !important;
  outline: none !important;
  width: 100% !important;
  transition: border-color .15s, box-shadow .15s !important;
}
.f-ctrl:focus,
input.f-ctrl:focus,
select.f-ctrl:focus {
  border-color: #0096c7 !important;
  box-shadow: 0 0 0 2px rgba(0,150,199,.15) !important;
}
.f-ctrl[disabled],
.f-ctrl:disabled,
input.f-ctrl[disabled] {
  background-color: #f0f5fb !important;
  color: #94a3b8 !important;
  cursor: not-allowed !important;
}
.f-ctrl[readonly],
input.f-ctrl[readonly] {
  background-color: #f5f8fd !important;
  color: #475569 !important;
}
textarea.f-ctrl {
  height: auto !important;
  resize: vertical !important;
  line-height: 1.5 !important;
}

/* 23-3. 검색 조건 래퍼 배경 통일 */
.flex-shrink-0.border-b,
.search-bar,
.search-area,
.filter-row,
[id*="search-row"],
[id*="filter-bar"],
[class*="cond-row"],
[class*="search-row"] {
  background-color: #f8fafd !important;
  border-bottom: 1px solid #d4dff0 !important;
}

/* ─────────────────────────────────────────
   24. 테이블 헤더 완전 강제 통일
       (파일별 인라인 `#main-table th` 등 최상위 명시도 제압)
   ───────────────────────────────────────── */

/* 24-1. 모든 th — 극강 specificity로 덮어씌우기 (HTML 내부의 #id 선택자 무력화) */
html body #bom-table th,
html body #diary-table th,
html body #inst-table th,
html body #item-table th,
html body #log-table th,
html body #mainTable th,
html body #leftTable th,
html body #main-table th,
html body #pdf-table th,
html body #popup-table th,
html body #sr-table th,
html body #detailTable th,
html body .detail-table th,
html body table.detail-table th,
html body table thead tr th,
html body table > thead > tr > th,
html body thead th,
html body th {
  font-family: var(--cb-font) !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  letter-spacing: 0.01em !important;
  color: #374151 !important;
  background-color: #f3f4f6 !important;
  background: #f3f4f6 !important;        /* background 단속성도 병행 */
  border: 1px solid #e5e7eb !important;
  padding: 10px 8px !important;
  height: 40px !important;
  line-height: 1.4 !important;
  text-align: center !important;
  vertical-align: middle !important;
  white-space: nowrap !important;
  position: sticky !important;
  top: 0 !important;
  z-index: 5 !important;
}

/* 24-2. sticky 헤더 그림자 (스크롤 시 시각적 분리) */
html body #bom-table th::after,
html body #diary-table th::after,
html body #inst-table th::after,
html body #item-table th::after,
html body #log-table th::after,
html body #mainTable th::after,
html body #leftTable th::after,
html body #main-table th::after,
html body #pdf-table th::after,
html body #popup-table th::after,
html body #sr-table th::after,
html body #detailTable th::after,
html body thead th::after {
  content: '' !important;
  position: absolute !important;
  left: 0; right: 0; bottom: -1px !important;
  height: 1px !important;
  background: #b0c4de !important;
}

/* 24-3. 삭제됨 (24-1에 통합하여 보라색 계열도 완전히 클리니컬 블루로 통합) */

/* 24-4. td 강제 통일 (파일별 인라인 오버라이드 방지) */
html body #bom-table td,
html body #diary-table td,
html body #inst-table td,
html body #item-table td,
html body #log-table td,
html body #mainTable td,
html body #leftTable td,
html body #main-table td,
html body #pdf-table td,
html body #popup-table td,
html body #sr-table td,
html body #detailTable td,
html body table tbody tr td,
html body table > tbody > tr > td,
html body tbody td {
  font-family: var(--cb-font) !important;
  font-size: 14px !important;
  font-weight: 400 !important;
  color: #374151 !important;
  border: 1px solid #e5e7eb !important;
  padding: 12px 8px !important;
  height: 44px !important;
  vertical-align: middle !important;
  text-align: center !important;
  white-space: nowrap !important;
}

/* 24-5. td 내 체크박스 셀 — 고정 폭 */
html body td:first-child:has(input[type="checkbox"]),
html body td.td-check {
  width: 36px !important;
  max-width: 36px !important;
  padding: 0 !important;
}

/* ─────────────────────────────────────────
   25. 가로 스크롤 래퍼 전역 강화
       (overflow-hidden 이 걸린 부모를 우회)
   ───────────────────────────────────────── */

/* 25-1. 테이블이 들어있는 flex 자식 div에 overflow 적용 */
.flex-1.overflow-auto,
.flex-1.overflow-y-auto,
[id$="-table-wrap"],
[id$="-grid-wrap"],
[id="grid-container"],
[id="table-container"],
div:has(> table) {
  overflow-x: auto !important;
  overflow-y: auto !important;
}

/* 25-2. table 자체 최소 너비 보장 */
html body table {
  min-width: max-content !important;
  border-collapse: collapse !important;
  width: 100% !important;
}

/* ─────────────────────────────────────────
   26. 누락 버튼 패치
       (각 페이지별 id 명칭 차이 보완)
   ───────────────────────────────────────── */

/* 26-1. 신규 계열 추가 id 패턴 */
button[id="btn-row-add"],
button[id="btn-detail-add"],
button[id="btn-line-add"],
button[id="btn-addrow"],
button[id="addRowBtn"] {
  background-color: #1a4480 !important;
  color: #ffffff !important;
  border: none !important;
  font-family: var(--cb-font) !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  height: 28px !important;
  padding: 5px 12px !important;
  border-radius: 5px !important;
}

/* 26-2. 저장 계열 추가 */
button[id="btn-save-form"],
button[id="btn-form-save"],
button[id="saveBtn"],
button[id="doSave"] {
  background-color: #059669 !important;
  color: #ffffff !important;
  border: none !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  height: 28px !important;
  border-radius: 5px !important;
}

/* 26-3. 확정 계열 추가 */
button[id="btn-inb-confirm"],
button[id="btn-inbound-confirm"],
button[id="btn-approveAll"],
button[id="btn-confirm-form"] {
  background-color: #0d9488 !important;
  color: #ffffff !important;
  border: none !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  height: 28px !important;
  border-radius: 5px !important;
}

/* 26-4. 출력/PDF 계열 추가 */
button[id="btn-form-pdf"],
button[id="btn-form-print"],
button[id="btn-form-excel"],
button[id="pdfBtn"],
button[id="printBtn"] {
  background-color: #1e293b !important;
  color: #ffffff !important;
  border: none !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  height: 28px !important;
  border-radius: 5px !important;
}

/* ─────────────────────────────────────────
   27. 상태 뱃지 보완 — 실제 텍스트값 기반
       (각 페이지 실제 사용 상태값 전수 대응)
   ───────────────────────────────────────── */

/* 완료/정상 계열 */
.status-완료,
.status-입고완료,
.status-출고완료,
.status-이동완료,
.status-반납완료,
.status-처리완료,
.status-정상,
.status-승인 {
  background: #d1fae5 !important;
  color: #065f46 !important;
  border: 1px solid #6ee7b7 !important;
  padding: 2px 8px !important;
  border-radius: 20px !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  display: inline-flex !important;
  align-items: center !important;
  white-space: nowrap !important;
}

/* 대기/의뢰/접수 계열 */
.status-대기,
.status-의뢰,
.status-접수,
.status-입고대기,
.status-출고대기,
.status-확인중 {
  background: #dbeafe !important;
  color: #1e3a8a !important;
  border: 1px solid #93c5fd !important;
  padding: 2px 8px !important;
  border-radius: 20px !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  display: inline-flex !important;
  align-items: center !important;
}

/* 진행/임시 계열 */
.status-진행,
.status-임시입고,
.status-임시이동,
.status-가출고,
.status-부분,
.status-검토중 {
  background: #fef3c7 !important;
  color: #92400e !important;
  border: 1px solid #fcd34d !important;
  padding: 2px 8px !important;
  border-radius: 20px !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  display: inline-flex !important;
  align-items: center !important;
}

/* 취소/반려/불량/오류 계열 */
.status-취소,
.status-반려,
.status-불량,
.status-오류,
.status-삭제 {
  background: #fee2e2 !important;
  color: #991b1b !important;
  border: 1px solid #fca5a5 !important;
  padding: 2px 8px !important;
  border-radius: 20px !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  display: inline-flex !important;
  align-items: center !important;
}

/* 반품/반납완료 계열 */
.status-반품완료,
.status-반납완료 {
  background: #fce7f3 !important;
  color: #9d174d !important;
  border: 1px solid #f9a8d4 !important;
  padding: 2px 8px !important;
  border-radius: 20px !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  display: inline-flex !important;
  align-items: center !important;
}

/* 이동중/출고중 계열 */
.status-이동중,
.status-출고중 {
  background: #ede9fe !important;
  color: #5b21b6 !important;
  border: 1px solid #c4b5fd !important;
  padding: 2px 8px !important;
  border-radius: 20px !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  display: inline-flex !important;
  align-items: center !important;
}

/* 미확인/미처리 계열 */
.status-미확인,
.status-미처리,
.status-없음 {
  background: #f1f5f9 !important;
  color: #475569 !important;
  border: 1px solid #cbd5e1 !important;
  padding: 2px 8px !important;
  border-radius: 20px !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  display: inline-flex !important;
  align-items: center !important;
}

/* ─────────────────────────────────────────
   28. 검색 바 라벨 줄바꿈 전역 방지
       (모든 페이지 검색 영역 라벨 가로 고정)
   ───────────────────────────────────────── */

/* 검색 바 컨테이너 가로 스크롤 허용, 세로 줄바꿈 방지 */
html body [class*="flex-wrap"]:has(> div > label.text-gray-500) {
  flex-wrap: nowrap !important;
  overflow-x: auto !important;
}

/* 검색 바 내 모든 라벨 — 단 1px도 세로 깨짐 없이 강제 고정 */
html body label.text-gray-500,
html body label.text-gray-500.text-xs,
html body .flex.items-center > label {
  white-space: nowrap !important;
  flex-shrink: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  writing-mode: horizontal-tb !important;
  text-orientation: mixed !important;
}

/* 검색 바 내 개별 항목 그룹 — 절대 줄바꿈 없이 가로 나열 */
html body .flex.items-center.gap-1\.5,
html body .flex.items-center.gap-1 {
  flex-shrink: 0 !important;
  white-space: nowrap !important;
}


/* [사이드바 폰트 글로벌 통일] 사용자 요청 가장 큰 폰트(15px)로 모두 동일하게 수정 */
#sidebar nav .menu-group > .menu-btn span,
#sidebar nav .submenu-content > .menu-group > .menu-btn span,
#sidebar nav .submenu-content a,
#sidebar nav .menu-btn,
aside#sidebar nav .menu-btn span,
aside#sidebar nav a {
    font-size: 15px !important;
}

/* ═══════════════════════════════════════════════════════
   ★ [전체 UI 폰트 사이즈 통일] — v2.0
     우측 메인 영역을 사이드바 기준(15px)에 맞춰 일괄 상향
     대상: 그리드(th/td), 버튼, 입력폼, 탭, 레이블, 뱃지, 탭
   ═══════════════════════════════════════════════════════ */

/* ── 1. 그리드 헤더(th) — 14px + 행 높이 확대 ── */
html body th,
html body thead th,
html body table > thead > tr > th,
html body table thead tr th,
html body #main-table th,
html body #mainTable th,
html body #leftTable th,
html body #grid-body th,
html body .detail-table th,
html body #bom-table th,
html body #item-table th,
html body #log-table th,
html body #inst-table th,
html body #diary-table th,
html body #sr-table th,
html body #pdf-table th,
html body #popup-table th,
html body #detailTable th {
    font-size: 14px !important;
    font-weight: 700 !important;
    color: #374151 !important;
    background-color: #f3f4f6 !important;
    background: #f3f4f6 !important;
    border: 1px solid #e5e7eb !important;
    height: 40px !important;
    line-height: 1.4 !important;
    padding: 10px 8px !important;
    vertical-align: middle !important;
    white-space: nowrap !important;
}

/* ── 2. 그리드 본문(td) — 14px + 행 높이 44px ── */
html body td,
html body tbody td,
html body table > tbody > tr > td,
html body table tbody tr td,
html body #main-table td,
html body #mainTable td,
html body #leftTable td,
html body #grid-body td,
html body .detail-table td,
html body #bom-table td,
html body #item-table td,
html body #log-table td,
html body #inst-table td,
html body #diary-table td,
html body #sr-table td,
html body #pdf-table td,
html body #popup-table td,
html body #detailTable td {
    font-size: 14px !important;
    color: #374151 !important;
    border: 1px solid #e5e7eb !important;
    height: 44px !important;
    line-height: 1.4 !important;
    padding: 12px 8px !important;
    vertical-align: middle !important;
    white-space: nowrap !important;
}

/* ── 3. 버튼 — 14px + 높이 자동 확대 ── */
html body button[id^="btn-"],
html body button[id*="-btn-"],
html body button[onclick],
html body #right-pane button:not(.close-btn),
html body div[class*="bg-white"] button:not(.close-btn) {
    font-size: 14px !important;
    height: 32px !important;
    padding: 5px 14px !important;
}

/* ── 4. 입력 컨트롤(input / select / textarea) — 14px ── */
html body input[type="text"],
html body input[type="number"],
html body input[type="date"],
html body input[type="email"],
html body input[type="password"],
html body input[type="search"],
html body select,
html body .f-ctrl,
html body input.f-ctrl,
html body select.f-ctrl {
    font-size: 14px !important;
    height: 32px !important;
}
html body textarea,
html body textarea.f-ctrl {
    font-size: 14px !important;
}

/* ── 5. 폼/검색 레이블 — 14px ── */
html body .f-label,
html body label.f-label,
html body span.f-label,
html body div.f-label,
html body label.text-gray-500,
html body label.text-xs {
    font-size: 14px !important;
}

/* ── 6. 탭 바 버튼 — 14px ── */
html body #tab-bar button,
html body .tab-bar button,
html body [id*="tab-bar"] button {
    font-size: 14px !important;
}

/* ── 7. 섹션 타이틀 / 페이지 헤더 텍스트 — 15px ── */
html body .sec-label,
html body .section-label,
html body .form-section-title,
html body h2[class*="border-l-4"],
html body .text-sm[class*="border-l-4"] {
    font-size: 15px !important;
}

/* ── 8. 상태 뱃지(Badge) — 13px ── */
html body .status-badge,
html body td span[class*="status-"],
html body td .badge,
html body td [class*="badge-"],
html body span[class*="status-"] {
    font-size: 13px !important;
}

/* ── 9. 페이지 조회 건수 / 하단 정보 텍스트 — 14px ── */
html body [id*="page-info"],
html body [id*="total-count"],
html body [class*="page-info"],
html body [class*="total-count"] {
    font-size: 14px !important;
}

/* ── 10. 모달/팝업 헤더 텍스트 — 16px ── */
html body [id*="modal"] h2,
html body [id*="popup"] h2,
html body [id*="modal"] h3,
html body [id*="popup"] h3 {
    font-size: 16px !important;
}

/* ── 11. 그리드 셀 내 input placeholder 숨김 ── */
table tbody td input::placeholder,
table tbody td input::-webkit-input-placeholder,
table tbody td input::-moz-placeholder,
table tbody td input:-ms-input-placeholder,
#grid-body td input::placeholder,
#grid-body td input::-webkit-input-placeholder,
.detail-table td input::placeholder,
.detail-table td select::placeholder {
    color: transparent !important;
    opacity: 0 !important;
}


/* -----------------------------------------
   12. 전역 표준 액션 버튼 (5종) - btn-std-*
   ----------------------------------------- */
button.btn-std-new,
button.btn-std-edit,
button.btn-std-save,
button.btn-std-delete,
button.btn-std-search {
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
  padding: 5px 12px !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  border-radius: 5px !important;
  cursor: pointer !important;
  transition: background 0.15s, opacity 0.15s !important;
  white-space: nowrap !important;
  line-height: 1.4 !important;
}
button.btn-std-new { background-color: #0f2441 !important; color: #fff !important; border: 1px solid #0f2441 !important; }
button.btn-std-new:hover { background-color: #1a3d6b !important; border-color: #1a3d6b !important; }
button.btn-std-edit { background-color: #fff !important; color: #c47f00 !important; border: 1px solid #e09b00 !important; }
button.btn-std-edit:hover { background-color: #fffbeb !important; }
button.btn-std-save { background-color: #fff !important; color: #1d6fd8 !important; border: 1px solid #1d6fd8 !important; }
button.btn-std-save:hover { background-color: #eff6ff !important; }
button.btn-std-delete { background-color: #fff !important; color: #dc2626 !important; border: 1px solid #dc2626 !important; }
button.btn-std-delete:hover { background-color: #fef2f2 !important; }
button.btn-std-search { background-color: #0f2441 !important; color: #fff !important; border: 1px solid #0f2441 !important; }
button.btn-std-search:hover { background-color: #1a3d6b !important; border-color: #1a3d6b !important; }


/* ─────────────────────────────────────────
   ★ [아이콘 전용 파스텔 버튼] — 독립 클래스 (단일 화면 테스트용)
   ───────────────────────────────────────── */
/* ─────────────────────────────────────────
   ★ [아이콘 전용 파스텔 버튼] — 독립 클래스 (단일 화면 테스트용)
   ───────────────────────────────────────── */
html body button.btn-pastel-new,
html body button.btn-pastel-edit,
html body button.btn-pastel-save,
html body button.btn-pastel-delete,
html body button.btn-pastel-search,
html body button.btn-pastel-upload,
html body button.btn-pastel-template,
html body button.btn-pastel-download,
html body button.btn-pastel-pdf {
  width: 34px !important;
  min-width: 34px !important;
  height: 34px !important;
  padding: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  border-radius: 8px !important;
  box-shadow: 0 2px 5px rgba(0,0,0,0.13) !important;
  transition: transform 0.12s, box-shadow 0.12s !important;
  cursor: pointer !important;
  gap: 0 !important;
}

html body button.btn-pastel-new:hover,
html body button.btn-pastel-edit:hover,
html body button.btn-pastel-save:hover,
html body button.btn-pastel-delete:hover,
html body button.btn-pastel-search:hover,
html body button.btn-pastel-upload:hover,
html body button.btn-pastel-template:hover,
html body button.btn-pastel-download:hover,
html body button.btn-pastel-pdf:hover {
  transform: translateY(-2px) !important;
  box-shadow: 0 4px 10px rgba(0,0,0,0.18) !important;
}

html body button.btn-pastel-new i,
html body button.btn-pastel-edit i,
html body button.btn-pastel-save i,
html body button.btn-pastel-delete i,
html body button.btn-pastel-search i,
html body button.btn-pastel-upload i,
html body button.btn-pastel-template i,
html body button.btn-pastel-download i,
html body button.btn-pastel-pdf i {
  font-size: 15px !important;
  margin: 0 !important;
  display: block !important;
}

/* 신규 */
html body button.btn-pastel-new { background-color: #6366F1 !important; color: #ffffff !important; border: none !important; }

/* 수정 */
html body button.btn-pastel-edit { background-color: #FCD34D !important; color: #78350F !important; border: none !important; }

/* 저장 */
html body button.btn-pastel-save { background-color: #34D399 !important; color: #065F46 !important; border: none !important; }

/* 삭제 */
html body button.btn-pastel-delete { background-color: #F87171 !important; color: #7F1D1D !important; border: none !important; }

/* 조회 - 사용자가 지적한 부분 (파스텔 하늘색 배경 + 남색 돋보기) */
html body button.btn-pastel-search { background-color: #7DD3FC !important; color: #075985 !important; border: none !important; }

/* 엑셀업로드 */
html body button.btn-pastel-upload { background-color: #C7D2FE !important; color: #6366F1 !important; border: 1.5px solid #6366F1 !important; }

/* 양식다운로드 */
html body button.btn-pastel-template { background-color: #99F6E4 !important; color: #0F766E !important; border: 1.5px solid #0F766E !important; }

/* 엑셀다운로드 */
html body button.btn-pastel-download { background-color: #BBF7D0 !important; color: #15803D !important; border: 1.5px solid #15803D !important; }

/* PDF출력 */
html body button.btn-pastel-pdf { background-color: #FECDD3 !important; color: #F43F5E !important; border: 1.5px solid #F43F5E !important; }

/* 신규 버튼 스타일 추가 (Print, Cancel, Expand, Collapse, Reset) */
html body button.btn-pastel-print,
html body button.btn-pastel-cancel,
html body button.btn-pastel-expand,
html body button.btn-pastel-collapse,
html body button.btn-pastel-reset {
  width: 34px !important;
  min-width: 34px !important;
  height: 34px !important;
  padding: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  border-radius: 8px !important;
  box-shadow: 0 2px 5px rgba(0,0,0,0.13) !important;
  transition: transform 0.12s, box-shadow 0.12s !important;
  cursor: pointer !important;
  gap: 0 !important;
  border: none !important;
}
html body button.btn-pastel-print:hover,
html body button.btn-pastel-cancel:hover,
html body button.btn-pastel-expand:hover,
html body button.btn-pastel-collapse:hover,
html body button.btn-pastel-reset:hover {
  transform: translateY(-1px) !important;
  box-shadow: 0 4px 8px rgba(0,0,0,0.15) !important;
}
html body button.btn-pastel-print i,
html body button.btn-pastel-cancel i,
html body button.btn-pastel-expand i,
html body button.btn-pastel-collapse i,
html body button.btn-pastel-reset i {
  font-size: 15px !important;
  margin: 0 !important;
  display: block !important;
}

html body button.btn-pastel-print { background-color: #E9D5FF !important; color: #7E22CE !important; }
html body button.btn-pastel-cancel { background-color: #F1F5F9 !important; color: #475569 !important; box-shadow: 0 1px 3px rgba(0,0,0,0.1) !important; }
html body button.btn-pastel-expand { background-color: #F0F9FF !important; color: #0284C7 !important; }
html body button.btn-pastel-collapse { background-color: #BAE6FD !important; color: #0369A1 !important; }
html body button.btn-pastel-reset { background-color: #FFEDD5 !important; color: #C2410C !important; }

/* ========================================================
   [스크롤 잘림 버그 완벽 픽스] 
   우측 메인 컨텐츠 영역(iframe 내부의 서브페이지) 전용 전역 CSS.
   기존 body에 걸려있는 강제 높이(100vh)와 잘림(overflow:hidden)을 무효화하여,
   브라우저 확대/축소 시 자연스럽게 가로·세로 스크롤을 생성하도록 강제함.
   ======================================================== */

/* :not(:has(#sidebar)) 룰을 통해 사이드바가 있는 부모(index.html)에는 영향을 1%도 주지 않음 */
body:not(:has(#sidebar)) {
  overflow: auto !important;          /* 억제된 스크롤 생성 허용 */
  height: auto !important;            /* 100vh로 고정되어 콘텐츠를 자르는 현상 해제 */
  min-height: 100vh !important;       /* 콘텐츠가 짧을 때는 기존처럼 화면을 꽉 채우도록 보호 */
  min-width: 0 !important;            /* Flex 환경에서 가로 잘림 방지 */
}

/* ========================================================
   폰트 굵기 강제 우선순위 (2026-04-21 정책)
   각 페이지 inline <style> 의 `label, ... { font-weight:normal !important }`
   가 .font-bold/.font-semibold/.font-extrabold 까지 무력화시키는 문제를
   외부 CSS의 클래스 specificity(>요소)로 우회하여 정상 굵기를 보장.
   ======================================================== */
.font-bold      { font-weight: 700 !important; }
.font-semibold  { font-weight: 600 !important; }
.font-extrabold { font-weight: 800 !important; }
strong, b       { font-weight: bold !important; }