/* ==========================================================================
   Doto Dark — 다크모드 (2026-08-29)

   원칙:
   - 마크업 무수정. 잉크 스킨과 같은 방식으로 «변수만» 뒤집는다.
   - 로드 순서는 doto-ink-skin.css 뒤 (header.php) — 잉크가 :root 에 박아 둔
     밝은 값을 [data-bs-theme="dark"] 특이도로 이긴다.
   - 의미색(success/warning/danger/info)과 도메인 색(차트·연차 간트·일정 분류)은
     그대로 둔다. 잉크와 같은 규칙 — 뒤집는 건 «셸과 크롬»이지 «의미»가 아니다.
   - 라임(#D9F99D)은 여기서도 「현재 위치」 전용(포커스 링). 어두운 바탕에서 더 잘 보인다.

   팔레트 (잉크 반전 — land3 잉크 언어를 어둠에 옮긴 것):
     bg #14171C · surface #1A1E24 · surface2 #1E232B · hover #262C35
     line #2C333D · line2 #3A424E
     text #D6DAE1 · strong #F3F5F7 · dim #9AA2AD
     accent #D9F99D

   켜고 끄기: 프로필 메뉴 「화면」 · ?theme=dark|light|system (지원용)
   ========================================================================== */

/* --------------------------------------------------------------------------
   1. 루트 토큰 — 잉크가 정한 밝은 축을 어두운 축으로 되돌린다
   -------------------------------------------------------------------------- */
[data-bs-theme="dark"] {
    color-scheme: dark;

    /* 도토 자체 서페이스 (style.css 가 #fff 로 정의 — 카드·칸반·컴포넌트가 참조) */
    --doto-surface: #1A1E24;

    /* 바탕과 글자 */
    --bs-body-bg: #14171C;
    --bs-body-bg-rgb: 20, 23, 28;
    --bs-body-color: #D6DAE1;
    --bs-body-color-rgb: 214, 218, 225;
    --bs-emphasis-color: #F3F5F7;
    --bs-emphasis-color-rgb: 243, 245, 247;
    --bs-heading-color: #F3F5F7;
    --bs-secondary-color: rgba(214, 218, 225, 0.72);   /* .text-muted 가 읽는 값 */
    --bs-tertiary-color: rgba(214, 218, 225, 0.52);

    /* primary = 잉크의 반전. 잉크에선 검정이 1차 액션이었으니 어둠에선 흰 계열이 그 자리 */
    --bs-primary: #E8EAED;
    --bs-primary-rgb: 232, 234, 237;
    --bs-primary-text-emphasis: #C9CED6;
    --bs-primary-bg-subtle: #1E232B;
    --bs-primary-border-subtle: #2C333D;

    /* 🔴 보조 회색축은 «판»으로 쓰인다 — .bg-secondary 이니셜 아바타가 대표(흰 글자를 얹는다).
       글자용으로 생각해 밝게 올렸더니 흰 글자와 2.36:1 로 뭉갰다(직원목록·부서·연차관리 실측).
       판은 어둡게 두고, 글자 쪽은 아래 §7 의 .text-secondary 가 따로 밝힌다. */
    --bs-secondary: #5A6270;
    --bs-secondary-rgb: 90, 98, 112;

    /* 면 2단 — 흰 카드 ↔ 서페이스 였던 것이 어둠에선 surface ↔ surface2 */
    --bs-tertiary-bg: #1A1E24;
    --bs-tertiary-bg-rgb: 26, 30, 36;
    --bs-secondary-bg: #1E232B;
    --bs-secondary-bg-rgb: 30, 35, 43;

    /* bg-light = 본문 배경으로 쓰이는 자리 */
    --bs-light: #1A1E24;
    --bs-light-rgb: 26, 30, 36;
    --bs-light-bg-subtle: #1A1E24;
    --bs-light-border-subtle: #2C333D;

    /* dark 유틸은 어둠에선 반대로 «밝은 판»이어야 대비가 산다 */
    --bs-dark: #E8EAED;
    --bs-dark-rgb: 232, 234, 237;

    /* 🔴 .bg-white 유틸이 읽는 값 — 잉크 상단바가 bg-white 라 이걸 안 바꾸면 흰 띠가 남는다 */
    --bs-white: #1A1E24;
    --bs-white-rgb: 26, 30, 36;

    /* 선 */
    --bs-border-color: #2C333D;
    --bs-border-color-translucent: #2C333D;

    /* 링크 = 잉크 관례 유지(링크다움은 밑줄이 담당) */
    --bs-link-color: #E8EAED;
    --bs-link-color-rgb: 232, 234, 237;
    --bs-link-hover-color: #FFFFFF;
    --bs-link-hover-color-rgb: 255, 255, 255;

    /* 포커스 링 = 라임 그대로 */
    --bs-focus-ring-color: rgba(217, 249, 157, 0.45);

    /* 그림자 — 어둠에선 흰 그림자가 없으니 더 짙게 */
    --bs-box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.5);
    --bs-box-shadow-sm: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.4);
    --bs-box-shadow-lg: 0 1rem 3rem rgba(0, 0, 0, 0.6);
}

