/* ===== erp_visual.css — «보기 편하게» 공용 시각 규칙 (R-1~R-11) · 2026-10-20 · ㉰ 화면 틀 방 =====
   원칙: 배치·기능·문구·숫자는 1원도 안 바꾼다. 글자 크기·색 역할·간격·단추 크기·표 머리줄·확인창 모양만.
   싣는 곳: 타이어ERP_*.html 36개(erp_theme.css 다음 줄). ⛔ 종합분석·견적기(얼마고_견적기.html)·셸에는 싣지 않는다(사장님 10-20 05:51 · 2순위 · v350 구역).
   ⛔ 인라인 색 사냥 선택자([style*=…])는 더하지 않는다(고정3 5권) — 규칙은 변수·이름표(클래스)로만.
   ⛔ html,body 글자 크기를 두지 않는다(본문 15px 화면이 줄어든다 · 검사원 🟨-1). 규칙은 «바닥(최소)»만 정한다.
   사장님 확정(10-20 09:05): 표 본문 14px · 돈 색 역할 4개+음수 빨강 · 폰 고정 단추줄 한 줄(저장 계열 앞·크게). */

/* ── 0. 규칙 변수(한 곳) ── */
:root{
  --fs-aux:12.5px;   /* 보조 글(라벨·안내·출처·딱지) — 이보다 작은 글자는 없다 */
  --fs-body:14px;    /* 본문·표 본문·입력칸 */
  --fs-em:16px;      /* 강조(제목·선택된 탭·상태 딱지) */
  --fs-big:22px;     /* 큰 숫자(합계·카드 값) */
  --txt-aux:#B8C2DC; /* 보조 글 색 — 어두운 카드·선택 줄(54,75,84) 위에서도 5.1:1 */
  --money-in:#33E0B0;    /* 들어온 돈·이익 */
  --money-out:#FF8FA3;   /* 나간 돈·지출·미지급 */
  --money-due:#FFB648;   /* 받을 돈·잔액 남음 */
  --money-total:#FFFFFF; /* 합계(가장 중요한 숫자) */
  --neg:#FF9AA6;         /* 마이너스(반품·차액) — 어두운 입력칸(40,66,85) 위 5.2:1 */
  --neg-light:#B3261E;   /* 밝은 상자(흰 창·안내 상자) 위 마이너스 6.5:1 */
  --btn-h:36px; --btn-h-m:44px;
}

