/* ==========================================================================
   dark.css — 다크 테마 공용 덮개 (ADR 26_10_008 · 전 화면 적재는 ADR 26_10_013)

   - 다크 시스템 템플릿(Dark)은 색 23개만 바꾼다. 테마 CSS 가 닿지 않는 색
     (codebase.min.css·layout.css·플러그인·화면 <style> 블록)을 이 파일이 덮는다.
   - 모든 규칙은 html[data-theme="dark"] 아래에만 둔다 → 라이트 화면에는 영향 0.
   - 모든 화면에 싣는다(css-link.jspf, ADR 26_10_013). 라이트로 남는 자리를 찾으면
     그 화면 절을 이 파일 끝에 더한다.
   - !important 는 상대 규칙이 !important 이거나(bg-white 등) 화면 <style>·인라인 style 일 때만 쓴다.
   ========================================================================== */

html[data-theme="dark"] {
	--dk-page: #15181d;
	--dk-surface: #1c2027;
	--dk-surface-2: #21262e;
	--dk-surface-3: #2a3039;
	--dk-border: #2c323c;
	--dk-text: #c3cad4;
	--dk-text-strong: #e8ecf2;
	--dk-text-muted: #8a94a3;
	--dk-primary-text: #8fb0ff;
	--dk-primary-soft: #1f2c4a;
	color-scheme: dark;
}

/* ── 1. 바탕·기본 글자 ──────────────────────────────────────────────── */
html[data-theme="dark"] body,
html[data-theme="dark"] #page-container,
html[data-theme="dark"] #main-container {
	background-color: var(--dk-page);
	color: var(--dk-text);
}
html[data-theme="dark"] h1,
html[data-theme="dark"] h2,
html[data-theme="dark"] h3,
html[data-theme="dark"] h4,
html[data-theme="dark"] h5,
html[data-theme="dark"] .block-title,
html[data-theme="dark"] .text-black {
	color: var(--dk-text-strong) !important;
}
html[data-theme="dark"] .text-muted { color: var(--dk-text-muted) !important; }
/* 테마 CSS 가 headerBg(다크에서는 거의 검정)를 글자색으로 쓰는 곳 — ADR 26_10_008 §3-1 */
html[data-theme="dark"] .text-primary-dark,
html[data-theme="dark"] .text-dual-primary-dark,
html[data-theme="dark"] .text-corporate-dark { color: var(--dk-text-strong) !important; }
html[data-theme="dark"] .alert-primary {
	background-color: var(--dk-primary-soft) !important;
	border-color: #2a3a63 !important;
	color: var(--dk-primary-text) !important;
}

/* ── 2. 상단 헤더 ──────────────────────────────────────────────────── */
html[data-theme="dark"] #page-header {
	background-color: var(--dk-page);
	border-bottom: 1px solid var(--dk-border);
}
html[data-theme="dark"] #page-header .btn,
html[data-theme="dark"] #page-header .btn-dual-secondary {
	background-color: var(--dk-surface-2);
	border-color: var(--dk-border);
	color: var(--dk-text);
}
html[data-theme="dark"] #page-header .btn:hover {
	background-color: var(--dk-surface-3);
	color: var(--dk-text-strong);
}

/* layout.css '머리띠 버튼' 절(.side-user-v2-page #page-header #id …)은 ID 두 개라 위 규칙보다 세다 — 같은 목록으로 덮는다 */
html[data-theme="dark"] .side-user-v2-page #page-header #adminBtn,
html[data-theme="dark"] .side-user-v2-page #page-header .btn-work-state-chk,
html[data-theme="dark"] .side-user-v2-page #page-header #btnHardReload,
html[data-theme="dark"] .side-user-v2-page #page-header #btnSelWorkPlanQuick,
html[data-theme="dark"] .side-user-v2-page #page-header #btnNotificationArea,
html[data-theme="dark"] .side-user-v2-page #page-header [data-action="sidebar_toggle"] {
	background-color: var(--dk-surface-2);
	border-color: var(--dk-border);
	box-shadow: none;
	color: var(--dk-text);
}

/* ── 3. 사이드바 ──────────────────────────────────────────────────── */
html[data-theme="dark"] #sidebar,
html[data-theme="dark"] #sidebar .sidebar-content,
html[data-theme="dark"] #sidebar .content-header,
html[data-theme="dark"] #sidebar .content-side {
	background-color: var(--dk-surface) !important;
}
html[data-theme="dark"] #sidebar { border-right: 1px solid var(--dk-border); }
html[data-theme="dark"] #sidebar .content-side-user { background-color: var(--dk-surface-2) !important; }
html[data-theme="dark"] #sidebar .nav-main a,
html[data-theme="dark"] #sidebar .sidebar-mini-hide { color: var(--dk-text) !important; }
html[data-theme="dark"] #sidebar .nav-main a > i,
html[data-theme="dark"] #sidebar .nav-main a svg { color: var(--dk-text-muted) !important; }
html[data-theme="dark"] #sidebar .nav-main a:hover {
	background-color: var(--dk-surface-3) !important;
	color: var(--dk-text-strong) !important;
}
html[data-theme="dark"] #sidebar .nav-main a.active {
	background-color: var(--dk-primary-soft) !important;
	color: var(--dk-primary-text) !important;
}
/* 사용자 이름·[내 정보]·[로그아웃] — 원래 흰 원 위 진한 아이콘 */
html[data-theme="dark"] #topUserNm,
html[data-theme="dark"] #sidebar .text-dual-primary-dark { color: var(--dk-text-strong) !important; }
html[data-theme="dark"] #sidebar .content-side-user .link-effect:not(#topUserNm) {
	background-color: var(--dk-surface-3) !important;
	border-color: var(--dk-border) !important;
	color: var(--dk-text) !important;
}
/* 티트리 로고는 어두운 글자 PNG 다 — 밝기만 뒤집고 색상은 되돌린다(초록 아이콘 유지) */
html[data-theme="dark"] #sidebar .content-header img[src*="ttree_logo"] { filter: invert(1) hue-rotate(180deg); }

/* ── 4. 블록·카드 ──────────────────────────────────────────────────── */
html[data-theme="dark"] .block,
html[data-theme="dark"] .block-content,
html[data-theme="dark"] .card {
	background-color: var(--dk-surface);
	color: var(--dk-text);
}
html[data-theme="dark"] .block-header,
html[data-theme="dark"] .bg-body-light { background-color: var(--dk-surface-2) !important; }
html[data-theme="dark"] .block-bordered,
html[data-theme="dark"] .block-header { border-color: var(--dk-border) !important; }
html[data-theme="dark"] .block-link-shadow:hover {
	box-shadow: 0 0 0 1px var(--dk-border), 0 8px 18px rgba(0, 0, 0, .45) !important;
}
html[data-theme="dark"] .bg-white { background-color: var(--dk-surface) !important; }

/* ── 5. 버튼 ────────────────────────────────────────────────────────── */
html[data-theme="dark"] .btn-alt-secondary {
	background-color: var(--dk-surface-2) !important;
	border-color: var(--dk-border) !important;
	color: var(--dk-text) !important;
}
html[data-theme="dark"] .btn-alt-secondary:hover {
	background-color: var(--dk-surface-3) !important;
	color: var(--dk-text-strong) !important;
}
html[data-theme="dark"] .btn-alt-primary {
	background-color: var(--dk-primary-soft) !important;
	border-color: transparent !important;
	color: var(--dk-primary-text) !important;
}

/* ── 6. 폼 ──────────────────────────────────────────────────────────── */
html[data-theme="dark"] .form-control,
html[data-theme="dark"] .custom-select,
html[data-theme="dark"] .input-group-text,
html[data-theme="dark"] .select2-container--default .select2-selection {
	background-color: var(--dk-surface-2) !important;
	border-color: var(--dk-border) !important;
	color: var(--dk-text) !important;
}
html[data-theme="dark"] .form-control::placeholder { color: var(--dk-text-muted); }
/* 조회 기간 검색 바(.period-search-group)를 감싼 흰 상자 — 32개 신청/결재 화면 공통 */
html[data-theme="dark"] div:has(> .period-search-group) { background-color: var(--dk-surface) !important; }

