/* =====================================================================================================================
 * 2026-11-02 RM-523 운영툴 밤 화면 (html[data-theme="dark"] 일 때만 · 낮 = 예전 Bootstrap 3 모양 그대로)
 * - 밤 색 = 보고서·작업 보드 색 표(ClaudeTools tools/board/REPORT_GUIDE.md §5) · 색 하나 = 뜻 하나
 *   (초록 끝남·통과 · 노랑 주의 · 빨강 문제 · 파랑 진행 · 그 밖 중립)
 * - 고르는 곳·저장 = public/javascripts/ops_theme.js(쿠키 ops_theme) · 각 화면 <head> 끝에서 이 파일을 불러 앞 CSS 를 덮는다
 * - 화면에 직접 박은 밝은 색(style="background:#fff" 등)은 아래 「직접 박은 색」 절의 속성 선택자로 덮는다
 * ===================================================================================================================== */
html[data-theme="dark"] {
    --bg: #0e1116; --surface: #1b2129; --surface-2: #151a21; --surface-3: #232a34;
    --ink: #e6e9ee; --ink-2: #9ca6b2; --ink-3: #6f7a87; --rule: #2a323d; --rule-2: #3a4452;
    --field: #10151b;
    --progress: #6fa0ff; --progress-soft: #18253b;
    --ok: #5ccb8c; --ok-soft: #15291f;
    --warn: #efb45c; --warn-soft: #1c1913;
    --bad: #ff7469; --bad-soft: #33191a;
    color-scheme: dark;
}