/* --------------------------------------------------------------------------
   2. 셸 — 잉크가 !important 로 못 박은 세 자리
   (여기를 놓치면 «카드만 어둡고 바탕은 흰» 상태가 된다)
   -------------------------------------------------------------------------- */
html[data-bs-theme="dark"] body {
    background-color: #14171C;
    color: #D6DAE1;
}

html[data-bs-theme="dark"] .main-layout {
    background-color: #14171C !important;
}

html[data-bs-theme="dark"] .sub-menu {
    background-color: #1A1E24 !important;
}

/* 서브메뉴 그룹 = 흰 패널이었던 것(8/22 오너 확정 «울타리»)을 어두운 패널로.
   울타리 구실은 색차가 하므로 바탕보다 한 단 밝게 둔다. */
html[data-bs-theme="dark"] .sub-menu .list-group,
html[data-bs-theme="dark"] .list-group {
    background-color: #1E232B;
    border-color: #2C333D;
}

html[data-bs-theme="dark"] .list-group-item {
    --bs-list-group-bg: transparent;
    --bs-list-group-color: #D6DAE1;
    --bs-list-group-border-color: #2C333D;
    --bs-list-group-action-hover-bg: #262C35;
    --bs-list-group-action-hover-color: #F3F5F7;
    --bs-list-group-active-color: #14171C;
    --bs-list-group-active-bg: #E8EAED;
    --bs-list-group-active-border-color: #E8EAED;
}

/* 상단 글로벌 바 — 잉크에서 .bg-white. 변수로도 덮지만 유틸이 !important 라 함께 못 박는다 */
html[data-bs-theme="dark"] .bg-white,
html[data-bs-theme="dark"] .mobile-header {
    background-color: #1A1E24 !important;
}
html[data-bs-theme="dark"] .mobile-header {
    border-bottom-color: #2C333D !important;
}

/* 모듈 런처·퀵 스위처(잉크 P2) */
html[data-bs-theme="dark"] .ink-palette,
html[data-bs-theme="dark"] .ink-launcher,
html[data-bs-theme="dark"] .ink-palette-panel {
    background-color: #1A1E24;
    border-color: #2C333D;
    color: #D6DAE1;
}

/* --------------------------------------------------------------------------
   3. 면 — 카드·모달·오프캔버스·드롭다운·팝오버
   -------------------------------------------------------------------------- */
[data-bs-theme="dark"] .card {
    --bs-card-bg: #1A1E24;
    --bs-card-color: #D6DAE1;
    --bs-card-border-color: #2C333D;
    --bs-card-cap-bg: #1E232B;
}

[data-bs-theme="dark"] .modal {
    --bs-modal-bg: #1A1E24;
    --bs-modal-color: #D6DAE1;
    --bs-modal-border-color: #2C333D;
    --bs-modal-header-border-color: #2C333D;
    --bs-modal-footer-border-color: #2C333D;
}

[data-bs-theme="dark"] .offcanvas,
[data-bs-theme="dark"] .offcanvas-lg,
[data-bs-theme="dark"] .offcanvas-md {
    --bs-offcanvas-bg: #1A1E24;
    --bs-offcanvas-color: #D6DAE1;
    --bs-offcanvas-border-color: #2C333D;
}

[data-bs-theme="dark"] .dropdown-menu {
    --bs-dropdown-bg: #1A1E24;
    --bs-dropdown-color: #D6DAE1;
    --bs-dropdown-border-color: #2C333D;
    --bs-dropdown-link-color: #D6DAE1;
    --bs-dropdown-link-hover-bg: #262C35;
    --bs-dropdown-link-hover-color: #F3F5F7;
    --bs-dropdown-link-active-bg: #E8EAED;
    --bs-dropdown-link-active-color: #14171C;
    --bs-dropdown-header-color: #9AA2AD;
    --bs-dropdown-divider-bg: #2C333D;
}

[data-bs-theme="dark"] .popover {
    --bs-popover-bg: #1A1E24;
    --bs-popover-border-color: #2C333D;
    --bs-popover-header-bg: #1E232B;
    --bs-popover-body-color: #D6DAE1;
}

[data-bs-theme="dark"] .tooltip {
    --bs-tooltip-bg: #E8EAED;
    --bs-tooltip-color: #14171C;
}

[data-bs-theme="dark"] .accordion {
    --bs-accordion-bg: #1A1E24;
    --bs-accordion-color: #D6DAE1;
    --bs-accordion-border-color: #2C333D;
    --bs-accordion-btn-color: #D6DAE1;
    --bs-accordion-btn-bg: #1E232B;
    --bs-accordion-active-bg: #262C35;
    --bs-accordion-active-color: #F3F5F7;
}

