/* app.css — 로그인 화면 + 공통 UI (targets/admin 페이지 전용) */

/* ─── 기본 리셋 · 변수 (targets/admin 전용) ─── */
:root {
  --primary:       #1a4f7a;
  --primary-dark:  #123458;
  --primary-light: #e8f0f8;
  --accent:        #2e7d32;
  --accent-light:  #e8f5e9;
  --danger:        #c0392b;
  --danger-light:  #fdecea;
  --warn:          #e67e22;
  --warn-light:    #fff4e8;
  --gray1:         #f4f6f9;
  --gray2:         #e8ecf0;
  --gray3:         #bdc3cb;
  --gray4:         #8a9099;
  --gray5:         #4a5060;
  --text:          #1a1d24;
  --radius:        10px;
  --shadow:        0 2px 12px rgba(0,0,0,.09);
  --shadow-lg:     0 8px 32px rgba(0,0,0,.14);
}

/* targets / admin / my_inspect / target_manage / map 페이지에 적용 */
body[data-page="targets"],
body[data-page="admin"],
body[data-page="my_inspect"],
body[data-page="target_manage"],
body[data-page="map"] {
  font-family: 'Noto Sans KR', 'Apple SD Gothic Neo', sans-serif;
  background: #f0f3f8;
  color: var(--text);
  font-size: 14px;
  line-height: 1.5;
  margin: 0;
  padding: 0;
  min-height: 100vh;
}

/* 지도 페이지는 다크 배경 + overflow hidden */
body[data-page="map"] {
  background: #0f1117;
  overflow: hidden;
}

*,
*::before,
*::after { box-sizing: border-box; }

/* 로그인 오버레이 — login-* 단일 클래스명으로 통일 */
/* ════════════════════════════════════════
   로그인 오버레이 — 축산물 위생점검 테마
════════════════════════════════════════ */
#loginOverlay {
  position: fixed; inset: 0;
  display: none; align-items: center; justify-content: center;
  z-index: 9999;
  background: linear-gradient(135deg, #0a0f1e 0%, #0d1a2e 50%, #0a1220 100%);
}
#loginOverlay.on { display: flex; }

.login-backdrop {
  position: absolute; inset: 0; overflow: hidden; pointer-events: none;
}
.login-backdrop::before {
  content: '';
  position: absolute; inset: 0;
  background:
    radial-gradient(ellipse 600px 400px at 20% 80%, rgba(180,40,30,.12) 0%, transparent 70%),
    radial-gradient(ellipse 400px 300px at 80% 20%, rgba(59,130,246,.08) 0%, transparent 70%);
}