/* ── 7. 알림 띠 ──────────────────────────────────────────────────────── */
html[data-theme="dark"] .alert-info {
	background-color: #10303a !important;
	border-color: #1b4a57 !important;
	color: #9fd8e6 !important;
}
html[data-theme="dark"] .alert-info b,
html[data-theme="dark"] .alert-info strong { color: #c9eef7 !important; }
html[data-theme="dark"] .alert-secondary {
	background-color: var(--dk-surface-2) !important;
	border-color: var(--dk-border) !important;
	color: var(--dk-text) !important;
}

/* ── 8. 표 ──────────────────────────────────────────────────────────── */
html[data-theme="dark"] .table,
html[data-theme="dark"] .table td,
html[data-theme="dark"] .table th {
	border-color: var(--dk-border) !important;
	color: var(--dk-text);
}
html[data-theme="dark"] .text-earth { color: #8fcf6c !important; }

/* ── 9. 모달 (준비 화면 안에서 여는 신청 팝업 등) ────────────────────── */
html[data-theme="dark"] .modal-content {
	background-color: var(--dk-surface);
	color: var(--dk-text);
}
html[data-theme="dark"] .modal-header,
html[data-theme="dark"] .modal-footer { border-color: var(--dk-border) !important; }

/* ── 10. fullcalendar ─────────────────────────────────────────────────── */
html[data-theme="dark"] .fc-unthemed td,
html[data-theme="dark"] .fc-unthemed th,
html[data-theme="dark"] .fc-unthemed .fc-content,
html[data-theme="dark"] .fc-unthemed .fc-divider,
html[data-theme="dark"] .fc-unthemed .fc-row { border-color: var(--dk-border) !important; }
html[data-theme="dark"] .fc-unthemed .fc-day { background-color: var(--dk-surface); }
html[data-theme="dark"] .fc-unthemed td.fc-today { background-color: #2b2a1c !important; }
html[data-theme="dark"] .fc-day-number { color: var(--dk-text) !important; }
html[data-theme="dark"] .fc-other-month .fc-day-number { color: var(--dk-text-muted) !important; opacity: .6; }
html[data-theme="dark"] .fc-toolbar h2 { color: var(--dk-text-strong) !important; }

/* ── 11. 목록 표 (layout.css '목록 표' 절 — 흰 바탕·줄무늬 #f5f6f8 를 :is/:has 로 높은 명시도에 둔다) ── */
html[data-theme="dark"] table.table { background-color: transparent !important; }
html[data-theme="dark"] .table thead th,
html[data-theme="dark"] .table thead tr,
html[data-theme="dark"] .bg-gray-lighter {
	background-color: var(--dk-surface-2) !important;
	color: var(--dk-text-strong);
}
/* layout.css '목록 표 공통 디자인' 의 머리글 회색(!important)은 같은 선택자에 html 접두를 붙여야 이긴다 */
html[data-theme="dark"] table.table:is(:has(> thead), :not(:has(th)):has(> tbody > tr:first-child[style*="display:none"])) > thead > tr > th {
	background-color: var(--dk-surface-2) !important;
	color: var(--dk-text-strong);
}
/* 머리글 글자 — 화면 CSS 가 진한 회색(#575757 등)을 박아 둔 표가 있다. 인라인으로 색을 준 칸(토·일 빨강 등)은 둔다 */
html[data-theme="dark"] .table thead th:not([style*="color"]) { color: var(--dk-text-strong) !important; }
/* 일부러 칠한 행(.table-* 상태 클래스·인라인 바탕)은 두고 줄무늬만 바꾼다 */
html[data-theme="dark"] table.table > tbody > tr:not([class*="table-"]):not([style*="background"]) { background-color: transparent !important; }
html[data-theme="dark"] table.table > tbody > tr:nth-child(even):not([class*="table-"]):not([style*="background"]) { background-color: rgba(255, 255, 255, .03) !important; }
html[data-theme="dark"] table.table-hover > tbody > tr:hover { background-color: var(--dk-surface-3) !important; }

/* ── 12. 페이지 번호 (m-datatable pager) ── */
html[data-theme="dark"] .m-datatable__pager-link {
	background-color: var(--dk-surface-2) !important;
	color: var(--dk-text) !important;
}
html[data-theme="dark"] .m-datatable__pager-link--active {
	background-color: #3d63db !important;
	color: #fff !important;
}

/* ── 13. 탭 ── */
html[data-theme="dark"] .nav-tabs { border-color: var(--dk-border); }
html[data-theme="dark"] .nav-tabs .nav-link {
	background-color: var(--dk-surface-2) !important;
	border-color: var(--dk-border) !important;
	color: var(--dk-text-muted) !important;
}
html[data-theme="dark"] .nav-tabs .nav-link.active {
	background-color: var(--dk-surface) !important;
	border-bottom-color: var(--dk-surface) !important;
	color: var(--dk-text-strong) !important;
}

/* ── 14. 연한 색 버튼(btn-alt-*)·윤곽 버튼·배지·체크박스 ── */
html[data-theme="dark"] .btn-alt-success { background-color: rgba(120, 190, 80, .16) !important; border-color: rgba(120, 190, 80, .4) !important; color: #9fd27a !important; }
html[data-theme="dark"] .btn-alt-info { background-color: rgba(38, 198, 218, .16) !important; border-color: rgba(38, 198, 218, .4) !important; color: #7fd6e6 !important; }
html[data-theme="dark"] .btn-alt-warning { background-color: rgba(236, 180, 0, .16) !important; border-color: rgba(236, 180, 0, .4) !important; color: #e3c46a !important; }
html[data-theme="dark"] .btn-alt-danger { background-color: rgba(229, 83, 75, .16) !important; border-color: rgba(229, 83, 75, .4) !important; color: #f08a84 !important; }
html[data-theme="dark"] .btn-outline-secondary,
html[data-theme="dark"] .btn-light {
	background-color: var(--dk-surface-2) !important;
	border-color: var(--dk-border) !important;
	color: var(--dk-text) !important;
}
/* 진행 막대의 빈 칸(트랙) */
html[data-theme="dark"] .progress { background-color: var(--dk-surface-3); }
html[data-theme="dark"] .badge-secondary { background-color: var(--dk-surface-3) !important; color: var(--dk-text) !important; }
html[data-theme="dark"] .css-control-indicator { background-color: var(--dk-surface-2) !important; border-color: var(--dk-border) !important; }
/* 체크박스 — 테마(codebase.min.css)는 ✓ 를 늘 흰색으로 그려 두고 '체크 안 됨' 일 때 흰 바탕으로 가린다.
   위 줄이 바탕을 어둡게 덮으면 체크 안 된 칸에도 흰 ✓ 가 드러나 전부 체크된 것처럼 보이고,
   같은 !important 가 테마의 '체크됨' 파란 바탕까지 덮어 두 상태를 구별할 수 없었다.
   체크 안 됨은 ✓ 를 가리고, 체크됨은 테마의 파란 바탕을 되살린다. (라디오는 점을 opacity 로 가려 영향 없음) */
html[data-theme="dark"] .css-checkbox .css-control-input:not(:checked) ~ .css-control-indicator::after { color: transparent; }
html[data-theme="dark"] .css-checkbox .css-control-input:checked ~ .css-control-indicator {
	background-color: #3f9ce8 !important;
	border-color: #1776c3 !important;
}
/* 흰 글자를 얹는 성공 배지 — Dark 의 success(#5fb35a)는 어두운 바탕 글자용이라 배지 바탕으로는 한 단계 진하게 */
html[data-theme="dark"] .badge-success,
html[data-theme="dark"] .bg-success { background-color: #3d7d3a !important; }

/* ── 15. 드롭다운·select2·datepicker·알림창 ── */
html[data-theme="dark"] .dropdown-menu {
	background-color: var(--dk-surface-2);
	border-color: var(--dk-border);
	color: var(--dk-text);
}
html[data-theme="dark"] .dropdown-item { color: var(--dk-text); }
html[data-theme="dark"] .dropdown-item:hover,
html[data-theme="dark"] .dropdown-item:focus { background-color: var(--dk-surface-3); color: var(--dk-text-strong); }
html[data-theme="dark"] .select2-container .select2-selection__rendered { color: var(--dk-text) !important; }
html[data-theme="dark"] .select2-dropdown {
	background-color: var(--dk-surface-2) !important;
	border-color: var(--dk-border) !important;
	color: var(--dk-text);
}
html[data-theme="dark"] .select2-results__option { color: var(--dk-text) !important; }
/* 이미 고른 항목 — 플러그인(select2.min.css)의 연회색(#ddd) 바탕 위에 밝은 글자가 올라가 안 읽혔다.
   마우스를 올린 항목(아래 highlighted)이 이기도록 이 규칙을 먼저 둔다(명시도 같음) */
html[data-theme="dark"] .select2-results__option[aria-selected="true"] {
	background-color: var(--dk-surface-3) !important;
	color: var(--dk-text-strong) !important;
}
html[data-theme="dark"] .select2-results__option--highlighted[aria-selected] {
	background-color: var(--dk-primary-soft) !important;
	color: var(--dk-primary-text) !important;
}
html[data-theme="dark"] .select2-search__field { background-color: var(--dk-surface); color: var(--dk-text); border-color: var(--dk-border) !important; }
html[data-theme="dark"] .datepicker-dropdown,
html[data-theme="dark"] .bootstrap-datetimepicker-widget {
	background-color: var(--dk-surface-2) !important;
	border-color: var(--dk-border) !important;
	color: var(--dk-text) !important;
}
html[data-theme="dark"] .datepicker table tr td.day:hover,
html[data-theme="dark"] .datepicker table tr th:hover { background-color: var(--dk-surface-3) !important; }
html[data-theme="dark"] .datepicker table tr td.old,
html[data-theme="dark"] .datepicker table tr td.new { color: var(--dk-text-muted) !important; }
/* 범위 달력(.input-daterange) — 플러그인(bootstrap-datepicker3.min.css)의 흰 범위 칸·노란 오늘·회색 끝날,
   주말 빨강·파랑(td:nth-child(1)/(7))을 다크 바탕에 맞춘다. 시작일(파랑 .active)은 그대로 둔다 */
html[data-theme="dark"] .datepicker td:nth-child(1) { color: #f08a84 !important; }
html[data-theme="dark"] .datepicker td:nth-child(7) { color: var(--dk-primary-text) !important; }
/* 주말 색도 !important 라 고른 날(파랑·회색 칸) 위에서는 흰 글자로 되돌린다 */
html[data-theme="dark"] .datepicker table tr td.day:is(.active, .selected) { color: #fff !important; }
html[data-theme="dark"] .datepicker table tr td.range { background-color: var(--dk-primary-soft); border-color: var(--dk-primary-soft); color: var(--dk-text-strong); }
html[data-theme="dark"] .datepicker table tr td.today { background-color: #4a3b1d; border-color: #4a3b1d; color: #f5cf8a; }
html[data-theme="dark"] .datepicker table tr td.range.today { background-color: #5a4520; border-color: #5a4520; color: #f5cf8a; }
html[data-theme="dark"] .datepicker table tr td.selected:not(.active) { background-color: #4b535f; border-color: #4b535f; color: var(--dk-text-strong); }
html[data-theme="dark"] .datepicker table tr td span:is(:hover, .focused) { background-color: var(--dk-surface-3); }
html[data-theme="dark"] .swal2-popup { background-color: var(--dk-surface) !important; }
html[data-theme="dark"] .swal2-title,
html[data-theme="dark"] .swal2-content,
html[data-theme="dark"] .swal2-html-container { color: var(--dk-text) !important; }

/* ── 16. 편집기 (summernote — 게시판 글쓰기) ── */
html[data-theme="dark"] .note-editor.note-frame { border-color: var(--dk-border) !important; }
html[data-theme="dark"] .note-editor .note-toolbar-wrapper,
html[data-theme="dark"] .note-editor .note-toolbar,
html[data-theme="dark"] .note-editor .note-statusbar {
	background-color: var(--dk-surface-2) !important;
	border-color: var(--dk-border) !important;
}
html[data-theme="dark"] .note-editor .note-editable {
	background-color: var(--dk-surface) !important;
	color: var(--dk-text) !important;
}

/* ── 17. 호버·포커스 — 위에서 !important 로 칠한 바탕이 원래 테마의 :hover 를 덮으므로 다크용으로 다시 정의한다 ── */
/* 머리띠 버튼 — 라이트(layout.css)와 같은 신호: 파란 테두리 + 옅은 파란 바탕. 알림 목록이 열린 동안도 유지 */
html[data-theme="dark"] .side-user-v2-page #page-header #adminBtn:is(:hover, :focus, :active),
html[data-theme="dark"] .side-user-v2-page #page-header .btn-work-state-chk:is(:hover, :focus, :active),
html[data-theme="dark"] .side-user-v2-page #page-header #btnHardReload:is(:hover, :focus, :active),
html[data-theme="dark"] .side-user-v2-page #page-header #btnSelWorkPlanQuick:is(:hover, :focus, :active),
html[data-theme="dark"] .side-user-v2-page #page-header #btnNotificationArea:is(:hover, :focus, :active),
html[data-theme="dark"] .side-user-v2-page #page-header #btnNotificationArea:has(+ #notificationArea.show),
html[data-theme="dark"] .side-user-v2-page #page-header [data-action="sidebar_toggle"]:is(:hover, :focus, :active) {
	background-color: rgba(79, 140, 240, .14) !important;
	border-color: #4f8cf0 !important;
	color: var(--dk-text-strong) !important;
}
/* 사이드바 [내 정보]·[로그아웃] — 라이트처럼 테두리로 호버를 알린다 */
html[data-theme="dark"] #sidebar .content-side-user .link-effect:not(#topUserNm):is(:hover, :focus) {
	border-color: #4f8cf0 !important;
	color: var(--dk-text-strong) !important;
}
/* 연한 색 버튼 — 바탕·테두리를 한 단계 진하게, 글자는 더 밝게 */
html[data-theme="dark"] .btn-alt-primary:is(:hover, :focus, :active):not(:disabled) { background-color: #26365c !important; border-color: #3a5aa8 !important; color: #b9ccff !important; }
html[data-theme="dark"] .btn-alt-secondary:is(:hover, :focus, :active):not(:disabled) { background-color: var(--dk-surface-3) !important; border-color: #3a414c !important; color: var(--dk-text-strong) !important; }
html[data-theme="dark"] .btn-alt-success:is(:hover, :focus, :active):not(:disabled) { background-color: rgba(120, 190, 80, .28) !important; border-color: rgba(120, 190, 80, .65) !important; color: #b8e39a !important; }
html[data-theme="dark"] .btn-alt-info:is(:hover, :focus, :active):not(:disabled) { background-color: rgba(38, 198, 218, .28) !important; border-color: rgba(38, 198, 218, .65) !important; color: #a3e4ef !important; }
html[data-theme="dark"] .btn-alt-warning:is(:hover, :focus, :active):not(:disabled) { background-color: rgba(236, 180, 0, .28) !important; border-color: rgba(236, 180, 0, .65) !important; color: #f0d68a !important; }
html[data-theme="dark"] .btn-alt-danger:is(:hover, :focus, :active):not(:disabled) { background-color: rgba(229, 83, 75, .28) !important; border-color: rgba(229, 83, 75, .65) !important; color: #f6aaa5 !important; }
html[data-theme="dark"] .work-detail-col .work-req-options #btnEarlyWorkPopupOpen:is(:hover, :focus, :active) { background-color: rgba(150, 100, 230, .3); border-color: rgba(150, 100, 230, .7); color: #d6c2f9; }
html[data-theme="dark"] .btn-outline-secondary:is(:hover, :focus, :active):not(:disabled),
html[data-theme="dark"] .btn-light:is(:hover, :focus, :active):not(:disabled) {
	background-color: var(--dk-surface-3) !important;
	border-color: #3a414c !important;
	color: var(--dk-text-strong) !important;
}
/* 탭·페이지 번호 */
html[data-theme="dark"] .nav-tabs .nav-link:not(.active):is(:hover, :focus) {
	background-color: var(--dk-surface-3) !important;
	color: var(--dk-text-strong) !important;
}
html[data-theme="dark"] .m-datatable__pager-link:not(.m-datatable__pager-link--active):not(.m-datatable__pager-link--disabled):hover {
	background-color: var(--dk-surface-3) !important;
	color: var(--dk-text-strong) !important;
}
/* 업무 시작 후 화면 — 상태 버튼·일일 근무 현황 행 버튼 */
html[data-theme="dark"] #workStCdBtnList .btn:is(:hover, :focus):not(:disabled) { background-color: var(--dk-surface-3); border-color: #3a414c; color: #b9ccff; }
html[data-theme="dark"] #curWorkInfoList .daily-row-btn-edit:is(:hover, :focus) { background-color: #26365c; border-color: #3a5aa8; color: #b9ccff; }
html[data-theme="dark"] #curWorkInfoList .daily-row-btn-del:is(:hover, :focus) { background-color: rgba(229, 83, 75, .28); border-color: rgba(229, 83, 75, .65); color: #f6aaa5; }
/* 신청 팝업 시간 버튼 */
html[data-theme="dark"] .rqp [name='btnSetType']:hover { background-color: var(--dk-surface-3); color: var(--dk-text-strong); }

/* ── 18. 로딩 가림막 — 다크에서 페이지를 넘길 때 밝은 막이 번쩍이던 것 ──
   사용자 화면 #page-loader: header.jsp 인라인 style 이 청록(#2facb2)으로 고정하고, codebase 가 흰 동그라미를
   그린 뒤 0.35초 걸려 위로 걷는다. data-theme 은 body 를 그리기 전에 붙으므로 다크에서는 처음부터 그리지 않는다
   (관리자 셸을 쓰지 않는 레거시 관리자 화면의 같은 막도 함께).
   관리자 셸 #ttreeShellLoading: 반투명 흰 막을 투명하게 둔다 — 옛 본문 클릭을 막는 역할은 그대로다.
   스피너는 0.3초 넘게 걸릴 때만 나타나게 해 빠른 이동에서는 아무것도 보이지 않는다. */
html[data-theme="dark"] #page-loader { display: none !important; }
html[data-theme="dark"] #ttreeShellLoading { background-color: transparent; }
html[data-theme="dark"] #ttreeShellLoading.is-active .ttree-shell-spinner {
	opacity: 0;
	animation: ttree-shell-spin .8s linear infinite, dk-shell-spinner-delay 0s linear .3s forwards;
}
@keyframes dk-shell-spinner-delay { to { opacity: 1; } }

/* ==========================================================================
   화면별 절 — 화면 <style> 블록의 고정색이 라이트로 남는 자리마다
   ========================================================================== */

/* ── /main (work/work-index.jsp <style> 블록) ─────────────────────────── */
html[data-theme="dark"] .blueBox { background: linear-gradient(180deg, #2d4a86 28%, #1b2c53 100%) !important; }
html[data-theme="dark"] .card-blue,
html[data-theme="dark"] .card-green,
html[data-theme="dark"] .card-orange,
html[data-theme="dark"] .card-purple { background-color: var(--dk-surface-2) !important; }
/* 색 그림자는 어두운 바탕에서 번진다 — 검정 그림자 + 색 테두리 링으로만 남긴다(시안) */
html[data-theme="dark"] .card-blue { box-shadow: 0 0 0 1px rgba(90, 140, 255, .22), 0 8px 18px rgba(0, 0, 0, .45) !important; }
html[data-theme="dark"] .card-green { box-shadow: 0 0 0 1px rgba(70, 200, 150, .22), 0 8px 18px rgba(0, 0, 0, .45) !important; }
html[data-theme="dark"] .card-orange { box-shadow: 0 0 0 1px rgba(255, 180, 80, .22), 0 8px 18px rgba(0, 0, 0, .45) !important; }
html[data-theme="dark"] .card-purple { box-shadow: 0 0 0 1px rgba(170, 100, 255, .22), 0 8px 18px rgba(0, 0, 0, .45) !important; }

/* ── /main 업무 시작 후 (work-user-detail-view.jsp, layout.css '.work-detail-col' 절) ── */
/* 카드 머리띠 — layout.css 가 흰 바탕을 !important 로 칠한다 */
html[data-theme="dark"] .work-detail-col > .block:has(> .block-header.bg-body-light) { border-color: var(--dk-border); }
html[data-theme="dark"] .work-detail-col > .block > .block-header.bg-body-light {
	background-color: var(--dk-surface-2) !important;
	box-shadow: inset 0 -1px 0 var(--dk-border);
}
html[data-theme="dark"] .work-detail-col > .block > .block-header.bg-body-light .block-title { color: var(--dk-text-strong); }
html[data-theme="dark"] .work-detail-col > .block > .block-header.section-collapse-header .section-collapse-toggle { color: var(--dk-text-muted); }
html[data-theme="dark"] .work-detail-col > .block > .block-header.section-collapse-header:hover:not(:has(.work-req-options:hover)) {
	background-color: var(--dk-surface-3) !important;
}
/* 상단 근무 상태 칸 — 근무중 글자·[점심시간] 같은 상태 버튼 */
html[data-theme="dark"] .work-header-status-box { background-color: var(--dk-primary-soft) !important; }
html[data-theme="dark"] .work-header-status-box .text-primary,
html[data-theme="dark"] .work-header-status-box .fa { color: var(--dk-primary-text) !important; }
html[data-theme="dark"] #workStCdBtnList .btn {
	background-color: var(--dk-surface-2);
	border-color: var(--dk-border);
	color: var(--dk-primary-text);
}
/* 일일 근무 현황 행 동작 버튼 */
html[data-theme="dark"] #curWorkInfoList .daily-row-btn-edit {
	background-color: var(--dk-primary-soft);
	border-color: #2a3a63;
	color: var(--dk-primary-text);
}
html[data-theme="dark"] #curWorkInfoList .daily-row-btn-del {
	background-color: rgba(229, 83, 75, .16);
	border-color: rgba(229, 83, 75, .4);
	color: #f08a84;
}
/* 근무 신청 버튼 — 색은 공용 btn-alt-* 다크 규칙(14절)이 칠한다. 여기는 그림자와 [조기출근] 보라만 */
html[data-theme="dark"] .work-detail-col .work-req-options .btn { box-shadow: none; }
html[data-theme="dark"] .work-detail-col .work-req-options #btnEarlyWorkPopupOpen { background-color: rgba(150, 100, 230, .18); border-color: rgba(150, 100, 230, .45); color: #c3a6f5; }
/* 근무 시간 현황 막대 — 빈 칸(트랙)과 구분선 */
html[data-theme="dark"] .work-detail-col .progress { background-color: var(--dk-surface-3); }
html[data-theme="dark"] .work-detail-col .border-top { border-color: var(--dk-border) !important; }
/* 주간 근무 신청 표(일반 근무제) */
html[data-theme="dark"] #weekSchedul { border-color: var(--dk-border) !important; }
html[data-theme="dark"] #weekSchedul .table { background-color: var(--dk-surface); }
html[data-theme="dark"] #weekSchedul th,
html[data-theme="dark"] #weekSchedul td { border-color: var(--dk-border) !important; }
html[data-theme="dark"] #weekSchedul thead > tr,
html[data-theme="dark"] #weekSchedul thead th { background-color: var(--dk-surface-2) !important; }
html[data-theme="dark"] #workVcatnInfoList > tr { background-color: var(--dk-surface) !important; }
html[data-theme="dark"] #workVcatnInfoList > tr:nth-child(even) { background-color: var(--dk-surface-2) !important; }
html[data-theme="dark"] #workVcatnInfoList > tr#no_1 { background-color: #3a3216 !important; }

/* ── 내 근무 내역 (work-my-history-view.jsp <style> 블록·인라인 색) ───────────
   일별 요약 행은 인라인 background #e7e7e7(PC)과 <style> 의 #fff !important(575px 이하)로 칠해져
   공용 표 규칙(일부러 칠한 행 제외)이 닿지 않는다 */
html[data-theme="dark"] div:has(> .period-search-group) { border-color: var(--dk-border) !important; }
html[data-theme="dark"] #dailyWorkInfoList > tbody.js-table-sections-header > tr:first-child {
	background-color: var(--dk-surface-2) !important;
	border-bottom-color: var(--dk-border) !important;
}
html[data-theme="dark"] #dailyWorkInfoList > tbody.js-table-sections-header { border-top-color: var(--dk-border) !important; }
html[data-theme="dark"] #dailyWorkInfoList > tbody.is-nowork > tr:first-child { background-color: var(--dk-surface) !important; }
html[data-theme="dark"] #dailyWorkInfoList tr[name="dailyWorkDtlInfoItemAdd"],
html[data-theme="dark"] #dailyWorkInfoList tr[name="dailyWorkSchdulAdd"] {
	background-color: var(--dk-surface) !important;
	border-bottom-color: var(--dk-border) !important;
}
html[data-theme="dark"] #dailyWorkInfoList .wh-m-date,
html[data-theme="dark"] #dailyWorkInfoList td#dailyWorkTime #workTotTime { color: var(--dk-text-strong); }
html[data-theme="dark"] #dailyWorkInfoList > tbody.is-nowork td#dailyWorkTime #workTotTime,
html[data-theme="dark"] #dailyWorkInfoList .wh-m-sub,
html[data-theme="dark"] #dailyWorkInfoList td#dailyWorkTime #totTimeSpan::after { color: var(--dk-text-muted); }
html[data-theme="dark"] #dailyWorkInfoList .wh-m-sub b { color: #f0a35a; }
html[data-theme="dark"] #dailyWorkInfoList .wh-m-sub u { color: #7fc4e6; }

/* ── 연차사용계획서 (popup/vcatn-plan-view.jsp <style> 블록·인라인 색) ─────── */
html[data-theme="dark"] #main-container > .content { background-color: var(--dk-page) !important; }
html[data-theme="dark"] .content-heading { color: var(--dk-text-strong); border-color: var(--dk-border); }
html[data-theme="dark"] .vp-card { background: var(--dk-surface); box-shadow: 0 0 0 1px var(--dk-border); }
html[data-theme="dark"] .vp-card-header {
	background: var(--dk-surface-2);
	border-bottom-color: var(--dk-border);
}
html[data-theme="dark"] .vp-card-header h6,
html[data-theme="dark"] .vp-stat-label { color: var(--dk-text-strong); }
html[data-theme="dark"] .vp-notice-text,
html[data-theme="dark"] .vp-stat-value,
html[data-theme="dark"] .vp-period { color: var(--dk-text); }
html[data-theme="dark"] .vp-card .table thead th {
	background: var(--dk-surface-2) !important;
	border-bottom-color: var(--dk-border) !important;
	color: var(--dk-text-muted);
}
html[data-theme="dark"] .vp-card .table tbody td { border-color: var(--dk-border); color: var(--dk-text); }
html[data-theme="dark"] #totalCnt { color: var(--dk-text-muted) !important; }
html[data-theme="dark"] #btnVcatnPlanSave,
html[data-theme="dark"] #btnVcatnPlanRegist,
html[data-theme="dark"] #btnCloseVcatnPlan {
	background-color: var(--dk-surface-3);
	border-color: var(--dk-border);
	color: var(--dk-text-strong);
}
html[data-theme="dark"] #btnVcatnPlanSave:hover:not(:disabled),
html[data-theme="dark"] #btnVcatnPlanRegist:hover:not(:disabled),
html[data-theme="dark"] #btnCloseVcatnPlan:hover:not(:disabled) { background-color: #343b46; border-color: #3a414c; color: #fff; }
html[data-theme="dark"] #btnVcatnPlanSave:disabled,
html[data-theme="dark"] #btnVcatnPlanRegist:disabled,
html[data-theme="dark"] #btnCloseVcatnPlan:disabled {
	background-color: var(--dk-surface-2);
	border-color: var(--dk-surface-2);
	color: var(--dk-text-muted);
}

/* ── 휴가 현황 보기 (popup/work-vcatn-list-view.jsp, vcatn-calendar.css .vcatn-cldr-page) ─ */
html[data-theme="dark"] .vcatn-cldr-page,
html[data-theme="dark"] #main-container.vcatn-cldr-main { background-color: var(--dk-page) !important; }
html[data-theme="dark"] .vcatn-cldr-page .vcatn-cldr-guide { color: var(--dk-text-muted); }
html[data-theme="dark"] .vcatn-cldr-page .vcatn-cldr-guide > .fa { color: var(--dk-primary-text); }
html[data-theme="dark"] .vcatn-cldr-page .vcatn-cldr-block {
	border-color: var(--dk-border);
	box-shadow: none;
}
html[data-theme="dark"] .vcatn-cldr-page .vcatn-cldr-block > .block-header { border-bottom-color: var(--dk-border); }
html[data-theme="dark"] .vcatn-cldr-page .vcatn-cldr-block > .block-content { background-color: var(--dk-surface) !important; }
/* 달력 머리 — 제목·이전/다음·[오늘]·보기 전환 */
html[data-theme="dark"] .vcatn-cldr-page .fc-toolbar h2 { color: var(--dk-text-strong) !important; }
html[data-theme="dark"] .vcatn-cldr-page .fc-toolbar .fc-prev-button,
html[data-theme="dark"] .vcatn-cldr-page .fc-toolbar .fc-next-button { color: var(--dk-text); }
html[data-theme="dark"] .vcatn-cldr-page .fc-toolbar .fc-prev-button:active,
html[data-theme="dark"] .vcatn-cldr-page .fc-toolbar .fc-next-button:active { background-color: var(--dk-surface-3); color: var(--dk-primary-text); }
html[data-theme="dark"] .vcatn-cldr-page .fc-toolbar .fc-today-button {
	background-color: var(--dk-surface-2);
	border-color: var(--dk-border);
	color: var(--dk-text);
}
html[data-theme="dark"] .vcatn-cldr-page .fc-toolbar .fc-today-button:hover:not(:disabled) {
	background-color: var(--dk-surface-3);
	border-color: var(--dk-border);
	color: var(--dk-primary-text);
}
html[data-theme="dark"] .vcatn-cldr-page .fc-right .fc-button-group { background-color: var(--dk-surface-2); }
html[data-theme="dark"] .vcatn-cldr-page .fc-right .fc-button-group > .fc-button { color: var(--dk-text-muted); }
html[data-theme="dark"] .vcatn-cldr-page .fc-right .fc-button-group > .fc-button:hover:not(.fc-button-active) { color: var(--dk-text-strong); }
html[data-theme="dark"] .vcatn-cldr-page .fc-right .fc-button-group > .fc-button:not(:disabled).fc-button-active {
	background-color: var(--dk-surface-3);
	box-shadow: none;
	color: var(--dk-primary-text);
}
/* 달력 몸통 */
html[data-theme="dark"] .vcatn-cldr-page .fc-view-container {
	background-color: var(--dk-surface);
	border-color: var(--dk-border);
}
html[data-theme="dark"] .vcatn-cldr-page .fc-unthemed td,
html[data-theme="dark"] .vcatn-cldr-page .fc-unthemed th,
html[data-theme="dark"] .vcatn-cldr-page .fc-unthemed .fc-row { border-color: var(--dk-border) !important; }
html[data-theme="dark"] .vcatn-cldr-page .fc-day-header { background-color: var(--dk-surface-2); color: var(--dk-text-muted); }
html[data-theme="dark"] .vcatn-cldr-page .fc-day-header.fc-sat,
html[data-theme="dark"] .vcatn-cldr-page td.fc-sat { color: #6fb3f0; }
html[data-theme="dark"] .vcatn-cldr-page .fc-day-header.fc-sun,
html[data-theme="dark"] .vcatn-cldr-page td.fc-sun { color: #f08a84; }
html[data-theme="dark"] .vcatn-cldr-page .fc-day-number { color: var(--dk-text) !important; }
html[data-theme="dark"] .vcatn-cldr-page td.fc-sat > .fc-day-number { color: #6fb3f0 !important; }
html[data-theme="dark"] .vcatn-cldr-page td.fc-sun > .fc-day-number { color: #f08a84 !important; }
html[data-theme="dark"] .vcatn-cldr-page .fc-unthemed td.fc-other-month { background-color: #181c22 !important; }
html[data-theme="dark"] .vcatn-cldr-page .fc-other-month > .fc-day-number { color: var(--dk-text-muted) !important; opacity: .7; }
html[data-theme="dark"] .vcatn-cldr-page .fc-unthemed td.fc-today { background-color: #1a2436 !important; }
html[data-theme="dark"] .vcatn-cldr-page .fc-today > .fc-day-number { background-color: #3d63db; color: #fff !important; }
html[data-theme="dark"] .vcatn-cldr-page .fc-more { color: var(--dk-text-muted); }
html[data-theme="dark"] .vcatn-cldr-page .fc-list-heading td { background-color: var(--dk-surface-2) !important; color: var(--dk-text-muted); }
html[data-theme="dark"] .vcatn-cldr-page .fc-list-empty { background-color: var(--dk-surface); color: var(--dk-text-muted); }
html[data-theme="dark"] .vcatn-cldr-page .fc-list-item:hover td { background-color: var(--dk-surface-3); }

/* ── 내 신청 내역 (work-sanctn-view) ──────────────────────────────────── */
html[data-theme="dark"] .sanctn-card .font-w700 { color: var(--dk-text-strong) !important; }

/* ── 화면 테마 (dsgn-theme) — 미리보기(.dsgn-main-mock)는 테마 견본이라 덮지 않는다 ── */
html[data-theme="dark"] .dsgn-theme-status,
html[data-theme="dark"] .dsgn-card {
	background-color: var(--dk-surface-2) !important;
	border-color: var(--dk-border) !important;
	color: var(--dk-text);
}
html[data-theme="dark"] .dsgn-card-title,
html[data-theme="dark"] .dsgn-theme-status-text { color: var(--dk-text-strong) !important; }

/* ── 승인 관리·참조 관리 (결재 요약 띠) ──────────────────────────────── */
html[data-theme="dark"] .sanctn-summary {
	background-color: var(--dk-surface-2) !important;
	border-color: var(--dk-border) !important;
	color: var(--dk-text);
}
html[data-theme="dark"] .sanctn-summary .sanctn-summary-clear { color: var(--dk-text-muted) !important; }

/* ── 내 정보 (user-profile_v2) ──────────────────────────────────────── */
html[data-theme="dark"] .settings-section {
	background-color: var(--dk-surface) !important;
	border-color: var(--dk-border) !important;
}

/* ── 게시판 상세 — 답글 회색 판 ─────────────────────────────────────── */
html[data-theme="dark"] .bbs-detail-page #replyList .bbs-cm-item .bbs-cm-item { background-color: var(--dk-surface-2); }

/* ── 신청 팝업 (request-popup-theme.css .rqp) ─────────────────────────
   머리줄은 [근무 신청] 버튼 색을 그대로 쓰는 규칙(변수 --rqp-head-*)이라 변수만 다크용으로 바꾼다.
   값은 위 '근무 신청 버튼' 다크 색과 같다. */
html[data-theme="dark"] .rqp .rqp-header { background-color: var(--rqp-head-bg, var(--dk-surface-2)) !important; }
html[data-theme="dark"] .rqp .rqp-header-comment,
html[data-theme="dark"] .rqp .rqp-header-extn { --rqp-head-bg: #1f2c4a; --rqp-head-fg: #8fb0ff; --rqp-head-line: #2a3a63; }
html[data-theme="dark"] .rqp .rqp-header-early { --rqp-head-bg: #2a2140; --rqp-head-fg: #c3a6f5; --rqp-head-line: #3e3061; }
html[data-theme="dark"] .rqp .rqp-header-holiday { --rqp-head-bg: #332b12; --rqp-head-fg: #e3c46a; --rqp-head-line: #4d4119; }
html[data-theme="dark"] .rqp .rqp-header-bsrp { --rqp-head-bg: #22301b; --rqp-head-fg: #9fd27a; --rqp-head-line: #344a28; }
html[data-theme="dark"] .rqp .rqp-header-vcatn { --rqp-head-bg: #3a1f1e; --rqp-head-fg: #f08a84; --rqp-head-line: #5a2c2a; }
html[data-theme="dark"] .rqp .rqp-header-diff { --rqp-head-bg: #12323a; --rqp-head-fg: #7fd6e6; --rqp-head-line: #1b4a57; }
html[data-theme="dark"] .rqp .rqp-header-allowance,
html[data-theme="dark"] .rqp .rqp-header-selwork,
html[data-theme="dark"] .rqp .rqp-header-workdtl { --rqp-head-bg: #2a3039; --rqp-head-fg: #e8ecf2; --rqp-head-line: #3a414c; }
html[data-theme="dark"] .rqp .rqp-body { background-color: var(--dk-page); }
html[data-theme="dark"] .rqp .rqp-group,
html[data-theme="dark"] .rqp .rqp-daylist,
html[data-theme="dark"] #modalSelWorkReq .rqp-steps {
	background-color: var(--dk-surface);
	border-color: var(--dk-border);
}
html[data-theme="dark"] .rqp .rqp-group-title,
html[data-theme="dark"] .rqp .rqp-kv-value,
html[data-theme="dark"] .rqp .rqp-value:disabled,
html[data-theme="dark"] .rqp .rqp-cell-select { color: var(--dk-text-strong); }
html[data-theme="dark"] .rqp .rqp-kv-value[class*="badge-"] { color: #fff; }
html[data-theme="dark"] .rqp .rqp-row-label,
html[data-theme="dark"] .rqp .rqp-hint,
html[data-theme="dark"] .rqp .rqp-kv-label,
html[data-theme="dark"] .rqp .rqp-total,
html[data-theme="dark"] .rqp .rqp-group-title > i,
html[data-theme="dark"] .rqp .rqp-colon,
html[data-theme="dark"] .rqp .rqp-unit,
html[data-theme="dark"] .rqp .rqp-range-sep { color: var(--dk-text-muted); }
html[data-theme="dark"] .rqp .rqp-total > strong { color: var(--dk-primary-text); }
html[data-theme="dark"] .rqp .rqp-group-hint { color: #f08a84; }
html[data-theme="dark"] .rqp .rqp-date { background-color: var(--dk-surface-2); }
html[data-theme="dark"] .rqp .form-control[readonly]:not(.rqp-date),
html[data-theme="dark"] .rqp .select2-container--disabled .select2-selection--single {
	background-color: var(--dk-surface-3) !important;
	color: var(--dk-text-muted) !important;
}
html[data-theme="dark"] .rqp .rqp-approvers li {
	background-color: var(--dk-primary-soft);
	color: var(--dk-text);
}
html[data-theme="dark"] .rqp .rqp-approvers li > span:not(:last-child) { color: var(--dk-text-muted); }
html[data-theme="dark"] .rqp .rqp-note {
	background-color: rgba(229, 83, 75, .12);
	color: #f08a84;
}
html[data-theme="dark"] .rqp .rqp-footer {
	background-color: var(--dk-surface);
	border-color: var(--dk-border);
}
html[data-theme="dark"] .rqp [name='btnSetType'] {
	background-color: var(--dk-surface-2);
	border-color: var(--dk-border);
	color: var(--dk-text);
}
html[data-theme="dark"] .rqp [name='btnSetType']:focus {
	background-color: var(--dk-primary-soft);
	color: var(--dk-primary-text);
}
html[data-theme="dark"] .rqp .rqp-table thead th {
	background-color: var(--dk-surface-2) !important;
	color: var(--dk-text-muted);
}
html[data-theme="dark"] .rqp-dropdown .select2-results__option--highlighted[aria-selected] {
	background-color: var(--dk-primary-soft) !important;
	color: var(--dk-primary-text) !important;
}
html[data-theme="dark"] .rqp-dropdown .select2-results__option[aria-selected="true"] {
	background-color: #3d63db !important;
	color: #fff !important;
}

/* ==========================================================================
   관리자 화면 (admin_header.jsp · admin-shell · admin-layout.css) — 1차 묶음
   ========================================================================== */

/* ── 관리자 틀 — 머리띠 경로·프로필 동그라미 ── */
html[data-theme="dark"] .header-path-parent { color: var(--dk-text-muted); }
html[data-theme="dark"] .header-path-sep { color: #5d6673; }
html[data-theme="dark"] .header-path-leaf { color: var(--dk-text-strong) !important; }
html[data-theme="dark"] #sidebar .content-side-user .item-circle.bg-primary-lighter { background-color: var(--dk-primary-soft) !important; }
html[data-theme="dark"] #sidebar .content-side-user .item-circle .text-primary { color: var(--dk-primary-text) !important; }

/* ── 역할별 버튼 색(layout.css '버튼 색 체계') — 흰 바탕을 쓰는 상태만 다크로. 조회 파랑·실행 진녹색 단색은 그대로 ── */
html[data-theme="dark"] #btnWorkTimeInfoModify:disabled,
html[data-theme="dark"] #btnWorkTimeInfoModify:disabled:is(:hover, :focus),
html[data-theme="dark"] #shiftGroupUptBtn:disabled,
html[data-theme="dark"] #shiftGroupUptBtn:disabled:is(:hover, :focus) {
	background-color: var(--dk-surface-2) !important;
	border-color: rgba(120, 190, 80, .35) !important;
	color: #9fd27a !important;
}
html[data-theme="dark"] #btnWorkTimeInfoDelete:disabled,
html[data-theme="dark"] #btnWorkTimeInfoDelete:disabled:is(:hover, :focus),
html[data-theme="dark"] #shiftGroupDelBtn:disabled,
html[data-theme="dark"] #shiftGroupDelBtn:disabled:is(:hover, :focus) {
	background-color: var(--dk-surface-2) !important;
	border-color: rgba(229, 83, 75, .35) !important;
	color: #f08a84 !important;
}
html[data-theme="dark"] .js-row-save {
	background-color: var(--dk-surface-2);
	border-color: rgba(120, 190, 80, .4);
	color: #9fd27a;
}
html[data-theme="dark"] .js-row-save:is(:hover, :focus) {
	background-color: rgba(120, 190, 80, .2);
	border-color: rgba(120, 190, 80, .65);
	color: #b8e39a;
}
/* 내보내기(Excel·복사 등) — 연녹색 톤을 어두운 녹색 톤으로 */
html[data-theme="dark"] .modal #btnSampleFileDown,
html[data-theme="dark"] #btnExcelDownload,
html[data-theme="dark"] #btnExcelFormDownload,
html[data-theme="dark"] #btnHrsWorkExcelDown,
html[data-theme="dark"] #btnAuditExcel,
html[data-theme="dark"] #btnDeptExcelSample,
html[data-theme="dark"] #btnListCopy {
	background-color: rgba(120, 190, 80, .16) !important;
	border-color: rgba(120, 190, 80, .4) !important;
	color: #9fd27a !important;
}
html[data-theme="dark"] .modal #btnSampleFileDown:is(:hover, :focus),
html[data-theme="dark"] #btnExcelDownload:is(:hover, :focus),
html[data-theme="dark"] #btnExcelFormDownload:is(:hover, :focus),
html[data-theme="dark"] #btnHrsWorkExcelDown:is(:hover, :focus),
html[data-theme="dark"] #btnAuditExcel:is(:hover, :focus),
html[data-theme="dark"] #btnDeptExcelSample:is(:hover, :focus),
html[data-theme="dark"] #btnListCopy:is(:hover, :focus) {
	background-color: rgba(120, 190, 80, .28) !important;
	border-color: rgba(120, 190, 80, .65) !important;
	color: #b8e39a !important;
}

/* ── 권한 칩(.role-badge) — 파스텔 바탕을 같은 계열의 어두운 톤으로 ── */
html[data-theme="dark"] .role-badge { background-color: var(--dk-surface-3); border-color: var(--dk-border); color: var(--dk-text); }
html[data-theme="dark"] .role-badge.role-super { background-color: rgba(170, 100, 255, .16); border-color: rgba(170, 100, 255, .4); color: #c9a8f7; }
html[data-theme="dark"] .role-badge.role-admin { background-color: rgba(229, 83, 75, .16); border-color: rgba(229, 83, 75, .4); color: #f08a84; }
html[data-theme="dark"] .role-badge.role-mngr { background-color: rgba(38, 198, 218, .16); border-color: rgba(38, 198, 218, .4); color: #7fd6e6; }
html[data-theme="dark"] .role-badge.role-user { background-color: rgba(120, 190, 80, .16); border-color: rgba(120, 190, 80, .4); color: #9fd27a; }

/* ── 일별 종합 근무 내역 — 현황판 안내 줄 ── */
html[data-theme="dark"] .status-card-note { color: var(--dk-text-muted); }
html[data-theme="dark"] .status-card-note .scn-hint b { color: var(--dk-text-strong); }
html[data-theme="dark"] .status-card-note .scn-active { background-color: var(--dk-primary-soft); color: var(--dk-primary-text); }

/* ── 실시간 현황 조회 — DataTables 도구줄·페이지 번호(admin-layout.css 의 화면 한정 규칙과 같은 선택자로) ── */
html[data-theme="dark"] #page-container.admin-view-all-status-view #main-container .dataTables_wrapper .dataTables_length label,
html[data-theme="dark"] #page-container.admin-view-all-status-view #main-container .dataTables_wrapper .dataTables_filter label,
html[data-theme="dark"] #page-container.admin-view-all-status-view #main-container .dataTables_wrapper .dataTables_info { color: var(--dk-text-muted); }
html[data-theme="dark"] #page-container.admin-view-all-status-view #main-container .dataTables_wrapper .dataTables_paginate .paginate_button { color: var(--dk-text); }
html[data-theme="dark"] #page-container.admin-view-all-status-view #main-container .dataTables_wrapper .dataTables_paginate .paginate_button:hover {
	background-color: var(--dk-surface-3);
	border-color: var(--dk-surface-3);
	color: var(--dk-text-strong);
}
html[data-theme="dark"] #page-container.admin-view-all-status-view #main-container .dataTables_wrapper .dataTables_paginate .paginate_button:is(.first, .previous, .next, .last) {
	background-color: var(--dk-surface-2);
	border-color: var(--dk-border);
	color: var(--dk-text);
}
html[data-theme="dark"] #page-container.admin-view-all-status-view #main-container .dataTables_wrapper .dataTables_paginate .paginate_button:is(.first, .previous, .next, .last):hover {
	background-color: var(--dk-surface-3);
	border-color: #3a414c;
	color: var(--dk-text-strong);
}
html[data-theme="dark"] #page-container.admin-view-all-status-view #main-container .dataTables_wrapper .dataTables_paginate .paginate_button.current,
html[data-theme="dark"] #page-container.admin-view-all-status-view #main-container .dataTables_wrapper .dataTables_paginate .paginate_button.current:hover {
	background-color: #3d63db;
	border-color: #3d63db;
}
html[data-theme="dark"] #page-container.admin-view-all-status-view #main-container .dataTables_wrapper .dataTables_paginate .paginate_button.disabled,
html[data-theme="dark"] #page-container.admin-view-all-status-view #main-container .dataTables_wrapper .dataTables_paginate .paginate_button.disabled:is(:hover, :active) {
	background-color: var(--dk-surface);
	border-color: var(--dk-border);
	color: #4b535f !important;
}

/* ── 실시간 현황 통계·근무자 통계 — 차트를 담는 회색 판. 차트 안 색은 dsgn-chart-theme.js 가 칠한다 ── */
html[data-theme="dark"] #dashBoardDiv { background-color: var(--dk-page) !important; }

/* ── 관리자 설정 팝업 공용(.wsp, admin-popup-theme.css) — 부서 선택 팝업이 거의 모든 관리자 화면에서 뜬다 ── */
html[data-theme="dark"] .wsp .modal-content { box-shadow: 0 12px 40px rgba(0, 0, 0, .6); }
html[data-theme="dark"] .wsp .wsp-body { background-color: var(--dk-page); }
html[data-theme="dark"] .wsp .wsp-notice { background-color: rgba(229, 83, 75, .12); border-color: rgba(229, 83, 75, .35); color: #f08a84; }
html[data-theme="dark"] .wsp .wsp-card,
html[data-theme="dark"] .wsp .wsp-footer { background-color: var(--dk-surface); border-color: var(--dk-border); }
html[data-theme="dark"] .wsp .wsp-card-title,
html[data-theme="dark"] .wsp .wsp-card-head { border-bottom-color: var(--dk-border); }
html[data-theme="dark"] .wsp .wsp-card-title { color: var(--dk-text-strong); }
html[data-theme="dark"] .wsp :is(.wsp-card-title > i, .wsp-label, .wsp-switch-text, .wsp-tilde, .wsp-rest-label, .wsp-hint-mute,
	.wsp-tags-empty, .wsp-rows-empty, .wsp-legend-item) { color: var(--dk-text-muted); }
html[data-theme="dark"] .wsp :is(.wsp-req, .wsp-hint) { color: #f08a84; }
html[data-theme="dark"] .wsp .form-control::placeholder { color: #5d6673; }
html[data-theme="dark"] .wsp .form-control:is([readonly], :disabled) { background-color: var(--dk-surface-3) !important; color: var(--dk-text-muted); }
html[data-theme="dark"] .wsp :is(.wsp-rest, .wsp-target + .wsp-target) { border-top-color: var(--dk-border); }
html[data-theme="dark"] .wsp .wsp-rest li { background-color: var(--dk-surface-2); color: var(--dk-text); }
html[data-theme="dark"] .wsp .wsp-scroll { border-color: var(--dk-border); }
html[data-theme="dark"] .wsp .wsp-core-table th { background-color: var(--dk-surface-2); color: var(--dk-text-muted); }
html[data-theme="dark"] .wsp .wsp-date-row .input-group-text { color: var(--dk-text-muted); }
/* 밑줄 입력칸(form-material) — 흰 칸·진한 글자 */
html[data-theme="dark"] .wsp .form-material > :is(.form-control, .input-group > .form-control, .dept-pick-field > .form-control) {
	background-color: var(--dk-surface-2) !important;
	border-color: var(--dk-border) !important;
	color: var(--dk-text) !important;
}
html[data-theme="dark"] .wsp .form-material > :is(.form-control, .input-group > .form-control, .dept-pick-field > .form-control):is([readonly], [disabled]) {
	background-color: var(--dk-surface-3) !important;
}
html[data-theme="dark"] .wsp .form-material > .form-control:focus { border-color: #4f8cf0 !important; box-shadow: 0 0 0 2px rgba(79, 140, 240, .25); }
html[data-theme="dark"] .wsp .wsp-legend-past .wsp-legend-dot { background-color: rgba(229, 83, 75, .3); border-color: rgba(229, 83, 75, .5); }
html[data-theme="dark"] .wsp .wsp-legend-next .wsp-legend-dot { background-color: rgba(120, 190, 80, .3); border-color: rgba(120, 190, 80, .5); }

/* ── 부서 선택(#modalDeptTreeSel)·대상자 선택(#modalTargetUserSel) ── */
html[data-theme="dark"] :is(#modalDeptTreeSel, #modalTargetUserSel) :is(.dept-pick-hint, .dept-pick-hint b) { color: var(--dk-text-muted); }
html[data-theme="dark"] :is(#modalDeptTreeSel, #modalTargetUserSel) :is(.dept-pick-body, .dept-pick-picked) {
	background-color: var(--dk-surface);
	border-color: var(--dk-border);
	color: var(--dk-text-muted);
}
html[data-theme="dark"] :is(#modalDeptTreeSel, #modalTargetUserSel) .dept-pick-picked-icon { color: #5d6673; }
html[data-theme="dark"] :is(#modalDeptTreeSel, #modalTargetUserSel) .dept-pick-picked-label { border-right-color: var(--dk-border); }
html[data-theme="dark"] :is(#modalDeptTreeSel, #modalTargetUserSel) .dept-pick-picked.is-picked {
	background-color: var(--dk-primary-soft);
	border-color: #2a3a63;
	color: var(--dk-primary-text);
}
html[data-theme="dark"] :is(#modalDeptTreeSel, #modalTargetUserSel) .dept-pick-picked.is-picked :is(.dept-pick-picked-icon, .dept-pick-picked-label) { color: var(--dk-primary-text); border-right-color: #2a3a63; }
html[data-theme="dark"] #modalDeptTreeSel .dept-pick-body .dept-node.is-selected { background-color: var(--dk-primary-soft); }
html[data-theme="dark"] #modalDeptTreeSel .dept-pick-body .dept-node.is-selected .dept-node-nm,
html[data-theme="dark"] #modalDeptTreeSel .dept-node-check { color: var(--dk-primary-text); }
html[data-theme="dark"] #modalDeptTreeSel .dept-node.is-match .dept-node-nm { background-color: #3a3216; color: var(--dk-text-strong); }

/* ── 일정 추가(#modalAddWorkInfoRegist .wap, work-add-popup.css) ── */
html[data-theme="dark"] #modalAddWorkInfoRegist .wap-body { background-color: var(--dk-page); }
html[data-theme="dark"] #modalAddWorkInfoRegist :is(.wap-group, .wap-date) { background-color: var(--dk-surface); border-color: var(--dk-border); }
html[data-theme="dark"] #modalAddWorkInfoRegist .wap-group-title { color: var(--dk-text-strong); }
html[data-theme="dark"] #modalAddWorkInfoRegist :is(.wap-group-title > i, .wap-unit, .wap-cell-label) { color: var(--dk-text-muted); }
html[data-theme="dark"] #modalAddWorkInfoRegist :is(.wap-part + .wap-part) { border-left-color: var(--dk-border); }
html[data-theme="dark"] #modalAddWorkInfoRegist .wap-group-usr .wap-group-title { border-bottom-color: var(--dk-border); }
html[data-theme="dark"] #modalAddWorkInfoRegist .wap-row .form-control:disabled { background-color: var(--dk-surface-3); color: var(--dk-text-muted); }
html[data-theme="dark"] #modalAddWorkInfoRegist .wap-footer { border-top-color: var(--dk-border) !important; }

/* ── 부트스트랩 기본 모달 머리·닫기·회색 버튼 (근무자별 PC근태 상세 등) ── */
html[data-theme="dark"] .modal-header .close { color: var(--dk-text); text-shadow: none; opacity: .8; }
html[data-theme="dark"] .modal-header .close:hover { color: var(--dk-text-strong); opacity: 1; }
html[data-theme="dark"] .modal-title { color: var(--dk-text-strong); }
html[data-theme="dark"] .bg-light { background-color: var(--dk-surface-2) !important; }
html[data-theme="dark"] .btn-secondary {
	background-color: var(--dk-surface-3);
	border-color: #3a414c;
	color: var(--dk-text-strong);
}
html[data-theme="dark"] .btn-secondary:is(:hover, :focus):not(:disabled) { background-color: #343b46; border-color: #4b535f; color: #fff; }

/* ── 일별 종합 근무 내역 상단 현황판(.status-summary) — 상태별 파스텔 카드를 같은 계열의 어두운 톤으로 ── */
html[data-theme="dark"] .status-summary .summary-grid { background-color: var(--dk-surface); border-color: var(--dk-border); }
html[data-theme="dark"] .status-summary .summary-item { border-right-color: var(--dk-border); }
html[data-theme="dark"] .status-summary .summary-label { color: var(--dk-text-muted); }
html[data-theme="dark"] .status-summary #workingContent    { background-color: rgba(120, 190, 80, .14); box-shadow: inset 0 3px 0 0 #6fb34a; }
html[data-theme="dark"] .status-summary #owkContent        { background-color: rgba(38, 198, 218, .13); box-shadow: inset 0 3px 0 0 #2bb3c6; }
html[data-theme="dark"] .status-summary #bsrpContent       { background-color: rgba(79, 140, 240, .14); box-shadow: inset 0 3px 0 0 #4f8cf0; }
html[data-theme="dark"] .status-summary #workEndContent    { background-color: var(--dk-surface-2); box-shadow: inset 0 3px 0 0 #6c757d; }
html[data-theme="dark"] .status-summary #lateContent       { background-color: rgba(236, 160, 40, .14); box-shadow: inset 0 3px 0 0 #d9a52a; }
html[data-theme="dark"] .status-summary #earlyLeaveContent { background-color: rgba(220, 200, 40, .12); box-shadow: inset 0 3px 0 0 #cdb92a; }
html[data-theme="dark"] .status-summary #noWorkContent     { background-color: rgba(229, 83, 75, .14); box-shadow: inset 0 3px 0 0 #e5534b; }
html[data-theme="dark"] .status-summary #workingContent:not(.is-zero) .summary-value,
html[data-theme="dark"] .status-summary .sv-work { color: #9fd27a; }
html[data-theme="dark"] .status-summary #owkContent:not(.is-zero) .summary-value,
html[data-theme="dark"] .status-summary .sv-away { color: #7fd6e6; }
html[data-theme="dark"] .status-summary #bsrpContent:not(.is-zero) .summary-value { color: #8fb0ff; }
html[data-theme="dark"] .status-summary #workEndContent:not(.is-zero) .summary-value,
html[data-theme="dark"] .status-summary .sv-done { color: var(--dk-text-strong); }
html[data-theme="dark"] .status-summary #lateContent:not(.is-zero) .summary-value,
html[data-theme="dark"] .status-summary #earlyLeaveContent:not(.is-zero) .summary-value,
html[data-theme="dark"] .status-summary .sv-warn { color: #e3c46a; }
html[data-theme="dark"] .status-summary #noWorkContent:not(.is-zero) .summary-value,
html[data-theme="dark"] .status-summary .sv-danger { color: #f08a84; }
html[data-theme="dark"] .status-summary .sv-off { color: var(--dk-text); }
html[data-theme="dark"] .status-card-note .scn-clear { border-color: #4f8cf0; color: var(--dk-primary-text); }
html[data-theme="dark"] .status-card-note .scn-clear:hover { background-color: var(--dk-primary-soft); }

/* ── 관리자 3차 묶음 — 설정 화면 ── */
/* 조직도 트리(dept-tree.css) — 인사 정보 관리·부서 관리 */
html[data-theme="dark"] .dept-tree .dept-node { color: var(--dk-text); }
/* 가상요소는 :is() 안에 둘 수 없어(규칙 전체가 무시된다) 따로 적는다 */
html[data-theme="dark"] .dept-tree .dept-node-rail,
html[data-theme="dark"] .dept-tree .dept-node-elbow.is-mid::after { background-color: var(--dk-border); }
html[data-theme="dark"] .dept-tree .dept-node-elbow { border-color: var(--dk-border); }
html[data-theme="dark"] .dept-tree .dept-node:hover { background-color: var(--dk-surface-3); }
html[data-theme="dark"] .dept-tree .dept-node.is-selected { background-color: var(--dk-primary-soft); }
html[data-theme="dark"] .dept-tree .dept-node.is-selected .dept-node-nm { color: var(--dk-primary-text); }
html[data-theme="dark"] .dept-tree :is(.dept-node-toggle, .dept-node-cnt, .dept-node-mchk, .dept-node-icon.fa-folder-o) { color: var(--dk-text-muted); }
html[data-theme="dark"] .dept-tree .dept-node-toggle:hover { color: var(--dk-text-strong); }
html[data-theme="dark"] .dept-tree .dept-node-mchk:is(:hover, .is-part) { color: var(--dk-primary-text); }
html[data-theme="dark"] .dept-tree .dept-node-mchk:hover { background-color: var(--dk-primary-soft); }
html[data-theme="dark"] .dept-tree-empty { color: var(--dk-text-muted); }
/* 결재선 관리 */
html[data-theme="dark"] .sanctn-tab-panel { background-color: var(--dk-surface); box-shadow: 0 0 0 1px var(--dk-border); }
html[data-theme="dark"] #page-container .sanctn-have { background-color: rgba(38, 198, 218, .16); color: #7fd6e6; }
html[data-theme="dark"] #page-container .sanctn-have-none { background-color: rgba(236, 120, 40, .16); color: #f0a35a; }
html[data-theme="dark"] #page-container :is(.sanctn-empty-guide, .vcatn-empty-guide) { color: var(--dk-text-muted); }
html[data-theme="dark"] #page-container :is(.sanctn-empty-arrow, .vcatn-empty-arrow) { color: #4b535f; }
html[data-theme="dark"] #page-container :is(.sanctn-empty-title, .sanctn-empty-desc b, .vcatn-empty-title) { color: var(--dk-text); }
/* 공통 시간 설정(.setting-form) */
html[data-theme="dark"] #page-container .setting-form .setting-item { background-color: var(--dk-surface-2); border-color: var(--dk-border); }
html[data-theme="dark"] #page-container .setting-form .setting-item:hover { background-color: var(--dk-surface-3); border-color: #3a414c; }
html[data-theme="dark"] #page-container .setting-form .setting-group-title { border-bottom-color: var(--dk-border); color: var(--dk-text-strong); }
html[data-theme="dark"] #page-container .setting-form .setting-label { color: var(--dk-text); }
/* 파랑 글자 라벨(.text-primary) — 테마 primary 는 버튼 채움색이라 어두운 바탕 글자로는 어둡다 */
html[data-theme="dark"] .text-primary:not(.btn) { color: var(--dk-primary-text) !important; }
/* 기능이 꺼진 화면 안내(OT 관리 등) */
html[data-theme="dark"] .error-container { background-color: var(--dk-surface) !important; color: var(--dk-text); }

/* ── 실시간 현황(새 창, popup-work-list-view2) — Tabulator 표 ── */
html[data-theme="dark"] .tabulator { background-color: var(--dk-surface); border-color: var(--dk-border); }
html[data-theme="dark"] .tabulator .tabulator-header,
html[data-theme="dark"] .tabulator .tabulator-header .tabulator-col {
	background-color: var(--dk-surface-2) !important;
	border-color: var(--dk-border) !important;
	color: var(--dk-text-strong);
}
html[data-theme="dark"] .tabulator .tabulator-header .tabulator-col.tabulator-sortable:hover { background-color: var(--dk-surface-3) !important; }
html[data-theme="dark"] .tabulator .tabulator-tableHolder,
html[data-theme="dark"] .tabulator .tabulator-tableHolder .tabulator-table { background-color: var(--dk-surface); }
html[data-theme="dark"] .tabulator-row { background-color: var(--dk-surface) !important; border-color: var(--dk-border) !important; color: var(--dk-text); }
html[data-theme="dark"] .tabulator-row.tabulator-row-even { background-color: var(--dk-surface-2) !important; }
html[data-theme="dark"] .tabulator-row.tabulator-selectable:hover { background-color: var(--dk-surface-3) !important; }
html[data-theme="dark"] .tabulator-row .tabulator-cell { border-color: var(--dk-border) !important; }
html[data-theme="dark"] .status-summary .summary-item.is-zero .summary-value { color: var(--dk-text-muted); }
html[data-theme="dark"] .error-container :is(.error-message, h1, h2, h3, p) { color: var(--dk-text) !important; }
html[data-theme="dark"] #page-container .setting-form .setting-actions,
html[data-theme="dark"] .setting-actions { background-color: var(--dk-surface) !important; border-color: var(--dk-border) !important; }

/* ── 직원 정보 추가/수정(#modalUserInfoRegist, user-regist-popup.css) ── */
html[data-theme="dark"] #modalUserInfoRegist .urp-body { background-color: var(--dk-page); }
html[data-theme="dark"] #modalUserInfoRegist .urp-body::-webkit-scrollbar-thumb { background-color: #3a414c; }
html[data-theme="dark"] #modalUserInfoRegist .modal-footer { background-color: var(--dk-surface); border-top-color: var(--dk-border) !important; }
html[data-theme="dark"] #modalUserInfoRegist .form-material > label,
html[data-theme="dark"] #modalUserInfoRegist :is(.urp-unit, .urp-copy, .urp-help, .urp-sep, .urp-range-sep) { color: var(--dk-text-muted); }
html[data-theme="dark"] #modalUserInfoRegist .form-material > label.urp-switch,
html[data-theme="dark"] #modalUserInfoRegist .form-material > label.urp-switch > span:last-child { color: var(--dk-text); }
html[data-theme="dark"] #modalUserInfoRegist .form-material > .form-control:focus + label { color: var(--dk-primary-text); }
html[data-theme="dark"] #modalUserInfoRegist .urp-req { color: #f08a84; }
html[data-theme="dark"] #modalUserInfoRegist .urp-copy:focus,
html[data-theme="dark"] #modalUserInfoRegist .urp-pw-eye:hover { background-color: var(--dk-surface-3); color: var(--dk-text-strong); }
html[data-theme="dark"] #modalUserInfoRegist .urp-copy.on { color: #9fd27a; }
html[data-theme="dark"] #modalUserInfoRegist #btnAddWorkLoc:not(:disabled) { background-color: rgba(120, 190, 80, .16); border-color: rgba(120, 190, 80, .4); color: #9fd27a; }
html[data-theme="dark"] #modalUserInfoRegist #btnAddWorkLoc:not(:disabled):is(:hover, :focus) { background-color: rgba(120, 190, 80, .28); border-color: rgba(120, 190, 80, .65); color: #b8e39a; }
html[data-theme="dark"] #modalUserInfoRegist .form-control[disabled] { color: var(--dk-text-muted); }
/* 부서 고르기 입력칸 — 팝업마다 흰 바탕을 !important 로 칠한다 */
html[data-theme="dark"] .modal .dept-pick-field > .form-control,
html[data-theme="dark"] .modal .dept-pick-field > .form-control[readonly] {
	background-color: var(--dk-surface-2) !important;
	border-color: var(--dk-border) !important;
	color: var(--dk-text) !important;
}
/* 초록 채움 버튼(btn-success, 설정 팝업 [등록]·[추가]) — 흰 글자가 읽히도록 한 단계 진하게 */
html[data-theme="dark"] .btn-success { background-color: #3d7d3a !important; border-color: #3d7d3a !important; }
html[data-theme="dark"] .btn-success:is(:hover, :focus):not(:disabled) { background-color: #468f42 !important; border-color: #468f42 !important; }

/* ── 적용 대상 선택(#modalTargetUserSel, admin-popup-theme.css .tus-*) — 근무제 설정 [대상선택] 등 ── */
html[data-theme="dark"] #modalTargetUserSel :is(.tus-hint, .tus-hint b, .tus-user-sub, .tus-empty) { color: var(--dk-text-muted); }
html[data-theme="dark"] #modalTargetUserSel .tus-col-head { color: var(--dk-text); }
html[data-theme="dark"] #modalTargetUserSel :is(.tus-col-all, .dept-node-sel, .tus-user-chk.is-on) { color: var(--dk-primary-text); }
html[data-theme="dark"] #modalTargetUserSel .tus-col-body { background-color: var(--dk-surface); border-color: var(--dk-border); }
html[data-theme="dark"] #modalTargetUserSel .dept-node.is-selected { background-color: var(--dk-primary-soft); box-shadow: inset 3px 0 0 0 #4f8cf0; }
html[data-theme="dark"] #modalTargetUserSel .tus-user { color: var(--dk-text); }
html[data-theme="dark"] #modalTargetUserSel .tus-user:hover { background-color: var(--dk-surface-3); }
html[data-theme="dark"] #modalTargetUserSel .tus-user.is-on { background-color: var(--dk-primary-soft); box-shadow: inset 3px 0 0 0 #4f8cf0; }
html[data-theme="dark"] #modalTargetUserSel .tus-user.is-on .tus-user-nm { color: var(--dk-primary-text); }
html[data-theme="dark"] #modalTargetUserSel .tus-user-chk { color: #5d6673; }
html[data-theme="dark"] #modalTargetUserSel .tus-hint-chk { background-color: var(--dk-primary-soft); color: var(--dk-primary-text); }

/* ── 엑셀 일괄등록 팝업(.excel-bulk-*, admin-layout.css) — 근무자 연차 관리 [일괄등록] 등 ── */
html[data-theme="dark"] .excel-bulk-guide { color: var(--dk-text); }
html[data-theme="dark"] :is(.excel-bulk-guide em, .excel-bulk-toggle-name, .excel-bulk-consent-note strong) { color: var(--dk-text-strong); }
html[data-theme="dark"] :is(.excel-bulk-guide-note, .excel-bulk-consent-eg) { color: var(--dk-text-muted); }
html[data-theme="dark"] .excel-bulk-actions { border-top-color: var(--dk-border); }
html[data-theme="dark"] .excel-bulk-consent { background: var(--dk-surface-2); border-color: var(--dk-border); }
html[data-theme="dark"] .excel-bulk-consent-note { color: var(--dk-text-muted); }
html[data-theme="dark"] .excel-bulk-consent-note em { color: var(--dk-text); }
html[data-theme="dark"] .excel-bulk-toggle-track { background: #4b535f; }
html[data-theme="dark"] .excel-bulk-toggle-track::after { background: var(--dk-text-strong); box-shadow: 0 1px 2px rgba(0, 0, 0, .5); }
html[data-theme="dark"] .excel-bulk-toggle-state { background: var(--dk-surface-3); color: var(--dk-text-muted); }
html[data-theme="dark"] .excel-bulk-toggle-input:checked ~ .excel-bulk-toggle .excel-bulk-toggle-track { background: #d9682a; }
html[data-theme="dark"] .excel-bulk-toggle-input:checked ~ .excel-bulk-toggle .excel-bulk-toggle-state { background: rgba(236, 120, 40, .18); color: #f0a35a; }
html[data-theme="dark"] :is(.excel-bulk-consent-caution, .excel-bulk-consent-caution strong) { color: #f0a35a; }

/* ── 실시간 현황 [부서별 현황] 탭 — 부서 트리(.dept-stat-tree, admin-layout.css) ── */
html[data-theme="dark"] :is(.dept-stat-tree-scroll, .dept-stat-tree) { --dst-line-strong: var(--dk-border); --dst-line-weak: #242930; }
html[data-theme="dark"] .dept-stat-tree { background-color: var(--dk-surface); color: var(--dk-text); }
html[data-theme="dark"] .dst-head { background-color: var(--dk-surface-2); color: var(--dk-text-muted); }
html[data-theme="dark"] .dst-row.is-working { border-left-color: #f97316; }
html[data-theme="dark"] .dst-row.is-even { background-color: #1f242b; }
html[data-theme="dark"] :is(.dst-row:hover, .dst-row.is-even:hover) { background-color: var(--dk-primary-soft); }
html[data-theme="dark"] .dst-row .dst-name { color: var(--dk-text-strong); }
html[data-theme="dark"] .dst-toggle { color: var(--dk-text-muted); }
html[data-theme="dark"] .dst-total { color: var(--dk-text); }
html[data-theme="dark"] .dst-work { color: #fb8c3c; }
html[data-theme="dark"] .dst-end { color: var(--dk-text-muted); }
html[data-theme="dark"] .dst-vcatn { color: #c084fc; }
html[data-theme="dark"] .dst-cell.is-zero { color: #5d6673; }
html[data-theme="dark"] :is(.dept-stat-legend, .dept-stat-updated) { color: var(--dk-text-muted); }
html[data-theme="dark"] .dept-stat-sep { color: #4b535f; }

/* ── 내부 관리(슈퍼관리자) — 템플릿 미리보기 틀(dsgn-pages.css), 광고 배너 집계 칩·통계 카드(admin-ad-banner-view.jsp <style>) ── */
html[data-theme="dark"] .dsgn-split-preview { background-color: var(--dk-surface); border-color: var(--dk-border); }
html[data-theme="dark"] .dsgn-split-preview-head { color: var(--dk-text-strong); }
html[data-theme="dark"] .dsgn-split-preview-box { border-color: var(--dk-border); }
html[data-theme="dark"] :is(.ad-count, .ad-kpi) { background-color: var(--dk-surface-2); border-color: var(--dk-border); color: var(--dk-text); }
html[data-theme="dark"] :is(.ad-count, .ad-kpi) strong { color: var(--dk-text-strong); }
html[data-theme="dark"] .ad-table-wrap { border-color: var(--dk-border); }
html[data-theme="dark"] .ad-table th { background-color: var(--dk-surface-2); }
html[data-theme="dark"] .ad-thumb { background-color: var(--dk-surface-2); border-color: var(--dk-border); }
html[data-theme="dark"] .ad-sub { color: var(--dk-text-muted); }
html[data-theme="dark"] .ad-preview-frame { background-color: var(--dk-surface-2); border-color: #4b535f; color: var(--dk-text-muted); }

/* ── 비콘 출퇴근 설정(admin-beacon-policy-view, ADR 26_10_006·007) — admin-layout.css '비콘 출퇴근 설정' 절의 밝은 색 ──
   화면 규칙이 #page-container.admin-view-… 라 같은 접두를 붙여야 이긴다 */
html[data-theme="dark"] #page-container.admin-view-admin-beacon-policy-view .text-secondary { color: var(--dk-text-muted) !important; }
html[data-theme="dark"] #page-container.admin-view-admin-beacon-policy-view .beacon-tx-admin { border-top-color: var(--dk-border); }
html[data-theme="dark"] #page-container.admin-view-admin-beacon-policy-view .beacon-tx-help { background: var(--dk-surface-2); color: var(--dk-text-muted); }
html[data-theme="dark"] #page-container.admin-view-admin-beacon-policy-view .beacon-tx-help dt { color: var(--dk-text-strong); }
html[data-theme="dark"] #page-container.admin-view-admin-beacon-policy-view .beacon-exempt-count { color: var(--dk-text-muted); }
html[data-theme="dark"] .swal2-popup .beacon-exempt-dialog-note { color: #f07a6a; }
/* 관리자 출퇴근 목록의 비콘 표시 (work-beacon-tag.js, ADR 26_10_012) */
html[data-theme="dark"] .work-beacon-mark { color: #8fd18a; }
/* 접속정보 팝업 (connection-Info-popup.jsp) */
html[data-theme="dark"] #modalConnInfo .conn-info-list dt { color: var(--dk-text-strong); }
html[data-theme="dark"] #modalConnInfo .conn-info-map.is-empty { background: var(--dk-surface-2); border-color: var(--dk-border); color: var(--dk-text-muted); }
html[data-theme="dark"] #page-container.admin-view-admin-beacon-policy-view .beacon-tx-kind.is-app { background: rgba(77, 148, 255, .18); color: #8ab8ff; }
html[data-theme="dark"] #page-container.admin-view-admin-beacon-policy-view .beacon-tx-kind.is-hw { background: var(--dk-surface-2); color: var(--dk-text-muted); }
html[data-theme="dark"] #page-container.admin-view-admin-beacon-policy-view .beacon-tx-table td.col-seen.is-stale { color: #f07a6a; }

/* ── 비콘 출퇴근 표시·앱 비콘 필수 안내 (ADR 26_10_006·26_10_011) — /main 업무시작·근무 상태 영역 ── */
html[data-theme="dark"] .ttree-beacon-badge.is-checking,
html[data-theme="dark"] .ttree-beacon-required {
	background: var(--dk-surface-2);
	color: var(--dk-text);
}
html[data-theme="dark"] .ttree-beacon-badge.is-pass {
	background: #16301f;
	color: #8fd6a4;
}
html[data-theme="dark"] .ttree-beacon-badge.is-fix {
	background: #3a2e12;
	color: #f0c96a;
}
html[data-theme="dark"] .ttree-beacon-required-msg {
	color: var(--dk-text-strong);
}
html[data-theme="dark"] .ttree-beacon-required-hint {
	color: var(--dk-text-muted);
}