@charset "utf-8";
/* ==========================================================================
   관리자 다크모드
   - html[data-theme="dark"] 일 때만 적용된다. 라이트모드는 기존 스타일 그대로.
   - 적용 범위: 공통 골격(배경/패널/표/입력/버튼) + 프로젝트관리·영업관리(#projectList)
   - 관리자 CSS 는 밝은 색이 하드코딩된 곳이 많아, 자주 쓰는 화면을 우선 덮는다.
     외부 위젯(서머노트/달력/트리 등)은 일부 밝게 남을 수 있음.
   ⚠ templateHtml.jsp 이후에 로드되어야 style.css 를 덮을 수 있다.
   ========================================================================== */

:root[data-theme="dark"] {
	--dk-bg:        #141414;   /* 페이지 배경 */
	--dk-surface:   #1e1e1e;   /* 카드/패널 */
	--dk-surface-2: #2a2a2a;   /* 표 헤더, 강조면 */
	--dk-border:    #3a3a3a;
	--dk-text:      #e5e5e5;
	--dk-text-mute: #9ca3af;
	--dk-hover:     #2e2e2e;
}

/* ===== 골격 ===== */
:root[data-theme="dark"] body,
:root[data-theme="dark"] .wrapper { background: var(--dk-bg) !important; color: var(--dk-text); }
:root[data-theme="dark"] .page-wrapper { background: var(--dk-bg) !important; }
:root[data-theme="dark"] .footer { background: transparent !important; color: var(--dk-text-mute) !important; }
:root[data-theme="dark"] .footer * { color: var(--dk-text-mute) !important; }

/* 패널/카드 */
:root[data-theme="dark"] .panel,
:root[data-theme="dark"] .card-view,
:root[data-theme="dark"] .panel-default {
	background: var(--dk-surface) !important;
	border-color: var(--dk-border) !important;
	box-shadow: none !important;
}
:root[data-theme="dark"] .panel-heading { background: var(--dk-surface) !important; border-color: var(--dk-border) !important; }
:root[data-theme="dark"] .panel-title,
:root[data-theme="dark"] .txt-dark { color: var(--dk-text) !important; }

/* 일반 텍스트 */
:root[data-theme="dark"] h1, :root[data-theme="dark"] h2, :root[data-theme="dark"] h3,
:root[data-theme="dark"] h4, :root[data-theme="dark"] h5, :root[data-theme="dark"] label,
:root[data-theme="dark"] p, :root[data-theme="dark"] span, :root[data-theme="dark"] div,
:root[data-theme="dark"] strong, :root[data-theme="dark"] li { color: inherit; }

/* ===== 공용 표 (게시판 등) ===== */
:root[data-theme="dark"] #bbs table,
:root[data-theme="dark"] .table_wrap table { background: var(--dk-surface) !important; }
:root[data-theme="dark"] #bbs th,
:root[data-theme="dark"] .table_wrap th {
	background: var(--dk-surface-2) !important;
	color: var(--dk-text) !important;
	border-color: var(--dk-border) !important;
}
:root[data-theme="dark"] #bbs td,
:root[data-theme="dark"] .table_wrap td {
	background: var(--dk-surface) !important;
	color: var(--dk-text) !important;
	border-color: var(--dk-border) !important;
}
:root[data-theme="dark"] #bbs tr:hover td { background: var(--dk-hover) !important; }

