/* === inline-style extraction (JS: mes-dash) === */
/* mes-dash.js 템플릿 literal 내 정적 인라인 style 추출 (JS 3차) */
/* 동적 값(width:${pct}%, conic-gradient(...), 조건부 색상)은 인라인 유지 */

/* progBar */
.u-dash-001 { font-size: 11px; color: var(--txt3); }
.u-dash-002 { font-size: 11px; color: var(--txt2); margin-top: 2px; }

/* showProcDet 모달 */
.u-dash-003 { width: 520px; max-height: 85vh; display: flex; flex-direction: column; }
.u-dash-004 { display: flex; justify-content: space-between; align-items: center; }
.u-dash-005 { background: none; font-size: 20px; cursor: pointer; border: none; }
.u-dash-006 { display: flex; gap: 0; border-bottom: 1px solid var(--bdr); }
.u-dash-007 { flex: 1; text-align: center; padding: 8px; font-size: 12px; }
.u-dash-008 { flex: 1; text-align: center; padding: 8px; font-size: 12px; border-left: 1px solid var(--bdr); border-right: 1px solid var(--bdr); }
.u-dash-009 { font-size: 18px; font-weight: 700; color: var(--pri); }
.u-dash-010 { font-size: 18px; font-weight: 700; color: #F59E0B; }
.u-dash-011 { font-size: 18px; font-weight: 700; color: var(--suc); }
.u-dash-012 { font-size: 11px; font-weight: 400; }
.u-dash-013 { color: var(--txt3); }
.u-dash-014 { padding: 10px 16px; flex: 1; overflow-y: auto; }

/* 진행중 카드 */
.u-dash-015 { border-left: 4px solid #F59E0B; background: #FFFBEB; border-radius: 8px; padding: 10px 12px; margin-bottom: 6px; display: flex; align-items: center; gap: 10px; }
.u-dash-016 { flex: 1; }
.u-dash-017 { font-weight: 700; font-size: 13px; }
.u-dash-018 { font-size: 11px; color: var(--txt3); margin-top: 2px; }
.u-dash-019 { padding: 4px 8px; font-size: 11px; }
.u-dash-020 { padding: 3px 8px; border-radius: 6px; background: #DCE8F5; color: #1D4ED8; font-size: 11px; font-weight: 600; }

/* 대기 안내 */
.u-dash-021 { font-size: 11px; color: #1E3A5F; margin-bottom: 6px; font-weight: 600; }

/* 대기 카드 — 정적 base. urg(D-1/D-3) 색상은 인라인 유지 */
.u-dash-022 { border-left: 4px solid var(--pri); background: var(--bg2); border-radius: 8px; padding: 10px 12px; margin-bottom: 6px; display: flex; align-items: center; gap: 10px; }
.u-dash-023 { display: flex; flex-direction: column; gap: 2px; flex-shrink: 0; }
/* 화살표 버튼 base — 활성/비활성 색은 인라인 유지 */
.u-dash-024 { border: none; font-size: 10px; line-height: 1; padding: 3px 4px; border-radius: 3px; }
.u-dash-025 { width: 22px; height: 22px; border-radius: 50%; background: #E2E8F0; display: flex; align-items: center; justify-content: center; font-size: 11px; font-weight: 700; color: #475569; }
/* D- 색상 동적 → 인라인 유지 */
.u-dash-026 { font-size: 11px; font-weight: 700; }
.u-dash-027 { padding: 3px 8px; border-radius: 6px; background: #FEF3C7; color: #B45309; font-size: 11px; font-weight: 600; }

/* 완료 카드 */
.u-dash-028 { border-left: 4px solid var(--suc); background: #F0FDF4; border-radius: 8px; padding: 10px 12px; margin-bottom: 6px; display: flex; align-items: center; gap: 10px; opacity: .7; }
.u-dash-029 { font-size: 13px; font-weight: 700; color: var(--suc); }

/* empty */
.u-dash-030 { text-align: center; padding: 30px; color: var(--txt3); font-size: 13px; }

/* progBar/gauge dynamic — font-size: 14px small label */
.u-dash-031 { font-size: 14px; }

/* nd-pipe-tags span 색상 */
.u-dash-pip-w { background: #FEF3C7; color: #92400E; }
.u-dash-pip-k { background: #E0F2FE; color: #1E3A5F; }
.u-dash-pip-d { background: #E9EDF2; color: #475569; }
.u-dash-pip-0 { background: #F5F7FA; color: #94A3B8; }

/* nd-area header */
.u-dash-032 { font-size: 10px; color: #94A3B8; font-weight: 600; }

/* ERP 정리: dailyTxRng 토글 버튼 스타일(u-dash-033/034/035) 제거 */

/* KPI rate small */
.u-dash-036 { font-size: 14px; font-weight: 700; }

/* tb-card-num 건 */
.u-dash-037 { font-size: 13px; font-weight: 700; color: #94A3B8; margin-left: 4px; }

/* 실시간 알림 타이틀 */
.u-dash-038 { font-size: 11px; color: var(--txt2); font-weight: 400; }
.u-dash-039 { max-height: 220px; overflow-y: auto; }

/* 완료 확인 대기 */
.u-dash-040 { max-height: 200px; overflow-y: auto; }
.u-dash-041 { display: flex; align-items: center; justify-content: space-between; padding: 8px 12px; margin-bottom: 4px; background: var(--bg2); border-radius: var(--r-sm); }
.u-dash-042 { display: flex; align-items: center; gap: 10px; flex: 1; }
.u-dash-043 { font-weight: 700; font-size: 13px; color: var(--txt); }
.u-dash-044 { font-size: 12px; color: var(--txt2); }
.u-dash-045 { font-size: 12px; color: var(--suc); font-weight: 600; }
.u-dash-046 { font-size: 12px; color: var(--txt); font-weight: 600; }

/* 입고확인 모달 */
.u-dash-047 { padding: 16px; }
.u-dash-048 { font-size: 13px; color: #64748B; margin-bottom: 12px; }
.u-dash-049 { display: flex; gap: 8px; align-items: end; }
.u-dash-050 { font-weight: 700; font-size: 12px; }
.u-dash-051 { padding: 10px; font-size: 16px; font-weight: 700; border: 2px solid var(--pri); border-radius: 8px; }
.u-dash-052 { display: none; }
.u-dash-053 { padding: 10px 24px; font-size: 14px; font-weight: 700; background: #1E3A5F; color: #fff; border: none; border-radius: 8px; cursor: pointer; height: 44px; white-space: nowrap; }
.u-dash-054 { width: 520px; }

/* renderCal 더보기 */
.u-dash-055 { font-size: 9px; color: var(--txt3); text-align: center; }

/* 현장모니터 sb 32px */
.u-dash-056 { font-size: 32px; }

/* 공정 카드 (rMonitor) */
.u-dash-057 { background: #fff; border-radius: 12px; padding: 16px; border: 1px solid #E5E7EB; box-shadow: 0 1px 3px rgba(0,0,0,.04); }
.u-dash-058 { display: flex; justify-content: space-between; align-items: center; margin-bottom: 10px; }
.u-dash-059 { font-size: 16px; font-weight: 800; color: var(--pri); }
/* 동적 색 inline 유지 */
.u-dash-060 { font-size: 20px; font-weight: 900; }
.u-dash-061 { background: #E5E7EB; border-radius: 6px; height: 10px; overflow: hidden; margin-bottom: 8px; }
/* 동적 width/background inline 유지 — transition 정적 */
.u-dash-062 { height: 100%; border-radius: 6px; transition: width .3s; }
.u-dash-063 { display: flex; justify-content: space-between; font-size: 11px; color: #6B7280; }
.u-dash-064 { margin-top: 8px; border-top: 1px solid #F3F4F6; padding-top: 6px; }
.u-dash-065 { font-size: 11px; padding: 3px 0; display: flex; justify-content: space-between; }
.u-dash-066 { font-weight: 600; }
.u-dash-067 { color: #EF4444; }
.u-dash-068 { color: #6B7280; }
.u-dash-069 { font-size: 10px; color: #94A3B8; text-align: center; }

/* 진행중 작업 테이블 (rMonitor) */
.u-dash-070 { background: #FEF2F2; }
.u-dash-071 { font-weight: 700; }
.u-dash-072 { text-align: right; }
.u-dash-073 { font-weight: 700; color: var(--pri); }
.u-dash-074 { display: flex; align-items: center; gap: 6px; }
.u-dash-075 { flex: 1; background: #E5E7EB; border-radius: 4px; height: 8px; overflow: hidden; }
.u-dash-076 { height: 100%; border-radius: 4px; }
.u-dash-077 { font-size: 12px; font-weight: 700; }
.u-dash-078 { color: #EF4444; font-weight: 700; }

/* === 동적 인라인 style 제거 (CSS var + 정적 modifier) === */

/* progBar fill — width 동적 → CSS var */
.u-dash-079 { width: var(--dw, 0%); }

/* urg 대기 카드 (proc-q-item) — 조건부 색상 → modifier */
.u-dash-022.is-urg-1 { border-color: #DC2626; background: #FEF2F2; }
.u-dash-022.is-urg-3 { border-color: #F59E0B; background: #FFFBEB; }

/* 화살표 버튼 활성/비활성 — modifier */
.u-dash-024.is-act { background: #DCE8F5; color: #1E3A5F; cursor: pointer; }
.u-dash-024.is-dis { background: #E5E7EB; color: #D1D5DB; cursor: default; }

/* D-day color modifier */
.u-dash-026.is-d1 { color: #DC2626; }
.u-dash-026.is-d3 { color: #F59E0B; }
.u-dash-026.is-d0 { color: #64748B; }

/* 게이지 원 — conic-gradient 배경 동적 → CSS var */
.u-dash-080 { background: var(--dbg, #E9EDF2); }

/* 게이지 값 색상 modifier (3-tier) */
.u-dash-081.is-hi { color: #059669; }
.u-dash-081.is-mid { color: #D97706; }
.u-dash-081.is-lo { color: #DC2626; }

/* 막대 차트 fill — height 동적 + 색상 modifier */
.u-dash-082 { height: var(--dh, 0%); background: #1E3A5F; }
.u-dash-082.is-today { background: #059669; }

/* 막대 차트 라벨 — modifier */
.u-dash-083 { color: #94A3B8; font-weight: 500; }
.u-dash-083.is-today { color: #059669; font-weight: 700; }

/* 파이프 ring — conic-gradient pct 동적 → CSS var */
.u-dash-084 { background: conic-gradient(#1E3A5F 0% var(--dw, 0%), #E9EDF2 var(--dw, 0%) 100%); }

/* nd-pipe-circle 완료 — modifier */
.nd-pipe-circle.is-done { background: #ECFDF5; color: #059669; }
.nd-pipe-name.is-done { color: #059669; font-weight: 800; }

/* 공정 카드 카운트 색상 (u-dash-060) — modifier */
.u-dash-060.is-hi { color: #10B981; }
.u-dash-060.is-mid { color: #F59E0B; }
.u-dash-060.is-lo { color: #6B7280; }

/* 공정 카드 진행 바 (u-dash-062) — width 동적 + 색상 modifier */
.u-dash-062 { width: var(--dw, 0%); background: #6B7280; }
.u-dash-062.is-hi { background: #10B981; }
.u-dash-062.is-mid { background: #F59E0B; }

/* 진행중 작업 테이블 진행 바 (u-dash-076 기존 height/border-radius 유지) */
.u-dash-076 { width: var(--dw, 0%); background: #3B82F6; }
.u-dash-076.is-hi { background: #10B981; }
.u-dash-076.is-mid { background: #F59E0B; }

/* 진행률 라벨 색상 modifier (u-dash-077) */
.u-dash-077.is-hi { color: #10B981; }
.u-dash-077.is-mid { color: #F59E0B; }
.u-dash-077.is-lo { color: #3B82F6; }

/* 게이지 conic은 동적 색 + 동적 pct 모두 필요 → 두 변수 */
.u-dash-085 { background: conic-gradient(var(--dc, #DC2626) 0% var(--dw, 0%), #E9EDF2 var(--dw, 0%) 100%); }