/* ── 1. 글자 단계 — 보조 글 바닥 12.5px (R-1) ── */
.sub,.note,.hint,.dl,.kpi .l,.chip .l,.lbl,.ex,.bnote,.locktx,.chelp-sub,.pi,.cnt,.gsub,.morebar,.tag,.pill,.code,.mono,
#lines td .sub,.ritem .code,.r .sub,.erp-aux{font-size:var(--fs-aux)!important}
.lineinp{font-size:var(--fs-body)!important}               /* 전표 줄 입력칸 = 돈 숫자 = 본문 크기 */
.kpi .l,.chip .l,.dl{font-size:var(--fs-aux)!important;color:var(--txt-aux)!important}
.sub,.note,.hint,.ex,.bnote,.locktx,.chelp-sub,.pi,.gsub,.empty,.ritem .code,.erp-aux{color:var(--txt-aux)!important}
table td,table th,.tscroll td,.tscroll th{font-size:var(--fs-body)!important}   /* 사장님 확정 ① 표 본문 14px (R-10 열 폭과 한 배포) */
table th{font-size:var(--fs-aux)!important}
.ritem .nm{font-size:var(--fs-body)!important}
.ritem .spec,.ritem .pr{color:var(--ink,#eaf0ff)!important;font-size:var(--fs-body)!important}   /* 품목 찾기: 규격은 품명과 같은 밝기(M-012) */
.ritem .spec{font-weight:700}
#lines .sub{font-size:var(--fs-aux)!important;color:var(--txt-aux)!important}
#pbbar button{font-size:var(--fs-body)!important;min-height:var(--btn-h)!important;height:auto!important;padding:6px 14px!important}  /* 공장도가표 구/신 스위치: 단추는 보통 크기(C-005) */
.pb-tag{font-size:var(--fs-em)!important}                   /* 상태 딱지는 강조 크기(검사원 🟨-5) */

/* ── 2. 돈 숫자 (R-2 · R-9) ── */
td.r,td.num,th.r,td.erp-num{text-align:right!important;font-variant-numeric:tabular-nums}
.erp-neg,td.erp-neg,.lineinp.erp-neg,input.erp-neg{color:var(--neg)!important;font-weight:800}   /* 이름표는 erp_common.js ⑮ 창구 하나가 붙인다 · 화면이 뜻을 준 칸(.neg/.pos/.in/.out…)은 그 색 그대로 */
tbody tr:hover>td.erp-neg:not(#erp-noid){color:var(--neg)!important}   /* 테마의 «마우스 올린 줄 글자 = 흰색» 규칙(특이도 큼)보다 위 — 음수는 올려도 빨강 */
/* 밝은 상자(흰 창·연하늘 안내 상자) 안의 음수는 진한 빨강(재검원 🟥-N1) */
.erp-card-solid .erp-neg,#apInfo .erp-neg,#bizArBadge .erp-neg,.erp-light .erp-neg{color:var(--neg-light)!important}
.kpi.g .v,.chip.g .v,.in,.io-in,.erp-money-in{color:var(--money-in)!important}
.kpi.r .v,.chip.r .v,.out,.io-out,.erp-money-out{color:var(--money-out)!important}
.kpi.a .v,.chip.a .v,.due,.erp-money-due{color:var(--money-due)!important}
.erp-money-total{color:var(--money-total)!important;font-size:var(--fs-big)!important;font-weight:900!important}
#vTotal{color:var(--money-total)!important;font-size:var(--fs-big)!important;font-weight:900!important;letter-spacing:-.01em}   /* 전표 합계 = 흰 큰 글씨 하나 */
#vTotal.erp-neg,.erp-money-total.erp-neg{color:var(--neg)!important}   /* 합계가 마이너스(반품 전표)면 «음수 빨강»이 «합계 흰»보다 위(사장님 확정 ② · 검사원 B 🟨-2 선조치) */
#vMargin{font-size:var(--fs-body)!important;color:var(--txt-aux)!important}

/* ── 3. 단추 3종 + 최소 높이 (R-4) ── */
button:not(.tbtn):not(.__colrHandle),.btn,.pq,.pmc,.pnav,.qchip,.seg button,.tabs button{min-height:var(--btn-h);font-size:var(--fs-body)}
.btn.ghost,.btn.line{font-weight:600}
.btn.blue,.btn.green{font-weight:900}
.btn.orange,button.org,.on.org{color:#1A1200!important}   /* 주황 채움 위 글자는 어둡게(M-016) */

/* ── 4. 표 머리줄 손잡이: 평소엔 흐리게 (R-6) ── */
.__colrHandle::after{background:rgba(139,156,255,.22)!important;width:2px!important}
.__colrHandle:hover::after{background:#aebaff!important;width:4px!important}
table th{border-left:1px solid rgba(255,255,255,.08)!important}

/* ── 4-b. PC 표 상자(U-V10): 표가 상자 폭 안에 다 들어오면(erp_colresize.js fitCheck 가 .erp-fit 을 붙임) 안쪽 2겹 스크롤을 풀어 페이지 스크롤 하나로 ── */
@media(min-width:761px){ .tscroll.erp-fit{max-height:none!important;overflow:visible!important} }   /* .erp-fit/.erp-over 판정 = erp_common.js ⑮ 한 곳 */

/* ── 5. 기간 고르기 창(공용 pselInit 6화면): 이름표 작게·두 칸 한 줄·칩 크게 (R-5) ── */
.drbar{display:flex;flex-wrap:wrap;align-items:flex-end;gap:6px 12px}
.drbar>div{display:flex;flex-direction:column;gap:2px}
.drbar .pselwrap{flex:1 1 100%;margin-top:4px}
.dl{font-size:var(--fs-aux)!important;margin-bottom:2px}
.pselwrap .pq,.pselwrap .pmc,.pselwrap .pnav{min-height:var(--btn-h);padding:0 12px;font-size:var(--fs-body)}

/* ── 6. 고정 하단 단추줄: 본문이 안 가리게 여백 (A-030 · 09-03 🟩-8) ── */
body:has(.bar.erp-fixbar){padding-bottom:84px}   /* .bar 는 내역 화면에선 «찾기 줄»이기도 하다 → 고정 단추줄(.erp-fixbar · 매출/매입등록)에만 */

/* ── 7. 오류 칸 테두리 (B-017) — 저장 길이 막혔을 때 문제 칸을 빨갛게. 이름표 .erp-err 를 화면 JS 가 붙였다 뗀다 ── */
.erp-err,input.erp-err,select.erp-err,textarea.erp-err{border-color:#FF5C6C!important;box-shadow:0 0 0 3px rgba(255,92,108,.28)!important}

/* ── 8. 확인창 한 모양 (R-8 · ERPGuard.ask 틀 = 어두운 불투명 · 가운데) ── */
.ov>div:not(.erp-card-solid),.posmodal,.modal:not(.erp-card-solid){background:#121A33!important;color:#EAF0FF!important;border:1px solid rgba(255,255,255,.14)!important;border-radius:16px}
.ov .btn,.modal .btn{min-height:40px}

/* ── 9. 폰 (R-7) ── */
@media(max-width:760px){
  button:not(.tbtn):not(.__colrHandle),.btn,.pq,.pmc,.pnav,.qchip,.seg button,.tabs button,#pbbar button{min-height:var(--btn-h-m)!important}
  input[type=checkbox],input[type=radio]{width:20px!important;height:20px!important}
  #erpZeroOv.ov{align-items:safe center!important}   /* 0원 사유창은 짧은 창 — 폰에서도 가운데(길면 위부터 · A-019) */
  .tscroll{position:relative}
  .tscroll.erp-over{background-image:linear-gradient(90deg,transparent,rgba(139,123,255,.45));background-size:18px 100%;background-position:right top;background-repeat:no-repeat;background-attachment:scroll}  /* 표 오른쪽 «더 있음» 그림자 힌트 — 표가 상자보다 넓을 때만(.erp-over 는 erp_common.js ⑮). ⛔ ::after{margin-top:-100%} 는 폭 기준이라 상자를 368px 로 잘랐다(검사원 B 🟥) → 상자 배경으로 */
  body{word-break:keep-all;overflow-wrap:anywhere}   /* 단어 중간 꺾임 금지(M-019) */
  /* 사장님 확정 ③ 고정 단추줄 한 줄: 저장 계열이 먼저·크게, 인쇄류는 뒤로 밀려 옆으로 보기(검사원 🟥-1 → order) */
  .bar.erp-fixbar{flex-wrap:nowrap;overflow-x:auto;gap:6px}
  .bar.erp-fixbar .btn{flex:0 0 auto;min-width:88px}
  .bar.erp-fixbar .btn.blue{order:-2;min-width:110px}
  .bar.erp-fixbar .btn.green{order:-1;min-width:140px}
  body:has(.bar.erp-fixbar){padding-bottom:72px}
}