/* --------------------------------------------------------------------------
   4. 버튼 — 잉크의 «검정 1차 / 흰 고스트»를 뒤집는다
   (success·danger·warning 은 의미색이라 손대지 않는다)
   -------------------------------------------------------------------------- */
[data-bs-theme="dark"] .btn-primary {
    --bs-btn-color: #14171C;
    --bs-btn-bg: #E8EAED;
    --bs-btn-border-color: #E8EAED;
    --bs-btn-hover-color: #14171C;
    --bs-btn-hover-bg: #FFFFFF;
    --bs-btn-hover-border-color: #FFFFFF;
    --bs-btn-active-color: #14171C;
    --bs-btn-active-bg: #C9CED6;
    --bs-btn-active-border-color: #C9CED6;
    --bs-btn-disabled-color: #14171C;
    --bs-btn-disabled-bg: #5A6270;
    --bs-btn-disabled-border-color: #5A6270;
}

[data-bs-theme="dark"] .btn-outline-primary {
    --bs-btn-color: #E8EAED;
    --bs-btn-border-color: #3A424E;
    --bs-btn-hover-color: #14171C;
    --bs-btn-hover-bg: #E8EAED;
    --bs-btn-hover-border-color: #E8EAED;
    --bs-btn-active-color: #14171C;
    --bs-btn-active-bg: #E8EAED;
    --bs-btn-active-border-color: #E8EAED;
    --bs-btn-disabled-color: #5A6270;
    --bs-btn-disabled-border-color: #2C333D;
}

/* 잉크의 btn-secondary = 흰 바탕 고스트 → 어둠에선 서페이스 고스트 */
[data-bs-theme="dark"] .btn-secondary {
    --bs-btn-color: #D6DAE1;
    --bs-btn-bg: #1E232B;
    --bs-btn-border-color: #3A424E;
    --bs-btn-hover-color: #F3F5F7;
    --bs-btn-hover-bg: #262C35;
    --bs-btn-hover-border-color: #4A5361;
    --bs-btn-active-color: #F3F5F7;
    --bs-btn-active-bg: #2C333D;
    --bs-btn-active-border-color: #4A5361;
    --bs-btn-disabled-color: #5A6270;
    --bs-btn-disabled-bg: #1A1E24;
    --bs-btn-disabled-border-color: #2C333D;
}

[data-bs-theme="dark"] .btn-outline-secondary {
    --bs-btn-color: #D6DAE1;
    --bs-btn-border-color: #3A424E;
    --bs-btn-hover-color: #F3F5F7;
    --bs-btn-hover-bg: #262C35;
    --bs-btn-hover-border-color: #4A5361;
    --bs-btn-active-color: #F3F5F7;
    --bs-btn-active-bg: #2C333D;
    --bs-btn-disabled-color: #5A6270;
    --bs-btn-disabled-border-color: #2C333D;
}

[data-bs-theme="dark"] .btn-light {
    --bs-btn-color: #D6DAE1;
    --bs-btn-bg: #1E232B;
    --bs-btn-border-color: #3A424E;
    --bs-btn-hover-color: #F3F5F7;
    --bs-btn-hover-bg: #262C35;
    --bs-btn-hover-border-color: #4A5361;
}

[data-bs-theme="dark"] .btn-link {
    --bs-btn-color: #D6DAE1;
    --bs-btn-hover-color: #FFFFFF;
}

[data-bs-theme="dark"] .btn-close {
    filter: invert(1) grayscale(100%) brightness(200%);
}

/* 🔴 로그인·가입 같은 «독립 골격» 화면은 잉크를 싣지 않아 Spacelab 의 그라디언트 버튼이 그대로 남는다.
   배경색만 뒤집으면 그 위를 파란 그라디언트가 덮어 «흰 배경 위 파란 버튼 + 어두운 글자」가 된다
   (로그인 화면 실측: backgroundColor 는 #E8EAED 인데 화면은 파랗다).
   앱 안쪽은 잉크가 이미 그라디언트를 없앴으므로 여기서 꺼도 달라지는 게 없다. */
[data-bs-theme="dark"] .btn {
    background-image: none;
}

/* --------------------------------------------------------------------------
   5. 폼
   -------------------------------------------------------------------------- */
[data-bs-theme="dark"] .form-control,
[data-bs-theme="dark"] .form-select,
[data-bs-theme="dark"] .input-group-text {
    background-color: #1E232B;
    border-color: #3A424E;
    color: #E8EAED;
}

[data-bs-theme="dark"] .form-control:focus,
[data-bs-theme="dark"] .form-select:focus {
    background-color: #1E232B;
    border-color: #6B7688;
    color: #F3F5F7;
}

[data-bs-theme="dark"] .form-control::placeholder {
    color: #7C8593;
}