.login-box {
  position: relative; z-index: 1;
  width: 400px; max-width: 94vw;
  background: linear-gradient(160deg, #111827 0%, #0f1623 100%);
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 20px;
  box-shadow: 0 30px 80px rgba(0,0,0,.6), 0 0 0 1px rgba(255,255,255,.04);
  overflow: hidden;
  animation: loginFadeIn .35s ease;
}
@keyframes loginFadeIn {
  from { opacity: 0; transform: translateY(24px) scale(.97); }
  to   { opacity: 1; transform: translateY(0) scale(1); }
}

/* ── 헤더 배너 ── */
.login-header {
  display: flex; align-items: center; gap: 16px;
  padding: 28px 32px 22px;
  background: linear-gradient(135deg, #7f1d1d 0%, #991b1b 40%, #1e3a5f 100%);
  border-bottom: 1px solid rgba(255,255,255,.08);
}
.login-header-icon {
  flex-shrink: 0;
  width: 72px; height: 54px;
  display: flex; align-items: center; justify-content: center;
  background: rgba(255,255,255,.1);
  border-radius: 12px;
  border: 1px solid rgba(255,255,255,.15);
}
.login-header-text { flex: 1; }
.login-title {
  font-size: 1.15rem; font-weight: 800;
  color: #fff; letter-spacing: -0.3px; line-height: 1.2;
  margin: 0;
}
.login-sub {
  font-size: 0.72rem; font-weight: 500;
  color: rgba(255,255,255,.55);
  letter-spacing: 0.6px; text-transform: uppercase;
  margin-top: 3px;
}

/* ── 폼 영역 ── */
.login-form-area { padding: 28px 32px 20px; }

.login-field { margin-bottom: 16px; }
.login-field-label {
  display: block; font-size: 12px; font-weight: 700;
  color: #8b95b8; letter-spacing: 0.4px; text-transform: uppercase;
  margin-bottom: 6px;
}
.login-input-wrap {
  position: relative; display: flex; align-items: center;
}
.login-input-icon {
  position: absolute; left: 13px;
  color: #4b5675; pointer-events: none;
  display: flex; align-items: center;
}
.login-input {
  width: 100%; padding: 11px 13px 11px 38px;
  background: rgba(255,255,255,.05);
  border: 1.5px solid rgba(255,255,255,.1);
  border-radius: 10px;
  font-size: 14px; font-weight: 500;
  color: #e4ecff;
  outline: none;
  transition: border-color .2s, background .2s, box-shadow .2s;
  box-sizing: border-box;
  font-family: 'Noto Sans KR', sans-serif;
}
.login-input:focus {
  border-color: #3b82f6;
  background: rgba(59,130,246,.07);
  box-shadow: 0 0 0 3px rgba(59,130,246,.18);
}
.login-input::placeholder { color: #3d4460; }

/* ── 아이디 저장 체크박스 ── */
.login-remember {
  display: flex; align-items: center;
  margin: 4px 0 14px;
}
.login-remember-label {
  display: flex; align-items: center; gap: 8px;
  font-size: 13px; color: #8b95b8;
  cursor: pointer; user-select: none;
}
.login-remember-check { display: none; }
.login-remember-custom {
  width: 16px; height: 16px; flex-shrink: 0;
  border: 2px solid #3d4460; border-radius: 4px;
  background: transparent;
  display: flex; align-items: center; justify-content: center;
  transition: all .15s;
}
.login-remember-check:checked + .login-remember-custom {
  background: #3b82f6; border-color: #3b82f6;
}
.login-remember-check:checked + .login-remember-custom::after {
  content: '✓'; color: #fff; font-size: 11px; font-weight: 700; line-height: 1;
}

/* ── 에러 메시지 ── */
.login-error {
  color: #f87171; font-size: 13px; font-weight: 500;
  min-height: 1.3em; margin-bottom: 12px;
  background: rgba(248,113,113,.08); border-radius: 7px;
  padding: 0;
  transition: all .2s;
}
.login-error:not(:empty) { padding: 8px 12px; }

/* ── 로그인 버튼 ── */
.login-btn {
  width: 100%;
  display: flex; align-items: center; justify-content: center; gap: 8px;
  padding: 13px 20px;
  background: linear-gradient(135deg, #991b1b, #b91c1c);
  color: #fff;
  border: none; border-radius: 10px;
  font-size: 15px; font-weight: 700;
  cursor: pointer;
  transition: all .2s;
  box-shadow: 0 4px 16px rgba(185,28,28,.4);
  letter-spacing: 0.2px;
}
.login-btn:hover {
  background: linear-gradient(135deg, #b91c1c, #dc2626);
  transform: translateY(-1px);
  box-shadow: 0 6px 20px rgba(185,28,28,.5);
}
.login-btn:active { transform: translateY(0); }
.login-btn:disabled {
  background: #374151; color: #6b7280;
  box-shadow: none; cursor: not-allowed; transform: none;
}

/* ── 하단 푸터 ── */
.login-footer {
  padding: 14px 32px 20px;
  font-size: 11px; color: #3d4460;
  text-align: center; letter-spacing: 0.3px;
}

/* 사용자 정보 표시 */
.user-badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 4px 10px;
  background: rgba(255,255,255,0.15);
  border-radius: 20px;
  font-size: 0.85rem;
  color: #fff;
  cursor: pointer;
}
.user-badge:hover { background: rgba(255,255,255,0.25); }

/* ══════════════════════════════
   공통 레이아웃 (사이드바 + 메인)
   checklist 페이지에서 사용
══════════════════════════════ */

/* 전체 페이지 */
body[data-page="checklist"] {
  display: flex;
  margin: 0;
  padding: 0;
  min-height: 100vh;
  font-family: 'Noto Sans KR', 'Apple SD Gothic Neo', sans-serif;
  background: #f0f3f8;
  color: #1a1d24;
  font-size: 14px;
}

/* 사이드바 */
.sidebar {
  width: 220px;
  min-width: 220px;
  background: #1a4f7a;
  display: flex;
  flex-direction: column;
  position: fixed;
  top: 0;
  left: 0;
  height: 100vh;
  z-index: 200;
  transition: transform 0.3s ease;
}
.sidebar-header {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 20px 16px;
  border-bottom: 1px solid rgba(255,255,255,0.12);
}
.sidebar-logo { font-size: 1.6rem; }
.sidebar-title {
  font-size: 1rem;
  font-weight: 700;
  color: #fff;
}
.sidebar-nav {
  flex: 1;
  padding: 12px 0;
  overflow-y: auto;
}
.nav-item {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 11px 20px;
  color: rgba(255,255,255,0.75);
  text-decoration: none;
  font-size: 0.9rem;
  transition: all 0.2s;
}
.nav-item:hover { background: rgba(255,255,255,0.1); color: #fff; }
.nav-item.active { background: rgba(255,255,255,0.18); color: #fff; font-weight: 600; }
.nav-icon { font-size: 1.1rem; width: 22px; text-align: center; }
.nav-label { flex: 1; }
.sidebar-footer {
  padding: 12px 16px;
  border-top: 1px solid rgba(255,255,255,0.12);
  display: flex;
  gap: 8px;
}
.btn-icon {
  background: rgba(255,255,255,0.1);
  border: none;
  border-radius: 8px;
  padding: 7px 10px;
  cursor: pointer;
  font-size: 1rem;
  transition: background 0.2s;
  color: #fff;
}
.btn-icon:hover { background: rgba(255,255,255,0.25); }

/* 메인 콘텐츠 영역 */
.main-wrap {
  margin-left: 220px;
  flex: 1;
  display: flex;
  flex-direction: column;
  min-height: 100vh;
  min-width: 0;
}

/* 상단 헤더 (checklist 전용) */
body[data-page="checklist"] .page-header {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 0 20px;
  height: 54px;
  min-height: 54px;
  background: #fff;
  border-bottom: 1px solid #e5e7eb;
  position: sticky;
  top: 0;
  z-index: 100;
  box-shadow: 0 1px 4px rgba(0,0,0,0.06);
  flex-shrink: 0;
}
body[data-page="checklist"] .header-left {
  display: flex;
  align-items: center;
  gap: 10px;
  flex: 1;
  min-width: 0;
}
body[data-page="checklist"] .header-right {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-shrink: 0;
}
body[data-page="checklist"] .page-title {
  font-size: 1rem;
  font-weight: 700;
  color: #1a4f7a;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  margin: 0;
}
.mob-menu-btn {
  display: none;
  background: none;
  border: none;
  font-size: 1.4rem;
  cursor: pointer;
  color: #374151;
  padding: 4px 8px;
}

/* 배지 */
.badge { display: inline-block; padding: 2px 10px; border-radius: 12px; font-size: 0.78rem; font-weight: 600; }
.badge-info { background: #dbeafe; color: #1d4ed8; }
.badge-ok   { background: #d1fae5; color: #065f46; }
.badge-warn { background: #fff3cd; color: #856404; }

/* 버튼 공통 */
.btn {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 7px 14px;
  border-radius: 7px;
  border: none;
  font-size: 0.86rem;
  font-weight: 500;
  cursor: pointer;
  transition: all 0.18s;
  white-space: nowrap;
  text-decoration: none;
}
.btn-sm { padding: 5px 11px; font-size: 0.8rem; }
.btn-primary { background: #1a4f7a; color: #fff; }
.btn-primary:hover { background: #123458; }
.btn-outline {
  background: #fff;
  color: #374151;
  border: 1.5px solid #d1d5db;
}
.btn-outline:hover { background: #f9fafb; border-color: #9ca3af; }
.btn-danger { background: #ef4444; color: #fff; }
.btn-danger:hover { background: #dc2626; }

/* 모달 기본 */
.modal-overlay {
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,0.5);
  display: none;
  align-items: center;
  justify-content: center;
  z-index: 9000;
  padding: 16px;
}
.modal-overlay.on { display: flex; }
.modal-box {
  background: #fff;
  border-radius: 12px;
  padding: 24px;
  width: 100%;
  max-width: 500px;
  box-shadow: 0 8px 32px rgba(0,0,0,0.15);
}
.modal-title {
  font-size: 1.05rem;
  font-weight: 700;
  margin-bottom: 16px;
  color: #1a4f7a;
}
.modal-actions {
  display: flex;
  gap: 10px;
  justify-content: flex-end;
  margin-top: 16px;
}
.form-textarea {
  width: 100%;
  border: 1.5px solid #d1d5db;
  border-radius: 7px;
  padding: 10px 12px;
  font-size: 0.9rem;
  resize: vertical;
  font-family: inherit;
  box-sizing: border-box;
}
.form-textarea:focus { outline: none; border-color: #1a4f7a; }

/* 모바일 */
@media (max-width: 768px) {
  .sidebar {
    transform: translateX(-100%);
  }
  .sidebar.open {
    transform: translateX(0);
  }
  .main-wrap {
    margin-left: 0;
  }
  .mob-menu-btn { display: block; }
  body[data-page="checklist"] .page-header { padding: 0 12px; }
}

/* 다크모드 */
body:not(.light-mode).checklist-page .sidebar { background: #111827; }
body:not(.light-mode) .main-wrap { background: #0f172a; }
body:not(.light-mode) body[data-page="checklist"] .page-header { background: #1f2937; border-bottom-color: #374151; }
body:not(.light-mode) .modal-box { background: #1f2937; color: #f9fafb; }
body:not(.light-mode) .form-textarea { background: #374151; border-color: #4b5563; color: #f9fafb; }

/* ══════════════════════════════
   체크리스트 페이지 스타일
══════════════════════════════ */

/* 점검표 페이지: targets 레이아웃을 그대로 사용 */
/* body[data-page="checklist"]의 .targets-content 안에서 체크리스트 콘텐츠 표시 */
body[data-page="checklist"] .targets-content {
  padding: 12px 16px 40px;
}

/* 점검표 테이블 & doc-header를 targets-content 안에서 자연스럽게 표시 */
body[data-page="checklist"] .table-wrap {
  border-radius: 10px;
  overflow-x: auto;   /* visible → auto: 테이블 우측 overflow 클리핑 */
}

body[data-page="checklist"] .action-bar {
  background: #13151f;
  border-top-color: #1e2130;
  border-radius: 0 0 10px 10px;
  position: sticky;
  bottom: 0;
  z-index: 10;
}

body[data-page="checklist"] #checklistRoot {
  display: flex;
  flex-direction: column;
  gap: 16px;
  width: 100%;
  min-width: 0;
  overflow-x: hidden;  /* 테이블 콘텐츠 우측 overflow 방지 */
}

/* 워크플로우 배지들을 탑바에 표시 */
.targets-topbar .wf-badge {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 5px 11px;
  border-radius: 20px;
  font-size: 12px;
  font-weight: 600;
  cursor: pointer;
  transition: all .15s;
  border: 1px solid transparent;
}

/* 워크플로우 툴바 */
.wf-toolbar {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px 16px;
  background: var(--surface, #fff);
  border-bottom: 1px solid var(--border, #e5e7eb);
  flex-wrap: wrap;
  overflow-x: auto;
}
.wf-label {
  font-size: 0.8rem;
  color: var(--text-muted, #6b7280);
  white-space: nowrap;
}
.wf-badge {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 5px 12px;
  border-radius: 20px;
  font-size: 0.82rem;
  font-weight: 500;
  cursor: pointer;
  border: none;
  transition: all 0.2s;
  white-space: nowrap;
}
.wf-badge-none {
  background: #f3f4f6;
  color: #6b7280;
}
.wf-badge-none:hover { background: #e5e7eb; }
.wf-badge-done {
  background: #d1fae5;
  color: #065f46;
}
.wf-badge-done:hover { background: #a7f3d0; }

/* 문서 헤더 카드 */
.doc-header-card {
  background: var(--surface, #fff);
  border: 1px solid var(--border, #e5e7eb);
  border-radius: 10px;
  padding: 14px 16px;
  margin: 12px 16px 8px;
}
.doc-header-row {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
}
.doc-header-field {
  display: flex;
  flex-direction: column;
  gap: 4px;
  flex: 1;
  min-width: 140px;
}
.doc-header-field label {
  font-size: 0.78rem;
  font-weight: 600;
  color: var(--text-muted, #6b7280);
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

/* 점검표 테이블 */
.table-wrap {
  overflow-x: auto;
  margin: 0 16px 16px;
}
.checklist-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.88rem;
  background: var(--surface, #fff);
  border-radius: 8px;
  overflow: hidden;
  border: 1px solid var(--border, #e5e7eb);
}
.checklist-table thead tr {
  background: #f9fafb;
}
.checklist-table th {
  padding: 10px 8px;
  text-align: center;
  font-weight: 600;
  font-size: 0.82rem;
  color: #374151;
  border-bottom: 2px solid #e5e7eb;
}
.checklist-table .th-cat  { width: 54px; }
.checklist-table .th-item { min-width: 180px; text-align: left; }
.checklist-table .th-chk  { width: 36px; }
.checklist-table .th-note { width: 110px; }

.checklist-table td {
  padding: 7px 8px;
  border-bottom: 1px solid #f3f4f6;
  vertical-align: middle;
}
.td-cat {
  text-align: center;
  font-size: 0.8rem;
  font-weight: 600;
  background: #f9fafb;
  border-right: 1px solid #e5e7eb;
  color: #374151;
  white-space: pre-wrap;
}
.td-item { text-align: left; }
.td-chk  { text-align: center; }
.td-note { padding: 4px; }

/* 체크 버튼 */
.chk-btn {
  width: 30px;
  height: 30px;
  border: 2px solid #d1d5db;
  background: #fff;
  border-radius: 6px;
  font-size: 0.9rem;
  font-weight: 700;
  cursor: pointer;
  transition: all 0.15s;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.chk-btn:hover { transform: scale(1.1); }
.chk-btn.sel-ok  { background: #10b981; border-color: #10b981; color: #fff; }
.chk-btn.sel-ng  { background: #ef4444; border-color: #ef4444; color: #fff; }
.chk-btn.chk-hide { opacity: 0.25; }

/* 비고 잉크 필드 */
.td-note .ink-field {
  position: relative;
  min-height: 32px;
  border: 1px solid #e5e7eb;
  border-radius: 4px;
  cursor: pointer;
  background: #fafafa;
}
.ink-ph {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #d1d5db;
  font-size: 0.78rem;
  pointer-events: none;
}
.ink-canvas {
  display: block;
  width: 100%;
}
.ink-field.has-ink .ink-ph { display: none; }

/* PC 비고칸 해당없음 표시 */
.ink-field.is-na {
  background: #fffbeb;
  border-color: #f59e0b;
}
.ink-field.is-na .ink-ph {
  display: flex !important;
  color: #92400e;
  font-weight: 700;
  font-size: 11px;
}
.ink-field.is-na .ink-ph::before {
  content: '해당없음';
}
body:not(.light-mode) .ink-field.is-na {
  background: #1e1500;
  border-color: #d97706;
}
body:not(.light-mode) .ink-field.is-na .ink-ph { color: #f59e0b; }

/* 저장 모달 */
.save-info {
  background: #f9fafb;
  border: 1px solid #e5e7eb;
  border-radius: 8px;
  padding: 12px;
  margin-bottom: 12px;
  font-size: 0.88rem;
  line-height: 1.7;
}
.warn-banner {
  background: #fffbeb;
  border: 1px solid #fbbf24;
  border-radius: 6px;
  padding: 8px 12px;
  margin-bottom: 10px;
  font-size: 0.82rem;
  color: #92400e;
}

/* 액션 바 */
.action-bar {
  display: flex;
  gap: 10px;
  justify-content: flex-end;
  padding: 12px 16px;
  background: var(--surface, #fff);
  border-top: 1px solid var(--border, #e5e7eb);
  position: sticky;
  bottom: 0;
}

/* 로딩 스피너 */
.loading-spinner {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 60px 20px;
  gap: 16px;
  color: var(--text-muted, #6b7280);
}
.spinner {
  width: 40px;
  height: 40px;
  border: 4px solid #e5e7eb;
  border-top-color: #2563eb;
  border-radius: 50%;
  animation: spin 0.8s linear infinite;
}
@keyframes spin { to { transform: rotate(360deg); } }

/* 모바일 점검표 — 상세 스타일은 style.css @media 블록에서 처리 */
@media (max-width: 768px) {
  .wf-toolbar { gap: 6px; padding: 6px 12px; }
  .wf-badge { font-size: 0.78rem; padding: 4px 10px; }
}

/* 다크모드 */
body:not(.light-mode) .doc-header-card,
body:not(.light-mode) .checklist-table,
body:not(.light-mode) .wf-toolbar,
body:not(.light-mode) .save-info {
  background: #13151f;
  border-color: #1e2130;
}
body:not(.light-mode) .td-cat { background: #0d0f19; color: #e4ecff; border-right-color: #1e2130; }
body:not(.light-mode) .checklist-table thead tr { background: #0d0f19; }
body:not(.light-mode) .checklist-table th { color: #e4ecff; border-bottom-color: #252840; }
body:not(.light-mode) .checklist-table td { border-bottom-color: #1e2235; color: #e4ecff; }
body:not(.light-mode) .checklist-table td .th-item,
body:not(.light-mode) .checklist-table .td-item { color: #e4ecff; }
body:not(.light-mode) .chk-btn { background: #1a1e30; border-color: #2a2d45; color: #e4ecff; }
body:not(.light-mode) .td-note .ink-field { background: #0d1020; border-color: #2a2d45; }
body:not(.light-mode) .wf-badge-none { background: #1a1e30; color: #9ba5c4; border-color: #2a2d45; }
body:not(.light-mode) .action-bar { background: #13151f; border-top-color: #1e2130; }

/* ══════════════════════════════
   관리자 페이지 스타일
══════════════════════════════ */

/* 탭 */
.admin-tabs {
  display: flex;
  gap: 0;
  background: var(--surface, #fff);
  border-bottom: 2px solid #e5e7eb;
  padding: 0 16px;
  overflow-x: auto;
  flex-shrink: 0;
}
.admin-tab {
  padding: 12px 20px;
  border: none;
  background: none;
  font-size: 0.88rem;
  font-weight: 500;
  color: #6b7280;
  cursor: pointer;
  border-bottom: 3px solid transparent;
  margin-bottom: -2px;
  white-space: nowrap;
  transition: color .15s, border-color .15s;
}
.admin-tab:hover { color: #1f2937; }
.admin-tab.active {
  color: #2563eb;
  border-bottom-color: #2563eb;
  font-weight: 600;
}

/* 탭 컨텐츠 */
.admin-tab-content {
  flex: 1;
  overflow-y: auto;
  padding: 0;
}

/* ── 새 admin 탭 네비게이션 (targets-layout 기반) ── */
.admin-tab-nav {
  display: flex;
  gap: 4px;
  padding: 14px 20px 0;
  background: transparent;
  border-bottom: 1px solid #1e2130;
  overflow-x: auto;
  flex-shrink: 0;
}
.admin-tab-btn {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 9px 16px 10px;
  border: none;
  background: none;
  font-size: 13px;
  font-weight: 500;
  color: #6b7599;
  cursor: pointer;
  border-bottom: 2px solid transparent;
  margin-bottom: -1px;
  white-space: nowrap;
  border-radius: 6px 6px 0 0;
  transition: color .15s, background .15s, border-color .15s;
}
.admin-tab-btn:hover { color: #c0c8e8; background: rgba(255,255,255,.04); }
.admin-tab-btn.active {
  color: #60a5fa;
  border-bottom-color: #3b82f6;
  background: rgba(59,130,246,.08);
  font-weight: 600;
}
.admin-tab-icon { font-size: 14px; }

/* 라이트모드 */
body.light-mode .admin-tab-nav { border-bottom-color: #e5e7eb; background: transparent; }
body.light-mode .admin-tab-btn { color: #6b7280; }
body.light-mode .admin-tab-btn:hover { color: #1f2937; background: rgba(0,0,0,.04); }
body.light-mode .admin-tab-btn.active { color: #2563eb; border-bottom-color: #2563eb; background: rgba(37,99,235,.06); }

/* 탭 내부 툴바 */
.tab-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 16px 20px 12px;
  gap: 12px;
  flex-wrap: wrap;
}
.tab-toolbar-right {
  display: flex;
  gap: 8px;
  align-items: center;
}
.tab-section-title {
  font-size: 1.05rem;
  font-weight: 700;
  color: #1a3c5e;
  margin: 0;
}

/* 테이블 */
.admin-table-wrap {
  overflow-x: auto;
  margin: 0 20px 20px;
  border: 1px solid #e5e7eb;
  border-radius: 8px;
}
.admin-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.875rem;
  background: #fff;
}
.admin-table thead tr { background: #f9fafb; }
.admin-table th {
  padding: 10px 12px;
  text-align: left;
  font-weight: 600;
  font-size: 0.8rem;
  color: #374151;
  border-bottom: 2px solid #e5e7eb;
}
.admin-table td {
  padding: 10px 12px;
  border-bottom: 1px solid #f3f4f6;
  vertical-align: middle;
}
.admin-table tbody tr:last-child td { border-bottom: none; }
.admin-table tbody tr:hover { background: #f9fafb; }
.td-empty {
  text-align: center;
  color: #9ca3af;
  padding: 32px !important;
  font-size: 0.9rem;
}
.td-center { text-align: center; }
.td-muted  { color: #9ca3af; }
.td-date   { color: #6b7280; font-size: 0.82rem; }

/* 역할 배지 */
.role-badge {
  display: inline-block;
  padding: 2px 8px;
  border-radius: 12px;
  font-size: 0.78rem;
  font-weight: 500;
}
.role-admin    { background: #dbeafe; color: #1d4ed8; }
.role-inspector { background: #f0fdf4; color: #166534; }

/* 상태 배지 */
.status-badge {
  display: inline-block;
  padding: 2px 8px;
  border-radius: 12px;
  font-size: 0.78rem;
  font-weight: 500;
}
.status-active   { background: #d1fae5; color: #065f46; }
.status-inactive { background: #fee2e2; color: #991b1b; }

/* 기본 프리셋 배지 */
.badge-default {
  display: inline-block;
  padding: 2px 7px;
  border-radius: 10px;
  background: #fef3c7;
  color: #92400e;
  font-size: 0.75rem;
  font-weight: 500;
}

/* 버튼 그룹 */
.btn-group {
  display: flex;
  gap: 4px;
  flex-wrap: wrap;
}
.btn-xs {
  padding: 3px 8px !important;
  font-size: 0.75rem !important;
  min-height: 0 !important;
}
.btn-danger {
  background: #fff;
  color: #dc2626;
  border: 1.5px solid #fca5a5;
}
.btn-danger:hover  { background: #fee2e2; }
.btn-danger:disabled { opacity: 0.4; cursor: not-allowed; }

/* 통계 카드 */
.stats-summary-row {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
  gap: 12px;
  padding: 0 20px 16px;
}
.stat-summary-card {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 16px;
  border-radius: 10px;
  border: 1px solid transparent;
}
.stat-summary-card.blue   { background: #eff6ff; border-color: #bfdbfe; }
.stat-summary-card.green  { background: #f0fdf4; border-color: #bbf7d0; }
.stat-summary-card.purple { background: #faf5ff; border-color: #e9d5ff; }
.stat-summary-card.orange { background: #fff7ed; border-color: #fed7aa; }
.stat-summary-icon { font-size: 1.8rem; line-height: 1; }
.stat-summary-label { font-size: 0.78rem; color: #6b7280; margin-bottom: 2px; }
.stat-summary-value { font-size: 1.5rem; font-weight: 700; color: #1f2937; }

.stats-section {
  padding: 0 20px 20px;
}
.stats-subtitle {
  font-size: 0.95rem;
  font-weight: 600;
  color: #374151;
  margin-bottom: 12px;
}
.stat-cards-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
  gap: 10px;
}
.stat-card {
  background: #fff;
  border: 1px solid #e5e7eb;
  border-radius: 8px;
  padding: 14px;
}
.stat-card-label { font-size: 0.78rem; color: #6b7280; margin-bottom: 6px; }
.stat-card-value { font-size: 1.4rem; font-weight: 700; margin-bottom: 6px; }
.stat-card-bar {
  height: 4px;
  background: #f3f4f6;
  border-radius: 2px;
  overflow: hidden;
  margin-bottom: 4px;
}
.stat-card-bar-fill { height: 100%; border-radius: 2px; transition: width .3s; }
.stat-card-pct { font-size: 0.72rem; color: #9ca3af; text-align: right; }

.status-chip {
  display: inline-block;
  padding: 2px 8px;
  border-radius: 12px;
  font-size: 0.75rem;
  font-weight: 500;
}

/* 시스템 설정 */
.settings-list {
  padding: 0 20px 20px;
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.settings-item {
  background: #fff;
  border: 1px solid #e5e7eb;
  border-radius: 8px;
  padding: 16px;
}
.settings-item-header {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 6px;
}
.settings-label {
  font-weight: 600;
  font-size: 0.9rem;
  color: #1f2937;
}
.settings-key-badge {
  font-size: 0.72rem;
  background: #f3f4f6;
  color: #6b7280;
  padding: 1px 6px;
  border-radius: 4px;
  font-family: monospace;
}
.settings-hint {
  font-size: 0.78rem;
  color: #9ca3af;
  margin-bottom: 8px;
}
.settings-input-row {
  display: flex;
  gap: 8px;
  align-items: center;
}
.settings-input-row .form-input { flex: 1; }

/* 탭 힌트 */
.tab-hint {
  font-size: 0.78rem;
  color: #9ca3af;
  padding: 0 20px 12px;
  margin: 0;
}

/* 토글 */
.toggle-wrap {
  display: flex;
  align-items: center;
  gap: 8px;
  cursor: pointer;
  user-select: none;
}
.toggle-wrap input[type="checkbox"] {
  width: 16px;
  height: 16px;
  cursor: pointer;
}

/* 폼 그룹 */
.form-group {
  margin-bottom: 14px;
}
.form-label {
  display: block;
  font-size: 0.83rem;
  font-weight: 600;
  color: #374151;
  margin-bottom: 5px;
}
.req { color: #dc2626; }
.form-error {
  font-size: 0.8rem;
  color: #dc2626;
  min-height: 1.2em;
  margin: 0;
}

/* 다크모드 - 관리자 */
body:not(.light-mode) .admin-tabs { background: #1f2937; border-bottom-color: #374151; }
body:not(.light-mode) .admin-tab  { color: #9ca3af; }
body:not(.light-mode) .admin-tab.active { color: #60a5fa; border-bottom-color: #60a5fa; }
body:not(.light-mode) .admin-table-wrap { border-color: #374151; }
body:not(.light-mode) .admin-table { background: #1f2937; }
body:not(.light-mode) .admin-table thead tr { background: #111827; }
body:not(.light-mode) .admin-table th { color: #9ca3af; border-bottom-color: #374151; }
body:not(.light-mode) .admin-table td { border-bottom-color: #374151; color: #d1d5db; }
body:not(.light-mode) .admin-table tbody tr:hover { background: #111827; }
body:not(.light-mode) .stat-summary-card.blue   { background: #1e3a5f; border-color: #2563eb; }
body:not(.light-mode) .stat-summary-card.green  { background: #14532d; border-color: #166534; }
body:not(.light-mode) .stat-summary-card.purple { background: #3b0764; border-color: #7c3aed; }
body:not(.light-mode) .stat-summary-card.orange { background: #431407; border-color: #c2410c; }
body:not(.light-mode) .stat-summary-value { color: #f9fafb; }
body:not(.light-mode) .stat-card { background: #1f2937; border-color: #374151; }
body:not(.light-mode) .stat-card-bar { background: #374151; }
body:not(.light-mode) .settings-item { background: #1f2937; border-color: #374151; }
body:not(.light-mode) .settings-label { color: #d1d5db; }
body:not(.light-mode) .settings-key-badge { background: #374151; color: #9ca3af; }
body:not(.light-mode) .tab-section-title { color: #93c5fd; }

/* ══════════════════════════════
   @media print — 화면 전용 요소 숨김
   (checklist/admin/targets 공통)
══════════════════════════════ */
@media print {
  /* 사이드바, 헤더, 액션바 숨김 */
  .sidebar,
  .targets-sidebar,
  .page-header,
  .targets-topbar,
  .action-bar,
  .wf-toolbar,
  .doc-header-card,
  .admin-tabs,
  .tab-toolbar,
  .mob-menu-btn,
  #toastEl,
  .toast-msg {
    display: none !important;
  }

  /* 메인 컨텐츠 여백 초기화 */
  .main-wrap,
  .targets-main {
    margin-left: 0 !important;
    padding: 0 !important;
  }
  .targets-content {
    padding: 0 !important;
  }

  /* 인쇄 전용 버튼 그룹 숨김 */
  .btn-group,
  .header-right,
  .header-left .btn,
  .topbar-actions {
    display: none !important;
  }
}

/* ═══════════════════════════════════════════════════════════
   TARGETS PAGE CSS — 24~27" 모니터 최적화 Pro 디자인
   사이드바(240px) + 메인 콘텐츠 레이아웃
═══════════════════════════════════════════════════════════ */

/* ─── 전체 레이아웃 ─── */
body[data-page="targets"],
body[data-page="my_inspect"],
body[data-page="target_manage"] {
  background: #0f1117;
  min-height: 100vh;
  display: flex;
  flex-direction: column;
}
#appRoot {
  display: flex !important;
  min-height: 100vh;
  background: #0f1117;
}

/* my_inspect / target_manage 레이아웃 래퍼 */
.targets-layout {
  display: flex;
  min-height: 100vh;
  width: 100%;
  background: #0f1117;
}

/* ─── 사이드바 ─── */
.targets-sidebar {
  width: 240px;
  min-width: 240px;
  background: #13151f;
  border-right: 1px solid #1e2130;
  display: flex;
  flex-direction: column;
  position: fixed;
  top: 0; left: 0;
  height: 100vh;
  z-index: 200;
}
.sidebar-brand {
  padding: 22px 20px 18px;
  border-bottom: 1px solid #1e2130;
  display: flex;
  align-items: center;
  gap: 12px;
}
.sidebar-brand-icon {
  width: 38px; height: 38px;
  background: linear-gradient(135deg, #3b82f6, #1d4ed8);
  border-radius: 10px;
  display: flex; align-items: center; justify-content: center;
  font-size: 18px;
  box-shadow: 0 4px 12px rgba(59,130,246,.35);
}
.sidebar-brand-text { flex: 1; min-width: 0; }
.sidebar-brand-name {
  font-size: 14px; font-weight: 700;
  color: #f0f4ff;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.sidebar-brand-sub {
  font-size: 11px; color: #6b7599; margin-top: 2px;
}
.sidebar-nav-section {
  padding: 14px 12px 6px;
}
.sidebar-nav-label {
  font-size: 10px; font-weight: 700;
  color: #556080; text-transform: uppercase;
  letter-spacing: 0.8px;
  padding: 0 8px; margin-bottom: 4px;
}
.sidebar-nav-item {
  display: flex; align-items: center; gap: 10px;
  padding: 10px 12px;
  border-radius: 8px;
  color: #a0aac8;
  cursor: pointer;
  font-size: 13px; font-weight: 500;
  transition: all 0.15s;
  text-decoration: none;
  margin-bottom: 2px;
}
.sidebar-nav-item:hover { background: #1a1d2e; color: #c0c8e8; }
.sidebar-nav-item.active {
  background: rgba(59,130,246,.15);
  color: #60a5fa;
  font-weight: 600;
}
.sidebar-nav-item.active .snav-icon { color: #3b82f6; }
.snav-icon { font-size: 15px; width: 20px; text-align: center; flex-shrink: 0; }
.snav-label { flex: 1; }
.snav-badge {
  background: rgba(59,130,246,.2);
  color: #60a5fa;
  font-size: 10px; font-weight: 700;
  padding: 1px 6px; border-radius: 10px;
}
.sidebar-divider { height: 1px; background: #1e2130; margin: 8px 12px; }
.sidebar-footer {
  margin-top: auto;
  padding: 12px 14px;          /* 좌우 패딩 키워 사이드바 너비 꽉 채움 */
  border-top: 1px solid #1e2130;
}
.sidebar-user-card {
  display: flex; align-items: center; gap: 10px;
  padding: 11px 12px;          /* 패딩 넉넉하게 */
  border-radius: 10px;
  background: #1a1d2e;
  cursor: pointer;
  transition: background 0.15s;
  width: 100%;                 /* 사이드바 너비 꽉 채움 */
  box-sizing: border-box;
}
.sidebar-user-card:hover { background: #1e2235; }
.sidebar-user-avatar {
  width: 32px; height: 32px;
  background: linear-gradient(135deg, #3b82f6, #8b5cf6);
  border-radius: 8px;
  display: flex; align-items: center; justify-content: center;
  font-size: 13px; font-weight: 700; color: #fff;
  flex-shrink: 0;
}
.sidebar-user-info { flex: 1; min-width: 0; }
.sidebar-user-name {
  font-size: 13px; font-weight: 600;
  color: #d0d8f0;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.sidebar-user-role {
  font-size: 11px; color: #6b7599; margin-top: 1px;
}
.sidebar-logout-btn {
  background: none; border: none;
  color: #4b5675; cursor: pointer;
  font-size: 14px; padding: 4px;
  transition: color 0.15s;
  flex-shrink: 0;
}
.sidebar-logout-btn:hover { color: #ef4444; }

/* ─── 메인 콘텐츠 영역 ─── */
.targets-main {
  margin-left: 240px;
  flex: 1;
  display: flex;
  flex-direction: column;
  min-height: 100vh;
  background: #0f1117;
  min-width: 0;
}

/* ─── 상단 탑바 ─── */
.targets-topbar {
  height: 58px;
  background: #13151f;
  border-bottom: 1px solid #1e2130;
  display: flex;
  align-items: center;
  padding: 0 28px;
  gap: 14px;
  position: sticky; top: 0; z-index: 100;
  flex-shrink: 0;
}
.topbar-breadcrumb {
  display: flex; align-items: center; gap: 8px;
  flex: 1;
}
.topbar-bc-icon { font-size: 16px; }
.topbar-bc-title {
  font-size: 15px; font-weight: 700;
  color: #e0e7ff;
}
.topbar-bc-sep { color: #4b5675; font-size: 13px; }
.topbar-actions {
  display: flex; align-items: center; gap: 8px;
}

/* ─── 메인 콘텐츠 패딩 영역 ─── */
.targets-content {
  padding: 16px 18px 40px;
  flex: 1;
}

/* ─── 페이지 타이틀 행 ─── (호환성 유지용)
.page-wrap,
.page-title-row,
.page-title,
.page-title-actions 등은 아래에서 재정의 */
.page-wrap { padding: 0; max-width: none; margin: 0; }
.page-title-bar {
  display: flex; align-items: center; gap: 14px;
  margin-bottom: 22px;
}
.page-title-text {
  font-size: 20px; font-weight: 800;
  color: #e0e7ff;
  flex: 1;
  letter-spacing: -0.3px;
}
.page-title-actions {
  display: flex; gap: 8px; align-items: center;
}

/* ─── 버튼 (targets 전용) ─── */
.btn-sm {
  padding: 7px 12px; font-size: 12px; font-weight: 600;
  border-radius: 7px; cursor: pointer; border: none;
  white-space: nowrap; transition: all .15s; display: inline-flex;
  align-items: center; gap: 5px; line-height: 1;
}
/* 액션 셀 버튼 그룹 */
.action-cell {
  display: flex; gap: 4px; align-items: center; justify-content: center;
  flex-wrap: nowrap;
}
.action-cell .btn-sm {
  padding: 5px 9px; font-size: 12px; gap: 3px;
}
/* 공통 btn 보완 */
body[data-page="targets"] .btn { border-radius: 7px; font-size: 12px; }

/* 점검 시작 — 가장 눈에 띄게 */
.btn-insp {
  background: linear-gradient(135deg, #3b82f6, #2563eb);
  color: #fff; border: none;
  box-shadow: 0 2px 8px rgba(59,130,246,.35);
  font-weight: 700;
}
.btn-insp:hover { background: linear-gradient(135deg, #2563eb, #1d4ed8); box-shadow: 0 4px 14px rgba(59,130,246,.5); transform: translateY(-1px); }

/* 수정 — 중립적 */
.btn-edit {
  background: #1e2235; color: #a0aac8;
  border: 1px solid #2e3350;
}
.btn-edit:hover { background: #252945; color: #c8d0f0; border-color: #4b5690; }

/* 이력 — 주황 강조 */
.btn-hist {
  background: rgba(245,158,11,.12); color: #f59e0b;
  border: 1px solid rgba(245,158,11,.25);
}
.btn-hist:hover { background: rgba(245,158,11,.22); color: #fbbf24; border-color: rgba(245,158,11,.5); }

/* 삭제 — 위험 빨강 */
.btn-del {
  background: rgba(248,113,113,.1); color: #f87171;
  border: 1px solid rgba(248,113,113,.2);
}
.btn-del:hover { background: #ef4444; color: #fff; border-color: #ef4444; }

/* 계획 — 초록 */
.btn-plan {
  background: rgba(52,211,153,.1); color: #34d399;
  border: 1px solid rgba(52,211,153,.2);
}
.btn-plan:hover { background: rgba(52,211,153,.2); color: #6ee7b7; border-color: rgba(52,211,153,.5); }

/* 이력보기 */
.btn-view {
  background: rgba(167,139,250,.1); color: #a78bfa;
  border: 1px solid rgba(167,139,250,.2);
}
.btn-view:hover { background: #8b5cf6; color: #fff; border-color: #8b5cf6; }

/* 계속 */
.btn-resume {
  background: rgba(56,189,248,.1); color: #38bdf8;
  border: 1px solid rgba(56,189,248,.2);
}
.btn-resume:hover { background: #0ea5e9; color: #fff; border-color: #0ea5e9; }

/* ─── 통계 카드 ─── */
.stats-row {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px;
  margin-bottom: 22px;
}
.stat-card {
  background: #13151f;
  border: 1px solid #1e2130;
  border-radius: 14px;
  padding: 20px 22px;
  display: flex; flex-direction: column; gap: 6px;
  position: relative; overflow: hidden;
  transition: border-color 0.2s, transform 0.15s;
}
.stat-card::before {
  content: '';
  position: absolute; top: 0; left: 0; right: 0;
  height: 3px;
  background: #2d3250;
}
.stat-card.done::before  { background: linear-gradient(90deg, #22c55e, #16a34a); }
.stat-card.ongoing::before { background: linear-gradient(90deg, #f59e0b, #d97706); }
.stat-card.none::before  { background: linear-gradient(90deg, #6b7280, #4b5563); }
.stat-card:first-child::before { background: linear-gradient(90deg, #3b82f6, #2563eb); }
.stat-card:hover { border-color: #2a2d45; transform: translateY(-1px); }

.stat-card-label {
  font-size: 15px; font-weight: 700;  /* 12 → 15px */
  color: #a0aac8;                      /* 더 밝게 */
  letter-spacing: 0.2px;
}
.stat-card-value {
  font-size: 36px; font-weight: 800;
  color: #e8eeff;
  line-height: 1;
  font-variant-numeric: tabular-nums;
  letter-spacing: -1px;
}
.stat-card.done    .stat-card-value { color: #4ade80; }
.stat-card.ongoing .stat-card-value { color: #fbbf24; }
.stat-card.none    .stat-card-value { color: #9ca3af; }

.stat-card-bar-wrap {
  height: 5px; background: #1e2235; border-radius: 3px; margin-top: 4px;
}
.stat-card-bar {
  height: 100%; border-radius: 3px;
  transition: width .6s ease;
}
/* 카드별 진행바 색상 */
.stat-bar-done    { background: linear-gradient(90deg, #22c55e, #16a34a); }
.stat-bar-ongoing { background: linear-gradient(90deg, #f59e0b, #d97706); }
.stat-bar-none    { background: linear-gradient(90deg, #6b7280, #4b5563); }
.stat-card:first-child .stat-card-bar { background: linear-gradient(90deg, #3b82f6, #2563eb); }

/* 카드 보조 텍스트 */
.stat-card-sub {
  font-size: 12px; color: #6b7599; margin-top: 3px;
}
.stat-card-pct {
  font-size: 13px; color: #9ba5c4; text-align: right; margin-top: 0px; font-weight: 700;
}
.stat-card-icon {
  position: absolute; right: 20px; top: 50%;
  transform: translateY(-50%);
  font-size: 38px; opacity: 0.40;  /* 0.15 → 0.40 */
}

/* ─── 필터 바 ─── */
.filter-bar {
  background: #13151f;
  border: 1px solid #1e2130;
  border-radius: 12px;
  padding: 14px 20px;
  margin-bottom: 18px;
}
.filter-row {
  display: flex; flex-wrap: wrap; gap: 8px; align-items: center;
  margin-bottom: 8px;
}
.filter-row:last-child { margin-bottom: 0; }
/* 한 줄 전용 — 줄바꿈 없이 가로 정렬 */
.filter-row-single {
  display: flex; flex-wrap: nowrap; gap: 8px; align-items: center;
  margin-bottom: 0;
  overflow-x: auto;
}
.filter-bar-body {
  display: flex; flex-direction: column; gap: 0;
}
.filter-group {
  display: flex; gap: 8px; align-items: center; flex-wrap: wrap;
}
.filter-input {
  padding: 9px 12px;
  min-width: 180px;
  background: #0d0f1a;
  border: 1px solid #30354e;
  border-radius: 8px;
  font-size: 14px;
  color: #d0d8f0;
  outline: none;
  transition: border-color .2s, box-shadow .2s;
  font-family: inherit;
}
.filter-input::placeholder { color: #50587a; }
.filter-input:focus { border-color: #3b82f6; background: #0a0e1e; box-shadow: 0 0 0 3px rgba(59,130,246,.12); }
.filter-kw { min-width: 200px; flex: 1; max-width: 320px; }
.filter-select {
  padding: 8px 10px;
  min-width: 110px;
  max-width: 175px;
  flex-shrink: 0;
  background: #0d0f1a;
  border: 1px solid #30354e;
  border-radius: 8px;
  font-size: 14px;
  color: #d0d8f0;
  outline: none; cursor: pointer;
  transition: border-color .2s, box-shadow .2s;
  font-family: inherit;
}
.filter-select:focus { border-color: #3b82f6; box-shadow: 0 0 0 3px rgba(59,130,246,.12); }
.filter-select option { background: #13151f; color: #c0c8e8; }

/* 필터 행 레이블 */
.filter-row-label {
  font-size: 12px; font-weight: 700; color: #9ba5c4;
  white-space: nowrap; padding: 0 4px 0 0;
  min-width: 46px; flex-shrink: 0;
}
/* 업종 등 긴 셀렉트용 */
.filter-select-wide {
  min-width: 160px; max-width: 240px; flex: 1;
}

/* ── PC 전용 1줄 필터 레이아웃 ── */
/* 업종 select: 세부업종이 길어서 넉넉한 너비 */
.filter-select-biz {
  min-width: 210px;
  max-width: 280px;
  flex-shrink: 0;
}
/* PC에서 filter-row 1줄로 정렬 */
.filter-row-pc-single {
  display: flex;
  flex-wrap: nowrap;
  gap: 8px;
  align-items: center;
  margin-bottom: 0;
}
.filter-row-pc-single .filter-select { flex-shrink: 0; }
.filter-row-pc-single .btn-filter-reset { margin-left: auto; flex-shrink: 0; }

/* 모바일에서는 기존처럼 줄바꿈 허용 */
@media (max-width: 900px) {
  .filter-row-pc-single {
    flex-wrap: wrap;
    gap: 6px;
  }
  .filter-select-biz { min-width: 100%; max-width: 100%; }
}
/* 초기화 버튼 (필터 바 전용) */
.btn-filter-reset {
  margin-left: auto;
  padding: 8px 16px;
  background: transparent;
  border: 1px solid #30354e;
  border-radius: 8px;
  font-size: 13px; color: #9ba5c4;
  cursor: pointer; white-space: nowrap;
  transition: background .15s, color .15s;
  display: flex; align-items: center; gap: 4px;
}
.btn-filter-reset:hover { background: #1e2130; color: #e4ecff; }

.filter-result-row {
  margin-top: 10px; padding-top: 8px;
  border-top: 1px solid #1e2130;
}
.table-count { font-size: 14px; color: #9ba5c4; font-weight: 600; }  /* 13 → 14px */
.filter-badge {
  background: #3b82f6; color: #fff;
  font-size: 10px; font-weight: 700;
  padding: 1px 5px; border-radius: 8px;
  margin-left: 3px;
}
.loading-bar {
  padding: 12px 16px; text-align: center;
  color: #3b82f6; font-size: 14px; font-weight: 600;
}

/* ─── PC 테이블 ─── */
.table-wrap {
  background: #13151f;
  border: 1px solid #1e2130;
  border-radius: 12px;
  overflow: hidden;
}
.table-header {
  display: flex; align-items: center; justify-content: space-between;
  padding: 14px 18px;
  border-bottom: 1px solid #1e2130;
}
.table-scroll { overflow-x: auto; }
.data-table {
  width: 100%; border-collapse: collapse;
  min-width: 900px;
  table-layout: fixed;  /* 컬럼 너비 고정 — col_resize.js와 연동 */
}
.data-table thead th {
  background: #0d0f19;
  padding: 10px 14px;
  text-align: left; font-size: 14px; font-weight: 700;
  color: #e4ecff;
  border-bottom: 2px solid #252840;
  white-space: nowrap;
  letter-spacing: 0.2px;
  position: sticky; top: 0; z-index: 1;
}
.data-table thead th.center { text-align: center; }
.data-table tbody tr {
  border-bottom: 1px solid #1e2235;
  transition: background .12s;
}
.data-table tbody tr:hover { background: #1a1e30; }
.data-table tbody tr:last-child { border-bottom: none; }
.data-table td {
  padding: 9px 14px;
  font-size: 14px; color: #e4ecff;
  font-weight: 700;
  vertical-align: middle;
  line-height: 1.3;
}
.data-table td.center { text-align: center; }
.td-no { color: #8b95b8; font-size: 14px; font-weight: 700; }
.td-license { font-size: 14px; color: #e4ecff; font-family: monospace; letter-spacing: 0.3px; font-weight: 700; }
.td-orgname { line-height: 1.3; }
.org-name { display: block; font-weight: 700; color: #e4ecff; font-size: 14px; }
.td-orgtype { font-size: 14px; color: #e4ecff; font-weight: 700; white-space: nowrap; }
.td-biztype { font-size: 14px; color: #e4ecff; font-weight: 700; white-space: nowrap; }
.td-hist {
  white-space: normal;
  min-width: 120px;
  max-width: 220px;
  line-height: 1.6;
}
.td-actions { white-space: nowrap; }
.td-loc { font-size: 14px; color: #e4ecff; font-weight: 700; white-space: nowrap; }
.td-sigungu { white-space: nowrap; }
.td-addr {
  font-size: 14px; color: #e4ecff; font-weight: 700;
  /* max-width 제거 — 주소가 잘리지 않도록 */
  min-width: 220px;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  line-height: 1.3;
}

/* 비고 셀 */
.td-note-cell {
  font-size: 12px; color: #94a3b8;
  max-width: 100px;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  padding: 0 6px;
}
body.light-mode .td-note-cell { color: #64748b; }

/* 체크박스 셀 */
.td-check-th, .td-check-cell {
  padding: 0 !important;
  text-align: center !important;
  width: 32px !important;
  min-width: 32px !important;
}
.td-check-cell input[type="checkbox"],
.td-check-th input[type="checkbox"] {
  width: 15px; height: 15px;
  cursor: pointer; accent-color: var(--primary, #3b82f6);
}

/* 일괄 액션 바 */
.bulk-action-bar {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 7px 12px;
  background: rgba(59,130,246,.12);
  border: 1px solid rgba(59,130,246,.3);
  border-radius: 8px;
  margin-bottom: 8px;
  animation: fadeIn .15s ease;
}
body.light-mode .bulk-action-bar {
  background: #eff6ff;
  border-color: #bfdbfe;
}
.bulk-count {
  font-size: 13px; font-weight: 700; color: #60a5fa; flex: 1;
}
body.light-mode .bulk-count { color: #2563eb; }
.btn-danger {
  background: #ef4444; color: #fff; border: none;
  border-radius: 6px; padding: 5px 12px;
  font-size: 12px; font-weight: 700; cursor: pointer;
}
.btn-danger:hover { background: #dc2626; }

/* ─── 배지 ─── */
.badge {
  display: inline-block; padding: 2px 8px;
  border-radius: 20px; font-size: 10px; font-weight: 700;
  white-space: nowrap;
}
.badge-org {
  background: rgba(59,130,246,.15); color: #60a5fa;
  border: 1px solid rgba(59,130,246,.2);
  margin-right: 3px;
}
.badge-biz {
  background: rgba(52,211,153,.1); color: #34d399;
  border: 1px solid rgba(52,211,153,.15);
}
.hist-badge-wrap {
  display: flex;
  flex-wrap: wrap;
  gap: 3px;
  align-items: flex-start;
}
.hist-badge {
  display: inline-flex; align-items: center; gap: 3px;
  padding: 3px 8px; border-radius: 12px;
  font-size: 12px; font-weight: 600;
  white-space: nowrap; cursor: pointer; margin: 0;
  transition: all .15s;
}
.hist-badge:hover { opacity: .75; }
/* 완료 = 파랑 */
.hist-done {
  background: rgba(59,130,246,.15); color: #60a5fa;
  border: 1px solid rgba(59,130,246,.3);
}
/* 진행중 = 녹색 */
.hist-ongoing {
  background: rgba(34,197,94,.14); color: #4ade80;
  border: 1px solid rgba(34,197,94,.3);
}

/* ─── 페이지네이션 ─── */
.pagination {
  display: flex; align-items: center; justify-content: center;
  gap: 5px; padding: 16px 0;
}
.page-btn {
  min-width: 32px; height: 32px; padding: 0 10px;
  border: 1px solid #2a2d45; border-radius: 6px;
  background: transparent; color: #6b7280;
  font-size: 12px; font-weight: 600;
  cursor: pointer; transition: all .15s;
  display: flex; align-items: center; justify-content: center;
}
.page-btn:hover:not(:disabled) { border-color: #3b82f6; color: #60a5fa; background: rgba(59,130,246,.08); }
.page-btn.active { background: #3b82f6; color: #fff; border-color: #3b82f6; }
.page-btn:disabled { opacity: .3; cursor: not-allowed; }

/* ─── 빈 상태 ─── */
.empty-state { text-align: center; padding: 60px 20px; color: #4b5675; }
.empty-icon  { font-size: 48px; margin-bottom: 14px; opacity: 0.5; }
.empty-text  { font-size: 15px; font-weight: 600; margin-bottom: 6px; color: #6b7280; }
.empty-sub   { font-size: 13px; color: #3d4460; }

/* ─── 모달 공통 ─── */
.targets-modal-overlay {
  position: fixed; inset: 0; z-index: 5000;
  background: rgba(0,0,0,.65);
  display: none; align-items: center; justify-content: center;
  padding: 16px;
  backdrop-filter: blur(2px);
}
.targets-modal-overlay.on { display: flex; }
.targets-modal-box {
  background: #13151f;
  border: 1px solid #2a2d45;
  border-radius: 16px;
  width: 100%; max-width: 600px;
  max-height: 90vh; overflow: hidden;
  display: flex; flex-direction: column;
  box-shadow: 0 20px 60px rgba(0,0,0,.5);
  animation: slideUpTargets .2s ease;
}
@keyframes slideUpTargets {
  from { transform: translateY(20px); opacity: 0; }
  to   { transform: translateY(0);    opacity: 1; }
}
.targets-modal-hd {
  display: flex; align-items: center; justify-content: space-between;
  padding: 18px 22px 14px;
  border-bottom: 1px solid #1e2130;
}
.targets-modal-title { font-size: 16px; font-weight: 700; color: #e0e7ff; }
.targets-modal-close {
  width: 28px; height: 28px; border: none;
  background: #1e2130; border-radius: 50%;
  font-size: 14px; cursor: pointer; color: #6b7280;
  display: flex; align-items: center; justify-content: center;
  transition: all .15s;
}
.targets-modal-close:hover { background: #ef4444; color: #fff; }
.targets-modal-body {
  padding: 18px 22px; overflow-y: auto;
  flex: 1; -webkit-overflow-scrolling: touch;
}
.targets-modal-ft {
  padding: 14px 22px; border-top: 1px solid #1e2130;
  display: flex; gap: 8px; justify-content: flex-end;
  background: #13151f; flex-shrink: 0;
}

/* 폼 */
.t-form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.t-form-group { display: flex; flex-direction: column; gap: 5px; }
.t-form-group.span2 { grid-column: 1 / 3; }
.t-form-label { font-size: 12px; font-weight: 700; color: #7b85a8; }
.t-form-label .req { color: #f87171; }
.t-form-control {
  padding: 9px 12px;
  background: #0f1117;
  border: 1px solid #2a2d45;
  border-radius: 7px;
  font-size: 13px;
  color: #c0c8e8;
  outline: none; transition: border-color .2s;
  font-family: inherit; width: 100%;
}
.t-form-control:focus { border-color: #3b82f6; background: #0d1020; }
.t-form-control.err   { border-color: #f87171; }
.t-form-control::placeholder { color: #3d4460; }
select.t-form-control { cursor: pointer; background: #0f1117; }
select.t-form-control option { background: #13151f; }
textarea.t-form-control { resize: vertical; min-height: 60px; }

/* 모달 버튼 */
.t-btn-save {
  padding: 9px 22px;
  background: linear-gradient(135deg, #3b82f6, #2563eb);
  color: #fff; border: none; border-radius: 8px;
  font-size: 14px; font-weight: 700; cursor: pointer;
  box-shadow: 0 2px 8px rgba(59,130,246,.35);
  transition: all .15s;
}
.t-btn-save:hover { background: linear-gradient(135deg, #2563eb, #1d4ed8); }
.t-btn-cancel {
  padding: 9px 18px;
  background: #1e2130; color: #7b85a8;
  border: 1px solid #2a2d45; border-radius: 8px;
  font-size: 14px; cursor: pointer; transition: all .15s;
}
.t-btn-cancel:hover { border-color: #4b5675; color: #c0c8e8; }
.t-btn-danger {
  padding: 9px 18px;
  background: #ef4444; color: #fff;
  border: none; border-radius: 8px;
  font-size: 14px; font-weight: 700; cursor: pointer;
  transition: all .15s;
}
.t-btn-danger:hover { background: #dc2626; }

/* 엑셀 업로드 */
.excel-drop-zone {
  border: 2px dashed #2a2d45; border-radius: 10px;
  padding: 36px 20px; text-align: center;
  cursor: pointer; transition: all .2s; background: #0f1117;
  margin-bottom: 14px;
}
.excel-drop-zone:hover, .excel-drop-zone.over {
  border-color: #3b82f6; background: rgba(59,130,246,.05);
}
.excel-drop-icon { font-size: 36px; margin-bottom: 8px; }
.excel-drop-text { font-size: 14px; font-weight: 600; color: #7b85a8; }
.excel-drop-sub  { font-size: 12px; color: #4b5675; margin-top: 4px; }
.excel-preview-wrap { overflow-x: auto; max-height: 240px; overflow-y: auto; }
.excel-preview-table { width: 100%; border-collapse: collapse; font-size: 12px; min-width: 600px; }
.excel-preview-table th, .excel-preview-table td {
  border: 1px solid #2a2d45; padding: 5px 8px; white-space: nowrap; color: #9ba3c0;
}
.excel-preview-table th { background: #0d0f19; font-weight: 700; position: sticky; top: 0; color: #6b7280; }
.excel-preview-count { font-size: 12px; color: #4b5675; margin-bottom: 6px; }
.excel-err { color: #f87171; font-size: 13px; padding: 8px 12px; background: rgba(239,68,68,.1); border-radius: 6px; margin-bottom: 8px; border: 1px solid rgba(239,68,68,.2); }

/* 점검 이력 모달 */
.hist-list { display: flex; flex-direction: column; gap: 10px; }
.hist-item {
  border: 1px solid #2a2d45; border-radius: 8px; padding: 12px 14px;
  background: #0f1117; display: flex; align-items: flex-start; gap: 10px;
  flex-wrap: wrap;
}
.hist-year-chip {
  background: rgba(59,130,246,.2); color: #60a5fa;
  border: 1px solid rgba(59,130,246,.3);
  font-size: 12px; font-weight: 700; padding: 3px 10px;
  border-radius: 6px; white-space: nowrap; flex-shrink: 0;
}
.hist-detail { flex: 1; min-width: 0; }
.hist-detail-row { font-size: 12px; color: #6b7280; display: flex; gap: 8px; flex-wrap: wrap; }
.hist-go-btn {
  padding: 4px 12px;
  background: rgba(59,130,246,.1); color: #60a5fa;
  border: 1px solid rgba(59,130,246,.2);
  border-radius: 6px; font-size: 12px; font-weight: 600;
  cursor: pointer; white-space: nowrap; transition: all .15s; text-decoration: none;
}
.hist-go-btn:hover { background: #3b82f6; color: #fff; }
.hist-del-btn {
  padding: 3px 10px;
  background: rgba(239,68,68,.08); color: #f87171;
  border: 1px solid rgba(239,68,68,.2);
  border-radius: 6px; font-size: 11px; font-weight: 600;
  cursor: pointer; white-space: nowrap; transition: all .15s;
}
.hist-del-btn:hover { background: #ef4444; color: #fff; }

/* 점검 시작 모달 */
.insp-modal-overlay {
  position: fixed; inset: 0; z-index: 5000;
  background: rgba(0,0,0,.65);
  display: none; align-items: center; justify-content: center;
  padding: 16px; backdrop-filter: blur(2px);
}
.insp-modal-overlay.on { display: flex; }
.insp-modal-box {
  background: #13151f;
  border: 1px solid #2a2d45;
  border-radius: 14px;
  width: 100%; max-width: 440px;
  box-shadow: 0 20px 60px rgba(0,0,0,.5);
  animation: slideUpTargets .2s ease; overflow: hidden;
}
.insp-modal-hd {
  padding: 18px 22px 14px;
  border-bottom: 1px solid #1e2130;
  font-size: 16px; font-weight: 700; color: #e0e7ff;
}
.insp-modal-body { padding: 18px 22px; }
.insp-biz-name  { font-size: 15px; font-weight: 700; color: #c0c8e8; margin-bottom: 14px; }
.insp-type-list { display: flex; flex-direction: column; gap: 8px; }
.insp-type-item {
  padding: 13px 16px;
  border: 1px solid #2a2d45;
  border-radius: 10px; cursor: pointer; transition: all .15s;
  display: flex; align-items: center; gap: 12px;
  font-size: 14px; font-weight: 600;
  color: #9ba3c0;
  background: #0f1117;
}
.insp-type-item:hover {
  border-color: #3b82f6;
  background: rgba(59,130,246,.08);
  color: #60a5fa;
  transform: translateX(3px);
}
.insp-type-item .it-icon { font-size: 20px; }
.insp-type-item .it-name { flex: 1; }
.insp-type-item .it-arrow { color: #3d4460; font-size: 12px; }
.insp-modal-ft {
  padding: 14px 22px; border-top: 1px solid #1e2130;
  display: flex; justify-content: flex-end;
}

/* 토스트 */
.t-toast-wrap {
  position: fixed; bottom: 28px; left: 50%; transform: translateX(-50%);
  z-index: 9998; display: flex; flex-direction: column; gap: 8px;
  pointer-events: none; align-items: center;
}
.t-toast {
  background: #1e2130; color: #e0e7ff;
  border: 1px solid #2a2d45;
  padding: 10px 20px; border-radius: 10px;
  font-size: 13px; font-weight: 500;
  box-shadow: 0 8px 24px rgba(0,0,0,.4);
  opacity: 0; transform: translateY(8px);
  transition: all .25s; pointer-events: none;
  max-width: 320px; text-align: center;
}
.t-toast.on  { opacity: 1; transform: translateY(0); }
.t-toast.ok  { background: rgba(34,197,94,.15); border-color: rgba(34,197,94,.3); color: #4ade80; }
.t-toast.err { background: rgba(239,68,68,.15); border-color: rgba(239,68,68,.3); color: #f87171; }

/* 유저 뱃지 */
.user-badge {
  display: flex; align-items: center; gap: 5px;
  background: rgba(255,255,255,.08); color: #c0c8e8;
  padding: 5px 12px; border-radius: 20px;
  font-size: 13px; cursor: pointer; transition: background .15s;
  white-space: nowrap; border: 1px solid rgba(255,255,255,.08);
}
.user-badge:hover { background: rgba(255,255,255,.14); }

/* ─── PC/모바일 전환 ─── */
.pc-only     { display: block; }
.mobile-only { display: none; }

/* ─── 모바일 카드 (레거시 호환) ─── */
.target-card {
  background: #13151f;
  border: 1px solid #1e2130;
  border-radius: 10px;
  padding: 14px 16px; margin-bottom: 10px;
}
.card-header {
  display: flex; align-items: center; gap: 6px;
  margin-bottom: 8px; flex-wrap: wrap;
}
.card-actions { margin-left: auto; display: flex; gap: 5px; }
.card-org-name {
  font-size: 16px; font-weight: 700; color: #d0d8f0;
  margin-bottom: 4px; line-height: 1.3;
}
.card-meta { font-size: 12px; color: #4b5675; margin-bottom: 4px; }
.card-addr { font-size: 12px; color: #6b7280; margin-bottom: 6px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.card-hist { display: flex; flex-wrap: wrap; gap: 4px; }

/* ─── FAB (모바일 플로팅 버튼) ─── */
.mob-fab {
  position: fixed; bottom: 24px; right: 20px; z-index: 400;
  width: 56px; height: 56px; border-radius: 50%;
  background: linear-gradient(135deg, #3b82f6, #2563eb); color: #fff;
  border: none; font-size: 26px; font-weight: 700;
  box-shadow: 0 6px 20px rgba(59,130,246,.55);
  cursor: pointer; display: none;
  align-items: center; justify-content: center;
  transition: transform .15s, box-shadow .15s; touch-action: manipulation;
}
.mob-fab:active { transform: scale(.91); box-shadow: 0 3px 10px rgba(59,130,246,.4); }
.mob-fab-overlay {
  position: fixed; inset: 0; z-index: 390;
  background: rgba(0,0,0,.5); display: none;
}
.mob-fab-overlay.on { display: block; }
.mob-fab-menu {
  position: fixed; bottom: 90px; right: 16px; z-index: 400;
  display: none; flex-direction: column; gap: 10px; align-items: flex-end;
}
.mob-fab-menu.open { display: flex; animation: fabMenuIn .18s ease; }
@keyframes fabMenuIn {
  from { opacity: 0; transform: translateY(10px); }
  to   { opacity: 1; transform: translateY(0); }
}
.mob-fab-item {
  background: #181a28; color: #c0c8e8;
  border: 1px solid #2a2d45; border-radius: 24px;
  padding: 12px 20px; font-size: 14px; font-weight: 600;
  box-shadow: 0 4px 16px rgba(0,0,0,.4);
  cursor: pointer; white-space: nowrap;
  display: flex; align-items: center; gap: 10px;
  touch-action: manipulation;
}
.mob-fab-item:active { background: #1e2130; }

/* ─── 모바일 드로어 오버레이 ─── */
.mob-drawer-overlay {
  display: none; position: fixed; inset: 0; z-index: 499;
  background: rgba(0,0,0,.55); backdrop-filter: blur(2px);
}
.mob-drawer-overlay.on { display: block; }
.mob-drawer-overlay.visible { display: block; }

/* ─── 모바일 햄버거 버튼 ─── */
.mob-hamburger {
  display: none;
  flex-direction: column; justify-content: center; gap: 5px;
  width: 40px; height: 40px; border-radius: 10px;
  background: rgba(255,255,255,.07); border: 1px solid rgba(255,255,255,.1);
  cursor: pointer; padding: 0 10px;
  touch-action: manipulation; flex-shrink: 0;
}
.mob-hamburger span {
  display: block; height: 2px; background: #c0c8e8; border-radius: 2px;
  transition: all .2s;
}
.mob-hamburger:active { background: rgba(255,255,255,.14); }

/* ─── 모바일 탑바 좌/우 영역 ─── */
.topbar-mob-left {
  display: none; align-items: center; gap: 10px; flex-shrink: 0;
}
.topbar-mob-brand {
  display: flex; align-items: center; gap: 6px;
}
.topbar-mob-brand-icon { font-size: 18px; }
.topbar-mob-brand-name {
  font-size: 16px; font-weight: 800; color: #d0d8f0; letter-spacing: -.3px;
}
.topbar-mob-right {
  display: none; align-items: center; gap: 8px; flex-shrink: 0;
}
.mob-topbar-btn {
  width: 38px; height: 38px; border-radius: 10px;
  background: rgba(255,255,255,.07); border: 1px solid rgba(255,255,255,.1);
  font-size: 16px; cursor: pointer; color: #c0c8e8;
  display: flex; align-items: center; justify-content: center;
  touch-action: manipulation; flex-shrink: 0;
}
.mob-topbar-btn.primary {
  background: linear-gradient(135deg, #3b82f6, #2563eb);
  border-color: transparent; color: #fff; font-size: 22px; font-weight: 700;
}
.mob-topbar-btn:active { opacity: .75; }

/* ─── 필터 모바일 헤더 (접기/펼치기) ─── */
.filter-mob-header {
  display: none; align-items: center; justify-content: space-between;
  cursor: pointer; padding: 2px 0 10px; user-select: none;
  touch-action: manipulation;
}
.filter-mob-title {
  font-size: 14px; font-weight: 700; color: #9ba3c0;
  display: flex; align-items: center; gap: 6px;
}
.filter-mob-arrow {
  font-size: 11px; color: #4b5675; transition: transform .2s;
}
.filter-mob-search { display: none; margin-bottom: 8px; }
.filter-bar-body {
  /* PC: 항상 표시 */
}

/* ─── 개선된 모바일 카드 ─── */
.mob-target-card {
  background: #13151f;
  border: 1px solid #1e2130;
  border-left: 4px solid #2a2d45;
  border-radius: 14px;
  margin: 0 0 12px;
  overflow: hidden;
  box-shadow: 0 2px 8px rgba(0,0,0,.25);
  transition: box-shadow .15s;
}
.mob-target-card:active { box-shadow: 0 1px 4px rgba(0,0,0,.2); }
.mob-target-card.card-done    { border-left-color: #22c55e; }
.mob-target-card.card-ongoing { border-left-color: #f59e0b; }
.mob-target-card.card-none    { border-left-color: #374151; }

/* 카드 탑 영역 */
.mob-card-top {
  display: flex; align-items: flex-start; justify-content: space-between;
  padding: 14px 16px 8px; gap: 10px;
}
.mob-card-name-wrap { flex: 1; min-width: 0; }
.mob-card-name {
  font-size: 16px; font-weight: 800; color: #e8eeff;
  line-height: 1.3; margin-bottom: 3px;
  word-break: break-word;
}
.mob-card-biz-type {
  font-size: 12px; color: #5a6385; font-weight: 500;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}

/* 상태 배지 */
.mob-status-badge {
  flex-shrink: 0; padding: 4px 10px; border-radius: 20px;
  font-size: 11px; font-weight: 700; white-space: nowrap;
}
.mob-status-badge.done    { background: rgba(34,197,94,.15); color: #4ade80; border: 1px solid rgba(34,197,94,.25); }
.mob-status-badge.ongoing { background: rgba(251,191,36,.12); color: #fbbf24; border: 1px solid rgba(251,191,36,.2); }
.mob-status-badge.none    { background: rgba(75,85,99,.15);   color: #6b7280; border: 1px solid rgba(75,85,99,.2); }

/* 메타 정보 row */
.mob-card-info-row {
  display: flex; flex-wrap: wrap; gap: 6px;
  padding: 0 16px 8px;
}
.mob-info-chip {
  display: inline-flex; align-items: center; gap: 4px;
  font-size: 12px; color: #7b85a8; font-weight: 500;
  background: rgba(255,255,255,.04); border: 1px solid rgba(255,255,255,.06);
  padding: 3px 8px; border-radius: 12px;
}
.mob-info-icon { font-size: 11px; }

/* 주소 */
.mob-card-addr {
  padding: 0 16px 10px;
  font-size: 12px; color: #4b5675;
  display: flex; align-items: center; gap: 4px;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}

/* 이력 row */
.mob-card-hist-row {
  display: flex; align-items: center; gap: 8px;
  padding: 8px 16px 10px;
  border-top: 1px solid rgba(255,255,255,.05);
  flex-wrap: wrap;
}
.mob-hist-label {
  font-size: 11px; color: #3d4460; font-weight: 700;
  flex-shrink: 0; background: rgba(255,255,255,.04);
  padding: 2px 7px; border-radius: 8px;
}
.mob-hist-chips { display: flex; flex-wrap: wrap; gap: 4px; flex: 1; }
.mob-no-hist { font-size: 11px; color: #3d4460; }

/* 액션 버튼 영역 */
.mob-card-actions {
  display: grid; grid-template-columns: repeat(4, 1fr);
  border-top: 1px solid rgba(255,255,255,.06);
}
.mob-action-btn {
  display: flex; flex-direction: column; align-items: center;
  justify-content: center; gap: 4px;
  padding: 12px 4px; border: none; background: transparent;
  cursor: pointer; touch-action: manipulation;
  border-right: 1px solid rgba(255,255,255,.06);
  transition: background .12s;
}
.mob-action-btn:last-child { border-right: none; }
.mob-action-btn:active { background: rgba(255,255,255,.06); }
.mob-action-icon { font-size: 18px; line-height: 1; }
.mob-action-label { font-size: 10px; font-weight: 700; color: #5a6385; }
.mob-action-btn.primary .mob-action-label { color: #60a5fa; }
.mob-action-btn.plan    .mob-action-label { color: #fbbf24; }
.mob-action-btn.hist    .mob-action-label { color: #a78bfa; }
.mob-action-btn.edit    .mob-action-label { color: #6b7280; }

/* 레거시 mob-btn 호환 */
.mob-btn {
  flex: 1; padding: 12px 6px; border: none; background: transparent;
  font-size: 13px; font-weight: 700; cursor: pointer;
  border-right: 1px solid rgba(255,255,255,.06);
  color: #5a6385; touch-action: manipulation; display: flex;
  align-items: center; justify-content: center; gap: 4px;
}
.mob-btn:last-child { border-right: none; }
.mob-btn:active { background: rgba(255,255,255,.06); }
.mob-btn.primary { color: #60a5fa; }
.mob-btn.plan    { color: #fbbf24; }
.mob-btn.edit    { color: #7b85a8; }
.mob-btn.danger  { color: #f87171; }

/* ─── 반응형 (모바일 768px 이하) ─── */
@media (max-width: 768px) {
  /* 사이드바 → 드로어 모드 */
  .targets-sidebar {
    position: fixed; top: 0; left: 0; height: 100vh;
    transform: translateX(-100%);
    transition: transform .28s cubic-bezier(.4,0,.2,1);
    z-index: 500; width: 280px; min-width: 280px;
    box-shadow: 4px 0 24px rgba(0,0,0,.5);
  }
  .targets-sidebar.mob-open { transform: translateX(0); }

  .targets-main     { margin-left: 0; }
  .targets-topbar   {
    padding: 0 14px;
    height: 56px;
    justify-content: space-between;
    position: sticky; top: 0; z-index: 100;
  }
  .targets-content  { padding: 12px 12px 100px; }

  /* 탑바: 데스크탑 요소 숨기고 모바일 요소 표시 */
  .topbar-breadcrumb { display: none !important; }
  .topbar-actions    { display: none !important; }
  .topbar-mob-left   { display: flex; }
  .topbar-mob-right  { display: flex; }
  .mob-hamburger     { display: flex; }

  /* 통계 카드 2열 그리드 */
  .stats-row {
    grid-template-columns: 1fr 1fr;
    gap: 8px; margin-bottom: 12px;
  }
  .stat-card { padding: 12px 14px; }
  .stat-card-value { font-size: 24px; }
  .stat-card-icon { font-size: 22px; top: 10px; right: 10px; }
  .stat-card-sub { display: none; }

  /* 필터 바 */
  .filter-bar { padding: 12px 14px; }
  .filter-mob-header { display: flex; }
  .filter-mob-search { display: block; }
  .filter-bar-body {
    display: none; /* 모바일 기본: 접혀있음 */
  }
  .filter-bar-body.open { display: flex; flex-direction: column; animation: filterFadeIn .18s ease; }
  @keyframes filterFadeIn {
    from { opacity: 0; transform: translateY(-6px); }
    to   { opacity: 1; transform: translateY(0); }
  }
  .filter-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
    margin-bottom: 8px;
  }
  .filter-row-label { display: none; }
  .filter-input  { min-width: unset; width: 100%; }
  .filter-select { min-width: unset; width: 100%; max-width: 100%; font-size: 14px; }
  .filter-select-wide { max-width: 100%; grid-column: 1 / -1; }
  .btn-filter-reset { margin-left: 0; width: 100%; justify-content: center; grid-column: 1 / -1; }
  /* 모바일에서 검색창은 filter-mob-search에만 표시 */
  .filter-bar-body .filter-kw { display: none; }

  /* PC 테이블 숨기고 모바일 카드 표시 */
  .pc-only     { display: none !important; }
  .mobile-only { display: block !important; }
  #mobileCardList { display: block; }
  .table-scroll.pc-only { display: none !important; }

  .mob-fab { display: flex; }

  .t-form-grid { grid-template-columns: 1fr; }
  .t-form-group.span2 { grid-column: auto; }
}

/* ─── 반응형 (태블릿 769~1024px) ─── */
@media (max-width: 1024px) and (min-width: 769px) {
  .targets-sidebar { width: 210px; min-width: 210px; }
  .targets-main    { margin-left: 210px; }
  .targets-content { padding: 16px 18px; }
  .stats-row       { grid-template-columns: repeat(2, 1fr); gap: 10px; }
  .stat-card-sub   { display: none; }
  .filter-row { flex-wrap: wrap; gap: 8px; }
  .filter-select { min-width: 130px; }
  .filter-select-wide { min-width: 180px; max-width: 240px; }
}

/* ─── 초소형 (375px 이하) ─── */
@media (max-width: 375px) {
  .mob-card-name { font-size: 15px; }
  .mob-card-actions { grid-template-columns: repeat(4, 1fr); }
  .mob-action-label { font-size: 9px; }
  .mob-action-icon  { font-size: 16px; }
  .stats-row { gap: 6px; }
  .stat-card { padding: 10px 12px; }
  .stat-card-value { font-size: 22px; }
}

/* ─── 다크모드 기본 배경 ─── */
body:not(.light-mode)                   { background: #0a0c12; }
body:not(.light-mode) .targets-sidebar  { background: #0a0c12; }
body:not(.light-mode) .targets-topbar   { background: #0d0f19; border-bottom-color: #1a1d2e; }
body:not(.light-mode) .targets-content  { background: #0a0c12; }
body:not(.light-mode) #appRoot          { background: #0a0c12; }
body:not(.light-mode) .targets-layout   { background: #0a0c12; }
body:not(.light-mode) .stat-card        { background: #0d0f19; border-color: #1a1d2e; }
body:not(.light-mode) .filter-bar       { background: #0d0f19; border-color: #1a1d2e; }
body:not(.light-mode) .table-wrap       { background: #0d0f19; border-color: #1a1d2e; }
body:not(.light-mode) .data-table thead th { background: #060810; }
body:not(.light-mode) .data-table tbody tr:hover { background: #101220; }


/* ═══════════════════════════════════════════════════════════
   모달 공통 (modal-overlay / modal-box / form-control) — 다크 테마
   targets.js HTML 클래스에 맞는 스타일
═══════════════════════════════════════════════════════════ */
.modal-overlay {
  position: fixed; inset: 0; z-index: 5000;
  background: rgba(0,0,0,.65);
  display: none; align-items: center; justify-content: center;
  padding: 16px; backdrop-filter: blur(2px);
}
.modal-overlay.on { display: flex; }
.modal-box {
  background: #13151f;
  border: 1px solid #2a2d45;
  border-radius: 16px;
  width: 100%; max-width: 620px;
  max-height: 90vh; overflow: hidden;
  display: flex; flex-direction: column;
  box-shadow: 0 20px 60px rgba(0,0,0,.5);
  animation: modalSlideUp .2s ease;
}
@keyframes modalSlideUp {
  from { transform: translateY(20px); opacity: 0; }
  to   { transform: translateY(0);    opacity: 1; }
}
.modal-hd {
  display: flex; align-items: center; justify-content: space-between;
  padding: 18px 22px 14px;
  border-bottom: 1px solid #1e2130;
  position: sticky; top: 0; background: #13151f; z-index: 1;
  flex-shrink: 0;
}
.modal-title { font-size: 17px; font-weight: 700; color: #f0f4ff; }
.modal-close {
  width: 30px; height: 30px; border: none;
  background: #252840; border-radius: 50%;
  font-size: 14px; cursor: pointer; color: #8890b0;
  display: flex; align-items: center; justify-content: center;
  transition: all .15s;
}
.modal-close:hover { background: #ef4444; color: #fff; }
.modal-body {
  padding: 20px 24px;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  flex: 1 1 auto;
}
.modal-ft {
  padding: 14px 22px;
  border-top: 1px solid #1e2130;
  display: flex; gap: 8px; justify-content: flex-end;
  flex-shrink: 0;
  background: #13151f;
}

/* ─── 폼 (form-grid / form-row / form-control) ─── */
.form-grid {
  display: grid; grid-template-columns: 1fr 1fr; gap: 14px;
}
.form-group {
  display: flex; flex-direction: column; gap: 5px;
}
.form-group-full { grid-column: 1 / -1; }
.form-row {
  display: flex; flex-direction: column; gap: 5px;
}
.form-row.full { grid-column: 1 / -1; }
.form-label {
  font-size: 13px; font-weight: 700; color: #a0aac8;
  display: flex; align-items: center; gap: 3px;
}
.form-label.req::after { content: ' *'; color: #f87171; }
.form-label .req, .req { color: #f87171; }
.form-error { color: #f87171; font-size: 12px; margin-top: 4px; }
.form-control {
  padding: 10px 13px;
  background: #0f1117;
  border: 1px solid #2e3250;
  border-radius: 8px;
  font-size: 14px;
  color: #e4ecff;
  font-weight: 500;
  outline: none; transition: border-color .2s, box-shadow .2s;
  font-family: 'Noto Sans KR', inherit;
  width: 100%;
}
.form-control:focus { border-color: #3b82f6; background: #0d1020; box-shadow: 0 0 0 3px rgba(59,130,246,.15); }
.form-control.err { border-color: #f87171; }
.form-control::placeholder { color: #454d6a; }
select.form-control { cursor: pointer; background: #0f1117; }
select.form-control option { background: #13151f; color: #e4ecff; }
textarea.form-control { resize: vertical; min-height: 65px; }

/* ─── 공통 버튼 ─── */
.btn {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 10px 20px; font-size: 14px; font-weight: 700;
  border-radius: 8px; cursor: pointer; border: none;
  transition: all .15s; white-space: nowrap;
}
.btn-primary {
  background: linear-gradient(135deg, #3b82f6, #2563eb);
  color: #fff;
  box-shadow: 0 2px 10px rgba(59,130,246,.4);
}
.btn-primary:hover { background: linear-gradient(135deg, #2563eb, #1d4ed8); transform: translateY(-1px); }
.btn-outline {
  background: #1e2235; color: #e4ecff;
  border: 1px solid #2e3350;
  font-size: 15px; font-weight: 700;
}
.btn-outline:hover { border-color: #3b82f6; color: #60a5fa; background: rgba(59,130,246,.08); }
.btn-excel {
  background: rgba(34,197,94,.15); color: #4ade80;
  border: 1px solid rgba(34,197,94,.25);
}
.btn-excel:hover { background: rgba(34,197,94,.25); }
.btn-danger {
  background: rgba(239,68,68,.15); color: #f87171;
  border: 1px solid rgba(239,68,68,.25);
}
.btn-danger:hover { background: #ef4444; color: #fff; }

/* ─── 모달 버튼 (공통) ─── */
.btn-start {
  padding: 10px 20px;
  background: linear-gradient(135deg, #3b82f6, #2563eb);
  color: #fff; border: none; border-radius: 8px;
  font-size: 14px; font-weight: 700; cursor: pointer;
  transition: all .15s;
  box-shadow: 0 2px 8px rgba(59,130,246,.35);
}
.btn-start:hover { background: linear-gradient(135deg, #2563eb, #1d4ed8); }

/* ─── 점검이력 테이블 ─── */
.hist-table {
  width: 100%; border-collapse: collapse; font-size: 13px;
}
.hist-table th, .hist-table td {
  border: 1px solid #1e2130; padding: 8px 10px; text-align: left;
  color: #9ba3c0;
}
.hist-table th { background: #0d0f19; font-weight: 700; color: #6b7280; }
.hist-table tbody tr:hover { background: #171a28; }
.status-badge {
  display: inline-block; padding: 2px 8px;
  border-radius: 12px; font-size: 11px; font-weight: 700;
}
.status-badge.done    { background: rgba(34,197,94,.12); color: #4ade80; }
.status-badge.ongoing { background: rgba(251,191,36,.1); color: #fbbf24; }

/* ─── 토스트 ─── */
.toast {
  position: fixed;
  bottom: 28px; left: 50%; transform: translateX(-50%) translateY(12px);
  background: #1e2130; color: #e0e7ff;
  border: 1px solid #2a2d45;
  padding: 10px 22px; border-radius: 10px;
  font-size: 13px; font-weight: 500;
  box-shadow: 0 8px 24px rgba(0,0,0,.4);
  opacity: 0; transition: all .3s;
  pointer-events: none; z-index: 9999;
  white-space: nowrap; max-width: 90vw;
}
.toast-msg {
  position: fixed;
  bottom: 28px; left: 50%; transform: translateX(-50%) translateY(12px);
  background: #1e2130; color: #e0e7ff;
  border: 1px solid #2a2d45;
  padding: 10px 22px; border-radius: 10px;
  font-size: 13px; font-weight: 500;
  box-shadow: 0 8px 24px rgba(0,0,0,.4);
  opacity: 0; transition: all .3s;
  pointer-events: none; z-index: 9999;
  white-space: nowrap; max-width: 90vw;
}
.toast.show, .toast-msg.show { opacity: 1; transform: translateX(-50%) translateY(0); }
.toast.err  { background: rgba(239,68,68,.15); border-color: rgba(239,68,68,.3); color: #f87171; }
.toast.info { background: rgba(59,130,246,.15); border-color: rgba(59,130,246,.3); color: #60a5fa; }
.toast.ok   { background: rgba(34,197,94,.15); border-color: rgba(34,197,94,.3); color: #4ade80; }

/* ─── 점검 시작 모달 특수 요소 ─── */
.insp-target-name {
  font-size: 15px; font-weight: 700; color: #60a5fa;
  padding: 10px 14px;
  background: rgba(59,130,246,.08);
  border: 1px solid rgba(59,130,246,.15);
  border-radius: 8px; margin-bottom: 16px;
}
.insp-target-info {
  background: rgba(59,130,246,.08);
  border: 1px solid rgba(59,130,246,.15);
  border-radius: 8px;
  padding: 10px 14px; font-size: 13px; color: #60a5fa;
}

/* ─── pc-only / mobile-only (중복 안전장치) ─── */
@media (min-width: 769px) {
  .mobile-only { display: none !important; }
  #mobileCardList { display: none !important; }
  .mob-fab, .mob-fab-menu, .mob-fab-overlay { display: none !important; }
  .mob-drawer-overlay, .mob-hamburger { display: none !important; }
  .topbar-mob-left, .topbar-mob-right { display: none !important; }
}

/* ─── 모바일 카드 (레거시 호환 클래스) ─── */
.mob-card {
  background: #13151f;
  border: 1px solid #1e2130;
  border-radius: 10px;
  margin: 0 0 10px; padding: 14px 16px;
  border-left: 3px solid #2a2d45;
}
.mob-card.card-done    { border-left-color: #22c55e; }
.mob-card.card-ongoing { border-left-color: #f59e0b; }
.mob-card.card-none    { border-left-color: #374151; }
.mob-card-row   { display: flex; align-items: center; gap: 8px; margin-bottom: 6px; }
.mob-card-title { font-size: 15px; font-weight: 700; flex: 1; color: #d0d8f0; }
.mob-card-info  { font-size: 12px; color: #4b5675; margin-bottom: 4px; }
.mob-card-btn {
  padding: 10px 5px; border: none; background: transparent;
  font-size: 12px; font-weight: 600; cursor: pointer;
  display: flex; flex-direction: column; align-items: center; gap: 3px;
  border-right: 1px solid #1e2130; color: #4b5675; transition: background .12s;
}
.mob-card-btn:last-child { border-right: none; }
.mob-card-btn:active { background: #1a1d2e; }
.mob-card-btn.primary { color: #60a5fa; }
.mob-card-btn.danger  { color: #f87171; }
.mob-card-btn.plan    { color: #fbbf24; }
.mob-card-btn .mcb-icon  { font-size: 15px; }
.mob-card-btn .mcb-label { font-size: 10px; }

/* 업종/이력 배지 추가 */
.biz-badge {
  display: inline-block; padding: 2px 8px;
  border-radius: 20px; font-size: 10px; font-weight: 600;
  background: rgba(59,130,246,.12); color: #60a5fa;
  border: 1px solid rgba(59,130,246,.2);
  white-space: nowrap; max-width: 180px;
  overflow: hidden; text-overflow: ellipsis; vertical-align: middle;
}
.hist-badge-plan {
  display: inline-block; padding: 2px 8px;
  background: rgba(251,191,36,.1); color: #fbbf24;
  border: 1px solid rgba(251,191,36,.2); border-radius: 12px;
  font-size: 10px; font-weight: 700; cursor: pointer;
  white-space: nowrap; transition: all .15s; margin: 2px;
}
.hist-badge-plan:hover { background: rgba(251,191,36,.2); }
/* 예약 = 노란색 */
.hist-plan  { background: rgba(251,191,36,.14); color: #fbbf24; border: 1px solid rgba(251,191,36,.3); }
.hist-cancel{ background: rgba(107,114,128,.12); color: #6b7280; border: 1px solid rgba(107,114,128,.25); }
.hist-none  { background: rgba(75,86,117,.12); color: #6b7280; border: 1px dashed #2a2d45; }
.hist-ng    { background: rgba(239,68,68,.08); color: #f87171; border: 1px solid rgba(239,68,68,.2); }
.hist-manual{ background: rgba(168,85,247,.14); color: #c084fc; border: 1px solid rgba(168,85,247,.3); cursor: pointer; }
.hist-year-list { display: flex; flex-wrap: wrap; gap: 4px; }

/* 액션 셀 */
.action-cell { display: flex; gap: 4px; align-items: center; justify-content: center; flex-wrap: wrap; }
.btn-inspect {
  padding: 5px 11px;
  background: linear-gradient(135deg, #3b82f6, #2563eb);
  color: #fff; border: none; border-radius: 6px;
  font-size: 12px; font-weight: 700;
  cursor: pointer; transition: all .15s; white-space: nowrap;
  box-shadow: 0 2px 6px rgba(59,130,246,.35);
}
.btn-inspect:hover { box-shadow: 0 3px 10px rgba(59,130,246,.5); }
.btn-plan-sm {
  padding: 4px 9px;
  background: rgba(251,191,36,.1); color: #fbbf24;
  border: 1px solid rgba(251,191,36,.2); border-radius: 6px;
  font-size: 11px; cursor: pointer; transition: all .15s; white-space: nowrap;
}
.btn-plan-sm:hover { background: rgba(251,191,36,.2); }
.btn-checklist-sm {
  padding: 4px 9px;
  background: rgba(139,92,246,.1); color: #a78bfa;
  border: 1px solid rgba(139,92,246,.2); border-radius: 6px;
  font-size: 11px; font-weight: 600; cursor: pointer; white-space: nowrap;
  transition: all .15s;
}
.btn-checklist-sm:hover { background: #8b5cf6; color: #fff; }

/* 점검이력 항목 (모달 내) */
.hist-status-chip {
  padding: 2px 8px; border-radius: 12px; font-size: 11px; font-weight: 700;
  white-space: nowrap; flex-shrink: 0;
}
.hist-status-chip.done     { background: rgba(34,197,94,.12); color: #4ade80; }
.hist-status-chip.ongoing  { background: rgba(251,191,36,.1); color: #fbbf24; }
.hist-status-chip.draft    { background: rgba(75,86,117,.15); color: #4b5675; }

/* 반응형 모달 — 바텀 시트 */
@media (max-width: 640px) {
  .modal-overlay {
    padding: 0; align-items: flex-end;
    background: rgba(0,0,0,.7);
  }
  .modal-box {
    border-radius: 20px 20px 0 0;
    max-height: 90vh;
    max-width: 100%;
    animation: sheetSlideUp .25s cubic-bezier(.4,0,.2,1);
  }
  @keyframes sheetSlideUp {
    from { transform: translateY(100%); }
    to   { transform: translateY(0); }
  }
  /* 모달 상단 핸들 */
  .modal-hd::before {
    content: '';
    position: absolute; top: 8px; left: 50%; transform: translateX(-50%);
    width: 36px; height: 4px; border-radius: 2px;
    background: rgba(255,255,255,.15);
  }
  .modal-hd { position: relative; padding-top: 22px; }
  .form-grid { grid-template-columns: 1fr; }
  .form-row.full { grid-column: 1; }
  .modal-ft { padding: 12px 16px 24px; }
  .modal-body { padding: 16px; }
  /* 버튼 전체 너비 */
  .modal-ft .btn { flex: 1; justify-content: center; padding: 13px; font-size: 15px; }
}

/* ═══════════════════════════════════════════════════════════
   테마 토글 버튼
═══════════════════════════════════════════════════════════ */
.btn-theme-toggle {
  background: rgba(255,255,255,.08);
  color: #c0c8e8;
  border: 1px solid rgba(255,255,255,.12);
  font-size: 16px;
  padding: 5px 10px;
  border-radius: 8px;
  cursor: pointer;
  transition: all .2s;
  line-height: 1;
}
.btn-theme-toggle:hover {
  background: rgba(255,255,255,.16);
  border-color: rgba(255,255,255,.25);
  transform: scale(1.08);
}
body.light-mode .btn-theme-toggle {
  background: rgba(0,0,0,.06);
  color: #374151;
  border-color: #d1d5db;
}
body.light-mode .btn-theme-toggle:hover {
  background: rgba(0,0,0,.1);
}

/* ═══════════════════════════════════════════════════════════
   가독성 개선 — 기본(다크) 폰트 크기·행간 강화
═══════════════════════════════════════════════════════════ */

/* 탑바 타이틀 */
.topbar-bc-title {
  font-size: 16px;
  font-weight: 700;
  color: #e0e7ff;
}

/* 통계 카드 라벨 */
.stat-card-label {
  font-size: 12px;
  font-weight: 600;
  color: #6b7694;
  text-transform: uppercase;
  letter-spacing: 0.4px;
}

/* 통계 카드 숫자 */
.stat-card-value {
  font-size: 36px;
  font-weight: 800;
  line-height: 1.1;
}

/* 필터 인풋 */
.filter-input,
.filter-select {
  font-size: 14px;
  padding: 8px 10px;
  line-height: 1.4;
}

/* 테이블 헤더 */
.data-table thead th {
  font-size: 14px;
  font-weight: 700;
  padding: 10px 14px;
  letter-spacing: 0.2px;
  color: #e4ecff;
}

/* 테이블 바디 셀 */
.data-table td {
  font-size: 14px;
  color: #e4ecff;
  font-weight: 700;
  padding: 13px 16px;
  line-height: 1.45;
  vertical-align: middle;
}

/* 사업장명 강조 */
.data-table td strong {
  font-size: 14px;
  font-weight: 700;
  color: #d8e0f8;
}

/* 주소 셀 */
.data-table td[style*="font-size:12px"] {
  font-size: 13px !important;
  color: #8090b0 !important;
}

/* 이력 배지 */
.hist-badge {
  font-size: 12px;
  padding: 3px 8px;
  border-radius: 12px;
}

/* 테이블 count */
.table-count {
  font-size: 13px;
  color: #6b7694;
  font-weight: 600;
}

/* 모달 타이틀 */
.modal-title {
  font-size: 17px;
  font-weight: 700;
}

/* 폼 라벨 */
.form-label {
  font-size: 13px;
  font-weight: 700;
  color: #8090b0;
}

/* 폼 컨트롤 */
.form-control {
  font-size: 14px;
  padding: 10px 13px;
  line-height: 1.4;
}

/* 사이드바 nav */
.sidebar-nav-item {
  font-size: 14px;
  padding: 10px 12px;
}
.sidebar-brand-name { font-size: 15px; }

/* 버튼 기본 크기 강화 */
.btn {
  font-size: 13px;
  padding: 8px 16px;
}
.btn-sm {
  font-size: 12px;
  padding: 7px 14px;
}

/* 점검이력 모달 */
.hist-item {
  font-size: 14px;
  padding: 14px 16px;
}
.hist-year-chip { font-size: 13px; }
.hist-meta span { font-size: 13px; }

/* ═══════════════════════════════════════════════════════════
   LIGHT MODE — body.light-mode
   다크 배경 → 밝고 깨끗한 라이트 테마 전환
═══════════════════════════════════════════════════════════ */
body.light-mode,
body.light-mode[data-page="targets"],
body.light-mode[data-page="my_inspect"],
body.light-mode[data-page="target_manage"] {
  background: #f0f4fa !important;
  color: #1a1d24 !important;
}

/* 앱 루트 */
body.light-mode #appRoot,
body.light-mode .targets-layout {
  background: #f0f4fa !important;
}

/* ── 사이드바 ── */
body.light-mode .targets-sidebar {
  background: #ffffff;
  border-right: 1px solid #e2e8f0;
  box-shadow: 2px 0 12px rgba(0,0,0,.06);
}
body.light-mode .sidebar-brand {
  border-bottom-color: #e2e8f0;
}
body.light-mode .sidebar-brand-name {
  color: #1a2340;
}
body.light-mode .sidebar-brand-sub {
  color: #94a3b8;
}
body.light-mode .sidebar-nav-label {
  color: #94a3b8;
}
body.light-mode .sidebar-nav-item {
  color: #4b6080;
}
body.light-mode .sidebar-nav-item:hover {
  background: #f1f5fb;
  color: #1a4f7a;
}
body.light-mode .sidebar-nav-item.active {
  background: rgba(59,130,246,.1);
  color: #1d4ed8;
}
body.light-mode .sidebar-divider {
  background: #e2e8f0;
}
body.light-mode .sidebar-footer {
  border-top-color: #e2e8f0;
}
body.light-mode .sidebar-user-card {
  background: #f1f5fb;
}
body.light-mode .sidebar-user-card:hover {
  background: #e8eef7;
}
body.light-mode .sidebar-user-name { color: #1a2340; }
body.light-mode .sidebar-user-role { color: #6b7280; }
body.light-mode .sidebar-logout-btn { color: #94a3b8; }
body.light-mode .sidebar-logout-btn:hover { color: #ef4444; }

/* ── 메인 영역 ── */
body.light-mode .targets-main {
  background: #f0f4fa;
}

/* ── 탑바 ── */
body.light-mode .targets-topbar {
  background: #ffffff;
  border-bottom: 1px solid #e2e8f0;
  box-shadow: 0 1px 6px rgba(0,0,0,.05);
}
body.light-mode .topbar-bc-title {
  color: #1a2340;
}
body.light-mode .topbar-bc-icon { color: #4b6080; }
body.light-mode .topbar-bc-sep  { color: #d1d5db; }
body.light-mode #topbarYearLabel { color: #6b7280 !important; }

/* ── 통계 카드 ── */
body.light-mode .stat-card {
  background: #ffffff;
  border: 1px solid #e2e8f0;
  box-shadow: 0 2px 8px rgba(0,0,0,.05);
}
body.light-mode .stat-card::before {
  background: #e2e8f0;
}
body.light-mode .stat-card.done::before   { background: linear-gradient(90deg, #22c55e, #16a34a); }
body.light-mode .stat-card.ongoing::before{ background: linear-gradient(90deg, #f59e0b, #d97706); }
body.light-mode .stat-card.none::before   { background: linear-gradient(90deg, #94a3b8, #64748b); }
body.light-mode .stat-card:first-child::before { background: linear-gradient(90deg, #3b82f6, #2563eb); }
body.light-mode .stat-card:hover { border-color: #cbd5e1; box-shadow: 0 4px 16px rgba(0,0,0,.08); }
body.light-mode .stat-card-label {
  color: #64748b;
}
body.light-mode .stat-card-value {
  color: #1e293b;
}
body.light-mode .stat-card.done    .stat-card-value { color: #16a34a; }
body.light-mode .stat-card.ongoing .stat-card-value { color: #d97706; }
body.light-mode .stat-card.none    .stat-card-value { color: #64748b; }
body.light-mode .stat-card-bar-wrap { background: #e2e8f0; }
body.light-mode .stat-card-pct { color: #94a3b8; }
body.light-mode .stat-card-icon { opacity: 0.30; }

/* ── 필터 바 ── */
body.light-mode .filter-bar {
  background: #ffffff;
  border: 1px solid #e2e8f0;
  box-shadow: 0 2px 8px rgba(0,0,0,.04);
}
body.light-mode .filter-input {
  background: #f8fafc;
  border-color: #d1d5db;
  color: #1e293b;
}
body.light-mode .filter-input::placeholder { color: #9ca3af; }
body.light-mode .filter-input:focus {
  background: #fff;
  border-color: #3b82f6;
}
body.light-mode .filter-select {
  background: #f8fafc;
  border-color: #d1d5db;
  color: #1e293b;
}
body.light-mode .filter-select:focus { border-color: #3b82f6; }
body.light-mode .filter-select option {
  background: #fff;
  color: #1e293b;
}
body.light-mode .filter-result-row { border-top-color: #e2e8f0; }
body.light-mode .filter-row-label { color: #6b7280; }
body.light-mode .btn-filter-reset {
  border-color: #d1d5db; color: #6b7280;
}
body.light-mode .btn-filter-reset:hover { background: #f3f4f6; color: #111827; }

/* ── 테이블 영역 ── */
body.light-mode .table-wrap {
  background: #ffffff;
  border: 1px solid #e2e8f0;
  box-shadow: 0 2px 8px rgba(0,0,0,.04);
}
body.light-mode .table-header {
  border-bottom-color: #e2e8f0;
  background: #fafbfd;
}
body.light-mode .table-count { color: #6b7280; }
body.light-mode .data-table thead th {
  background: #f8fafc;
  color: #1a2340; font-weight: 700;
  border-bottom-color: #e2e8f0;
}
body.light-mode .data-table tbody tr {
  border-bottom-color: #f1f5f9;
}
body.light-mode .data-table tbody tr:hover { background: #f8fafc; }
body.light-mode .data-table td {
  color: #1a2340; font-weight: 700;
}
body.light-mode .data-table td strong { color: #1a2340; }
body.light-mode .td-no { color: #6b7280; }
body.light-mode .td-license { color: #1a2340; }
body.light-mode .td-loc { color: #1a2340; }
body.light-mode .td-orgtype { color: #1a2340; }
body.light-mode .td-biztype { color: #1a2340; }
body.light-mode .td-addr { color: #1a2340; }
body.light-mode .org-name { color: #1a2340; }

/* ── 배지 ── */
body.light-mode .hist-done {
  background: rgba(37,99,235,.1);
  color: #1d4ed8;
  border-color: rgba(37,99,235,.25);
}
body.light-mode .hist-ongoing {
  background: rgba(22,163,74,.1);
  color: #166534;
  border-color: rgba(22,163,74,.25);
}
body.light-mode .hist-plan {
  background: rgba(217,119,6,.1);
  color: #92400e;
  border-color: rgba(217,119,6,.25);
}
body.light-mode .hist-none {
  background: rgba(100,116,139,.08);
  color: #64748b;
  border-color: #d1d5db;
}
body.light-mode .hist-manual {
  background: rgba(168,85,247,.1);
  color: #7c3aed;
  border-color: rgba(168,85,247,.3);
}

/* ── 버튼 ── */
body.light-mode .btn-primary {
  background: linear-gradient(135deg, #3b82f6, #2563eb);
  color: #fff;
}
body.light-mode .btn-outline {
  background: #ffffff;
  color: #374151;
  border-color: #d1d5db;
}
body.light-mode .btn-outline:hover {
  background: #f1f5f9;
  border-color: #94a3b8;
}
body.light-mode .btn-excel {
  background: rgba(22,163,74,.1);
  color: #166534;
  border-color: rgba(22,163,74,.2);
}
body.light-mode .btn-excel:hover { background: rgba(22,163,74,.18); }
body.light-mode .btn-insp {
  background: linear-gradient(135deg, #3b82f6, #2563eb);
  color: #fff;
  box-shadow: 0 2px 6px rgba(59,130,246,.3);
}
body.light-mode .btn-edit {
  background: #f1f5f9;
  color: #4b6080;
  border-color: #d1d5db;
}
body.light-mode .btn-edit:hover { background: #e2e8f0; color: #1a4f7a; border-color: #3b82f6; }
body.light-mode .btn-hist {
  background: #fffbeb;
  color: #92400e;
  border-color: #fcd34d;
}
body.light-mode .btn-hist:hover { background: #fef3c7; }
body.light-mode .btn-del {
  background: #fef2f2;
  color: #dc2626;
  border-color: #fca5a5;
}
body.light-mode .btn-del:hover { background: #ef4444; color: #fff; }
body.light-mode .btn-plan {
  background: #f0fdf4;
  color: #166534;
  border-color: #bbf7d0;
}
body.light-mode .btn-plan:hover { background: #dcfce7; }
body.light-mode .btn-danger {
  background: rgba(239,68,68,.08);
  color: #dc2626;
  border-color: rgba(239,68,68,.2);
}
body.light-mode .btn-danger:hover { background: #ef4444; color: #fff; }

/* ── 페이지네이션 ── */
body.light-mode .pg-btn,
body.light-mode .page-btn {
  background: #fff;
  border-color: #d1d5db;
  color: #374151;
}
body.light-mode .pg-btn:hover:not(:disabled),
body.light-mode .page-btn:hover:not(:disabled) {
  border-color: #3b82f6;
  color: #2563eb;
  background: #eff6ff;
}
body.light-mode .pg-btn.active,
body.light-mode .page-btn.active {
  background: #3b82f6;
  color: #fff;
  border-color: #3b82f6;
}
body.light-mode .pg-ellipsis { color: #94a3b8; }

/* ── 빈 상태 ── */
body.light-mode .empty-state { color: #64748b; }
body.light-mode .empty-text  { color: #374151; }
body.light-mode .empty-sub   { color: #94a3b8; }

/* ── 모달 ── */
body.light-mode .modal-overlay { background: rgba(0,0,0,.4); }
body.light-mode .modal-box {
  background: #ffffff;
  border-color: #e2e8f0;
  box-shadow: 0 20px 60px rgba(0,0,0,.12);
}
body.light-mode .modal-hd {
  background: #ffffff;
  border-bottom-color: #e2e8f0;
}
body.light-mode .modal-title { color: #1a2340; }
body.light-mode .modal-close {
  background: #f1f5f9;
  color: #6b7280;
}
body.light-mode .modal-close:hover { background: #ef4444; color: #fff; }
body.light-mode .modal-body { color: #374151; }
body.light-mode .modal-ft {
  background: #fafbfd;
  border-top-color: #e2e8f0;
}

/* ── 폼 ── */
body.light-mode .form-label { color: #374151; }
body.light-mode .form-control {
  background: #f8fafc;
  border-color: #d1d5db;
  color: #1e293b;
}
body.light-mode .form-control:focus {
  background: #fff;
  border-color: #3b82f6;
}
body.light-mode .form-control::placeholder { color: #9ca3af; }
body.light-mode select.form-control { background: #f8fafc; }
body.light-mode select.form-control option { background: #fff; color: #1e293b; }
body.light-mode .form-error { color: #dc2626; }

/* ── 점검 이력 모달 내부 ── */
body.light-mode .hist-item {
  background: #f8fafc;
  border-color: #e2e8f0;
}
body.light-mode .hist-year-chip {
  background: rgba(59,130,246,.1);
  color: #1d4ed8;
  border-color: rgba(59,130,246,.2);
}
body.light-mode .hist-status-chip.done    { background: #d1fae5; color: #065f46; }
body.light-mode .hist-status-chip.ongoing { background: #fef3c7; color: #92400e; }
body.light-mode .hist-go-btn {
  background: rgba(59,130,246,.08);
  color: #2563eb;
  border-color: rgba(59,130,246,.2);
}
body.light-mode .hist-go-btn:hover { background: #3b82f6; color: #fff; }
body.light-mode .hist-del-btn {
  background: rgba(239,68,68,.06);
  color: #dc2626;
  border-color: rgba(239,68,68,.2);
}
body.light-mode .hist-del-btn:hover { background: #ef4444; color: #fff; }
body.light-mode #histList { color: #374151; }
body.light-mode .hist-meta span { color: #4b6080; }
body.light-mode .wf-step { color: #6b7280; font-size: 12px; }
body.light-mode .wf-step.done { color: #166534; }

/* ── 엑셀 드롭존 ── */
body.light-mode .excel-drop-zone {
  background: #f8fafc;
  border-color: #d1d5db;
  color: #4b6080;
}
body.light-mode .excel-drop-zone:hover {
  border-color: #3b82f6;
  background: #eff6ff;
}
body.light-mode .excel-preview-table th {
  background: #f1f5f9;
  color: #374151;
  border-color: #e2e8f0;
}
body.light-mode .excel-preview-table td {
  border-color: #e2e8f0;
  color: #374151;
}

/* ── 토스트 ── */
body.light-mode .toast-msg,
body.light-mode .toast {
  background: #1e293b;
  color: #f1f5f9;
  border-color: #334155;
}
body.light-mode .toast.ok,  body.light-mode .toast-msg.ok  {
  background: rgba(22,163,74,.12); color: #166534; border-color: rgba(22,163,74,.25);
}
body.light-mode .toast.err, body.light-mode .toast-msg.err {
  background: rgba(239,68,68,.1); color: #dc2626; border-color: rgba(239,68,68,.25);
}

/* ── FAB (모바일) ── */
body.light-mode .mob-fab-item {
  background: #fff;
  color: #374151;
  border-color: #e2e8f0;
  box-shadow: 0 2px 12px rgba(0,0,0,.1);
}
body.light-mode .mob-fab-item:active { background: #f1f5f9; }

/* ── 모바일 드로어/햄버거 ── */
body.light-mode .mob-hamburger {
  background: rgba(0,0,0,.06); border-color: #d1d5db;
}
body.light-mode .mob-hamburger span { background: #374151; }
body.light-mode .mob-topbar-btn {
  background: rgba(0,0,0,.05); border-color: #d1d5db; color: #374151;
}
body.light-mode .mob-topbar-btn.primary {
  background: linear-gradient(135deg, #3b82f6, #2563eb);
  border-color: transparent; color: #fff;
}
body.light-mode .topbar-mob-brand-name { color: #1a2340; }

/* ── 모바일 필터 헤더 ── */
body.light-mode .filter-mob-title { color: #374151; }
body.light-mode .filter-mob-arrow { color: #9ca3af; }

/* ── 개선된 모바일 카드 ── */
body.light-mode .mob-target-card,
body.light-mode .mob-card {
  background: #ffffff;
  border-color: #e2e8f0;
  box-shadow: 0 1px 4px rgba(0,0,0,.08);
}
body.light-mode .mob-card-name     { color: #1a2340; }
body.light-mode .mob-card-biz-type { color: #64748b; }
body.light-mode .mob-info-chip     { background: rgba(0,0,0,.04); border-color: #e2e8f0; color: #64748b; }
body.light-mode .mob-card-addr     { color: #94a3b8; }
body.light-mode .mob-card-hist-row { border-top-color: #f1f5f9; }
body.light-mode .mob-hist-label    { background: rgba(0,0,0,.04); color: #9ca3af; }
body.light-mode .mob-no-hist       { color: #9ca3af; }
body.light-mode .mob-card-actions  { border-top-color: #e2e8f0; }
body.light-mode .mob-action-btn    { border-right-color: #e2e8f0; }
body.light-mode .mob-action-btn:active { background: #f8fafc; }
body.light-mode .mob-action-label  { color: #64748b; }
body.light-mode .mob-action-btn.primary .mob-action-label { color: #2563eb; }
body.light-mode .mob-action-btn.plan    .mob-action-label { color: #d97706; }
body.light-mode .mob-action-btn.hist    .mob-action-label { color: #7c3aed; }
body.light-mode .mob-action-btn.edit    .mob-action-label { color: #475569; }
/* 레거시 mob-btn */
body.light-mode .mob-btn         { border-right-color: #e2e8f0; color: #64748b; }
body.light-mode .mob-btn:active  { background: #f1f5f9; }
body.light-mode .mob-btn.primary { color: #2563eb; }
body.light-mode .mob-btn.plan    { color: #d97706; }
body.light-mode .mob-btn.edit    { color: #4b6080; }
body.light-mode .mob-btn.danger  { color: #dc2626; }
body.light-mode .mob-card-badges .hist-badge { /* 배지 이미 위에서 처리 */ }

/* ── 확인 모달 ── */
body.light-mode #confirmMsg { color: #374151; }

/* ── insp-target-info (점검 시작 모달) ── */
body.light-mode .insp-target-info {
  background: rgba(59,130,246,.06);
  border-color: rgba(59,130,246,.15);
  color: #1d4ed8;
}

/* ── startInspTplInfo ── */
body.light-mode #startInspTplInfo {
  background: #eff6ff;
  border: 1px solid #bfdbfe;
  color: #1d4ed8;
}

/* ── planExistingWrap 헤더 ── */
body.light-mode #planExistingWrap > div:first-child {
  color: #92400e;
}

/* ── 로딩바 ── */
body.light-mode #loadingBar { color: #3b82f6; }

/* ── 점검 계획 모달 배경 ── */
body.light-mode .modal-body [style*="background:#fffbeb"] {
  background: #fffbeb !important;
  border-color: #fcd34d !important;
}

/* ── 페이지네이션 ── */
body.light-mode .pagination .pg-ellipsis { color: #94a3b8; }

/* ═══════════════════════════════════════════════════
   서명(Signature) 섹션 스타일
═══════════════════════════════════════════════════ */

/* 서명 섹션 전체 컨테이너 */
.sign-section {
  display: flex;
  gap: 16px;
  margin-top: 12px;
  padding-top: 12px;
  border-top: 1px solid #374151;
  flex-wrap: wrap;
}

/* 서명 블록 (점검자 / 확인자 각각) */
.sign-block {
  flex: 1 1 320px;
  display: flex;
  gap: 12px;
  align-items: flex-start;
  background: #1e2130;
  border: 1px solid #374151;
  border-radius: 8px;
  padding: 12px 14px;
  min-width: 0;
}

.sign-block-title {
  writing-mode: vertical-rl;
  text-orientation: mixed;
  font-size: 0.85rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  color: #93c5fd;
  background: #1e3a5f;
  padding: 8px 4px;
  border-radius: 4px;
  text-align: center;
  min-width: 28px;
  align-self: stretch;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* 정보 입력 필드 묶음 */
.sign-fields {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.sign-info-row {
  display: flex;
  align-items: center;
  gap: 6px;
}

.sign-info-row label {
  font-size: 0.75rem;
  color: #9ca3af;
  min-width: 32px;
  white-space: nowrap;
}

.sign-input {
  flex: 1;
  padding: 4px 8px !important;
  font-size: 0.8rem !important;
  height: 28px !important;
  min-width: 0;
}

/* 서명 캔버스 영역 */
.sign-canvas-area {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  min-width: 120px;
}

.sign-canvas-label {
  font-size: 0.72rem;
  color: #9ca3af;
  text-align: center;
}

.sign-canvas-wrap {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
}

.sign-canvas {
  border: 1px dashed #4b5563;
  border-radius: 4px;
  background: #111827;
  width: 120px;
  height: 50px;
  display: block;
}

.sign-img {
  border: 1px solid #374151;
  border-radius: 4px;
  width: 120px;
  height: 50px;
  object-fit: contain;
  background: #1e2030;   /* 다크모드: 어두운 배경 (저장된 검정선이 안 보이므로 반전 필터) */
  filter: invert(1);     /* 검정선 → 흰선으로 표시 */
}

/* 라이트모드: 흰 배경, 필터 없음 → 검정선 그대로 */
body.light-mode .sign-img {
  background: #ffffff;
  border-color: #cbd5e1;
  filter: none;
}

.sign-btns {
  display: flex;
  gap: 4px;
  flex-wrap: wrap;
  justify-content: center;
}

.btn-xs {
  font-size: 0.7rem !important;
  padding: 2px 7px !important;
  height: 22px !important;
  line-height: 1.2 !important;
}

/* 서명 모달 */
/* 배경 클릭으로 닫히지 않도록 pointer-events 제어는 JS에서 처리 */
.sign-modal-overlay {
  /* 배경 클릭 이벤트 없음 — 취소/완료 버튼으로만 닫힘 */
}

.sign-modal-box {
  width: 540px;
  max-width: 95vw;
}

/* 서명 모달 헤더: X 버튼 없이 타이틀만 */
.sign-modal-header {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 18px 22px 14px;
  border-bottom: 1px solid #1e2130;
  font-size: 16px;
  font-weight: 700;
  color: #f0f4ff;
}
body.light-mode .sign-modal-header {
  border-bottom-color: #e5e7eb;
  color: #1a2030;
}

/* 서명 모달 푸터: 지우기 | 취소 | 완료 */
.sign-modal-footer {
  display: flex;
  gap: 8px;
  justify-content: flex-end;
  padding: 12px 16px;
  border-top: 1px solid #1e2130;
}
body.light-mode .sign-modal-footer {
  border-top-color: #e5e7eb;
}

/* 취소 버튼 */
.sign-cancel-btn {
  min-width: 64px;
}
/* 모바일에서 modal-footer .btn { flex:1 } 오버라이드 */
.sign-modal-footer .btn {
  flex: none !important;
}

.sign-modal-body {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 16px;
  gap: 8px;
}

/* 서명 모달 캔버스 */
.sign-modal-canvas {
  border: 2px solid #4b5563;
  border-radius: 6px;
  background: #1e2030;   /* 다크모드 기본: 어두운 배경 → 흰 선이 잘 보임 */
  cursor: crosshair;
  touch-action: none;
}

/* 라이트모드: 흰 배경 → 검정 선이 잘 보임 */
body.light-mode .sign-modal-canvas {
  background: #ffffff;
  border-color: #9ca3af;
}

.sign-hint {
  font-size: 0.8rem;
  color: #9ca3af;
  margin: 0;
}

/* 라이트모드 서명 섹션 */
body.light-mode .sign-section {
  border-top-color: #e5e7eb;
}

body.light-mode .sign-block {
  background: #f9fafb;
  border-color: #e5e7eb;
}

body.light-mode .sign-block-title {
  color: #1d4ed8;
  background: #dbeafe;
}

body.light-mode .sign-info-row label {
  color: #6b7280;
}

body.light-mode .sign-canvas {
  background: #f8fafc;
  border-color: #cbd5e1;
}

body.light-mode .sign-canvas-label { color: #6b7280; }

/* 인쇄 시 서명 모달 숨기기 */
@media print {
  #signModal { display: none !important; }
  .sign-btns { display: none !important; }
  .sign-canvas { display: none !important; }
  .sign-section {
    border-top: 1px solid #000;
    margin-top: 8px;
  }
  .sign-block {
    border: 1px solid #000;
    background: #fff !important;
    break-inside: avoid;
  }
  .sign-block-title {
    background: #f0f0f0 !important;
    color: #000 !important;
  }
  .sign-img {
    display: block !important;
    width: 100px;
    height: 45px;
  }
}

/* ═══════════════════════════════════════
   내 점검 (my_inspect.js) 전용 스타일
═══════════════════════════════════════ */

/* 헤더 */
.mi-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 12px;
  margin-bottom: 20px;
}
.mi-header-title {
  display: flex;
  align-items: center;
  gap: 14px;
}
.mi-header-icon {
  font-size: 36px;
  line-height: 1;
}
.mi-title {
  font-size: 22px;
  font-weight: 700;
  color: var(--text-primary, #e0e6ff);
  margin: 0 0 4px;
}
.mi-subtitle {
  font-size: 13px;
  color: var(--text-muted, #8892b0);
  margin: 0;
}
.mi-year-select select {
  padding: 8px 14px;
  border-radius: 10px;
  border: 1px solid var(--border, #2a2d45);
  background: var(--card-bg, #1e2130);
  color: var(--text-primary, #e0e6ff);
  font-size: 14px;
  font-weight: 600;
  cursor: pointer;
}

/* 통계 카드 그리드 */
.mi-stats-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 14px;
  margin-bottom: 20px;
}
.mi-stat-card {
  border-radius: 14px;
  padding: 18px 16px;
  display: flex;
  align-items: center;
  gap: 14px;
  border: 1px solid transparent;
  transition: transform .15s;
}
.mi-stat-card:hover { transform: translateY(-2px); }
.mi-stat-icon { font-size: 28px; line-height: 1; }
.mi-stat-val {
  font-size: 26px;
  font-weight: 800;
  line-height: 1;
  margin-bottom: 2px;
}
.mi-stat-lbl {
  font-size: 12px;
  opacity: 0.75;
}

/* 카드 색상 */
.mi-stat-blue   { background: linear-gradient(135deg,#1e3a5f,#1a2d4a); border-color:#2a4a7f; color:#60a5fa; }
.mi-stat-green  { background: linear-gradient(135deg,#1e4a2f,#1a3a22); border-color:#2a6a3f; color:#4ade80; }
.mi-stat-yellow { background: linear-gradient(135deg,#4a3a10,#3a2d0a); border-color:#7a5a10; color:#fbbf24; }
.mi-stat-purple { background: linear-gradient(135deg,#2e1e5a,#221644); border-color:#4a2a9a; color:#a78bfa; }

/* 탭 + 카드 */
.mi-card {
  background: var(--card-bg, #1e2130);
  border: 1px solid var(--border, #2a2d45);
  border-radius: 16px;
  overflow: hidden;
}
.mi-tabs {
  display: flex;
  border-bottom: 1px solid var(--border, #2a2d45);
  padding: 0 16px;
  gap: 4px;
}
.mi-tab {
  padding: 14px 18px;
  background: none;
  border: none;
  border-bottom: 2px solid transparent;
  color: var(--text-muted, #8892b0);
  font-size: 14px;
  font-weight: 500;
  cursor: pointer;
  transition: all .15s;
  margin-bottom: -1px;
}
.mi-tab.active {
  color: #5b8dee;
  border-bottom-color: #5b8dee;
  font-weight: 700;
}
.mi-tab:hover:not(.active) { color: var(--text-primary, #e0e6ff); }

/* 로딩 / 에러 */
.mi-loading {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 40px;
  color: var(--text-muted, #8892b0);
  font-size: 14px;
}
.mi-spinner {
  width: 22px; height: 22px;
  border: 3px solid var(--border, #2a2d45);
  border-top-color: #5b8dee;
  border-radius: 50%;
  animation: miSpin .7s linear infinite;
}
@keyframes miSpin { to { transform: rotate(360deg); } }
.mi-error {
  padding: 16px 20px;
  color: #f87171;
  font-size: 13px;
}

/* 목록 */
.mi-list { padding: 12px 0; }
.mi-empty {
  text-align: center;
  padding: 60px 20px;
  color: var(--text-muted, #8892b0);
  font-size: 14px;
  line-height: 2;
}

/* 날짜 그룹 */
.mi-date-group { margin-bottom: 4px; }
.mi-date-label {
  padding: 10px 20px 6px;
  font-size: 12px;
  font-weight: 700;
  color: var(--text-muted, #8892b0);
  text-transform: uppercase;
  letter-spacing: 0.5px;
}
.mi-items {}

/* 개별 항목 */
.mi-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 14px 20px;
  border-bottom: 1px solid var(--border, #2a2d45);
  cursor: pointer;
  transition: background .12s;
  gap: 12px;
}
.mi-item:last-child { border-bottom: none; }
.mi-item:hover { background: var(--hover-bg, rgba(91,141,238,.07)); }
.mi-item-left {
  display: flex;
  align-items: center;
  gap: 12px;
  flex: 1;
  min-width: 0;
}
.mi-item-info { min-width: 0; }
.mi-item-name {
  font-size: 15px;
  font-weight: 600;
  color: var(--text-primary, #e0e6ff);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.mi-item-meta {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
  margin-top: 3px;
}
.mi-item-meta span {
  font-size: 11px;
  color: var(--text-muted, #8892b0);
  background: var(--tag-bg, rgba(91,141,238,.12));
  padding: 2px 7px;
  border-radius: 4px;
}
.mi-item-right { flex-shrink: 0; }
.mi-go-btn {
  padding: 7px 14px;
  background: linear-gradient(135deg,#3b6fd4,#5b8dee);
  color: #fff;
  border: none;
  border-radius: 8px;
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
  white-space: nowrap;
  transition: opacity .15s;
}
.mi-go-btn:hover { opacity: 0.85; }

/* 상태 배지 */
.mi-status-badge {
  display: inline-flex;
  align-items: center;
  padding: 3px 10px;
  border-radius: 20px;
  font-size: 11px;
  font-weight: 700;
  white-space: nowrap;
  flex-shrink: 0;
}
.mi-status-done     { background: rgba(74,222,128,.15); color: #4ade80; }
.mi-status-draft    { background: rgba(148,163,184,.15); color: #94a3b8; }
.mi-status-progress { background: rgba(251,191,36,.15);  color: #fbbf24; }

/* 라이트모드 */
body.light-mode .mi-title      { color: #1a1a2e; }
body.light-mode .mi-subtitle   { color: #6b7280; }
body.light-mode .mi-year-select select { background:#fff; color:#1a1a2e; border-color:#e0e0e0; }
body.light-mode .mi-stat-blue  { background:linear-gradient(135deg,#dbeafe,#eff6ff); border-color:#bfdbfe; color:#1d4ed8; }
body.light-mode .mi-stat-green { background:linear-gradient(135deg,#dcfce7,#f0fdf4); border-color:#bbf7d0; color:#15803d; }
body.light-mode .mi-stat-yellow{ background:linear-gradient(135deg,#fef9c3,#fefce8); border-color:#fde047; color:#a16207; }
body.light-mode .mi-stat-purple{ background:linear-gradient(135deg,#ede9fe,#faf5ff); border-color:#ddd6fe; color:#7c3aed; }
body.light-mode .mi-card       { background:#fff; border-color:#e0e0e0; }
body.light-mode .mi-tab        { color:#6b7280; }
body.light-mode .mi-tab.active { color:#3b6fd4; border-bottom-color:#3b6fd4; }
body.light-mode .mi-item:hover { background:rgba(59,111,212,.05); }
body.light-mode .mi-item-name  { color:#1a1a2e; }
body.light-mode .mi-item-meta span { background:rgba(59,111,212,.08); color:#4b5675; }
body.light-mode .mi-date-label { color:#6b7280; }
body.light-mode .mi-item       { border-bottom-color:#f0f0f0; }
body.light-mode .mi-status-done     { background:rgba(21,128,61,.12); color:#15803d; }
body.light-mode .mi-status-draft    { background:rgba(107,114,128,.12); color:#6b7280; }
body.light-mode .mi-status-progress { background:rgba(161,98,7,.12); color:#a16207; }

/* 반응형 */
@media (max-width: 900px) {
  .mi-stats-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 600px) {
  .mi-header { flex-direction: column; align-items: flex-start; }
  .mi-stats-grid { grid-template-columns: repeat(2, 1fr); gap:10px; }
  .mi-stat-card { padding: 14px 12px; }
  .mi-stat-val { font-size: 22px; }
  .mi-title { font-size: 18px; }
  .mi-tab { padding: 12px 12px; font-size: 13px; }
  .mi-item { padding: 12px 14px; }
  .mi-item-name { font-size: 14px; }
}

/* ═══════════════════════════════════════
   대상 관리 (target_manage.js) 전용 스타일
═══════════════════════════════════════ */

/* 사업장 상태 배지 */
.tm-status-badge {
  display: inline-flex;
  align-items: center;
  gap: 3px;
  padding: 3px 8px;
  border-radius: 20px;
  font-size: 11px;
  font-weight: 700;
  white-space: nowrap;
}
.tm-badge-normal  { background: rgba(74,222,128,.15); color: #4ade80; }
.tm-badge-pause   { background: rgba(251,191,36,.15);  color: #fbbf24; }
.tm-badge-closed  { background: rgba(248,113,113,.15); color: #f87171; }
.tm-badge-noprod  { background: rgba(167,139,250,.15); color: #a78bfa; }

body.light-mode .tm-badge-normal  { background: rgba(21,128,61,.1);   color: #15803d; }
body.light-mode .tm-badge-pause   { background: rgba(161,98,7,.1);    color: #a16207; }
body.light-mode .tm-badge-closed  { background: rgba(185,28,28,.1);   color: #b91c1c; }
body.light-mode .tm-badge-noprod  { background: rgba(109,40,217,.1);  color: #6d28d9; }

/* 폼 그리드 */
.form-grid-2 {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
}
.form-group { display: flex; flex-direction: column; gap: 5px; }
.form-group label { font-size: 12px; font-weight: 600; color: var(--text-muted,#8892b0); }
.form-control {
  padding: 9px 12px;
  border-radius: 8px;
  border: 1px solid var(--border,#2a2d45);
  background: var(--input-bg,#13151f);
  color: var(--text-primary,#e0e6ff);
  font-size: 14px;
  outline: none;
  transition: border-color .15s;
  width: 100%;
  box-sizing: border-box;
}
.form-control:focus { border-color: #5b8dee; }
textarea.form-control { resize: vertical; }

body.light-mode .form-control { background:#f8fafc; color:#1a1a2e; border-color:#e0e0e0; }
body.light-mode .form-group label { color:#6b7280; }

/* 엑셀 드롭 존 */
.tm-excel-zone {
  border: 2px dashed var(--border,#2a2d45);
  border-radius: 12px;
  padding: 32px 20px;
  text-align: center;
  cursor: pointer;
  color: var(--text-muted,#8892b0);
  transition: border-color .15s, background .15s;
}
.tm-excel-zone:hover,
.tm-excel-zone.drag-over {
  border-color: #5b8dee;
  background: rgba(91,141,238,.06);
}

/* 토스트 */
.tm-toast {
  position: fixed;
  bottom: 32px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 99999;
  padding: 13px 22px;
  border-radius: 10px;
  font-size: 14px;
  font-weight: 600;
  background: #22c55e;
  color: #fff;
  box-shadow: 0 4px 20px rgba(0,0,0,.3);
  pointer-events: none;
}
.tm-toast.err  { background: #ef4444; }
.tm-toast.warn { background: #f59e0b; }

/* 버튼 추가 */
.btn-xs {
  padding: 4px 9px;
  font-size: 12px;
  border-radius: 6px;
}
.btn-danger {
  background: rgba(239,68,68,.15);
  border: 1px solid rgba(239,68,68,.3);
  color: #f87171;
  cursor: pointer;
  transition: background .15s;
}
.btn-danger:hover { background: rgba(239,68,68,.3); }
body.light-mode .btn-danger { background:rgba(185,28,28,.1); border-color:rgba(185,28,28,.25); color:#b91c1c; }

@media (max-width: 600px) {
  .form-grid-2 { grid-template-columns: 1fr; }
  .form-group[style*="grid-column"] { grid-column: unset !important; }
}

/* ═══════════════════════════════════════
   targets-table — 점검대상 관리 전용 테이블
   (30인치 대형 모니터 / 100% 줌 기준 가독성 최적화)
═══════════════════════════════════════ */
.targets-table-wrap {
  width: 100%;
  overflow-x: auto;
  border-radius: 10px;
  border: 1px solid var(--border, #2a2d45);
  background: var(--card-bg, #13151f);
}

.targets-table {
  width: 100%;
  border-collapse: collapse;
  table-layout: fixed;
  font-size: 14px;        /* 기본 14px (기존 12px 대비 +2) */
  line-height: 1.5;
}

/* 컬럼 너비 고정 */
.targets-table col.col-chk     { width: 36px; }
.targets-table col.col-no       { width: 40px; }
.targets-table col.col-license  { width: 120px; }
.targets-table col.col-sido     { width: 50px; }
.targets-table col.col-sigungu  { width: 90px; }
.targets-table col.col-name     { width: 240px; }
.targets-table col.col-orgtype  { width: 80px; }
.targets-table col.col-biz      { width: 180px; }
.targets-table col.col-addr     { width: 220px; }
.targets-table col.col-note     { width: 160px; }
.targets-table col.col-status   { width: 68px; }
.targets-table col.col-action   { width: 88px; }

.targets-table thead tr {
  background: #0d0f19;
  position: sticky;
  top: 0;
  z-index: 1;
}

.targets-table th {
  padding: 11px 13px;
  font-size: 13px;
  font-weight: 700;
  color: #9ca3af;
  text-align: left;
  border-bottom: 2px solid #1e2235;
  white-space: nowrap;
  letter-spacing: 0.02em;
  background: #0d0f19;
}

.targets-table td {
  padding: 10px 13px;
  font-size: 14px;
  color: #ffffff;
  font-weight: 500;
  border-bottom: 1px solid #1e2235;
  vertical-align: middle;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.targets-table tbody tr:hover td {
  background: rgba(91,141,238,.07);
}

.targets-table tbody tr:last-child td {
  border-bottom: none;
}

/* 사업장명 강조 */
.targets-table td:nth-child(6) {
  font-weight: 700;
  color: #ffffff;
  font-size: 14px;
}

/* 업종 컬럼: 긴 텍스트 줄바꿈 허용 */
.targets-table td:nth-child(8) {
  white-space: normal;
  word-break: keep-all;
  line-height: 1.4;
  font-size: 13px;
  color: #ffffff;
  font-weight: 500;
}

/* 주소 컬럼 */
.targets-table td:nth-child(9) {
  color: #e2e8f0;
  font-size: 13px;
  font-weight: 400;
}

/* 비고 컬럼 */
.targets-table td:nth-child(10) {
  color: #cbd5e1;
  font-size: 13px;
  font-weight: 400;
}

/* 인허가번호: 고정폭 폰트 */
.targets-table td:nth-child(3) {
  font-size: 13px;
  color: #e2e8f0;
  font-weight: 600;
  font-family: 'JetBrains Mono', 'Fira Code', monospace;
}

/* 관리 버튼 셀 */
.targets-table td:last-child {
  text-align: center;
}

/* 라이트 모드 */
body.light-mode .targets-table-wrap {
  background: #fff;
  border-color: #e5e7eb;
}
body.light-mode .targets-table thead tr,
body.light-mode .targets-table th {
  background: #1e3a5f;
  color: #ffffff;
  font-weight: 700;
  border-bottom-color: #1e3a5f;
}
body.light-mode .targets-table td {
  color: #111827;
  font-weight: 600;
  border-bottom-color: #e5e7eb;
}
body.light-mode .targets-table tbody tr:hover td {
  background: #eff6ff;
}
body.light-mode .targets-table td:nth-child(6) {
  color: #000000;
  font-weight: 700;
}
body.light-mode .targets-table td:nth-child(8) {
  color: #111827;
  font-weight: 600;
}
body.light-mode .targets-table td:nth-child(9) {
  color: #374151;
  font-weight: 500;
}
body.light-mode .targets-table td:nth-child(10) {
  color: #4b5563;
  font-weight: 500;
}
body.light-mode .targets-table td:nth-child(3) {
  color: #1f2937;
  font-weight: 700;
}

/* 페이지네이션 (target_manage 전용) */
.pagination {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
  flex-wrap: wrap;
}
.pagination button {
  padding: 6px 12px;
  font-size: 13px;
  border-radius: 7px;
  border: 1px solid var(--border, #2a2d45);
  background: var(--card-bg, #13151f);
  color: var(--text-primary, #e0e6ff);
  cursor: pointer;
  transition: background .15s, border-color .15s;
  min-width: 36px;
  font-weight: 500;
}
.pagination button:hover:not(:disabled) {
  background: rgba(91,141,238,.15);
  border-color: #5b8dee;
}
.pagination button.active {
  background: #2563eb;
  border-color: #2563eb;
  color: #fff;
  font-weight: 700;
}
.pagination button:disabled {
  opacity: 0.38;
  cursor: default;
}
body.light-mode .pagination button {
  background: #fff;
  border-color: #e5e7eb;
  color: #374151;
}
body.light-mode .pagination button:hover:not(:disabled) {
  background: #eff6ff;
  border-color: #93c5fd;
}
body.light-mode .pagination button.active {
  background: #2563eb;
  border-color: #2563eb;
  color: #fff;
}

/* filter-result-row */
.filter-result-count {
  font-size: 13px;
  color: #8892b0;
  font-weight: 500;
}
body.light-mode .filter-result-count { color: #6b7280; }

/* ══════════════════════════════════════
   점검표 에디터 (관리자 탭) - 다크/라이트 대응
══════════════════════════════════════ */
/* 섹션 컨테이너 */
.tpl-section {
  margin-bottom: 16px;
  border: 1px solid var(--gray2);
  border-radius: 8px;
  overflow: hidden;
}
/* 항목 테이블 내부 패딩 영역 */
.tpl-section-body {
  padding: 8px 12px;
  background: var(--tpl-bg, #fff);
}
/* thead 헤더 행 */
.tpl-thead-tr {
  background: var(--tpl-head-bg, #f4f6f9);
  color: var(--tpl-head-color, #4a5060);
}
.tpl-thead-tr th {
  padding: 5px 8px;
  border-bottom: 1px solid var(--tpl-border, #e8ecf0);
}
/* 데이터 행 */
.tpl-sub-tr {
  border-bottom: 1px solid var(--tpl-border, #e8ecf0);
}
.tpl-sub-id {
  padding: 5px 8px;
  text-align: center;
  color: var(--tpl-id-color, #8a9099);
  font-size: 0.78rem;
}
.tpl-sub-text-td {
  padding: 4px 8px;
}
/* 핵심: 점검 내용 입력 필드 */
.tpl-sub-input {
  width: 100%;
  padding: 4px 6px;
  border: 1px solid var(--tpl-input-border, #e8ecf0);
  border-radius: 4px;
  background: var(--tpl-input-bg, #ffffff);
  color: var(--tpl-input-color, #1a1d24);
  font-size: 0.85rem;
  font-family: inherit;
  line-height: 1.5;
  min-height: 28px;
  resize: none;         /* 수동 리사이즈 비활성화 (자동으로만) */
  overflow: hidden;     /* 스크롤 없이 높이 자동 확장 */
  display: block;
  box-sizing: border-box;
}
.tpl-sub-input:focus {
  outline: none;
  border-color: var(--primary);
  box-shadow: 0 0 0 2px rgba(26,79,122,0.15);
}
/* 항목 추가 버튼 */
.tpl-add-sub-btn {
  margin-top: 8px;
  padding: 4px 14px;
  border: 1px dashed var(--tpl-add-border, #bdc3cb);
  border-radius: 4px;
  background: transparent;
  color: var(--tpl-add-color, #4a5060);
  font-size: 0.82rem;
  cursor: pointer;
  width: 100%;
}
.tpl-add-sub-btn:hover {
  background: var(--tpl-add-hover, rgba(0,0,0,0.04));
}
/* 이동/삭제 버튼 */
.tpl-btn-move {
  background: var(--tpl-btn-bg, #e8ecf0);
  border: none;
  color: var(--tpl-btn-color, #1a1d24);
  border-radius: 3px;
  padding: 2px 6px;
  cursor: pointer;
  font-size: 0.78rem;
}
.tpl-btn-del {
  background: var(--tpl-del-bg, #fee2e2);
  border: none;
  color: #dc2626;
  border-radius: 3px;
  padding: 2px 6px;
  cursor: pointer;
  font-size: 0.78rem;
}

/* ── 다크모드 변수 재정의 ── */
body:not(.light-mode) {
  --tpl-bg:           #1e2535;
  --tpl-head-bg:      #16202e;
  --tpl-head-color:   #94a3b8;
  --tpl-border:       #2a3347;
  --tpl-id-color:     #64748b;
  --tpl-input-bg:     #16202e;
  --tpl-input-border: #2a3347;
  --tpl-input-color:  #e2e8f0;
  --tpl-add-border:   #2a3347;
  --tpl-add-color:    #94a3b8;
  --tpl-add-hover:    rgba(255,255,255,0.05);
  --tpl-btn-bg:       #2a3347;
  --tpl-btn-color:    #e2e8f0;
  --tpl-del-bg:       rgba(220,38,38,0.2);
}

/* ── 라이트모드 변수 재정의 ── */
body.light-mode {
  --tpl-bg:           #ffffff;
  --tpl-head-bg:      #f4f6f9;
  --tpl-head-color:   #4a5060;
  --tpl-border:       #e8ecf0;
  --tpl-id-color:     #8a9099;
  --tpl-input-bg:     #ffffff;
  --tpl-input-border: #e8ecf0;
  --tpl-input-color:  #1a1d24;
  --tpl-add-border:   #bdc3cb;
  --tpl-add-color:    #4a5060;
  --tpl-add-hover:    rgba(0,0,0,0.04);
  --tpl-btn-bg:       #e8ecf0;
  --tpl-btn-color:    #1a1d24;
  --tpl-del-bg:       #fee2e2;
}

/* ═══════════════════════════════════════════════════════════
   점검대상 관리 - 모바일 반응형 전면 개선
   ═══════════════════════════════════════════════════════════ */

/* table-header 모바일 버튼 영역 */
.th-mob-actions {
  display: none;
  align-items: center;
  gap: 6px;
}
.th-mob-btn {
  padding: 5px 10px !important;
  font-size: 12px !important;
  height: 32px;
  white-space: nowrap;
}

@media (max-width: 768px) {
  /* ─── table-header 모바일 레이아웃 ─── */
  .table-header {
    flex-wrap: wrap;
    gap: 8px;
    padding: 12px 14px;
  }
  .th-mob-actions {
    display: flex !important;
  }
  .table-count {
    flex: 1;
    font-size: 13px;
  }

  /* ─── 모바일 카드 패딩 최적화 ─── */
  #mobileCardList {
    padding: 0 12px 12px;
  }

  /* ─── 카드 전체 개선 ─── */
  .mob-target-card {
    margin: 0 0 10px;
    border-radius: 12px;
  }

  /* ─── 카드 상단 영역 ─── */
  .mob-card-top {
    padding: 12px 14px 8px;
    gap: 8px;
  }
  .mob-card-name {
    font-size: 15px;
    font-weight: 700;
  }
  .mob-card-biz-type {
    font-size: 11px;
    margin-top: 2px;
    color: #7b85a8;
  }

  /* ─── 상태 배지 크기 축소 ─── */
  .mob-status-badge {
    font-size: 10px;
    padding: 3px 8px;
  }

  /* ─── 메타정보 행 ─── */
  .mob-card-info-row {
    padding: 0 14px 8px;
    gap: 5px;
  }
  .mob-info-chip {
    font-size: 11px;
    padding: 2px 7px;
  }

  /* ─── 주소 ─── */
  .mob-card-addr {
    padding: 0 14px 8px;
    font-size: 11px;
  }

  /* ─── 이력 행 ─── */
  .mob-card-hist-row {
    padding: 8px 14px 8px;
    gap: 6px;
  }
  .mob-hist-label {
    font-size: 10px;
  }
  .hist-badge {
    font-size: 11px;
    padding: 2px 6px;
  }

  /* ─── 액션 버튼 영역 ─── */
  .mob-card-actions {
    grid-template-columns: repeat(4, 1fr);
  }
  .mob-action-btn {
    padding: 10px 4px;
    gap: 3px;
  }
  .mob-action-icon {
    font-size: 16px;
  }
  .mob-action-label {
    font-size: 9px;
    font-weight: 600;
  }

  /* ─── 필터 바 개선 ─── */
  .filter-bar {
    padding: 10px 12px;
  }
  .filter-bar-body.open {
    gap: 6px;
  }
  .filter-row {
    gap: 6px;
    margin-bottom: 6px;
  }
  .filter-select {
    font-size: 13px;
    padding: 7px 10px;
    height: 36px;
  }
  .filter-input {
    font-size: 13px;
    padding: 7px 10px;
    height: 36px;
  }
  .btn-filter-reset {
    height: 36px;
    font-size: 13px;
  }

  /* ─── 통계 카드 모바일 개선 ─── */
  .stats-row {
    grid-template-columns: 1fr 1fr;
    gap: 8px;
    margin-bottom: 10px;
  }
  .stat-card {
    padding: 12px 12px;
    border-radius: 12px;
  }
  .stat-card-label {
    font-size: 11px;
    margin-bottom: 4px;
  }
  .stat-card-value {
    font-size: 26px;
    font-weight: 800;
  }
  .stat-card-icon {
    font-size: 20px;
    top: 10px;
    right: 10px;
  }
  .stat-card-pct {
    font-size: 11px;
  }

  /* ─── 페이지네이션 모바일 ─── */
  .pagination {
    padding: 10px 14px;
    gap: 4px;
    flex-wrap: wrap;
    justify-content: center;
  }
  .page-btn {
    min-width: 34px;
    height: 34px;
    font-size: 13px;
  }

  /* ─── 모달 모바일 개선 ─── */
  .modal-box {
    margin: 12px;
    max-height: calc(100vh - 24px);
  }
  .modal-header {
    padding: 16px 18px;
  }
  .modal-body {
    padding: 16px 18px;
  }
  .modal-footer {
    padding: 12px 18px;
    gap: 8px;
  }
  .modal-footer .btn {
    flex: 1;
    justify-content: center;
  }

  /* ─── 폼 그리드 모바일 ─── */
  .t-form-grid {
    grid-template-columns: 1fr;
    gap: 12px;
  }
  .t-form-group label {
    font-size: 12px;
    margin-bottom: 4px;
  }
  .t-form-input,
  .t-form-select,
  .t-form-textarea {
    font-size: 14px;
    padding: 9px 12px;
  }

  /* ─── FAB 버튼 위치 조정 ─── */
  .mob-fab {
    bottom: 20px;
    right: 16px;
    width: 52px;
    height: 52px;
    font-size: 26px;
  }
}

/* ─── 라이트모드 모바일 카드 ─── */
@media (max-width: 768px) {
  body.light-mode .mob-target-card {
    background: #ffffff;
    border-color: #e8ecf0;
    box-shadow: 0 1px 4px rgba(0,0,0,.08);
  }
  body.light-mode .mob-card-name { color: #1a1d24; }
  body.light-mode .mob-card-biz-type { color: #6b7280; }
  body.light-mode .mob-card-addr { color: #6b7280; }
  body.light-mode .mob-info-chip {
    background: rgba(0,0,0,.03);
    border-color: rgba(0,0,0,.08);
    color: #4b5563;
  }
  body.light-mode .mob-card-hist-row {
    border-top-color: rgba(0,0,0,.07);
  }
  body.light-mode .mob-hist-label {
    background: rgba(0,0,0,.04);
    color: #9ca3af;
  }
  body.light-mode .mob-no-hist { color: #9ca3af; }
  body.light-mode .mob-card-actions {
    border-top-color: rgba(0,0,0,.07);
  }
  body.light-mode .mob-action-btn {
    border-right-color: rgba(0,0,0,.07);
  }
  body.light-mode .mob-action-label { color: #9ca3af; }
  body.light-mode .mob-action-btn.primary .mob-action-label { color: #2563eb; }
  body.light-mode .mob-action-btn.plan    .mob-action-label { color: #d97706; }
  body.light-mode .mob-action-btn.hist    .mob-action-label { color: #7c3aed; }
  body.light-mode .mob-action-btn.edit    .mob-action-label { color: #4b5563; }
  body.light-mode .table-header {
    background: #ffffff;
    border-bottom-color: #e5e7eb;
  }
  body.light-mode .th-mob-btn {
    background: #f3f4f6;
    border-color: #e5e7eb;
    color: #374151;
  }
}

/* ═══════════════════════════════════════════════════════
   컬럼 너비 조정 (col_resize.js)
   — 점검대상 목록(targets) / 대상 관리(target_manage) 공통
═══════════════════════════════════════════════════════ */

/* 리사이즈 가능한 th */
th.col-resizable {
  user-select: none;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  /* 경계선을 항상 표시 (오른쪽만) */
  border-right: 2px solid rgba(99,153,255,0.35) !important;
}
th.col-resizable:last-child {
  border-right: none !important;
}

/* 고정 컬럼의 구분선 전용 핸들 (드래그 불가, 경계선 표시만) */
.col-resize-handle.col-resize-divider {
  cursor: default !important;
  pointer-events: none;
  opacity: 0.5;
}

/* 드래그 핸들: 항상 보이는 얇은 세로 라인 */
.col-resize-handle {
  position: absolute;
  top: 10%;
  right: 0;
  width: 5px;
  height: 80%;
  cursor: col-resize;
  z-index: 10;
  /* 항상 보이는 경계 라인 */
  border-right: 2px solid rgba(99,153,255,0.5);
  transition: border-color .15s, width .1s;
  box-sizing: border-box;
}
.col-resize-handle:hover {
  border-right: 3px solid rgba(99,153,255,0.9);
  background: rgba(99,153,255,0.12);
  width: 8px;
}
.col-resizing .col-resize-handle {
  border-right-color: #6399ff;
  background: rgba(99,153,255,0.2);
}

/* 라이트모드 핸들 */
body.light-mode .col-resize-handle {
  border-right-color: rgba(37,99,235,0.4);
}
body.light-mode .col-resize-handle:hover {
  border-right-color: #2563eb;
  background: rgba(37,99,235,0.08);
}
body.light-mode th.col-resizable {
  border-right-color: rgba(37,99,235,0.25) !important;
}

/* 드래그 중 전체 오버레이 (커서 & 선택 방지) */
.col-resize-overlay {
  position: fixed;
  inset: 0;
  z-index: 99999;
  cursor: col-resize;
  user-select: none;
}

/* 수직 안내선 — position:fixed(뷰포트 기준)로 스크롤 무관하게 정확히 표시 */
.col-resize-guide {
  position: fixed;
  top: 0;
  width: 2px;
  background: rgba(99, 153, 255, 0.8);
  pointer-events: none;
  z-index: 99998;
  box-shadow: 0 0 4px rgba(99,153,255,0.4);
}
body.light-mode .col-resize-guide {
  background: rgba(37,99,235,0.75);
  box-shadow: 0 0 4px rgba(37,99,235,0.3);
}

/* 리사이즈 중 테이블 선택 방지 */
table.col-resizing {
  user-select: none;
}

/* 고정 컬럼 (리사이즈 핸들 없음) */
th.col-resize-fixed {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

/* 리사이즈 초기화 버튼 */
.btn-col-reset {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 4px 10px;
  font-size: 12px;
  border-radius: 6px;
  border: 1px solid var(--border, #2a2d45);
  background: transparent;
  color: var(--text-muted, #8899bb);
  cursor: pointer;
  transition: background .15s, color .15s;
  white-space: nowrap;
}
.btn-col-reset:hover {
  background: rgba(99,153,255,.12);
  color: #6399ff;
  border-color: #6399ff;
}
body.light-mode .btn-col-reset {
  border-color: #d1d5db;
  color: #6b7280;
}
body.light-mode .btn-col-reset:hover {
  background: #eff6ff;
  color: #2563eb;
  border-color: #2563eb;
}

/* 모바일에서 숨김 */
@media (max-width: 768px) {
  .col-resize-handle { display: none; }
  .btn-col-reset { display: none; }
  th.col-resizable { border-right: none !important; }
}
