/* SR_LEDGER — SR_RPA 컨트롤러와 같은 색 · 글꼴(server/web/templates/base.html, SR_RPA 58a0b7a) */
:root {
  --sr-primary: #1e3a5f;
  --sr-primary-hover: #284a73;
  --sr-dirty: #fff3bf;
  --sr-error: #ffe3e3;
  --sr-auto: #eceff3;
}
body {
  font-family: 'Noto Sans KR', -apple-system, BlinkMacSystemFont, "Segoe UI", "맑은 고딕", sans-serif;
  background: #f5f7fa;
  color: #1a1a2e;
}
.navbar-sr { background: var(--sr-primary); }
.navbar-brand { font-weight: 700; letter-spacing: -0.3px; }
.ci-on-dark { filter: brightness(0) invert(1); opacity: 0.95; }
.btn-primary-sr { background-color: var(--sr-primary); border-color: var(--sr-primary); color: #fff; }
.btn-primary-sr:hover, .btn-primary-sr:focus { background-color: var(--sr-primary-hover); border-color: var(--sr-primary-hover); color: #fff; }
/* 도움말 — 작업 버튼과 다른 색(오른쪽 끝) */
.btn-help { color: #0b7285; border-color: #66d9e8; background: #e3fafc; }
.btn-help:hover, .btn-help:focus { color: #fff; border-color: #0c8599; background: #0c8599; }
.btn-primary-sr:disabled { background-color: #8a9bb0; border-color: #8a9bb0; color: #fff; }

/* ── 로그인 · 비밀번호 설정 (SR_RPA login.html과 같은 모양) */
body.page-login { background: linear-gradient(135deg, #f5f7fa 0%, #e8eef5 100%); }
.login-wrapper { min-height: 100vh; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 24px 16px; }
.login-brand { text-align: center; margin-bottom: 28px; }
.login-brand img { height: 56px; margin-bottom: 12px; }
.login-brand h1 { font-size: 24px; color: var(--sr-primary); font-weight: 700; margin: 0; }
.login-brand .tagline { color: #666; font-size: 13px; margin-top: 4px; }
.login-card {
  width: 100%; max-width: 380px; background: rgba(255, 255, 255, 0.95); backdrop-filter: blur(8px);
  padding: 28px 24px; border-radius: 12px; box-shadow: 0 8px 24px rgba(30, 58, 95, 0.12);
  border: 1px solid rgba(30, 58, 95, 0.08);
}

/* ── 화면 전체를 쓰는 표 화면: 스크롤은 표 안에서만(세로 · 가로 모두 화면 안에 보인다) */
body.page-fill { height: 100vh; display: flex; flex-direction: column; overflow: hidden; }
.page-fill > nav, .page-fill .grid-toolbar { flex: 0 0 auto; }
.page-fill .grid-wrap { flex: 1 1 auto; min-height: 0; position: relative; margin: 0 12px; }
.page-fill .grid-wrap > .grid { position: absolute; inset: 0; }
.grid-toolbar { padding: 10px 12px; display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.grid-toolbar h1 { font-size: 1.05rem; margin: 0 8px 0 0; font-weight: 700; color: var(--sr-primary); }
.grid-toolbar h2 { font-size: .95rem; margin: 0 6px 0 0; font-weight: 700; color: var(--sr-primary); }
/* 나란히 두 표(왼쪽 목록 · 오른쪽 그 행의 하위 목록) — 각 표가 자기 도구줄을 갖는다 */
.page-fill .grid-split { flex: 1 1 auto; min-height: 0; display: flex; margin: 0 12px 8px; }
.grid-split .grid-pane { display: flex; flex-direction: column; min-width: 0; min-height: 0; }
.grid-split .grid-pane > .grid-toolbar { padding: 2px 0 6px; }
.page-fill .grid-split .grid-wrap { margin: 0; }
/* 두 표 사이 끄는 막대(SRLGrid.split) */
.grid-gutter { flex: 0 0 12px; cursor: col-resize; position: relative; touch-action: none; outline: none; }
.grid-gutter::after { content: ""; position: absolute; top: 45%; bottom: 45%; left: 5px; width: 2px; border-radius: 1px; background: #adb5bd; }
.grid-gutter:hover::after, .grid-gutter:focus-visible::after, .grid-split.splitting .grid-gutter::after { top: 0; bottom: 0; background: var(--sr-primary); }
.grid-split.splitting { cursor: col-resize; user-select: none; }
@media (max-width: 991.98px) {
  .page-fill .grid-split { flex-direction: column; gap: 12px; }
  .grid-split .grid-pane { flex: 1 1 0 !important; }
  .grid-gutter { display: none; }
}
/* 비밀번호 자리수 — 표에서는 ● 작게(칸이 넘치지 않게) */
.secret-dots { font-size: 9px; letter-spacing: 1px; color: #495057; }
/* 팝업 안의 표(고객 일괄 추가 등) — 높이를 정해 둔다 */
.grid-box { height: 55vh; min-height: 280px; position: relative; }
.grid-box > .grid { position: absolute; inset: 0; }
.btn-audit.active { background: #e7f1ff; border-color: var(--sr-primary); color: var(--sr-primary); }
.legend { display: inline-block; width: 12px; height: 12px; border: 1px solid #ced4da; vertical-align: -2px; margin: 0 3px 0 10px; }

/* 표 — 엑셀처럼 촘촘하게(Tabulator 기본 테마 위에) */
.tabulator { font-size: 12.5px; border: 1px solid #ced4da; background: #fff; }
/* 표를 불러오는 동안 — 표 위 원형 회전(운영자 261110). 빈 표 문구는 다 불러온 뒤에만 */
.srl-loading { position: absolute; inset: 0; z-index: 30; display: flex; align-items: center; justify-content: center; background: rgba(255, 255, 255, .55); }
.srl-loading[hidden] { display: none; }
.srl-loading .spinner-border { width: 2.5rem; height: 2.5rem; }
/* 환경설정 — 위 두 표 좌우(줄 수만큼 높이) · 아래 한 칸 폼(운영자 261111) */
.settings-body { margin: 0 12px 16px; }
.settings-row { display: flex; flex-wrap: wrap; gap: 16px; align-items: flex-start; }
.settings-row > section { min-width: 0; }
.settings-body .grid-toolbar { padding: 2px 0 6px; }
/* 이동 칸 — 다른 화면에서 이 고객(운영자 261110) */
.col-jump { cursor: pointer; }
.col-jump .jump { color: var(--sr-primary); font-size: 14px; }
.col-jump:hover .jump { color: #0d6efd; }
/* 가로 스크롤 막대는 틀고정 칸 오른쪽에서부터 — --srl-frozen은 srl_grid.js가 잰다(운영자 261109). Chrome · Edge의 막대 규칙 */
.tabulator .tabulator-tableholder::-webkit-scrollbar { width: 12px; height: 12px; }
.tabulator .tabulator-tableholder::-webkit-scrollbar-track { background: #f1f3f5; }
.tabulator .tabulator-tableholder::-webkit-scrollbar-track:horizontal { margin-left: var(--srl-frozen, 0px); }
.tabulator .tabulator-tableholder::-webkit-scrollbar-thumb { background: #adb5bd; border-radius: 6px; border: 2px solid #f1f3f5; }
.tabulator .tabulator-tableholder::-webkit-scrollbar-thumb:hover { background: #868e96; }
.tabulator .tabulator-tableholder::-webkit-scrollbar-corner { background: #f1f3f5; }
.tabulator .tabulator-header { border-bottom: 1px solid #adb5bd; background: #f1f3f5; }
.tabulator .tabulator-header .tabulator-col { background: #f1f3f5; }
.tabulator .tabulator-header .tabulator-col .tabulator-col-content { padding: 4px 6px; }
.tabulator .tabulator-header .tabulator-col .tabulator-col-title { font-weight: 600; color: #343a40; }
.tabulator .tabulator-header .tabulator-col .tabulator-header-filter input,
.tabulator .tabulator-header .tabulator-col .tabulator-header-filter select { height: 22px; padding: 1px 4px; font-size: 12px; border: 1px solid #ced4da; border-radius: 2px; }
.tabulator .tabulator-row { min-height: 24px; }
.tabulator .tabulator-row .tabulator-cell { padding: 3px 6px; border-right: 1px solid #e9ecef; }
.tabulator .tabulator-row.tabulator-row-even { background: #fbfcfd; }
.tabulator .tabulator-row.tabulator-selectable:hover { background: #eef3fa; }
.tabulator .tabulator-row .tabulator-frozen.tabulator-frozen-left { border-right: 2px solid #adb5bd; }
.tabulator .tabulator-cell.col-auto, .tabulator .tabulator-col.col-auto { background: var(--sr-auto); color: #6c757d; }
.tabulator .tabulator-cell.col-readonly { color: #495057; }
/* 고칠 칸이 있는 표 — 고칠 수 없는 칸은 옅은 회색(srl_grid.js가 저절로 — 운영자 261109) */
.tabulator .tabulator-cell.col-locked { background: var(--sr-auto); }
.tabulator .tabulator-cell.cell-dirty { background: var(--sr-dirty) !important; }
.tabulator .tabulator-row.row-error .tabulator-cell { background: var(--sr-error); }
.tabulator .tabulator-row.row-new .tabulator-cell:first-child { box-shadow: inset 3px 0 0 #2f9e44; }
.tabulator .tabulator-cell.tabulator-validation-fail { border: 1px solid #e03131; }
.tabulator .tabulator-row.row-excluded .tabulator-cell { color: #adb5bd; font-style: italic; }
.tabulator .tabulator-row.row-current .tabulator-cell { background: #e7f1ff; }   /* 오른쪽 표의 주인 행 */
.tabulator .tabulator-row.row-current .tabulator-cell.cell-dirty { background: var(--sr-dirty) !important; }
.tabulator .open-detail { line-height: 1; font-size: 14px; }
/* 같은 묶음(전표 등)의 행을 번갈아 칠한다 — 하늘색 · 흰색(자동장부 분개 — 운영자 261106). 짝수 줄 바탕보다 앞선다 */
.tabulator .tabulator-row.row-band { background: #e7f5ff; }
.tabulator .tabulator-row.row-plain { background: #fff; }
/* 묶음 칸(셀 병합처럼) — 첫 줄에만 글자, 칸 바탕은 한 가지(자동장부 유형별 합계의 전표구분 · 구분 — 운영자 261106) */
.tabulator .tabulator-cell.col-merge { background: #fff; font-weight: 600; }
/* 묶음 경계 — 묶음이 바뀌는 줄의 모든 칸 위에 선, 큰 묶음이 바뀌면 굵게. 이어지는 큰 묶음 칸(merge-outer)에는 긋지 않는다 */
.tabulator .tabulator-row.grp-top .tabulator-cell { box-shadow: inset 0 1px 0 #adb5bd; }
.tabulator .tabulator-row.grp-top2 .tabulator-cell { box-shadow: inset 0 2px 0 #868e96; }
.tabulator .tabulator-row.grp-top:not(.grp-top2) .tabulator-cell.merge-outer { box-shadow: none; }
/* 소계 줄 — 연한 노랑 · 굵게(묶음 칸은 흰 바탕 그대로 — 합친 칸이 이어져 보이게. 운영자 261106) */
.tabulator .tabulator-row.row-subtotal { background: #fff9db; font-weight: 600; }
/* 팝업 위에 겹쳐 뜨는 팝업(도움말 창과 같은 층) */
.modal.srl-stack { z-index: 1065; }
.modal-backdrop.srl-stack-backdrop { z-index: 1060; }
.chk { display: inline-flex; align-items: center; gap: 3px; font-size: 12px; white-space: nowrap; cursor: pointer; }
.chk-ok { color: #2b8a3e; } .chk-warn { color: #e8590c; } .chk-err { color: #e03131; }
.chk-wait { color: #1971c2; } .chk-missing { color: #868e96; } .chk-off { color: #ced4da; }
.chk-prov { color: #5c940d; } .chk-some { color: #1971c2; }   /* 잠정(확정일 전에 받음) · 일부(n/3) — 자동기장 */
.chk .spin { display: inline-block; animation: srl-spin 1s linear infinite; }
@keyframes srl-spin { to { transform: rotate(360deg); } }
.check-line { display: flex; align-items: center; gap: 8px; padding: 4px 0; border-bottom: 1px solid #f1f3f5; font-size: 13px; }

/* 고객 상세 팝업 — 탭 3개(기본정보 · 점검 · 기타정보) */
.detail-tabs .nav-link { font-size: .9rem; color: #495057; }
.detail-tabs .nav-link.active { font-weight: 600; color: var(--sr-primary); }
.detail-sec { border: 1px solid #e9ecef; border-radius: .5rem; padding: .85rem 1rem; margin-bottom: .85rem; }
.detail-sec-title { font-weight: 700; font-size: .95rem; color: var(--sr-primary); margin-bottom: .6rem; }
.detail-help { background: #e3fafc; border: 1px solid #99e9f2; border-radius: .5rem; padding: .6rem .9rem; margin-bottom: .8rem; }
.detail-help li { margin: .15rem 0; }
.detail-auto { display: grid; grid-template-columns: max-content 1fr; gap: 3px 16px; font-size: 13px; margin: .7rem 0 0; }
.detail-auto:empty { display: none; }
.detail-auto dt { font-weight: normal; color: #6c757d; }
.detail-auto dd { margin: 0; }
.secret::placeholder { color: #212529; opacity: 1; letter-spacing: .1em; }   /* 가린 값 — 자리수만큼 검은 ● */
.check-line .msg { color: #6c757d; font-size: 12px; flex: 1; }
.cred-badge { display: inline-block; min-width: 26px; padding: 0 4px; margin-right: 2px; border-radius: 3px; font-size: 11px; text-align: center; }
.cred-on { background: #d3f9d8; color: #2b8a3e; }
.cred-off { background: #f1f3f5; color: #adb5bd; }

/* 도움말 창 — 팝업 위에 겹쳐 뜬다(srl_grid.js — 운영자 261105 도움말 표준화) */
.modal.srl-help { z-index: 1065; }
.modal-backdrop.srl-help-backdrop { z-index: 1060; }
.modal.srl-help .detail-help { border: 0; padding: 0; background: transparent; }
.tabulator-row.row-muted .tabulator-cell { color: #adb5bd; }   /* 고를 수 없는 행(일괄 추가 — 사업자번호 없음) */
.tabulator .col-check .form-check-input { margin: 0; cursor: pointer; }   /* 표준 체크 열 */