/* ===== 입력 요소 ===== */
:root[data-theme="dark"] input[type=text],
:root[data-theme="dark"] input[type=password],
:root[data-theme="dark"] input[type=number],
:root[data-theme="dark"] input[type=date],
:root[data-theme="dark"] input[type=email],
:root[data-theme="dark"] input[type=search],
:root[data-theme="dark"] select,
:root[data-theme="dark"] textarea,
:root[data-theme="dark"] .form-control {
	background: #171717 !important;
	border-color: var(--dk-border) !important;
	color: var(--dk-text) !important;
}
:root[data-theme="dark"] input::placeholder,
:root[data-theme="dark"] textarea::placeholder { color: #8b8b8b !important; }
:root[data-theme="dark"] input[type=date]::-webkit-calendar-picker-indicator { filter: invert(1) brightness(1.6); }

/* ===== 버튼 ===== */
:root[data-theme="dark"] .btns_blue_line {
	background: transparent !important;
	border-color: var(--dk-border) !important;
	color: var(--dk-text) !important;
}
:root[data-theme="dark"] .btns_blue_line strong { color: var(--dk-text) !important; }

/* ==========================================================================
   프로젝트관리 · 영업관리 (#projectList)
   ========================================================================== */
:root[data-theme="dark"] #projectList { color: var(--dk-text); }
:root[data-theme="dark"] #projectList .page-title { color: #f0f0f0; }

/* KPI 카드 */
:root[data-theme="dark"] #projectList .kpi-card {
	background: var(--dk-surface) !important;
	border-color: var(--dk-border) !important;
	box-shadow: none;
}
:root[data-theme="dark"] #projectList .kpi-title { color: var(--dk-text-mute); }
:root[data-theme="dark"] #projectList .kpi-value { color: #f0f0f0; }
:root[data-theme="dark"] #projectList .kpi-value.text-red { color: #f87171; }
:root[data-theme="dark"] #projectList .kpi-value.text-blue { color: #60a5fa; }

/* 필터바 / 상세검색 */
:root[data-theme="dark"] #projectList .filter-section,
:root[data-theme="dark"] #projectList .adv-search {
	background: var(--dk-surface) !important;
	border-color: var(--dk-border) !important;
}
:root[data-theme="dark"] #projectList .filter-btn {
	background: transparent; border-color: var(--dk-border); color: var(--dk-text-mute);
}
:root[data-theme="dark"] #projectList .filter-btn:hover { background: var(--dk-hover); color: #fff; }
:root[data-theme="dark"] #projectList .filter-btn.active { background: #3b82f6; border-color: #3b82f6; color: #fff; }
:root[data-theme="dark"] #projectList .year-item { color: var(--dk-text-mute); }
:root[data-theme="dark"] #projectList .year-item.active { color: #f0f0f0; }
:root[data-theme="dark"] #projectList .divider { color: var(--dk-border); }
:root[data-theme="dark"] #projectList .adv-search label { color: var(--dk-text-mute); }

:root[data-theme="dark"] #projectList .btn-outline {
	background: transparent; border-color: var(--dk-border); color: var(--dk-text-mute);
}
:root[data-theme="dark"] #projectList .btn-outline:hover,
:root[data-theme="dark"] #projectList .btn-outline.on { background: var(--dk-hover); color: #fff; }
/* 신규 등록 버튼: 라이트에서 남색(중립)이므로 다크에선 밝은 슬레이트로 (파랑 남용 방지) */
:root[data-theme="dark"] #projectList .btn-primary {
	background: #2563eb; border-color: #2563eb; color: #fff; box-shadow: none;
}
:root[data-theme="dark"] #projectList .btn-primary:hover { background: #1d4ed8; border-color: #1d4ed8; color: #fff; }

:root[data-theme="dark"] #projectList .search-box { background: #171717; border-color: var(--dk-border); }
:root[data-theme="dark"] #projectList .search-box select,
:root[data-theme="dark"] #projectList .search-btn { background: var(--dk-surface-2) !important; color: var(--dk-text) !important; border-color: var(--dk-border) !important; }
:root[data-theme="dark"] #projectList .search-btn:hover { background: var(--dk-hover) !important; }

/* 표 */
:root[data-theme="dark"] #projectList .table-wrapper {
	background: var(--dk-surface) !important;
	border-color: var(--dk-border) !important;
	box-shadow: none;
}
:root[data-theme="dark"] #projectList table.plist th {
	background: var(--dk-surface-2) !important;
	color: var(--dk-text) !important;
	border-color: var(--dk-border) !important;
}
:root[data-theme="dark"] #projectList table.plist th.group-money { background: #2e2e2e !important; }
:root[data-theme="dark"] #projectList table.plist td {
	background: var(--dk-surface) !important;
	color: var(--dk-text) !important;
	border-color: var(--dk-border) !important;
}
:root[data-theme="dark"] #projectList table.plist tbody tr:hover td { background: var(--dk-hover) !important; }
:root[data-theme="dark"] #projectList .sub-text,
:root[data-theme="dark"] #projectList .text-content { color: var(--dk-text-mute) !important; }
:root[data-theme="dark"] #projectList .cust-link { color: #60a5fa; }
:root[data-theme="dark"] #projectList table.plist td.text-red { color: #f87171 !important; }