/* ---------------------------------------------------------------- 바탕·글자 */
html[data-theme="dark"] body { background-color: var(--bg); color: var(--ink); }
html[data-theme="dark"] a { color: #b9c7d8; }
html[data-theme="dark"] a:hover, html[data-theme="dark"] a:focus { color: #ffffff; }
html[data-theme="dark"] hr { border-top-color: var(--rule); }
html[data-theme="dark"] .text-muted, html[data-theme="dark"] .help-block, html[data-theme="dark"] small, html[data-theme="dark"] .small { color: var(--ink-2); }
html[data-theme="dark"] .text-success { color: var(--ok); }
html[data-theme="dark"] .text-warning { color: var(--warn); }
html[data-theme="dark"] .text-danger  { color: var(--bad); }
html[data-theme="dark"] .text-info    { color: #8fc7e8; }
html[data-theme="dark"] .text-primary { color: var(--progress); }
html[data-theme="dark"] .bg-success { background-color: var(--ok-soft); }
html[data-theme="dark"] .bg-warning { background-color: var(--warn-soft); }
html[data-theme="dark"] .bg-danger  { background-color: var(--bad-soft); }
html[data-theme="dark"] .bg-info, html[data-theme="dark"] .bg-primary { background-color: var(--surface-2); color: var(--ink); }
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"] h6 { color: var(--ink); }
html[data-theme="dark"] .page-header, html[data-theme="dark"] .sub-header { border-bottom-color: var(--rule); }
html[data-theme="dark"] blockquote { border-left-color: var(--rule-2); }
html[data-theme="dark"] code { background-color: var(--surface-3); color: #ffb3c4; }
html[data-theme="dark"] pre, html[data-theme="dark"] kbd { background-color: var(--surface-2); color: var(--ink); border-color: var(--rule); }
html[data-theme="dark"] ::placeholder { color: var(--ink-3); }
html[data-theme="dark"] ::selection { background: #2f4b7a; color: #fff; }
html[data-theme="dark"] * { scrollbar-color: #3a4452 var(--bg); }

/* ---------------------------------------------------------------- 왼쪽 하위 메뉴(dashboard.css) */
html[data-theme="dark"] .sidebar { background-color: var(--surface-2); border-right-color: var(--rule); }
html[data-theme="dark"] .nav-sidebar > li > a { color: var(--ink-2); }
html[data-theme="dark"] .nav-sidebar > li > a:hover { background-color: var(--surface-3); color: var(--ink); }
html[data-theme="dark"] .nav-sidebar > .active > a, html[data-theme="dark"] .nav-sidebar > .active > a:hover, html[data-theme="dark"] .nav-sidebar > .active > a:focus {
    background-color: var(--surface); color: #ffffff; font-weight: 600; box-shadow: inset 3px 0 0 var(--ink);
}

/* ---------------------------------------------------------------- 패널·우물·점보 */
html[data-theme="dark"] .panel { background-color: var(--surface); border-color: var(--rule); box-shadow: none; }
html[data-theme="dark"] .panel-default { border-color: var(--rule); }
html[data-theme="dark"] .panel-default > .panel-heading { background-color: var(--surface-2); border-color: var(--rule); color: var(--ink); }
html[data-theme="dark"] .panel-heading, html[data-theme="dark"] .panel-footer { border-color: var(--rule); }
html[data-theme="dark"] .panel-footer { background-color: var(--surface-2); }
html[data-theme="dark"] .panel-primary { border-color: #2f4b7a; }
html[data-theme="dark"] .panel-primary > .panel-heading { background-color: #22355a; border-color: #2f4b7a; color: #e6eeff; }
html[data-theme="dark"] .panel-info { border-color: var(--rule-2); }
html[data-theme="dark"] .panel-info > .panel-heading { background-color: var(--surface-3); border-color: var(--rule-2); color: var(--ink); }
html[data-theme="dark"] .panel-success { border-color: #24563a; }
html[data-theme="dark"] .panel-success > .panel-heading { background-color: var(--ok-soft); border-color: #24563a; color: var(--ok); }
html[data-theme="dark"] .panel-warning { border-color: #5a4520; }
html[data-theme="dark"] .panel-warning > .panel-heading { background-color: var(--warn-soft); border-color: #5a4520; color: var(--warn); }
html[data-theme="dark"] .panel-danger { border-color: #6a2a27; }
html[data-theme="dark"] .panel-danger > .panel-heading { background-color: var(--bad-soft); border-color: #6a2a27; color: var(--bad); }
html[data-theme="dark"] .panel-group .panel-heading + .panel-collapse > .panel-body, html[data-theme="dark"] .panel > .panel-body + .table,
html[data-theme="dark"] .panel > .table-bordered, html[data-theme="dark"] .panel > .table + .panel-body { border-color: var(--rule); }
html[data-theme="dark"] .well, html[data-theme="dark"] .jumbotron { background-color: var(--surface-2); border-color: var(--rule); color: var(--ink); box-shadow: none; }
html[data-theme="dark"] .thumbnail { background-color: var(--surface); border-color: var(--rule); }

/* ---------------------------------------------------------------- 표 */
html[data-theme="dark"] .table { color: var(--ink); background-color: transparent; }
html[data-theme="dark"] .table > thead > tr > th, html[data-theme="dark"] .table > tbody > tr > th, html[data-theme="dark"] .table > tfoot > tr > th,
html[data-theme="dark"] .table > thead > tr > td, html[data-theme="dark"] .table > tbody > tr > td, html[data-theme="dark"] .table > tfoot > tr > td { border-color: var(--rule); }
html[data-theme="dark"] .table > thead > tr > th { border-bottom-color: var(--rule-2); }
html[data-theme="dark"] .table-bordered, html[data-theme="dark"] .table-bordered > thead > tr > th, html[data-theme="dark"] .table-bordered > tbody > tr > td,
html[data-theme="dark"] .table-bordered > tbody > tr > th, html[data-theme="dark"] .table-bordered > thead > tr > td, html[data-theme="dark"] .table-bordered > tfoot > tr > td { border-color: var(--rule); }
html[data-theme="dark"] .table-striped > tbody > tr:nth-of-type(odd) { background-color: rgba(255,255,255,0.03); }
html[data-theme="dark"] .table-hover > tbody > tr:hover { background-color: rgba(255,255,255,0.06); }
html[data-theme="dark"] .table > thead > tr > .active, html[data-theme="dark"] .table > tbody > tr > .active, html[data-theme="dark"] .table > tbody > tr.active > td,
html[data-theme="dark"] .table > thead > tr.active > th, html[data-theme="dark"] .table > tbody > tr.active > th { background-color: var(--surface-3); }
html[data-theme="dark"] .table > tbody > tr.success > td, html[data-theme="dark"] .table > tbody > tr > td.success, html[data-theme="dark"] .table > thead > tr > th.success, html[data-theme="dark"] .table > tbody > tr.success > th { background-color: var(--ok-soft); }
html[data-theme="dark"] .table > tbody > tr.warning > td, html[data-theme="dark"] .table > tbody > tr > td.warning, html[data-theme="dark"] .table > thead > tr > th.warning, html[data-theme="dark"] .table > tbody > tr.warning > th { background-color: var(--warn-soft); }
html[data-theme="dark"] .table > tbody > tr.danger > td, html[data-theme="dark"] .table > tbody > tr > td.danger, html[data-theme="dark"] .table > thead > tr > th.danger, html[data-theme="dark"] .table > tbody > tr.danger > th { background-color: var(--bad-soft); }
html[data-theme="dark"] .table > tbody > tr.info > td, html[data-theme="dark"] .table > tbody > tr > td.info, html[data-theme="dark"] .table > thead > tr > th.info, html[data-theme="dark"] .table > tbody > tr.info > th { background-color: var(--surface-3); }

/* ---------------------------------------------------------------- 입력 칸 */
html[data-theme="dark"] .form-control, html[data-theme="dark"] input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=button]):not([type=submit]):not([type=color]),
html[data-theme="dark"] select, html[data-theme="dark"] textarea {
    background-color: var(--field); color: var(--ink); border-color: var(--rule-2);
}
html[data-theme="dark"] .form-control { box-shadow: none; }
html[data-theme="dark"] .form-control:focus { border-color: #5b8ff0; box-shadow: 0 0 0 2px rgba(91,143,240,0.25); }
html[data-theme="dark"] .form-control[disabled], html[data-theme="dark"] .form-control[readonly], html[data-theme="dark"] fieldset[disabled] .form-control,
html[data-theme="dark"] input[disabled], html[data-theme="dark"] select[disabled], html[data-theme="dark"] textarea[disabled] { background-color: var(--surface-2); color: var(--ink-2); }
html[data-theme="dark"] select option, html[data-theme="dark"] select optgroup { background-color: var(--surface); color: var(--ink); }
html[data-theme="dark"] .input-group-addon { background-color: var(--surface-3); border-color: var(--rule-2); color: var(--ink); }
html[data-theme="dark"] label, html[data-theme="dark"] .control-label, html[data-theme="dark"] legend { color: var(--ink); }
html[data-theme="dark"] legend { border-bottom-color: var(--rule); }
html[data-theme="dark"] .has-error .form-control { border-color: var(--bad); }
html[data-theme="dark"] .has-error .help-block, html[data-theme="dark"] .has-error .control-label { color: var(--bad); }
html[data-theme="dark"] .has-success .form-control { border-color: var(--ok); }
html[data-theme="dark"] .has-warning .form-control { border-color: var(--warn); }
html[data-theme="dark"] input[type=checkbox], html[data-theme="dark"] input[type=radio] { accent-color: #6fa0ff; }

/* ---------------------------------------------------------------- 단추 */
html[data-theme="dark"] .btn-default { background-color: var(--surface-3); border-color: var(--rule-2); color: var(--ink); background-image: none; text-shadow: none; }
html[data-theme="dark"] .btn-default:hover, html[data-theme="dark"] .btn-default:focus, html[data-theme="dark"] .btn-default.focus,
html[data-theme="dark"] .btn-default:active, html[data-theme="dark"] .btn-default.active, html[data-theme="dark"] .open > .dropdown-toggle.btn-default {
    background-color: #2d3541; border-color: #4a5566; color: #ffffff;
}
html[data-theme="dark"] .btn-default[disabled], html[data-theme="dark"] .btn-default.disabled { background-color: var(--surface-2); color: var(--ink-3); }
html[data-theme="dark"] .btn-link { color: #b9c7d8; }
html[data-theme="dark"] .btn-group > .btn-default + .btn-default { border-left-color: var(--rule-2); }
html[data-theme="dark"] .caret { border-top-color: currentColor; }

/* ---------------------------------------------------------------- 펼침 메뉴·창·말풍선 */
html[data-theme="dark"] .dropdown-menu { background-color: var(--surface); border-color: var(--rule-2); box-shadow: 0 8px 24px rgba(0,0,0,0.5); }
html[data-theme="dark"] .dropdown-menu > li > a { color: var(--ink); }
html[data-theme="dark"] .dropdown-menu > li > a:hover, html[data-theme="dark"] .dropdown-menu > li > a:focus { background-color: var(--surface-3); color: #ffffff; }
html[data-theme="dark"] .dropdown-menu > .active > a, html[data-theme="dark"] .dropdown-menu > .active > a:hover, html[data-theme="dark"] .dropdown-menu > .active > a:focus {
    background-color: var(--surface-3); color: #ffffff; font-weight: 600; box-shadow: inset 3px 0 0 var(--ink);
}
html[data-theme="dark"] .dropdown-menu .divider { background-color: var(--rule); }
html[data-theme="dark"] .dropdown-header { color: var(--ink-2); }
html[data-theme="dark"] .modal-content { background-color: var(--surface); border-color: var(--rule-2); box-shadow: 0 12px 40px rgba(0,0,0,0.6); color: var(--ink); }
html[data-theme="dark"] .modal-header, html[data-theme="dark"] .modal-footer { border-color: var(--rule); }
html[data-theme="dark"] .modal-backdrop.in { opacity: 0.7; }
html[data-theme="dark"] .close { color: var(--ink); text-shadow: none; opacity: 0.7; }
html[data-theme="dark"] .close:hover { color: #ffffff; opacity: 1; }
html[data-theme="dark"] .popover { background-color: var(--surface); border-color: var(--rule-2); color: var(--ink); }
html[data-theme="dark"] .popover-title { background-color: var(--surface-2); border-bottom-color: var(--rule); }
html[data-theme="dark"] .popover.top > .arrow:after { border-top-color: var(--surface); }
html[data-theme="dark"] .popover.bottom > .arrow:after { border-bottom-color: var(--surface); }
html[data-theme="dark"] .popover.left > .arrow:after { border-left-color: var(--surface); }
html[data-theme="dark"] .popover.right > .arrow:after { border-right-color: var(--surface); }

/* ---------------------------------------------------------------- 탭·알약·쪽 번호·목록 */
html[data-theme="dark"] .nav-tabs { border-bottom-color: var(--rule-2); }
html[data-theme="dark"] .nav-tabs > li > a { color: var(--ink-2); }
html[data-theme="dark"] .nav-tabs > li > a:hover { background-color: var(--surface-2); border-color: var(--rule) var(--rule) var(--rule-2); color: var(--ink); }
html[data-theme="dark"] .nav-tabs > li.active > a, html[data-theme="dark"] .nav-tabs > li.active > a:hover, html[data-theme="dark"] .nav-tabs > li.active > a:focus {
    background-color: var(--bg); border-color: var(--rule-2) var(--rule-2) transparent; color: #ffffff; font-weight: 600;
}
html[data-theme="dark"] .panel .nav-tabs > li.active > a, html[data-theme="dark"] .modal .nav-tabs > li.active > a { background-color: var(--surface); }
html[data-theme="dark"] .nav > li > a:hover, html[data-theme="dark"] .nav > li > a:focus { background-color: var(--surface-2); }
html[data-theme="dark"] .nav-pills > li > a { color: var(--ink-2); }
html[data-theme="dark"] .nav-pills > li.active > a, html[data-theme="dark"] .nav-pills > li.active > a:hover, html[data-theme="dark"] .nav-pills > li.active > a:focus { background-color: var(--surface-3); color: #ffffff; }
html[data-theme="dark"] .pagination > li > a, html[data-theme="dark"] .pagination > li > span { background-color: var(--surface); border-color: var(--rule-2); color: var(--ink); }
html[data-theme="dark"] .pagination > li > a:hover, html[data-theme="dark"] .pagination > li > span:hover { background-color: var(--surface-3); color: #ffffff; }
html[data-theme="dark"] .pagination > .active > a, html[data-theme="dark"] .pagination > .active > span, html[data-theme="dark"] .pagination > .active > a:hover { background-color: #3a4452; border-color: #4a5566; color: #ffffff; }
html[data-theme="dark"] .pagination > .disabled > a, html[data-theme="dark"] .pagination > .disabled > span { background-color: var(--surface-2); color: var(--ink-3); border-color: var(--rule); }
html[data-theme="dark"] .pager li > a, html[data-theme="dark"] .pager li > span { background-color: var(--surface); border-color: var(--rule-2); }
html[data-theme="dark"] .list-group-item { background-color: var(--surface); border-color: var(--rule); color: var(--ink); }
html[data-theme="dark"] a.list-group-item:hover, html[data-theme="dark"] button.list-group-item:hover { background-color: var(--surface-3); color: #ffffff; }
html[data-theme="dark"] .list-group-item.active, html[data-theme="dark"] .list-group-item.active:hover { background-color: var(--surface-3); border-color: var(--rule-2); color: #ffffff; }
html[data-theme="dark"] .breadcrumb { background-color: var(--surface-2); }
html[data-theme="dark"] .progress { background-color: var(--surface-3); box-shadow: none; }

/* ---------------------------------------------------------------- 알림 상자·꼬리표 */
html[data-theme="dark"] .alert-success { background-color: var(--ok-soft); border-color: #24563a; color: var(--ok); }
html[data-theme="dark"] .alert-warning { background-color: var(--warn-soft); border-color: #5a4520; color: var(--warn); }
html[data-theme="dark"] .alert-danger  { background-color: var(--bad-soft); border-color: #6a2a27; color: var(--bad); }
html[data-theme="dark"] .alert-info    { background-color: var(--surface-3); border-color: var(--rule-2); color: var(--ink); }
html[data-theme="dark"] .alert .alert-link { color: inherit; }
html[data-theme="dark"] .label-default, html[data-theme="dark"] .badge { background-color: #3a4452; color: var(--ink); }

/* ---------------------------------------------------------------- DataTables (CDN css + datatable.css) */
html[data-theme="dark"] table.dataTable, html[data-theme="dark"] table.dataTable tbody tr, html[data-theme="dark"] table.dataTable thead th,
html[data-theme="dark"] table.dataTable tfoot th, html[data-theme="dark"] table.dataTable tbody td { background-color: transparent; color: var(--ink); }
html[data-theme="dark"] table.dataTable thead th, html[data-theme="dark"] table.dataTable thead td, html[data-theme="dark"] table.dataTable tfoot th,
html[data-theme="dark"] table.dataTable tfoot td, html[data-theme="dark"] table.dataTable.no-footer, html[data-theme="dark"] .dataTables_wrapper.no-footer .dataTables_scrollBody { border-color: var(--rule-2); }
html[data-theme="dark"] table.dataTable.row-border tbody th, html[data-theme="dark"] table.dataTable.row-border tbody td,
html[data-theme="dark"] table.dataTable.display tbody th, html[data-theme="dark"] table.dataTable.display tbody td { border-top-color: var(--rule); }
html[data-theme="dark"] table.dataTable.cell-border tbody th, html[data-theme="dark"] table.dataTable.cell-border tbody td { border-color: var(--rule); }
html[data-theme="dark"] table.dataTable.stripe tbody tr.odd, html[data-theme="dark"] table.dataTable.display tbody tr.odd { background-color: rgba(255,255,255,0.03); }
html[data-theme="dark"] table.dataTable.hover tbody tr:hover, html[data-theme="dark"] table.dataTable.display tbody tr:hover { background-color: rgba(255,255,255,0.07); }
html[data-theme="dark"] table.dataTable.display tbody tr > .sorting_1, html[data-theme="dark"] table.dataTable.display tbody tr > .sorting_2,
html[data-theme="dark"] table.dataTable.display tbody tr > .sorting_3, html[data-theme="dark"] table.dataTable.order-column tbody tr > .sorting_1,
html[data-theme="dark"] table.dataTable.display tbody tr.odd > .sorting_1, html[data-theme="dark"] table.dataTable.display tbody tr.even > .sorting_1 { background-color: rgba(255,255,255,0.025); }
html[data-theme="dark"] table.dataTable tbody tr.selected, html[data-theme="dark"] table.dataTable tbody tr.selected > td,
html[data-theme="dark"] table.dataTable.display tbody tr.selected > .sorting_1 { background-color: #22355a !important; color: #ffffff; }
html[data-theme="dark"] .dataTables_wrapper .dataTables_length, html[data-theme="dark"] .dataTables_wrapper .dataTables_filter,
html[data-theme="dark"] .dataTables_wrapper .dataTables_info, html[data-theme="dark"] .dataTables_wrapper .dataTables_processing,
html[data-theme="dark"] .dataTables_wrapper .dataTables_paginate { color: var(--ink-2) !important; }
html[data-theme="dark"] .dataTables_wrapper .dataTables_processing { background: var(--surface) !important; border: 1px solid var(--rule-2); }
html[data-theme="dark"] .dataTables_wrapper .dataTables_paginate .paginate_button { color: var(--ink) !important; border-color: transparent; }
html[data-theme="dark"] .dataTables_wrapper .dataTables_paginate .paginate_button:hover { background: var(--surface-3) !important; border-color: var(--rule-2) !important; color: #ffffff !important; }
html[data-theme="dark"] .dataTables_wrapper .dataTables_paginate .paginate_button.current,
html[data-theme="dark"] .dataTables_wrapper .dataTables_paginate .paginate_button.current:hover { background: #3a4452 !important; border-color: #4a5566 !important; color: #ffffff !important; }
html[data-theme="dark"] .dataTables_wrapper .dataTables_paginate .paginate_button.disabled,
html[data-theme="dark"] .dataTables_wrapper .dataTables_paginate .paginate_button.disabled:hover { color: var(--ink-3) !important; background: transparent !important; border-color: transparent !important; }
html[data-theme="dark"] .dataTables_wrapper .dataTables_filter input, html[data-theme="dark"] .dataTables_wrapper .dataTables_length select { background-color: var(--field); color: var(--ink); border: 1px solid var(--rule-2); }
html[data-theme="dark"] button.dt-button, html[data-theme="dark"] div.dt-button, html[data-theme="dark"] a.dt-button {
    background: var(--surface-3) !important; border-color: var(--rule-2) !important; color: var(--ink) !important; background-image: none !important;
}
html[data-theme="dark"] button.dt-button:hover:not(.disabled), html[data-theme="dark"] a.dt-button:hover:not(.disabled) { background: #2d3541 !important; color: #ffffff !important; }
html[data-theme="dark"] div.dt-button-collection { background-color: var(--surface); border-color: var(--rule-2); }
html[data-theme="dark"] table.dataTable thead .sorting, html[data-theme="dark"] table.dataTable thead .sorting_asc, html[data-theme="dark"] table.dataTable thead .sorting_desc { background-blend-mode: normal; }

/* ---------------------------------------------------------------- flatpickr 날짜 고르기 */
html[data-theme="dark"] .flatpickr-calendar { background: var(--surface); border: 1px solid var(--rule-2); box-shadow: 0 8px 24px rgba(0,0,0,0.5); color: var(--ink); }
html[data-theme="dark"] .flatpickr-calendar.arrowTop:after { border-bottom-color: var(--surface); }
html[data-theme="dark"] .flatpickr-calendar.arrowBottom:after { border-top-color: var(--surface); }
html[data-theme="dark"] .flatpickr-months .flatpickr-month, html[data-theme="dark"] .flatpickr-current-month .flatpickr-monthDropdown-months,
html[data-theme="dark"] .flatpickr-current-month input.cur-year, html[data-theme="dark"] .flatpickr-months .flatpickr-prev-month, html[data-theme="dark"] .flatpickr-months .flatpickr-next-month { color: var(--ink); fill: var(--ink); background: transparent; }
html[data-theme="dark"] .flatpickr-months .flatpickr-prev-month svg, html[data-theme="dark"] .flatpickr-months .flatpickr-next-month svg { fill: var(--ink); }
html[data-theme="dark"] .flatpickr-month, html[data-theme="dark"] .flatpickr-current-month, html[data-theme="dark"] .flatpickr-current-month span.cur-month,
html[data-theme="dark"] .flatpickr-prev-month, html[data-theme="dark"] .flatpickr-next-month { color: var(--ink) !important; fill: var(--ink) !important; }
html[data-theme="dark"] .flatpickr-prev-month svg, html[data-theme="dark"] .flatpickr-next-month svg, html[data-theme="dark"] .flatpickr-prev-month svg path, html[data-theme="dark"] .flatpickr-next-month svg path { fill: var(--ink) !important; }
html[data-theme="dark"] .flatpickr-current-month input.cur-year, html[data-theme="dark"] .flatpickr-current-month .numInputWrapper input { background: transparent !important; border: 0 !important; color: var(--ink) !important; box-shadow: none !important; }
html[data-theme="dark"] .flatpickr-current-month .numInputWrapper:hover, html[data-theme="dark"] .flatpickr-current-month span.cur-month:hover { background: var(--surface-3); }
html[data-theme="dark"] span.flatpickr-weekday, html[data-theme="dark"] .flatpickr-weekdays { color: var(--ink-2); background: transparent; }
html[data-theme="dark"] .flatpickr-day { color: var(--ink); }
html[data-theme="dark"] .flatpickr-day:hover, html[data-theme="dark"] .flatpickr-day:focus, html[data-theme="dark"] .flatpickr-day.inRange { background: var(--surface-3); border-color: var(--surface-3); box-shadow: none; }
html[data-theme="dark"] .flatpickr-day.today { border-color: var(--ink-2); }
html[data-theme="dark"] .flatpickr-day.selected, html[data-theme="dark"] .flatpickr-day.startRange, html[data-theme="dark"] .flatpickr-day.endRange,
html[data-theme="dark"] .flatpickr-day.selected:hover { background: #2360d6; border-color: #2360d6; color: #ffffff; }
html[data-theme="dark"] .flatpickr-day.prevMonthDay, html[data-theme="dark"] .flatpickr-day.nextMonthDay, html[data-theme="dark"] .flatpickr-day.flatpickr-disabled,
html[data-theme="dark"] .flatpickr-day.flatpickr-disabled:hover { color: var(--ink-3); }
html[data-theme="dark"] .flatpickr-time { border-top-color: var(--rule); }
html[data-theme="dark"] .flatpickr-time input, html[data-theme="dark"] .flatpickr-time .flatpickr-am-pm, html[data-theme="dark"] .flatpickr-time .flatpickr-time-separator { color: var(--ink); background: transparent; }
html[data-theme="dark"] .flatpickr-time input:hover, html[data-theme="dark"] .flatpickr-time input:focus { background: var(--surface-3); }
html[data-theme="dark"] .numInputWrapper span.arrowUp:after { border-bottom-color: var(--ink-2); }
html[data-theme="dark"] .numInputWrapper span.arrowDown:after { border-top-color: var(--ink-2); }

/* ---------------------------------------------------------------- bootstrap-multiselect */
html[data-theme="dark"] .multiselect-container > li > a > label, html[data-theme="dark"] .multiselect-container > li > a { color: var(--ink); }
html[data-theme="dark"] .multiselect-container > li.active > a, html[data-theme="dark"] .multiselect-container > li.active > a > label { background-color: var(--surface-3); color: #ffffff; }
html[data-theme="dark"] .multiselect-container .input-group-addon { background-color: var(--surface-3); }

/* ---------------------------------------------------------------- dhtmlx 일정 달력(자체 색이 많아 통째로 뒤집음 · 일정 색은 다시 뒤집어 원래 색) */
html[data-theme="dark"] .dhx_cal_container { filter: invert(0.9) hue-rotate(180deg); }
html[data-theme="dark"] .dhx_cal_container .dhx_cal_event, html[data-theme="dark"] .dhx_cal_container .dhx_cal_event_line,
html[data-theme="dark"] .dhx_cal_container .dhx_cal_event_clear, html[data-theme="dark"] .dhx_cal_container img { filter: invert(1) hue-rotate(180deg); }

/* ---------------------------------------------------------------- 머티리얼 스위치(material.switch.css) */
html[data-theme="dark"] .material-switch > label::before { background: #4a5566; box-shadow: inset 0 0 10px rgba(0,0,0,0.5); }

/* ---------------------------------------------------------------- 화면에 직접 박은 밝은 색(style="…") */
html[data-theme="dark"] [style*="background:#fff;"], html[data-theme="dark"] [style*="background: #fff;"], html[data-theme="dark"] [style$="background:#fff"],
html[data-theme="dark"] [style$="background: #fff"], html[data-theme="dark"] [style*="background:#ffffff"], html[data-theme="dark"] [style*="background: #ffffff"],
html[data-theme="dark"] [style*="background-color:#fff;"], html[data-theme="dark"] [style*="background-color: #fff;"], html[data-theme="dark"] [style$="background-color:#fff"],
html[data-theme="dark"] [style$="background-color: #fff"], html[data-theme="dark"] [style*="background-color:#ffffff"], html[data-theme="dark"] [style*="background-color: #ffffff"],
html[data-theme="dark"] [style*="background-color:#FFFFFF"], html[data-theme="dark"] [style*="background-color: #FFFFFF"],
html[data-theme="dark"] [style*="background:white"], html[data-theme="dark"] [style*="background: white"], html[data-theme="dark"] [style*="background-color:white"],
html[data-theme="dark"] [style*="background-color: white"], html[data-theme="dark"] [style*="background-color:rgb(255, 255, 255)"], html[data-theme="dark"] [style*="background-color: rgb(255, 255, 255)"] {
    background-color: var(--surface) !important; color: var(--ink);
}
html[data-theme="dark"] [style*="background-color:#efefef"], html[data-theme="dark"] [style*="background-color: #efefef"], html[data-theme="dark"] [style*="background-color:#f5f5f5"],
html[data-theme="dark"] [style*="background-color: #f5f5f5"], html[data-theme="dark"] [style*="background:#eceff1"], html[data-theme="dark"] [style*="background: #eceff1"],
html[data-theme="dark"] [style*="background:#f5f5f5"], html[data-theme="dark"] [style*="background: #f5f5f5"], html[data-theme="dark"] [style*="background-color:#eee"],
html[data-theme="dark"] [style*="background-color: #eee"], html[data-theme="dark"] [style*="background:#eee"], html[data-theme="dark"] [style*="background: #eee"],
html[data-theme="dark"] [style*="background-color:#f9f9f9"], html[data-theme="dark"] [style*="background-color: #f9f9f9"], html[data-theme="dark"] [style*="background-color:#fafafa"],
html[data-theme="dark"] [style*="background-color: #fafafa"], html[data-theme="dark"] [style*="background:#fafafa"], html[data-theme="dark"] [style*="background: #fafafa"] {
    background-color: var(--surface-2) !important; color: var(--ink);
}
/* 옅은 초록 바탕(골라진 줄 등) = 통과·고름 → 밤의 초록 바탕 */
html[data-theme="dark"] [style*="rgb(161,228,163)"], html[data-theme="dark"] [style*="rgb(161, 228, 163)"], html[data-theme="dark"] [style*="#a1e4a3"], html[data-theme="dark"] [style*="#A1E4A3"] {
    background-color: var(--ok-soft) !important; color: var(--ok) !important;
}
html[data-theme="dark"] [style*="background:#fff4e0"], html[data-theme="dark"] [style*="background: #fff4e0"], html[data-theme="dark"] [style*="background-color:#fff4e0"],
html[data-theme="dark"] [style*="background:#fff8e1"], html[data-theme="dark"] [style*="background: #fff8e1"], html[data-theme="dark"] [style*="background-color:#fcf8e3"] { background-color: var(--warn-soft) !important; }
html[data-theme="dark"] [style*="background:#fdecec"], html[data-theme="dark"] [style*="background: #fdecec"], html[data-theme="dark"] [style*="background-color:#fdecec"],
html[data-theme="dark"] [style*="background:#ffebee"], html[data-theme="dark"] [style*="background: #ffebee"], html[data-theme="dark"] [style*="background-color:#f2dede"] { background-color: var(--bad-soft) !important; }
html[data-theme="dark"] [style*="background:#e8f5e9"], html[data-theme="dark"] [style*="background: #e8f5e9"], html[data-theme="dark"] [style*="background-color:#dff0d8"] { background-color: var(--ok-soft) !important; }
/* 어두운 글자를 박은 곳 = 밤엔 밝은 글자 */
html[data-theme="dark"] [style*="color:#263238"], html[data-theme="dark"] [style*="color: #263238"], html[data-theme="dark"] [style*="color:#333"], html[data-theme="dark"] [style*="color: #333"],
html[data-theme="dark"] [style*="color:#000"], html[data-theme="dark"] [style*="color: #000"], html[data-theme="dark"] [style*="color:black"], html[data-theme="dark"] [style*="color: black"],
html[data-theme="dark"] [style*="color:#455a64"], html[data-theme="dark"] [style*="color: #455a64"], html[data-theme="dark"] [style*="color:#212121"], html[data-theme="dark"] [style*="color: #212121"] { color: var(--ink) !important; }
html[data-theme="dark"] [style*="color:#777"], html[data-theme="dark"] [style*="color: #777"], html[data-theme="dark"] [style*="color:#6b7280"], html[data-theme="dark"] [style*="color: #6b7280"],
html[data-theme="dark"] [style*="color:#78909c"], html[data-theme="dark"] [style*="color: #78909c"], html[data-theme="dark"] [style*="color:#607d8b"], html[data-theme="dark"] [style*="color: #607d8b"],
html[data-theme="dark"] [style*="color:#666"], html[data-theme="dark"] [style*="color: #666"], html[data-theme="dark"] [style*="color:#888"], html[data-theme="dark"] [style*="color: #888"],
html[data-theme="dark"] [style*="color:#999"], html[data-theme="dark"] [style*="color: #999"], html[data-theme="dark"] [style*="color:gray"], html[data-theme="dark"] [style*="color: gray"] { color: var(--ink-2) !important; }
/* 위 규칙이 「background-color:#fff」 안의 「color:#fff」 를 잘못 잡지 않게: 흰 글자는 그대로(어두운 바탕 단추 등) */
html[data-theme="dark"] [style*="color:#fff"]:not([style*="background"]), html[data-theme="dark"] [style*="color: #fff"]:not([style*="background"]) { color: #ffffff; }

/* ---------------------------------------------------------------- jQuery .css() 로 넣은 색(rgb(…) 모양으로 들어감) */
html[data-theme="dark"] [style*="background-color: rgb(249, 249, 249)"], html[data-theme="dark"] [style*="background-color: rgb(245, 245, 245)"],
html[data-theme="dark"] [style*="background-color: rgb(239, 239, 239)"], html[data-theme="dark"] [style*="background-color: rgb(238, 238, 238)"],
html[data-theme="dark"] [style*="background-color: rgb(250, 250, 250)"], html[data-theme="dark"] [style*="background: rgb(249, 249, 249)"],
html[data-theme="dark"] [style*="background: rgb(245, 245, 245)"], html[data-theme="dark"] [style*="background: rgb(238, 238, 238)"] { background-color: var(--surface-2) !important; color: var(--ink); }
html[data-theme="dark"] [style*="background: rgb(255, 255, 255)"] { background-color: var(--surface) !important; color: var(--ink); }
html[data-theme="dark"] [style*="color: rgb(51, 51, 51)"], html[data-theme="dark"] [style*="color: rgb(0, 0, 0)"], html[data-theme="dark"] [style*="color: rgb(33, 33, 33)"] { color: var(--ink) !important; }
html[data-theme="dark"] [style*="color:#a22a2a"], html[data-theme="dark"] [style*="color: #a22a2a"], html[data-theme="dark"] [style*="color:#c62828"]:not([style*="background"]),
html[data-theme="dark"] [style*="color: #c62828"]:not([style*="background"]), html[data-theme="dark"] [style*="color:#d03b3b"], html[data-theme="dark"] [style*="color:red"],
html[data-theme="dark"] [style*="color: red"] { color: var(--bad) !important; }
html[data-theme="dark"] [style*="color:#9a4a1f"], html[data-theme="dark"] [style*="color: #9a4a1f"], html[data-theme="dark"] [style*="color:#9a4a26"], html[data-theme="dark"] [style*="color:#7a3a1d"] { color: var(--warn) !important; }
html[data-theme="dark"] [style*="color:#006300"], html[data-theme="dark"] [style*="color: #006300"], html[data-theme="dark"] [style*="color:#2e7d32"], html[data-theme="dark"] [style*="color: #2e7d32"] { color: var(--ok) !important; }

/* ---------------------------------------------------------------- 로그인 상자(style.css) · 서버 개요 숫자 칸(dashboard.css) */
html[data-theme="dark"] .form-signin { background-color: var(--surface); border: 1px solid var(--rule); color: var(--ink); }
html[data-theme="dark"] .form-signin-heading { color: var(--ink); }
html[data-theme="dark"] .dashboard-block, html[data-theme="dark"] .dashboard-block:hover, html[data-theme="dark"] .dashboard-block:active, html[data-theme="dark"] .dashboard-block:focus {
    background-color: var(--surface-3); color: var(--ink-2); text-shadow: none; opacity: 1;
}
html[data-theme="dark"] .dashboard-block .title { color: var(--ink-2); }
html[data-theme="dark"] .dashboard-block .count, html[data-theme="dark"] .dashboard-block .details span:not(.title) { color: var(--ink); }
html[data-theme="dark"] .dashboard-block i, html[data-theme="dark"] .dashboard-block:hover i { color: rgba(255,255,255,0.07); }

/* ---------------------------------------------------------------- 지급 사유 칸(gift_reason.js 가 넣는 CSS) */
html[data-theme="dark"] .gr-row { background: var(--surface-2); }
html[data-theme="dark"] .gr-label { color: var(--ink); }
html[data-theme="dark"] .gr-label em { color: var(--bad); }
html[data-theme="dark"] .gr-hint { color: var(--ink-2); }
html[data-theme="dark"] .gr-box .gr-code, html[data-theme="dark"] .gr-box .gr-detail { background-color: var(--field); color: var(--ink); border-color: var(--rule-2); }

/* ---------------------------------------------------------------- 보안·감사 · 내 지급 기록 · 위험 잠금 카드 · 캠페인 스케줄러(c1_audit.css · c3_campaign.css = .c1 변수) */
html[data-theme="dark"] .c1 {
    --c1-page: #12161c; --c1-surface: #1b2129; --c1-wash: #151a21;
    --c1-ink: #e6e9ee; --c1-ink2: #b4bdc8; --c1-muted: #8a95a2;
    --c1-line: #2a323d; --c1-border: rgba(255, 255, 255, 0.10);
    --c1-accent: #2a78d6; --c1-accent-strong: #4a8ee8; --c1-accent-soft: #22355a; --c1-accent-wash: #18253b;
    --c1-good: #5ccb8c; --c1-good-text: #5ccb8c; --c1-warning: #efb45c; --c1-serious: #f0a07a; --c1-critical: #ff7469;
}
html[data-theme="dark"] .c1-seg, html[data-theme="dark"] .cc-modeset { background: var(--surface-2); }
html[data-theme="dark"] .c1 .c1-input::placeholder { color: var(--ink-3); }
html[data-theme="dark"] .c1 .c1-input, html[data-theme="dark"] .c1 .c1-select { border-color: var(--rule-2); background-color: var(--field); color: var(--ink); }
html[data-theme="dark"] .c1 .c1-btn-ghost { box-shadow: inset 0 0 0 1px var(--rule-2); }
html[data-theme="dark"] .c1 code.c1-cmd, html[data-theme="dark"] .c1-chip, html[data-theme="dark"] .c1-risk.r1, html[data-theme="dark"] .cc-mode.m-off,
html[data-theme="dark"] .cc-state.s0, html[data-theme="dark"] .cc-type, html[data-theme="dark"] .cc-srv-chip { background: var(--surface-3); }
html[data-theme="dark"] .c1 .dataTables_paginate .pagination > li > a:hover, html[data-theme="dark"] .c1 .c1-x:hover, html[data-theme="dark"] .cc-modal .c1-x:hover { background: var(--surface-3); }
html[data-theme="dark"] .c1 .dataTables_paginate .pagination > .active > a, html[data-theme="dark"] .c1 .dataTables_paginate .pagination > .active > a:hover { background: #3a4452; color: #ffffff; }
html[data-theme="dark"] .c1 .dataTables_paginate .pagination > .disabled > a { color: var(--ink-3); }
html[data-theme="dark"] .c1-status.bad, html[data-theme="dark"] .cc-tabs.over, html[data-theme="dark"] .cc-note.bad { color: var(--bad); }
html[data-theme="dark"] .c1-risk.r3, html[data-theme="dark"] .cc-srv-chip.miss { background: var(--bad-soft); color: var(--bad); }
html[data-theme="dark"] .c1-risk.r2, html[data-theme="dark"] .cc-warnbox { background: var(--warn-soft); color: var(--warn); }
html[data-theme="dark"] .cc-note.warn, html[data-theme="dark"] .cc-next .cc-held { color: var(--warn); }
html[data-theme="dark"] .cc-mode.m-auto, html[data-theme="dark"] .cc-state.s1, html[data-theme="dark"] .cc-srv-chip.s1 { background: var(--ok-soft); color: var(--ok); }
html[data-theme="dark"] .cc-tabs-bar { background: var(--surface-3); }
html[data-theme="dark"] .c1 pre.c1-code { background: var(--surface-2); }
html[data-theme="dark"] .c1 .c1-cell-input:hover { border-color: var(--rule-2); }
html[data-theme="dark"] .c1-switch span { background: #4a5566; }
html[data-theme="dark"] .c1 tr.c1-dirty td { background: var(--warn-soft); }
html[data-theme="dark"] .c1-drawer-backdrop { background: rgba(0, 0, 0, 0.5); }

/* ---------------------------------------------------------------- 내 지급 기록(audit_mine.ejs 의 .am-*) */
html[data-theme="dark"] body[style*="background:#f4f6fa"], html[data-theme="dark"] body[style*="background: #f4f6fa"] { background: var(--bg) !important; }
html[data-theme="dark"] .am-wrap { color: var(--ink); }
html[data-theme="dark"] .am-head small, html[data-theme="dark"] .am-sum span { color: var(--ink-2); }
html[data-theme="dark"] .am-bar, html[data-theme="dark"] .am-sum div, html[data-theme="dark"] table.am-t { background: var(--surface); border-color: var(--rule); }
html[data-theme="dark"] .am-bar input { background: var(--field); color: var(--ink); border-color: var(--rule-2); }
html[data-theme="dark"] .am-bar button { background: #2a78d6; }
html[data-theme="dark"] table.am-t th { background: var(--surface-2); color: var(--ink-2); border-bottom-color: var(--rule); }
html[data-theme="dark"] table.am-t td { border-bottom-color: var(--rule); }
html[data-theme="dark"] .am-ok { color: var(--ok); }
html[data-theme="dark"] .am-fail { color: var(--bad); }
html[data-theme="dark"] .am-empty { color: var(--ink-3); }

/* ---------------------------------------------------------------- 화면 <style> 에 박은 밝은 색(2026-11-03 RM-547 · 밤에 흰 창이 뜨던 곳)
   CS 한 화면(user_dialog_cs.ejs .csv) · 감시 목록(user_dialog_watch.ejs .wl) · 해시 차단 해제(logging_hash_release.ejs #hbr-wrap) · 2단계 등록(login_otp_setup.ejs)
   색 뜻은 그대로: 꼬리표(.cat · .pill)의 진한 바탕·흰 글자는 둠 · 옅은 노랑/빨강/보라 줄 바탕 = 밤의 주의·문제·중립 바탕 */
html[data-theme="dark"] .csv .modal-body, html[data-theme="dark"] .wl .modal-body { background: var(--bg); color: var(--ink); }
html[data-theme="dark"] .csv .card, html[data-theme="dark"] .csv .box, html[data-theme="dark"] .csv .tl, html[data-theme="dark"] .csv .lk,
html[data-theme="dark"] .wl .box { background: var(--surface); box-shadow: 0 0 0 1px var(--rule); color: var(--ink); }
html[data-theme="dark"] .csv .card b { color: var(--ink); }
html[data-theme="dark"] .csv .card span, html[data-theme="dark"] .csv .tl td.t, html[data-theme="dark"] .csv .tl .d, html[data-theme="dark"] .csv .lk .d,
html[data-theme="dark"] .csv .src, html[data-theme="dark"] .csv .box td.k, html[data-theme="dark"] .wl .d { color: var(--ink-2); }
html[data-theme="dark"] .csv .box h5, html[data-theme="dark"] .csv .lk-head b, html[data-theme="dark"] .wl .box h5 { color: var(--ink-2); }
html[data-theme="dark"] .csv .tl th, html[data-theme="dark"] .csv .lk th, html[data-theme="dark"] .wl th { background: var(--surface-2); color: var(--ink-2); }
html[data-theme="dark"] .csv .tl td, html[data-theme="dark"] .csv .lk td, html[data-theme="dark"] .wl td { border-top-color: var(--rule); }
html[data-theme="dark"] .csv .tl tr.warn td { background: var(--warn-soft); } html[data-theme="dark"] .csv .tl tr.bad td { background: var(--bad-soft); }
html[data-theme="dark"] .csv .lk tr.dev td { background: var(--surface-3); }
html[data-theme="dark"] .csv .lk tr.mute td, html[data-theme="dark"] .wl tr.off td { color: var(--ink-3); }
html[data-theme="dark"] .csv .chip { background: var(--surface); border-color: var(--rule-2); color: var(--ink); }
html[data-theme="dark"] .csv .chip.on { background: var(--progress-soft); border-color: var(--progress); color: var(--ink); }
html[data-theme="dark"] .csv .lk .ipc { background: var(--surface-3); color: var(--ink); } html[data-theme="dark"] .csv .lk .ipc.shared { background: var(--warn-soft); color: var(--warn); }
html[data-theme="dark"] .csv .lk-ban { background: var(--bad-soft); }
html[data-theme="dark"] .csv .lk-ban select, html[data-theme="dark"] .csv .lk-ban input[type=text], html[data-theme="dark"] .csv-wreason { background: var(--field); color: var(--ink); border: 1px solid var(--rule-2); }
html[data-theme="dark"] .csv .src .err, html[data-theme="dark"] .csv .lk .err { color: var(--bad); }
html[data-theme="dark"] #hbr-wrap .hbr-note code, html[data-theme="dark"] #hbr-wrap label code { background: var(--surface-3); }
html[data-theme="dark"] #hbr-wrap .hbr-warn, html[data-theme="dark"] #hbr-wrap .hbr-done.warn { background: var(--warn-soft); color: var(--warn); box-shadow: inset 0 0 0 1px rgba(239,180,92,.35); }
html[data-theme="dark"] #hbr-wrap .hbr-err, html[data-theme="dark"] #hbr-wrap .c1-chip.hbr-chip-target { background: var(--bad-soft); color: var(--bad); }
html[data-theme="dark"] #hbr-wrap .c1-chip.hbr-chip-other, html[data-theme="dark"] #hbr-wrap .hbr-stale { background: var(--warn-soft); color: var(--warn); }
html[data-theme="dark"] #hbr-wrap .hbr-stale { background: transparent; }
html[data-theme="dark"] #hbr-wrap .c1-chip.hbr-chip-released { background: var(--ok-soft); }
html[data-theme="dark"] #hbr-wrap .hbr-k-target .c1-stat-value { color: var(--bad); }
html[data-theme="dark"] #hbr-wrap .hbr-exec { background: var(--bad-soft); box-shadow: inset 0 0 0 1px rgba(255,116,105,.35); }
html[data-theme="dark"] #hbr-wrap .hbr-done { background: var(--ok-soft); box-shadow: inset 0 0 0 1px rgba(92,203,140,.35); }
html[data-theme="dark"] body[style*="background:#f0f2f5"] { background: var(--bg) !important; }
html[data-theme="dark"] .setup-box { background: var(--surface); border-color: var(--rule); color: var(--ink); }
html[data-theme="dark"] .setup-box .secret { background: var(--surface-3); color: var(--ink); }
html[data-theme="dark"] .setup-box .muted { color: var(--ink-2); }
html[data-theme="dark"] .setup-box .qr { background: #fff; padding: 8px; border-radius: 6px; }      /* QR 은 밝은 바탕이어야 찍힘 · 여백은 svg 말고 감싼 칸에(svg 에 padding 을 주면 QR 오른쪽·아래가 잘림 · ClaudeTools 공지 r936) */

/* ---------------------------------------------------------------- 오른쪽 위 「화면」 고르기 · 상단 막대 폭(밤·낮 모두) */
.ops-theme-menu .fa { width: 16px; text-align: center; }
/* 상단 막대가 정해진 1170px 상자(.container)에 갇혀 영어·간체에서 두 줄로 밀렸다 → 화면 폭 전체 · 좁으면 「화면」은 아이콘만 */
.navbar-fixed-top > .container { width: auto; max-width: none; padding-left: 20px; padding-right: 20px; }
@media (max-width: 1599px) { .ops-theme-menu #headerTheme { display: none; } }

/* =====================================================================================================================
 * 2026-11-02 RM-525 글자 손보기(밤·낮 모두) · 사용자 「언어별 읽기 좋은 글꼴 · 겹치는 곳 · 너무 작은 글자 · 밤 단추 색」
 * - 글꼴 = <html lang>(ops_theme.js 가 언어 쿠키로 · menu_top.ejs 가 서버 값으로 다시) 따라:
 *   한국어·English = Pretendard(웹 글꼴 · ops_theme.js 가 간체가 아닐 때만 불러옴 · 못 받으면 맑은 고딕/Segoe UI) · 简体中文 = 微软雅黑/PingFang(기기 글꼴 · 중국에서도 받기 걱정 없음)
 * - 작은 글자: 원래 화면이 표를 <div style="font-size:11px"> 로 감싸 줄였다(모바일 탓 아님 · 66곳) → 13px · 그 밖 12px 미만 → 12px
 * ===================================================================================================================== */
:root {
    --ops-font-ko: "Pretendard Variable", Pretendard, -apple-system, BlinkMacSystemFont, "Apple SD Gothic Neo", "Malgun Gothic", "맑은 고딕", "Noto Sans KR", sans-serif;
    --ops-font-en: "Pretendard Variable", Pretendard, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Malgun Gothic", sans-serif;
    --ops-font-zh: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Microsoft YaHei", "微软雅黑", "Noto Sans SC", "Source Han Sans SC", "Hiragino Sans GB", sans-serif;
    --ops-font: var(--ops-font-ko);
}
html:lang(en) { --ops-font: var(--ops-font-en); }
html:lang(zh), html:lang(zh-CN) { --ops-font: var(--ops-font-zh); }
body, input, select, textarea, button, .btn, .tooltip, .popover, .c1, .gr-row, .gr-box, .c1-toast, .c1-tip, .am-wrap, .navbar, .dropdown-menu, .modal-content { font-family: var(--ops-font); }
body { -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; }
td, th, .c1-num, .dashboard-block .count { font-variant-numeric: tabular-nums; }

/* 작은 글자 */
[style*="font-size:11px"], [style*="font-size: 11px"], [style*="font-size:11.5px"], [style*="font-size: 11.5px"] { font-size: 13px !important; }
[style*="font-size:10px"], [style*="font-size: 10px"], [style*="font-size:9px"], [style*="font-size: 9px"], [style*="font-size:8pt"], [style*="font-size: 8pt"] { font-size: 12px !important; }
small, .small { font-size: max(0.85em, 12px); }
.flot-tick-label, .tickLabel { font-size: 12px !important; }
html .c1 table.c1-table thead th, html .c1 table.c1-table th, html .c1 code.c1-cmd, html .gr-hint, html .cc-type, html .c1-chip, html .c1-risk, html .c1-subtext, html .c1-table-meta { font-size: 12px; }
/* 화면 <style> 이 DataTables 표를 11px 로(상품 확률 · 랭킹 관리 등) → 12.5px */
html table.dataTable thead th, html table.dataTable thead td, html table.dataTable tbody td { font-size: max(12.5px, 1em); }
.flot-text, .flot-text div { font-size: 12px !important; }
html .c1 .c1-field > label, html .c1-field label { font-size: 12px; }
html button.dt-button, html div.dt-button, html a.dt-button, html .dt-button span { font-size: 12.5px; }
html .label { font-size: 12px; }
.dataTables_wrapper .dataTables_info, .dataTables_wrapper .dataTables_length, .dataTables_wrapper .dataTables_filter, .dataTables_wrapper .dataTables_paginate { font-size: 12.5px; }

/* 겹침(1280 폭에서 찾음): 좁은 칸에 고정 폭 입력·단추 → 옆 칸으로 넘침 → 그 줄은 내용 폭대로 · 줄바꿈 */
/* 바로 그 줄에만(전에 :has 가 깊은 곳의 같은 id 를 잡아 유저 화면 전체 줄이 넓어졌다) */
.row:has(> [class*="col-"] > .input-group > .input-group-btn > #btnDownLoadForm), .row:has(> [class*="col-"] > .input-group > #member-id) { display: flex; flex-wrap: wrap; gap: 6px 0; }
.row:has(> [class*="col-"] > .input-group > .input-group-btn > #btnDownLoadForm) > [class*="col-"], .row:has(> [class*="col-"] > .input-group > #member-id) > [class*="col-"] { width: auto; float: none; flex: 0 0 auto; }
.btn { min-width: max-content; }

/* 밤 단추·꼬리표 = 밤 색 톤(채도 낮춤 · 흰 글자 대비 4.5 넘게) · 뜻은 그대로(초록 = 정상·실행 · 노랑 = 주의 · 빨강 = 위험 · 파랑 = 주 동작 · 청록 = 조회) */
html[data-theme="dark"] .btn-primary { background-color: #2b5ea8; border-color: #3a6fbd; color: #ffffff; }
html[data-theme="dark"] .btn-primary:hover, html[data-theme="dark"] .btn-primary:focus, html[data-theme="dark"] .btn-primary:active, html[data-theme="dark"] .btn-primary.active { background-color: #3a6fbd; border-color: #4b80cc; color: #ffffff; }
html[data-theme="dark"] .btn-info { background-color: #1f5a73; border-color: #2a6d89; color: #e8f6fc; }
html[data-theme="dark"] .btn-info:hover, html[data-theme="dark"] .btn-info:focus, html[data-theme="dark"] .btn-info:active, html[data-theme="dark"] .btn-info.active { background-color: #2a6d89; border-color: #3a7f9c; color: #ffffff; }
html[data-theme="dark"] .btn-success { background-color: #1f6744; border-color: #2a7d54; color: #eafaf1; }
html[data-theme="dark"] .btn-success:hover, html[data-theme="dark"] .btn-success:focus, html[data-theme="dark"] .btn-success:active, html[data-theme="dark"] .btn-success.active { background-color: #2a7d54; border-color: #389165; color: #ffffff; }
html[data-theme="dark"] .btn-warning { background-color: #7d5212; border-color: #96651c; color: #fff6e6; }
html[data-theme="dark"] .btn-warning:hover, html[data-theme="dark"] .btn-warning:focus, html[data-theme="dark"] .btn-warning:active, html[data-theme="dark"] .btn-warning.active { background-color: #96651c; border-color: #ab7626; color: #ffffff; }
html[data-theme="dark"] .btn-danger { background-color: #8a2c27; border-color: #a33a33; color: #fff0ee; }
html[data-theme="dark"] .btn-danger:hover, html[data-theme="dark"] .btn-danger:focus, html[data-theme="dark"] .btn-danger:active, html[data-theme="dark"] .btn-danger.active { background-color: #a33a33; border-color: #b84a42; color: #ffffff; }
html[data-theme="dark"] .btn-secondary { background-color: var(--surface-3); border: 1px solid var(--rule-2); color: var(--ink); }
html[data-theme="dark"] .btn-primary[disabled], html[data-theme="dark"] .btn-info[disabled], html[data-theme="dark"] .btn-success[disabled], html[data-theme="dark"] .btn-warning[disabled], html[data-theme="dark"] .btn-danger[disabled] { opacity: 0.45; }
html[data-theme="dark"] .label-primary { background-color: #2b5ea8; }
html[data-theme="dark"] .label-info { background-color: #1f5a73; }
html[data-theme="dark"] .label-success { background-color: #1f6744; }
html[data-theme="dark"] .label-warning { background-color: #7d5212; }
html[data-theme="dark"] .label-danger { background-color: #8a2c27; }
html[data-theme="dark"] .c1 .c1-btn-primary { background: #2b5ea8; }
html[data-theme="dark"] .am-bar button { background: #2b5ea8; }

/* 좁은 화면(노트북 + 윈도 배율 125~150% = 1024~1280px)에서 상단 막대가 두 줄 → 본문 첫 줄을 덮었다
 * → 막대 높이(--ops-nav-h · ops_theme.js 가 잼)만큼 본문·왼쪽 메뉴를 내림 · 1280 아래는 메뉴 간격을 줄여 되도록 한 줄 */
body { padding-top: var(--ops-nav-h, 50px); }
.sidebar { top: calc(var(--ops-nav-h, 50px) + 1px); }
@media (max-width: 1279px) {
    .navbar-fixed-top .navbar-nav > li > a { padding-left: 9px; padding-right: 9px; }
    .navbar-fixed-top .navbar-brand { padding-left: 8px; padding-right: 8px; }
}

/* 표 글자를 키우자 넓은 표의 오른쪽 열이 칸에서 잘림 → 잘리지 않고 옆으로 밀어 보게 */
.dataTables_wrapper { overflow-x: auto; }