/* 우리 쪽 CSS — 가져온 vc.css 는 고치지 않는다
 * ★색은 여기 :root 한 곳에만★ (UI_기본검증규칙 7 · 화면테마 §2.2). 화면 파일에 hex 를 박지 않는다.
 * 라이트 기본. 다크를 켤 때는 이 토큰만 덮어쓰면 된다. */
:root {
  --lel-warn-bg:   #fff7ed;   /* 확인 대상 행 */
  --lel-warn-bg-h: #ffedd5;
  --lel-err-bg:    #fef2f2;   /* 오류 행(끊긴 연결·한도 초과) */
  --lel-err-bg-h:  #fee2e2;
  --lel-done-tx:   #8a94a3;   /* 끝난 건(시트의 회색 칠과 같은 뜻) */
  --lel-danger:    #dc2626;
  --lel-caution:   #b45309;
}

tbody tr.lel-orphan td, tbody tr.lel-warn td { background: var(--lel-warn-bg); }        /* 확인 대상(단계 누락)·경고 */
tbody tr.lel-orphan:hover td, tbody tr.lel-warn:hover td { background: var(--lel-warn-bg-h); }
tbody tr.lel-err td, tbody tr.lel-over td { background: var(--lel-err-bg); }            /* 오류·컨테이너 한도 초과 */
tbody tr.lel-err:hover td, tbody tr.lel-over:hover td { background: var(--lel-err-bg-h); }
tbody tr.lel-done td { color: var(--lel-done-tx); }                                    /* 수출매출 끝난 오더 */

/* ──────────────────────────────────────────────────────────────────────
 * 조회 버튼을 ★패널 우측 끝★에 고정 (UI_화면표준_규격서 §3 · §1-2 「margin-left:auto 로 항상 우측 고정」)
 *
 *  ★원인(2026-09-12 컴퓨티드 스타일 실측)★
 *   vc.css 는 .vcs-search 를 `minmax(0,1fr) auto` 로 두지만, 공용 vc-screen.js 가 나중에 주입하는
 *   인라인 <style> 이 같은 선택자를 ★`minmax(0,max-content) auto` + justify-content:start★ 로 덮는다.
 *   거기에 엔진(vc-screen.js fitFieldsWidth)이 [data-basic] 의 max-width 를 검색칸 수에 맞춰 줄이므로
 *   (3칸 921px · 4칸 1232px) 1열 트랙이 딱 그만큼만 잡히고, 2열의 .vcs-topact(조회·상세)가 바로 뒤에 붙는다.
 *   그래서 1600px 에서 조회 버튼 x 가 화면마다 937~1541px 로 ★최대 605px★ 흩어졌다(41화면이 우측 끝에서 60px 초과).
 *
 *  ★고치는 법★ 1열을 다시 1fr 로 되돌린다. [data-basic] 의 max-width 는 그대로라 칸 배치는 안 바뀌고,
 *   남는 공간이 1열 트랙에 들어가 2열(조회·상세)이 패널 우측 끝으로 밀린다.
 *   공용 파일(common/*)은 고치지 않는다 — 인라인 <style> 이 나중에 삽입돼 같은 특이성이면 그쪽이 이기므로
 *   `.vcs-search.panel`(0,2,0)로 특이성을 한 단계 올려 덮는다.
 *   ★768px 이하는 건드리지 않는다★ — 그 폭에서는 인라인 <style> 이 1열(세로 쌓기)로 바꾸는데,
 *   특이성이 높은 이 규칙이 그것까지 이기면 좁은 화면에서 가로넘침이 난다. 그래서 769px 이상에만 건다. */
@media (min-width: 769px) {
  .vcs-search.panel { grid-template-columns: minmax(0, 1fr) auto; justify-content: normal; }
}

/* ──────────────────────────────────────────────────────────────────────
 * 조회 그리드 칸 폭 고정 — ★페이지를 넘겨도 칸이 안 움직이게★ (UI_기본검증규칙 4-2)
 *
 *  ★증상(2026-09-13 헤드리스 실측 1600×900)★
 *   같은 조건으로 두 번 조회하면 폭 변동 0px 인데, ★2페이지로 넘기면 칸 폭이 다시 잡혔다★.
 *   수출Order품목조회 45칸 중 4칸이 넓어지고 2칸이 좁아짐(한 칸 최대 67px 축소),
 *   수출Invoice품목조회 47칸 중 6칸 넓어지고 2칸 좁아짐(총 변동 161px).
 *   규칙 4-2 는 「넓히는 쪽으로만」 을 못박는데 ★좁아지는 칸★ 이 생긴다.
 *
 *  ★원인★ 공용 vc-grid.js 의 _lockWidths() 가 첫 줄에서
 *   `if (this.paging && this.paging.mode === 'server') return;` 로 ★서버 페이징 화면을 통째로 건너뛴다★.
 *   이 프로젝트의 새 화면은 lel-screen.js 의 rest 설정이 paging:true(서버 페이징)라 폭 고정이 한 번도 안 걸리고,
 *   표가 `table-layout:auto` 라 페이지마다 ★그 페이지 내용 길이대로★ 칸이 다시 잡힌다.
 *   (th 에는 이미 width/min/max 가 박혀 있지만, auto 레이아웃에서 표 셀의 max-width 는 무시된다.)
 *
 *  ★고치는 법★ 공용 파일은 고치지 않는다. 규칙 4-2 의 처방 그대로 ★table-layout:fixed★ 를 건다.
 *   생성기가 만든 정의는 ★보이는 모든 칸에 width 가 있어★ 첫 줄 선언만으로 폭이 확정된다.
 *   남는 폭은 공용이 이미 가진 「폭을 안 준 빈 칸」(vc-grid.js _needFiller — computed table-layout 이
 *   fixed 일 때만 붙는다)이 흡수하므로 다른 칸은 지정 폭 그대로다.
 *
 *  ★적용 범위★ `.lel-gen`(= lel-screen.js 가 동적 화면 meta.kind 를 보고 붙인다) 안의
 *   ★조회 그리드([data-grid])만★. 기존 화면 11개(views.js 정의 — meta 에 kind 가 없다)와
 *   상세의 줄 그리드([data-detail] · 편집 그리드)는 손대지 않는다(규칙 3). */
.lel-gen [data-grid] table.grid { table-layout: fixed; }

/* 제목 옆 회색 안내 한 줄 — 원천이 0행인 화면(반출 대기) 등.
 *  ★nowrap 금지★ — 390px 에서 안내문 한 줄이 문서 가로 스크롤을 만들었다(2026-09-12 실측, 입력 화면 10개).
 *  lel-form.js 의 .lel-form-note 와 같은 모양이지만, 조회 페이지는 lel-form.js 를 싣지 않으므로 여기에 둔다. */
.lel-note { font-size: 12px; color: var(--txm, #6b7684); font-weight: 400; margin-left: 8px;
  white-space: normal; min-width: 0; flex: 0 1 auto; }
.vcs-head.lel-wrapnote { flex-wrap: wrap; }