/* 편집 상태 */
:root[data-theme="dark"] #projectList table.plist tr.editing td { background: #2a2413 !important; }
:root[data-theme="dark"] #projectList table.plist tr.edit-row > td { background: #2a2413 !important; }
:root[data-theme="dark"] #projectList .edit-bar-inline .edit-target { color: #fcd34d; }
:root[data-theme="dark"] #projectList .edit-bar-inline .edit-target b { color: #fde68a; }
:root[data-theme="dark"] #projectList table.plist .cell-edit input,
:root[data-theme="dark"] #projectList table.plist .cell-edit select,
:root[data-theme="dark"] #projectList table.plist .cell-edit textarea {
	background: #171717 !important; border-color: var(--dk-border) !important; color: var(--dk-text) !important;
}

/* 액션 버튼 */
:root[data-theme="dark"] #projectList .action-btn {
	background: transparent; border-color: var(--dk-border); color: var(--dk-text-mute);
}
:root[data-theme="dark"] #projectList .action-btn:hover { background: var(--dk-hover); color: #fff; }
:root[data-theme="dark"] #projectList .action-btn.on { background: var(--dk-hover); color: #fff; }
/* 저장: 중립(슬레이트) / 수주확정: 강조(파랑) — 역할이 다르므로 색을 구분한다 */
:root[data-theme="dark"] #projectList .action-btn.btn-save { background: #2563eb; border-color: #2563eb; color: #fff; }
:root[data-theme="dark"] #projectList .action-btn.btn-save:hover { background: #1d4ed8; border-color: #1d4ed8; color: #fff; }
:root[data-theme="dark"] #projectList .action-btn.btn-confirm { background: #2563eb; border-color: #2563eb; color: #fff; }
:root[data-theme="dark"] #projectList .action-btn.btn-confirm:hover { background: #1d4ed8; border-color: #1d4ed8; color: #fff; }
:root[data-theme="dark"] #projectList .action-btn.btn-del { color: #fca5a5; border-color: #7f1d1d; }
:root[data-theme="dark"] #projectList .action-btn.btn-del:hover { background: #7f1d1d; color: #fff; }

/* 상태 배지 (어두운 배경용) */
:root[data-theme="dark"] #projectList .badge.st-done       { background: #14532d; color: #86efac; }
:root[data-theme="dark"] #projectList .badge.st-incomplete { background: #7f1d1d; color: #fca5a5; }
:root[data-theme="dark"] #projectList .badge.st-progress   { background: #1e3a8a; color: #93c5fd; }
:root[data-theme="dark"] #projectList .badge.st-contract   { background: #78350f; color: #fcd34d; }
:root[data-theme="dark"] #projectList .badge.st-none       { background: var(--dk-surface-2); color: var(--dk-text-mute); }
:root[data-theme="dark"] #projectList .flag.urgent { background: #7f1d1d; color: #fca5a5; }
:root[data-theme="dark"] #projectList .flag.check  { background: #78350f; color: #fcd34d; }

/* 영업일지 */
:root[data-theme="dark"] #projectList table.plist tr.memo-row td { background: #191919 !important; border-top-color: var(--dk-border) !important; }
:root[data-theme="dark"] #projectList .memo-history { background: var(--dk-surface) !important; border-color: var(--dk-border) !important; }
:root[data-theme="dark"] #projectList .history-item { border-bottom-color: var(--dk-border); }
:root[data-theme="dark"] #projectList .history-content { color: var(--dk-text) !important; }
:root[data-theme="dark"] #projectList .memo-textarea { background: #171717 !important; border-color: var(--dk-border) !important; color: var(--dk-text) !important; }
:root[data-theme="dark"] #projectList .btn-memo-save { background: #404040; color: #fafafa; }
:root[data-theme="dark"] #projectList .btn-memo-save:hover { background: #8b8b8b; color: #fff; }