/* 🔴 라벨이 칸 안으로 들어가는 입력(.form-floating)은 Bootstrap 이 placeholder 를 «투명»으로
   숨겨 두었다. 위 규칙이 그 위에 색을 얹으면 라벨과 placeholder 가 겹쳐 보인다 —
   로그인 화면에서 「아이디」가 두 줄로 찍혔다(라이트와 나란히 놓고 잡았다). 투명을 되돌린다. */
[data-bs-theme="dark"] .form-floating > .form-control::placeholder,
[data-bs-theme="dark"] .form-floating > .form-control-plaintext::placeholder {
    color: transparent;
}

[data-bs-theme="dark"] .form-control:disabled,
[data-bs-theme="dark"] .form-control[readonly],
[data-bs-theme="dark"] .form-select:disabled {
    background-color: #191D23;
    color: #8B94A1;
}

[data-bs-theme="dark"] .form-check-input {
    background-color: #1E232B;
    border-color: #4A5361;
}
/* 🔴 체크 표시는 «흰색 SVG»로 그려진다. 다크의 1차색이 밝은 판이라
   그대로 두면 흰 판에 흰 체크 = 켠 것과 끈 것이 구별되지 않는다.
   판을 밝게 유지하고 체크 자체를 어둡게 다시 그린다. */
[data-bs-theme="dark"] .form-check-input:checked {
    background-color: #E8EAED;
    border-color: #E8EAED;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%2314171C' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='m6 10 3 3 6-6'/%3e%3c/svg%3e");
}
[data-bs-theme="dark"] .form-check-input:checked[type="radio"] {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='2' fill='%2314171C'/%3e%3c/svg%3e");
}
[data-bs-theme="dark"] .form-switch .form-check-input {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%239AA2AD'/%3e%3c/svg%3e");
}
[data-bs-theme="dark"] .form-switch .form-check-input:checked {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%2314171C'/%3e%3c/svg%3e");
}
[data-bs-theme="dark"] .form-check-input:indeterminate {
    background-color: #E8EAED;
    border-color: #E8EAED;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%2314171C' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='M6 10h8'/%3e%3c/svg%3e");
}

[data-bs-theme="dark"] .form-label,
[data-bs-theme="dark"] .col-form-label {
    color: #C9CED6;
}

[data-bs-theme="dark"] .form-text {
    color: #9AA2AD;
}

/* --------------------------------------------------------------------------
   6. 표
   -------------------------------------------------------------------------- */
[data-bs-theme="dark"] .table {
    --bs-table-bg: transparent;
    --bs-table-color: #D6DAE1;
    --bs-table-border-color: #2C333D;
    --bs-table-striped-bg: #1E232B;
    --bs-table-striped-color: #D6DAE1;
    --bs-table-hover-bg: #262C35;
    --bs-table-hover-color: #F3F5F7;
    --bs-table-active-bg: #2C333D;
}

/* 표 머리 — 잉크에서 table-light(플랫)였다 */
[data-bs-theme="dark"] .table > thead,
[data-bs-theme="dark"] .table-light,
[data-bs-theme="dark"] .table > thead > tr > th {
    --bs-table-bg: #1E232B;
    background-color: #1E232B;
    color: #C9CED6;
    border-color: #2C333D;
}

/* 🔴 고정열(sticky)은 «자기 배경»이 있어야 스크롤될 때 밑이 비쳐 보이지 않는다.
   그래서 어느 표든 리터럴 흰색을 갖고 있다 — 어둠에선 여기를 반드시 덮어야 한다. */
[data-bs-theme="dark"] .sticky-col,
[data-bs-theme="dark"] .table .sticky-col,
[data-bs-theme="dark"] th.sticky-col,
[data-bs-theme="dark"] td.sticky-col {
    background-color: #1A1E24 !important;
    color: #D6DAE1;
}

/* --------------------------------------------------------------------------
   7. 글자 대비 — 다크모드에서 가장 많이 깨지는 축
   밝은 종이에서 «부차적»이던 회색이 어두운 바탕에선 그냥 사라진다.
   -------------------------------------------------------------------------- */
[data-bs-theme="dark"] .text-muted,
[data-bs-theme="dark"] .text-body-secondary {
    color: #9AA2AD !important;
}

[data-bs-theme="dark"] .text-secondary {
    color: #A8B0BB !important;
}

[data-bs-theme="dark"] .text-dark,
[data-bs-theme="dark"] .text-body,
[data-bs-theme="dark"] .text-body-emphasis {
    color: #E8EAED !important;
}

[data-bs-theme="dark"] .text-black {
    color: #F3F5F7 !important;
}

[data-bs-theme="dark"] .text-white {
    color: #F3F5F7 !important;
}

