/* ===== light-mode.css — 공통 라이트모드 규칙 ===== */

/* 깜빡임 방지 */
html.body--light-pending { background: #FFFFFF !important; }

/* 기본 배경 & 색상 */
body.body--light { background: #FFFFFF !important; color: #2D3748; }
body.body--light .content { background: #FFFFFF; color: #2D3748; }
body.body--light .kv-body { background: #FFFFFF; color: #2D3748; }

/* CSS 변수 재정의 */
body.body--light {
    --bg: #FFFFFF;
    --panel: #F7F8FA;
    --line: #E2E8F0;
    --text: #2D3748;
    --muted: #6B7280;
    --gray-90: #FFFFFF;
    --gray-80: #F7F8FA;
    --gray-70: #E2E8F0;
    --gray-60: #CBD5E0;
    --gray-50: #9CA3AF;
    --gray-40: #6B7280;
    --gray-30: #4B5563;
    --gray-20: #374151;
    --gray-10: #1F2937;
    --gray-00: #111827;
}

/* data-theme(신표준) 라이트 — Map Control/Model Info 패널 한정 --gray 라이트 공급(전역 무영향).
   이 패널들(modal-popup.css·content.css)은 레거시 --gray-* 사용. body--light 페이지는 위 블록이 처리. 2026-06-23 · tanwoo */
html[data-theme="light"] .left-modal-panel,
html[data-theme="light"] .right-modal-panel {
    --gray-90: #FFFFFF;
    --gray-80: #F7F8FA;
    --gray-70: #E2E8F0;
    --gray-60: #CBD5E0;
    --gray-50: #9CA3AF;
    --gray-40: #6B7280;
    --gray-30: #4B5563;
    --gray-20: #374151;
    --gray-10: #1F2937;
    --gray-00: #111827;
}

/* data-theme 라이트 — Map Control 헤더 아이콘(흰색 svg)이 라이트 배경에 안 보여 어둡게 보정 */
html[data-theme="light"] .left-modal-panel .header-icon img { filter: brightness(0); }
/* 라이트에서 너무 연한 보조 텍스트 진하게 — 범례 단위(.legend-unit=--gray-60) · Node/Link 등 필드 라벨(.field-label=--gray-50) */
html[data-theme="light"] .left-modal-panel .legend-unit,
html[data-theme="light"] .left-modal-panel .field-label,
html[data-theme="light"] .left-modal-panel .column-label,
html[data-theme="light"] .left-modal-panel .time-speed-value { color: var(--gray-40); }
/* Time 재생/화살표 버튼 svg는 배경 rect fill #ECF6FF(연블루) 고정 — 라이트 흰 배경에 묻힘. filter로 약간 진하게 */
html[data-theme="light"] .left-modal-panel .time-playback-btn img,
html[data-theme="light"] .left-modal-panel .time-arrow-btn img { filter: brightness(0.92); }
/* 속도 슬라이더 트랙 배경(#ECF6FF 하드코딩)도 라이트에서 안 보여 연회색으로 */
html[data-theme="light"] .left-modal-panel .time-speed-slider { background: var(--gray-70); }

/* 레이아웃 */
body.body--light .layout { background: #FFFFFF; }
body.body--light .content--fixed { background: #FFFFFF; }
body.body--light .main-wrapper { background: #FFFFFF; }
body.body--light .gnb-header { box-shadow: none; }

/* 브레드크럼 */
body.body--light .breadcrumb { background: #FFFFFF; }
body.body--light .breadcrumb-item span { color: #6B7280; }
body.body--light .breadcrumb-item strong { color: #1A202C; }

/* 필터 공통 */
body.body--light .filter-container { background: transparent; }
body.body--light .filter-card { background: #F7F8FA; border-color: #E2E8F0; }
body.body--light .filter-title { color: #1A202C; }
body.body--light .filter-caption { color: #2563EB; }
body.body--light .content-head { color: #1A202C; }
body.body--light .filter-actions { border-color: #E2E8F0; }
body.body--light .filter-section { background-color: #F7F8FA; }
body.body--light .filter-controls::-webkit-scrollbar { background: #FFFFFF; }
body.body--light .filter-controls::-webkit-scrollbar-thumb { background-color: #CBD5E0; }
body.body--light .filter-separator { background-color: #E2E8F0; }

/* 입력 필드 — Pattern B (bs-*) */
body.body--light .bs-input { background: #FFFFFF; outline-color: #CBD5E0; }
body.body--light .bs-input__native { color: #1A202C; }
body.body--light .bs-input__native::placeholder { color: #9CA3AF; }
body.body--light .bs-select { background: #FFFFFF; outline-color: #CBD5E0; }
body.body--light .bs-select .label { color: #1A202C; }
body.body--light .bs-select .val { color: #4B5563; }
body.body--light .bs-select .val.muted { color: #9CA3AF; }
body.body--light .bs-select.is-disabled { outline-color: #E2E8F0; }
body.body--light .date-range { background: #FFFFFF; outline-color: #CBD5E0; }
body.body--light .date-native { color: #1A202C; }
body.body--light .date-chip { background: #E2E8F0; color: #1A202C; }
body.body--light .date-dash { background: #CBD5E0; }
body.body--light .date-hint { color: #6B7280; }

/* 입력 필드 — Pattern A (인라인 필터) */
body.body--light .control-box { background: #FFFFFF; border-color: #CBD5E0; color: #1A202C; }
body.body--light .input-plain { color: #1A202C; }
body.body--light .input-plain::placeholder { color: #9CA3AF; }
body.body--light .input-select { background: #FFFFFF; border-color: #CBD5E0; color: #1A202C; }
body.body--light .input-date { background: #E2E8F0; color: #1A202C; }
body.body--light .label { color: #6B7280; }
body.body--light .label.subtle { color: #4B5563; }
body.body--light .value .value-text { color: #1A202C; }
body.body--light .value .hint { color: #9CA3AF; }
body.body--light .filter-input .form-control { background-color: #FFFFFF; border-color: #CBD5E0; color: #1A202C; }
body.body--light .filter-input .form-control::placeholder { color: #9CA3AF; }
body.body--light .filter-input .form-control:focus { background-color: #FFFFFF; color: #1A202C; }
body.body--light .filter-input .disabled-input { background-color: #F0F1F3; border-color: #CBD5E0; }
body.body--light .input-text { color: #6B7280; }
body.body--light .date-selection { background-color: #FFFFFF; border-color: #CBD5E0; }
body.body--light .date-input { background-color: #E2E8F0; }
body.body--light .date-value { color: #1A202C; }
body.body--light .date-separator { color: #9CA3AF; }
body.body--light .date-label { color: #6B7280; }
body.body--light .dropdown-selection { background-color: #FFFFFF; border-color: #CBD5E0; }
body.body--light .dropdown-label { color: #1A202C; }
body.body--light .dropdown-value { color: #4B5563; }

/* 버튼 */
body.body--light .btn-apply { background: #E2E8F0; color: #1A202C; border-color: #E2E8F0; }
body.body--light .btn-apply:hover { background: #CBD5E0; }
body.body--light .btn-apply span { color: #1A202C; }
body.body--light .btn-apply img { filter: brightness(0) saturate(100%) invert(15%) sepia(10%) saturate(500%) hue-rotate(180deg) brightness(90%) contrast(90%); }
body.body--light .link-clear { color: #6B7280; }
body.body--light .divider { background: #E2E8F0; }
body.body--light .btn-secondary { background: #E2E8F0; border-color: #E2E8F0; color: #4B5563; }
body.body--light .btn-secondary:hover { background: #CBD5E0; border-color: #CBD5E0; color: #1A202C; }
body.body--light .btn-delete { border-color: #CBD5E0; }
body.body--light .btn-delete .btn-inner span { color: #4B5563; }
body.body--light .btn-add { background: #2563EB; border-color: #2563EB; }
body.body--light .btn-add .btn-inner span { color: #FFFFFF; }

/* 그리드 라이트모드 → grid.css 에서 통일 관리 */
/* grid-container 헤더 */
body.body--light .grid-container .grid-header { background: transparent; border-bottom-color: #E2E8F0; }

/* 상세행 */
body.body--light .detail-row { background: #F7F8FA; border-color: #E2E8F0; }
body.body--light .detail-label { color: #6B7280; }
body.body--light .detail-value { color: #1A202C; }

/* 상세 페이지 */
body.body--light .detail-panel { background: #FFFFFF; color: #1A202C; }
body.body--light .detail-panel::-webkit-scrollbar { background: #FFFFFF; }
body.body--light .detail-panel::-webkit-scrollbar-thumb { background-color: #CBD5E0; }
body.body--light .detail-panel .fixed-bottom { background-color: #FFFFFF; }
body.body--light .page-title { color: #1A202C; }
body.body--light .section-title { color: #1A202C; }
body.body--light .info-cards-wrapper { background: #F7F8FA; border: 1px solid #E2E8F0; }
body.body--light .info-label { color: #6B7280; }
body.body--light .info-value { color: #1A202C; }
body.body--light .vertical-divider { background: #E2E8F0; }
body.body--light .location-wrapper { background-color: #F7F8FA; border: 1px solid #E2E8F0; }
body.body--light .location-card .info-label { color: #6B7280; }
body.body--light .location-card .info-value { color: #1A202C; }
body.body--light .location-divider { background-color: #E2E8F0; }
body.body--light .form-label { color: #6B7280; }
body.body--light .form-input { background: #FFFFFF; color: #1A202C; border: 1px solid #CBD5E0; }
body.body--light .form-input:focus { border-color: #2563EB; }
body.body--light .form-input:read-only { background-color: #F0F1F3; border-color: #E2E8F0; }
body.body--light .form-textarea { background-color: #FFFFFF; color: #1A202C; border: 1px solid #CBD5E0; }
body.body--light .form-textarea:focus { border-color: #2563EB; }
body.body--light .form-textarea::placeholder { color: #9CA3AF; }
body.body--light .select-overlay { background: #FFFFFF; color: #1A202C; border: 1px solid #CBD5E0; }
body.body--light .bottom-divider { background: #E2E8F0; }
body.body--light .inspection-date-selection { background-color: #FFFFFF; border: 1px solid #CBD5E0; }
body.body--light .inspection-date-input { background-color: #E2E8F0; }
body.body--light .inspection-date-value { color: #1A202C; }
body.body--light .action-buttons .btn-cancel { background-color: #E2E8F0 !important; color: #4B5563 !important; }
body.body--light .action-buttons .btn-cancel:hover { background-color: #CBD5E0 !important; color: #1A202C !important; }
body.body--light .action-buttons .btn-save { background-color: #2563EB !important; color: #FFFFFF !important; }
body.body--light .action-buttons .btn-save:hover { background-color: #1D4ED8 !important; }

/* 스크롤바 */
body.body--light ::-webkit-scrollbar-track { background: #FFFFFF; }
body.body--light ::-webkit-scrollbar-thumb { background: #CBD5E0; }
body.body--light ::-webkit-scrollbar-thumb:hover { background: #9CA3AF; }