/* 페이징 / 하단 */
:root[data-theme="dark"] #projectList .page_num,
:root[data-theme="dark"] #projectList .page_num strong { color: var(--dk-text) !important; }
:root[data-theme="dark"] #projectList .paging_wrap .page a.b_num {
	background: var(--dk-surface) !important; border-color: var(--dk-border) !important; color: var(--dk-text-mute) !important;
}
:root[data-theme="dark"] #projectList .paging_wrap .page a.b_num:hover { background: var(--dk-hover) !important; color: #fff !important; }

/* 차량정보 모달 */
:root[data-theme="dark"] #carModal .car-box { background: var(--dk-surface); }
:root[data-theme="dark"] #carModal .car-head { color: #f0f0f0; border-bottom-color: var(--dk-border); }
:root[data-theme="dark"] #carModal .car-row { border-bottom-color: var(--dk-border); }
:root[data-theme="dark"] #carModal .car-label { color: var(--dk-text-mute); }
:root[data-theme="dark"] #carModal .car-val { color: var(--dk-text); }
:root[data-theme="dark"] #carModal .car-foot { border-top-color: var(--dk-border); }


:root[data-theme="dark"] #projectList table.plist tr.new-row > td,
:root[data-theme="dark"] #projectList table.plist tr#editrow_new > td { background: #262626 !important; }
:root[data-theme="dark"] #projectList table.plist tr#editrow_new .edit-target { color: #93c5fd; }