/* 잉크가 링크를 검정으로 두었다 — 어둠에선 밝게.
   🔴 «자기 판을 가진 링크»는 반드시 빼야 한다. 페이지네이션의 현재 페이지가 그 예로,
   판이 밝은데 글자까지 밝혀 놓으니 숫자가 통째로 사라졌다(실측 1:1). */
[data-bs-theme="dark"] a:not(.btn):not(.list-group-item):not(.nav-link):not(.dropdown-item):not(.page-link):not(.badge) {
    color: #E8EAED;
}

[data-bs-theme="dark"] hr {
    border-color: #2C333D;
    opacity: 1;
}

/* --------------------------------------------------------------------------
   8. 확인 다이얼로그(SweetAlert2) — App.docAction·알림이 전부 이걸 쓴다
   변수 기반이라 팔레트만 갈아 끼우면 된다.
   -------------------------------------------------------------------------- */
[data-bs-theme="dark"] {
    --swal2-background: #1A1E24;
    --swal2-color: #D6DAE1;
    --swal2-title-color: #F3F5F7;
    --swal2-html-container-color: #C9CED6;
    --swal2-footer-background: #1E232B;
    --swal2-footer-border-color: #2C333D;
    --swal2-footer-color: #9AA2AD;
    --swal2-input-background: #1E232B;
    --swal2-input-color: #E8EAED;
    --swal2-input-border: 1px solid #3A424E;
    --swal2-actions-background: transparent;
    --swal2-validation-message-background: #2C333D;
    --swal2-validation-message-color: #E8EAED;
}

/* swal 은 body 밖(container)에 붙어 [data-bs-theme] 조상을 못 탈 수 있다 —
   html 에 붙은 속성으로 스코프를 잡아 두 경로 모두 덮는다. */
