@charset "UTF-8";
/* #jwkim 2026-10-31 다크 테마(A안 딥 네이비) 공통 틀 + 라이트/다크 전환 버튼. 네 앱(플랫폼·EPCIS·탄소·SSO)이 같은 파일을 쓴다.
   화면에 직접 박힌 밝은 색은 dpp-theme.js 가 계산해서 바꾼다. 여기서는 토큰·사이드바·상단·표(ag-Grid)·입력칸·모달처럼
   공통으로 쓰는 틀과, 스크립트가 못 바꾸는 가상 요소(placeholder·스크롤바)만 맡는다. 되돌리기: head 의 이 줄과 dpp-theme.js 줄 삭제 */

/* ── 전환 버튼(라이트·다크 모두) ── */
.theme-btn{display:inline-flex;align-items:center;justify-content:center;width:34px;height:32px;margin-right:6px;padding:0;border:1px solid #d8dfec;border-radius:8px;background:#fff;color:#334155;cursor:pointer;flex-shrink:0}
.theme-btn:hover{background:#eef3ff}
.theme-btn svg{width:16px;height:16px;pointer-events:none}
.theme-btn .ic-sun{display:none}
html[data-theme="dark"] .theme-btn .ic-sun{display:block}
html[data-theme="dark"] .theme-btn .ic-moon{display:none}
html[data-theme="dark"] .theme-btn{background:#18243f !important;border-color:#24324f !important;color:#ffd166 !important}
html[data-theme="dark"] .theme-btn:hover{background:#1e2c4c !important}

/* ── 다크 토큰 ── */
html[data-theme="dark"]{
  color-scheme:dark;
  --ledger-navy:#070d1c; --ledger-ink:#e6ecf5; --ledger-muted:#9fb0c8; --ledger-bg:#0b1326; --ledger-line:#24324f;
  --ledger-blue:#3b7bff; --ledger-teal:#57d6cb; --ledger-green:#4cc38a;
  --v5-bg:#0b1326; --v5-sf:#121c33; --v5-sf2:#18243f; --v5-ln:#24324f; --v5-ln2:#24324f; --v5-tx:#e6ecf5; --v5-tx2:#9fb0c8; --v5-tx3:#7f91ad;
  --v5-ac:#3b7bff; --v5-acs:#1e2a52;   /* --v5-side(사이드바 폭)·--v5-hd(머리 높이)는 크기 값이라 건드리지 않는다 */
}
html[data-theme="dark"], html[data-theme="dark"] body{background:#0b1326 !important;color:#e6ecf5}

/* 사이드바·상단 */
html[data-theme="dark"] body #topnav, html[data-theme="dark"] body .ledger-side{background:#070d1c !important;border-color:#16203a !important}
html[data-theme="dark"] body .ledger-top, html[data-theme="dark"] body .top-nav, html[data-theme="dark"] body .head_top{background:#121c33 !important;border-color:#24324f !important}
html[data-theme="dark"] body.ledger #topnav.ledger-side .tn-logo-mk{background:#3b7bff !important}   /* 라이트에서 글자색(--v5-tx) 단색 사각형이라 다크에서 밝은 칸이 되던 것 */
html[data-theme="dark"] body .dpp-ver{background:#1e2a52 !important;color:#a5b4fc !important}

/* 입력칸 */
html[data-theme="dark"] input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=color]), html[data-theme="dark"] textarea, html[data-theme="dark"] select{background-color:#0f182c !important;color:#e6ecf5 !important;border-color:#2b3a5b !important}
html[data-theme="dark"] input::placeholder, html[data-theme="dark"] textarea::placeholder{color:#7f91ad !important;opacity:1}
html[data-theme="dark"] input:disabled, html[data-theme="dark"] select:disabled, html[data-theme="dark"] textarea:disabled, html[data-theme="dark"] input[readonly]{background-color:#141e36 !important;color:#9fb0c8 !important}
html[data-theme="dark"] option{background:#121c33;color:#e6ecf5}

/* 표 · ag-Grid(balham) */
html[data-theme="dark"] .ag-theme-balham .ag-root-wrapper, html[data-theme="dark"] .ag-theme-balham .ag-body-viewport, html[data-theme="dark"] .ag-theme-balham .ag-center-cols-viewport,
html[data-theme="dark"] .ag-theme-balham .ag-row, html[data-theme="dark"] .ag-theme-balham .ag-row-odd, html[data-theme="dark"] .ag-theme-balham .ag-row-even{background-color:#121c33 !important;color:#e6ecf5 !important;border-color:#24324f !important}
html[data-theme="dark"] .ag-theme-balham .ag-row-odd{background-color:#14203a !important}
html[data-theme="dark"] .ag-theme-balham .ag-header, html[data-theme="dark"] .ag-theme-balham .ag-header-row, html[data-theme="dark"] .ag-theme-balham .ag-header-cell{background-color:#18243f !important;color:#9fb0c8 !important;border-color:#24324f !important}
html[data-theme="dark"] .ag-theme-balham .ag-row-hover, html[data-theme="dark"] .ag-theme-balham .ag-row:hover{background-color:#1c2a4a !important}
html[data-theme="dark"] .ag-theme-balham .ag-row-selected{background-color:#1e3a8a !important}
html[data-theme="dark"] .ag-theme-balham .ag-cell, html[data-theme="dark"] .ag-theme-balham .ag-header-cell{border-color:#24324f !important}
html[data-theme="dark"] .ag-theme-balham .ag-paging-panel, html[data-theme="dark"] .ag-theme-balham .ag-overlay-no-rows-wrapper{background:#121c33 !important;color:#9fb0c8 !important}
html[data-theme="dark"] table th{background-color:#18243f !important;color:#9fb0c8 !important;border-color:#24324f !important}
html[data-theme="dark"] table td{border-color:#24324f !important}

/* 모달·드롭다운·알림 */
html[data-theme="dark"] .modal-content, html[data-theme="dark"] .dropdown-menu, html[data-theme="dark"] .popover{background:#121c33 !important;color:#e6ecf5 !important;border-color:#24324f !important}
html[data-theme="dark"] .modal-header, html[data-theme="dark"] .modal-footer{border-color:#24324f !important}
html[data-theme="dark"] .modal-backdrop.show{opacity:.7}
html[data-theme="dark"] .close, html[data-theme="dark"] .btn-close{color:#e6ecf5 !important;filter:invert(1) grayscale(1)}

/* 링크·보조 글자 */
html[data-theme="dark"] a:not(.btn):not([class*="move-link"]){color:#8fb3ff}
html[data-theme="dark"] .text-muted{color:#9fb0c8 !important}
html[data-theme="dark"] hr{border-color:#24324f !important}

/* 스크롤바 */
html[data-theme="dark"] ::-webkit-scrollbar{width:10px;height:10px;background:#0b1326}
html[data-theme="dark"] ::-webkit-scrollbar-thumb{background:#2b3a5b;border-radius:6px}

/* 로그 이미지·바코드는 바탕을 그대로 둔다(흰 바탕이 있어야 읽힌다) */
html[data-theme="dark"] img, html[data-theme="dark"] canvas{background-color:transparent}
html[data-theme="dark"] .barcode_info_table, html[data-theme="dark"] [class*="barcode"] svg{background:#fff !important}

/* #jwkim 2026-11-01 위젯 제목 옆 설명문("날짜를 누르면…", "누적 · 오늘 늘어난 수")이 강조돼 보인다는 의견 — 두 테마 모두 한 단계 옅게, 굵기 보통.
   다크에서 스크립트가 다시 진하게 칠하지 않도록 해당 span 에 data-theme-keep 을 붙였다(P-14·P-15) */
html body.ledger .dw-section .dw-card h3 span{color:#98a2b3 !important;font-weight:400 !important}
html[data-theme="dark"] body.ledger .dw-section .dw-card h3 span{color:#6c7d99 !important}