/* ===== 배차 정보 모달 ===== */
:root[data-theme="dark"] .el-modal .modal-container { background: var(--dk-surface); }
:root[data-theme="dark"] .el-modal .modal-header,
:root[data-theme="dark"] .el-modal .modal-footer { border-color: var(--dk-border); }
:root[data-theme="dark"] .el-modal .modal-title { color: #f0f0f0; }
:root[data-theme="dark"] .el-modal .info-label { color: var(--dk-text-mute); }
:root[data-theme="dark"] .el-modal .info-input {
	background: #171717 !important; border-color: var(--dk-border) !important; color: var(--dk-text) !important;
}
:root[data-theme="dark"] .el-modal .info-input[readonly] { background: #26262660 !important; }
:root[data-theme="dark"] .el-modal .info-input.amount { color: #60a5fa !important; }
:root[data-theme="dark"] .el-modal .btn-modal {
	background: transparent; border-color: var(--dk-border); color: var(--dk-text-mute);
}
:root[data-theme="dark"] .el-modal .btn-modal:hover { background: var(--dk-hover); color: #fff; }
:root[data-theme="dark"] .el-modal .btn-modal-save { background: #404040; border-color: #404040; color: #fafafa; }
:root[data-theme="dark"] .el-modal .btn-modal-save:hover { background: #8b8b8b; color: #fff; }

:root[data-theme="dark"] .el-modal .mv-product { color: #f0f0f0; }
:root[data-theme="dark"] .el-modal .hs-item { border-bottom-color: var(--dk-border); }
:root[data-theme="dark"] .el-modal .hs-date { color: var(--dk-text-mute); }
:root[data-theme="dark"] .el-modal .hs-qty { color: var(--dk-text); }
:root[data-theme="dark"] .el-modal .hs-memo { color: var(--dk-text-mute); }
:root[data-theme="dark"] .el-modal .hs-type.in  { background: #14532d; color: #86efac; }
:root[data-theme="dark"] .el-modal .hs-type.out { background: #7f1d1d; color: #fca5a5; }
:root[data-theme="dark"] .el-modal .hs-type.adj { background: #312e81; color: #a5b4fc; }

:root[data-theme="dark"] .el-modal .hs-car { background: #1e3a8a; color: #93c5fd; }

/* 재고관리 다듬기 (다크) */
:root[data-theme="dark"] #projectList .qty-num { color: #f0f0f0; }
:root[data-theme="dark"] #projectList .qty-num.low  { color: #fbbf24; }
:root[data-theme="dark"] #projectList .qty-num.zero { color: #f87171; }
:root[data-theme="dark"] #projectList .qty-unit { color: #8b8b8b; }
:root[data-theme="dark"] #projectList .th-help { background: #404040; }
:root[data-theme="dark"] #projectList .action-btn.btn-in  { color: #93c5fd; }
:root[data-theme="dark"] #projectList .action-btn.btn-in:hover  { background: #1e3a5f; border-color: #3b82f6; color: #dbeafe; }
:root[data-theme="dark"] #projectList .action-btn.btn-out { color: #fca5a5; }
:root[data-theme="dark"] #projectList .action-btn.btn-out:hover { background: #4c1d1d; border-color: #7f1d1d; color: #fecaca; }

/* ==========================================================================
   모바일(≤768px) 다크모드 보정
   - 데스크톱 다크모드는 위 규칙 그대로 유지하고, 모바일에서만 어긋나는 색을 덮는다.
   - GNB/카드/테이블/일반 모달 색상은 다크 규칙이 폭에 상관없이 적용되어 이미 정합.
     (라이트모드 모바일 @media 들은 색을 바꾸지 않고 폭/그리드만 조정하므로 충돌 없음)
   - 여기서는 작은 화면에서 특히 눈에 띄는 입출고 이력 모달의 재고변동 라벨만 보정한다.
   ========================================================================== */
@media (max-width: 768px) {
	/* 입출고 이력 모달의 입고(+)/출고(-) 라벨.
	   마크업은 .hs-move.in/.out 를 쓰는데 라이트 색(#166534/#b91c1c)이 어두운 배경에서
	   대비가 약해 흐릿하게 보인다 → 다크 팔레트 톤으로 밝혀 가독성 확보. */
	:root[data-theme="dark"] .el-modal .hs-move.in  { color: #4ade80 !important; }
	:root[data-theme="dark"] .el-modal .hs-move.out { color: #f87171 !important; }
	/* 이력 헤더/빈 목록 라벨은 뮤트 텍스트 톤으로 통일 */
	:root[data-theme="dark"] .el-modal .hs-head,
	:root[data-theme="dark"] .el-modal .hs-head .hs-move { color: var(--dk-text-mute) !important; }
	:root[data-theme="dark"] .el-modal .hs-empty { color: var(--dk-text-mute) !important; }
}

/* ===== 품목 여러 줄 입력 (다크) ===== */
:root[data-theme="dark"] #projectList .pl-del { border-color: #7f1d1d; color: #fca5a5; background: transparent; }
:root[data-theme="dark"] #projectList .pl-del:hover { background: #3f1d1d; border-color: #b91c1c; }
:root[data-theme="dark"] #projectList .pl-add { color: #60a5fa; }

/* ===== 완료/수주확정 행 강조 (다크: 아주 옅은 초록 틴트) ===== */
:root[data-theme="dark"] #projectList table.plist > tbody > tr.row-ok > td { background: #1c261f !important; }
:root[data-theme="dark"] #projectList table.plist > tbody > tr.row-ok:hover > td { background: #26332a !important; }

/* ===== 배차 차량 목록 모달 (다크) ===== */
:root[data-theme="dark"] .el-modal .dispatch-item { background: #171717; border-color: #3a3a3a; color: #e5e5e5; }
:root[data-theme="dark"] .el-modal .dispatch-item:hover { background: #262626; border-color: #404040; }
:root[data-theme="dark"] .el-modal .dispatch-item .di-date,
:root[data-theme="dark"] .el-modal .dispatch-item .di-item { color: #9ca3af; }
:root[data-theme="dark"] .el-modal .dispatch-item .di-driver { color: #d4d4d4; }
:root[data-theme="dark"] .el-modal .dl-empty { color: #8b8b8b; }
:root[data-theme="dark"] .el-modal .btn-add-car { background: #171717; border-color: #404040; color: #d4d4d4; }
:root[data-theme="dark"] .el-modal .btn-add-car:hover { background: #262626; border-color: #8b8b8b; }