html[data-bs-theme="dark"] .swal2-popup {
    background: #1A1E24;
    color: #D6DAE1;
}
html[data-bs-theme="dark"] .swal2-title { color: #F3F5F7; }
html[data-bs-theme="dark"] .swal2-html-container { color: #C9CED6; }
html[data-bs-theme="dark"] .swal2-input,
html[data-bs-theme="dark"] .swal2-textarea,
html[data-bs-theme="dark"] .swal2-select {
    background: #1E232B;
    color: #E8EAED;
    border: 1px solid #3A424E;
}

/* --------------------------------------------------------------------------
   9. 나머지 부속 — 탭·페이지네이션·뱃지·진행바·스피너
   -------------------------------------------------------------------------- */
[data-bs-theme="dark"] .nav-tabs {
    --bs-nav-tabs-border-color: #2C333D;
    --bs-nav-tabs-link-hover-border-color: #3A424E;
    --bs-nav-tabs-link-active-color: #F3F5F7;
    --bs-nav-tabs-link-active-bg: transparent;
    --bs-nav-tabs-link-active-border-color: #E8EAED;
}

[data-bs-theme="dark"] .nav-link {
    --bs-nav-link-color: #B4BCC7;
    --bs-nav-link-hover-color: #F3F5F7;
}

[data-bs-theme="dark"] .nav-pills {
    --bs-nav-pills-link-active-bg: #E8EAED;
    --bs-nav-pills-link-active-color: #14171C;
}

[data-bs-theme="dark"] .pagination {
    --bs-pagination-bg: #1A1E24;
    --bs-pagination-color: #D6DAE1;
    --bs-pagination-border-color: #2C333D;
    --bs-pagination-hover-bg: #262C35;
    --bs-pagination-hover-color: #F3F5F7;
    --bs-pagination-hover-border-color: #3A424E;
    --bs-pagination-active-bg: #E8EAED;
    --bs-pagination-active-color: #14171C;
    --bs-pagination-active-border-color: #E8EAED;
    --bs-pagination-disabled-bg: #1A1E24;
    --bs-pagination-disabled-color: #5A6270;
    --bs-pagination-disabled-border-color: #2C333D;
}

[data-bs-theme="dark"] .progress {
    --bs-progress-bg: #2C333D;
}

[data-bs-theme="dark"] .breadcrumb {
    --bs-breadcrumb-divider-color: #7C8593;
    --bs-breadcrumb-item-active-color: #C9CED6;
}

[data-bs-theme="dark"] .badge.bg-light,
[data-bs-theme="dark"] .badge.text-bg-light {
    background-color: #2C333D !important;
    color: #D6DAE1 !important;
}

/* --------------------------------------------------------------------------
   10. 도메인 부품 — 전용 CSS 가 직접 칠한 자리
   -------------------------------------------------------------------------- */

/* 마스터-디테일 상세 하단 버튼줄 */
[data-bs-theme="dark"] .detail-footer,
[data-bs-theme="dark"] .detail-header {
    background-color: #1A1E24;
    border-color: #2C333D;
}

/* 트리(부서·분류) */
[data-bs-theme="dark"] .tree-view,
[data-bs-theme="dark"] .tree-node:hover {
    background-color: transparent;
    color: #D6DAE1;
}
[data-bs-theme="dark"] .tree-node:hover {
    background-color: #262C35;
}

/* 코드·인용 */
[data-bs-theme="dark"] code:not([class*="language-"]) {
    background-color: #1E232B;
    color: #E8B4A0;
}
[data-bs-theme="dark"] pre,
[data-bs-theme="dark"] blockquote {
    background-color: #1E232B;
    color: #D6DAE1;
    border-color: #2C333D;
}

/* --------------------------------------------------------------------------
   11. 잉크가 리터럴로 못 박은 자리 — 변수로는 못 닿는 곳
   (전부 실화면 계산값으로 확인하고 적었다. 짐작으로 넣은 규칙 없음)
   -------------------------------------------------------------------------- */

/* 🔴 메인메뉴 레일·오프캔버스 — 잉크에선 .bg-primary 가 «검정»이라 어두운 메뉴였다.
   다크에서 primary 를 흰 계열로 뒤집었더니 메뉴가 통째로 하얘진다(반전의 부작용).
   여기만 되돌린다 — 메뉴는 어둠에서도 어두운 게 맞다.
   이 nav 는 data-bs-theme="dark" 를 스스로 다시 선언하는 «섬»이라 :root 변수가 닿지 않는다.
   그래서 변수가 아니라 배경을 직접 지정한다. */
html[data-bs-theme="dark"] .main-menu.bg-primary,
html[data-bs-theme="dark"] .main-menu .offcanvas,
html[data-bs-theme="dark"] #mainMenuOffcanvas,
html[data-bs-theme="dark"] .offcanvas,
html[data-bs-theme="dark"] .offcanvas-start,
html[data-bs-theme="dark"] .offcanvas-end,
html[data-bs-theme="dark"] .offcanvas-top,
html[data-bs-theme="dark"] .offcanvas-bottom {
    background-color: #1A1E24 !important;
    color: #D6DAE1;
}

/* 통합 메뉴 아이콘 판 (잉크 서페이스 #F4F5F7) */
html[data-bs-theme="dark"] .unified-menu-icon {
    background-color: #262C35;
    color: #C9CED6;
}

/* 상단바 회사명 — 잉크가 #0A0A0A 리터럴 */
html[data-bs-theme="dark"] .ink-brand-name {
    color: #F3F5F7;
}

/* 서브메뉴 항목 — 잉크 리터럴(기본 #374151 / hover #F0F1F3 / active #E8EAED).
   어두운 바탕에서 기본 글자가 그대로면 «메뉴가 사라진 것처럼» 보인다. */
html[data-bs-theme="dark"] .sub-menu .list-group-item {
    color: #B4BCC7;
}
html[data-bs-theme="dark"] .sub-menu .list-group-item:hover {
    background: #262C35;
    color: #F3F5F7;
}
html[data-bs-theme="dark"] .sub-menu .list-group-item.active,
html[data-bs-theme="dark"] .list-group-item.subnav-split.active {
    background: #2C333D;
    color: #F3F5F7;
}
html[data-bs-theme="dark"] .sub-menu .list-group-item.p-0.active > a,
html[data-bs-theme="dark"] .sub-menu .list-group-item.p-0.active .dropdown > .btn,
html[data-bs-theme="dark"] .sub-menu .list-group-item.p-0 > a {
    color: #E8EAED !important;
}
/* subnav 1단 분류 라벨 (§14 3단 위계) */
html[data-bs-theme="dark"] .subnav-group-label,
html[data-bs-theme="dark"] .sub-menu .text-muted {
    color: #8B94A1 !important;
}

/* 🔴 subnav 하단 «설정 링크»의 «지금 보고 있는 화면» 표시 (잉크 §14.2).
   잉크는 밝은 판(#E8EAED) + 검정 글자인데, 이 링크가 .text-primary 를 달고 있어서
   위에서 .text-primary 를 밝게 올리면 «밝은 판 위 밝은 글자» = 라벨이 통째로 사라진다.
   실측으로 잡았다(근무조 스케줄이 빈 상자로 보였다). 판을 어둡게 내리고 글자를 밝힌다. */
html[data-bs-theme="dark"] .sub-menu .border-top a.small.d-block.fw-semibold {
    background: #2C333D;
    color: #F3F5F7 !important;
}
html[data-bs-theme="dark"] .sub-menu .border-top a.small.d-block.fw-semibold i {
    color: #C9CED6;
}
html[data-bs-theme="dark"] .sub-menu .border-top a.small.d-block:hover,
html[data-bs-theme="dark"] .sub-menu .border-top button.subnav-locked:hover {
    background: #262C35;
    color: #F3F5F7;
}
html[data-bs-theme="dark"] .sub-menu .border-top a.small.d-block:hover i {
    color: #C9CED6;
}

/* 뱃지 §15 «그냥 개수» 칩 — 잉크가 흰 바탕 + 헤어라인으로 만든 자리.
   어둠에선 흰 칩이 가장 크게 튄다. 도트 색(--ink-dot)은 의미색이라 손대지 않는다. */
html[data-bs-theme="dark"] .badge.rounded-pill:not(.filter-chip).badge-soft-primary,
html[data-bs-theme="dark"] .badge.rounded-pill:not(.filter-chip).badge-soft-secondary,
html[data-bs-theme="dark"] .badge.rounded-pill:not(.filter-chip).badge-soft-info,
html[data-bs-theme="dark"] .badge.rounded-pill:not(.filter-chip).badge-soft-success,
html[data-bs-theme="dark"] .badge[class*="badge-soft-"],
html[data-bs-theme="dark"] .badge.badge-tag {
    background-color: #1E232B !important;
    color: #A8B0BB !important;
    border-color: #3A424E !important;
}
/* 처리해야 할 것(채움 뱃지)은 의미색 유지 — 위 일반 규칙에서 되돌린다 */
html[data-bs-theme="dark"] .badge.rounded-pill:not(.filter-chip).badge-soft-danger,
html[data-bs-theme="dark"] .badge.rounded-pill:not(.filter-chip).bg-danger,
html[data-bs-theme="dark"] .notification-badge.rounded-pill {
    background-color: var(--bs-danger) !important;
    color: #fff !important;
    border-color: transparent !important;
}
html[data-bs-theme="dark"] .badge.rounded-pill:not(.filter-chip).badge-soft-warning {
    background-color: var(--bs-warning) !important;
    color: #1F2937 !important;
    border-color: transparent !important;
}

/* 도토AI 위젯 — 입력창이 흰 판, 보내기 버튼은 흰 바탕에 흰 글자였다(안 보임) */
html[data-bs-theme="dark"] .doto-ai-input-area,
html[data-bs-theme="dark"] .doto-ai-panel,
html[data-bs-theme="dark"] .doto-ai-body {
    background-color: #1A1E24 !important;
    border-color: #2C333D;
    color: #D6DAE1;
}
html[data-bs-theme="dark"] .btn-send {
    background-color: #E8EAED;
    color: #14171C;
}

/* 근태 매트릭스 — 이름열·요약열이 «자기 배경»을 갖는 고정열이라 리터럴 흰색이다 */
html[data-bs-theme="dark"] .att-matrix-name-col,
html[data-bs-theme="dark"] .att-matrix-summary-col {
    background-color: #1A1E24 !important;
    color: #D6DAE1;
}

/* 메일함 목록 — 제목·주소가 잉크 검정 리터럴 */
html[data-bs-theme="dark"] .col-subject,
html[data-bs-theme="dark"] .email-address-link,
html[data-bs-theme="dark"] .email-subject {
    color: #D6DAE1;
}

/* 상태 뱃지 = 도트 칩(잉크 §13.1) — 잉크가 «색 판 대신 흰 칩 + 의미색 도트»로 바꾼 자리.
   칩만 어둡게 하고 도트 색(--ink-dot)은 손대지 않는다 — 의미는 도트가 지고 있다. */
html[data-bs-theme="dark"] .badge[class*="badge-status-"]:not(.rounded-pill),
html[data-bs-theme="dark"] .badge[class*="-subtle"]:not(.rounded-pill) {
    background-color: #1E232B !important;
    color: #C9CED6 !important;
    border-color: #3A424E !important;
}

/* 안 읽은 메일 제목 — 잉크가 «굵은 검정»으로 강조한 자리(§13.3) */
html[data-bs-theme="dark"] .master-list .list-item-row.unread .col-subject,
html[data-bs-theme="dark"] .master-list .list-item-row .col-subject {
    color: #F3F5F7;
}

/* 🔴 의미색 «글자» — 진한 빨강·초록은 밝은 종이에서만 읽힌다.
   어두운 바탕에선 같은 색이 그대로 묻히므로 밝은 변형으로 올린다.
   판(배경)의 의미색은 그대로 둔다 — 여기서 바꾸는 건 글자뿐이다. */
html[data-bs-theme="dark"] .text-danger  { color: #F2837E !important; }
html[data-bs-theme="dark"] .text-success { color: #6FD1A6 !important; }
html[data-bs-theme="dark"] .text-warning { color: #E8B860 !important; }
html[data-bs-theme="dark"] .text-info    { color: #74C4DC !important; }
html[data-bs-theme="dark"] .text-primary { color: #E8EAED !important; }
/* 단 «색 판 위의 글자»는 판이 대비를 책임진다 — 위 규칙을 되돌린다 */
html[data-bs-theme="dark"] .bg-danger .text-white,
html[data-bs-theme="dark"] .btn .text-danger,
html[data-bs-theme="dark"] .btn .text-success,
html[data-bs-theme="dark"] .btn .text-warning {
    color: inherit !important;
}

/* 탭·보조 링크 */
html[data-bs-theme="dark"] .nav-link.text-nowrap,
html[data-bs-theme="dark"] .nav-tabs .nav-link {
    color: #B4BCC7;
}
html[data-bs-theme="dark"] .nav-tabs .nav-link.active {
    color: #F3F5F7;
}

/* 일정 — 공휴일 라벨·펼치기 버튼 */
html[data-bs-theme="dark"] .fc-holiday-label {
    color: #F2837E;
}
html[data-bs-theme="dark"] .doto-expand-all-btn {
    background-color: #1E232B;
    color: #D6DAE1;
    border-color: #3A424E;
}

/* 🔴 .card 가 아니면서 --bs-card-bg 의 «fallback #fff»에 기대는 부품들이 있다
   (대시보드 지표 카드). 변수를 루트에도 정의해 fallback 이 쓰이지 않게 한다. */
[data-bs-theme="dark"] {
    --bs-card-bg: #1A1E24;
}

/* 대시보드 지표 «숫자»의 의미색 — 위 .text-danger 계열과 같은 문제.
   대시보드는 «배경 대신 숫자색만 의미색»으로 설계돼 있어(doto-dashboard.css §지표카드)
   이 값이 어두우면 위험·경고를 알리는 숫자 자체를 못 읽는다.
   doto-dashboard.css 에도 다크 블록이 있지만, 다크 관련 결정은 이 파일에 모은다. */
[data-bs-theme="dark"] {
    --ds-negative: #F2837E;
    --ds-warning:  #E8B860;
    --ds-info:     #74C4DC;
    --ds-positive: #6FD1A6;
}

/* 대시보드 작업면 — 잉크 §12 가 크림색(#F6F6F4)을 리터럴로 박아 둔 자리.
   여기가 밝게 남으면 그 위 글자를 우리가 밝혀 둔 탓에 제목·범례가 통째로 사라진다
   (생산현황에서 실측 1.01:1). 점무늬도 검은 점이라 어둠에서 안 보여 함께 뒤집는다. */
html[data-bs-theme="dark"] .content-area,
html[data-bs-theme="dark"] .dashboard-content-area {
    background-color: #14171C;
}
html[data-bs-theme="dark"] .dashboard-content-area {
    background-image: radial-gradient(circle, rgba(255, 255, 255, 0.05) 1px, transparent 1px);
}

/* 업무일지 칸반 열 (뷰의 <style> 이 그린 자리 — head 에서 우리보다 뒤에 오므로 !important) */
html[data-bs-theme="dark"] .journal-column {
    background-color: #1A1E24 !important;
    border-color: #2C333D !important;
}
html[data-bs-theme="dark"] .journal-column-header {
    background-color: #1E232B !important;
    color: #D6DAE1 !important;
    border-color: #2C333D !important;
}
html[data-bs-theme="dark"] .journal-column-header.today {
    background-color: #2C333D !important;
}
html[data-bs-theme="dark"] .journal-column-header.rest {
    background-color: #23282F !important;
}
html[data-bs-theme="dark"] .kanban-home {
    background-color: #1E232B !important;
    color: #D6DAE1 !important;
    border-color: #3A424E !important;
}

/* 연차 매트릭스 — 근태 매트릭스와 같은 고정열 구조 */
html[data-bs-theme="dark"] .leave-matrix-summary-col,
html[data-bs-theme="dark"] .leave-matrix-name-col,
html[data-bs-theme="dark"] .att-matrix-scroll {
    background-color: #1A1E24 !important;
    color: #D6DAE1;
}

/* 위키 아이콘 고르기 격자 */
html[data-bs-theme="dark"] .wiki-icon-cell {
    background-color: #1E232B !important;
    color: #D6DAE1 !important;
    border-color: #3A424E !important;
}
html[data-bs-theme="dark"] .wiki-icon-cell:hover,
html[data-bs-theme="dark"] .wiki-icon-cell.selected {
    background-color: #262C35 !important;
}

/* --------------------------------------------------------------------------
   12. 🔴 인쇄는 언제나 밝게 — 종이는 검지 않다.
   다크로 인쇄하면 토너를 통째로 먹고 글자가 안 보인다.
   -------------------------------------------------------------------------- */
@media print {
    html[data-bs-theme="dark"],
    html[data-bs-theme="dark"] body,
    html[data-bs-theme="dark"] .main-layout,
    html[data-bs-theme="dark"] .sub-menu,
    html[data-bs-theme="dark"] .card,
    html[data-bs-theme="dark"] .bg-white {
        background-color: #fff !important;
        color: #000 !important;
    }
    html[data-bs-theme="dark"] .table,
    html[data-bs-theme="dark"] .table > thead > tr > th,
    html[data-bs-theme="dark"] .sticky-col {
        background-color: #fff !important;
        color: #000 !important;
        border-color: #ddd !important;
    }
}