/* 2026-10-22 토스트 누름 통과(.toast-item pointer-events:none) — 토스트가 떠 있어도 그 밑 버튼이 눌림. 버튼 줄 위로 띄우는 것은 config.js _toastLift */
/* 2026-10-21 머리 메뉴 버튼(.h-nav-tab) 키보드 선택 테두리 숨김 — 옛 이름 .top-tab 규칙에 이름만 더함 */
/* 2026-10-15 모바일 목록 툴바: 견적 이력 범위 버튼 칸 여백 8px · 제목·건수 줄바꿈 안 함, 좁으면 버튼이 다음 줄 오른쪽으로 */
/* ===== core-ui.css — 2026-10-15 core.css 2500~3129줄을 그대로 옮김 (모바일 최적화 묶음: 고객사 목록 모바일·고객사 창 .cd-*·입력 중 목록 .ccs-*·직접 입력·페이지·토스트 모바일 / 옛 툴바·목록 툴바 .list-toolbar·history-wrap·고객사 목록 PC·유틸리티·AQ). 불러오는 순서 core-legacy.css 바로 뒤, qm-modal.css 앞 — 바꾸지 말 것 ===== */
/* ══════════════════════════════════════════════════════════
   ■ 모바일 최적화 — 헤더 / 고객사 관리 / 모달
   (오늘 작업분 통합)
   ══════════════════════════════════════════════════════════ */

/* ── 헤더: 480px 이하 로고 텍스트 숨기고 탭 균등 분배 ── */
@media screen and (max-width: 480px) {
  /* 2026-10-09 머리 규칙 제거 (core.css 위쪽 '머리 영역'으로 통합) */
  .btn-logout { display: none; }
}

/* ── 고객사 목록: 모바일 — 2026-10-09 ⑤ 옛 툴바·표 규칙을 고침. 표 HTML 그대로 두고 줄마다 3줄 카드 (grid)
   1줄 회사명 · 오른쪽 '견적 N' / 2줄 고객 담당자 / 3줄 구분선 + [구매·렌탈] 번호 · 날짜 · 오른쪽 영업 담당
   renderClientList 칸 순서(회사명·담당자·마지막 견적·견적일·견적 수·영업 담당)를 바꾸면 여기도 같이 ── */
@media screen and (max-width: 600px) {
  .cl-list { padding: var(--ds-sp-3); }
  .cl-table, .cl-table tbody { display: block; }
  .cl-table thead { display: none; }
  .cl-table tr {
    display: grid; grid-template-columns: auto auto 1fr;
    grid-template-areas: "co co cnt" "ct ct ct" "lq dt own";
    margin-bottom: 10px; padding: 14px 16px; background: #fff;
    border: var(--ds-line) solid var(--ds-gray-200); border-radius: var(--ds-radius-lg);
  }
  .cl-table td { display: block; padding: 0; border: none; font-size: var(--ds-fs-md); background: none; }
  .cl-table td[colspan] { grid-column: 1 / -1; text-align: center; }
  .cl-table td.cl-co { grid-area: co; font-size: var(--ds-fs-lg); font-weight: 700; }
  .cl-table td.cl-cnt { grid-area: cnt; align-self: center; padding-left: var(--ds-sp-2); color: var(--ds-gray-600); }
  .cl-table td.cl-ct { grid-area: ct; margin-top: var(--ds-sp-1); color: var(--ds-gray-600); }
  .cl-table td.cl-lq, .cl-table td.cl-dt, .cl-table td.cl-own { margin-top: 10px; padding-top: 10px; border-top: var(--ds-line) solid #f1f5f9; }
  .cl-table td.cl-lq { grid-area: lq; }
  .cl-table td.cl-dt { grid-area: dt; padding-left: var(--ds-sp-1); }
  .cl-table td.cl-dt:not(:empty)::before { content: '· '; }
  .cl-table td.cl-own { grid-area: own; text-align: right; padding-left: var(--ds-sp-2); }
  .cl-table .cl-m { display: inline; } /* PC 숨김 규칙(아래쪽)보다 한 단계 높여 */
}
/* ── 고객사 창 (.cd-modal) — 2026-10-10 ⑤ 시안 확정본. 기준표(--ds-*)만 사용. 옛 #modal-client 규칙(.cm-delete-mobile·.client-modal-body) 자리
   모바일 아래에서 올라오는 창은 768px 블록의 .modal-overlay.open{align-items:flex-start !important} 를 이겨야 해서 !important */
.cd-modal{width:640px;max-width:96vw;max-height:90vh;}
.cd-modal .modal-header{align-items:flex-start;padding:var(--ds-sp-4) var(--ds-sp-4) var(--ds-sp-3);}
.cd-head{flex:1;min-width:0;}
.cd-title{display:flex;align-items:center;gap:var(--ds-sp-2);font-size:var(--ds-fs-lg);font-weight:700;color:var(--ds-brand);}
.cd-sum{margin-top:var(--ds-sp-1);font-size:var(--ds-fs-sm);color:var(--ds-gray-600);}
.cd-body{display:flex;flex-direction:column;gap:var(--ds-sp-6);padding:var(--ds-sp-4);}
.cd-sec-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:var(--ds-sp-2);}
.cd-sec-title{font-size:var(--ds-fs-base);font-weight:700;color:var(--ds-brand);}
.cd-sec-title .cd-n{font-weight:400;color:var(--ds-gray-600);margin-left:var(--ds-sp-1);}
.cd-link{background:none;border:none;padding:4px 0;font-size:var(--ds-fs-md);color:var(--ds-primary);cursor:pointer;}
.cd-pen{background:none;border:none;width:28px;height:28px;border-radius:var(--ds-radius-md);font-size:var(--ds-fs-base);color:var(--ds-gray-400);cursor:pointer;flex-shrink:0;}
.cd-list{border-top:var(--ds-line) solid var(--ds-gray-200);}
/* 담당자 줄 */
.cd-ct{display:grid;grid-template-columns:120px 120px minmax(0,1fr) 76px 28px;gap:var(--ds-sp-3);align-items:center;padding:var(--ds-sp-2) 0;border-bottom:var(--ds-line) solid var(--ds-gray-200);font-size:var(--ds-fs-base);color:var(--ds-gray-900);}
.cd-ct-name{font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.cd-ct-mail{font-size:var(--ds-fs-md);color:var(--ds-gray-600);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.cd-ct-dt{font-size:var(--ds-fs-sm);color:var(--ds-gray-400);text-align:right;}
.cd-nil{color:var(--ds-gray-400);}
.cd-ct:has(.cd-ct-sub){row-gap:var(--ds-sp-1);}
.cd-ct-sub{grid-column:1 / 5;display:flex;gap:var(--ds-sp-2);font-size:var(--ds-fs-sm);color:var(--ds-gray-600);line-height:1.5;}
.cd-ct-k{flex:0 0 40px;color:var(--ds-gray-400);}
.cd-ct-v{white-space:pre-line;min-width:0;word-break:break-all;}
.cd-row-full{margin-top:var(--ds-sp-2);}
.cd-ct > .cd-nil:only-child, .cd-q > .cd-nil:only-child{grid-column:1 / -1;} /* 안내 한 줄(불러오는 중·없음·오류)은 줄 전체 폭 */
/* 담당자 고치는 줄 */
.cd-ct-edit{padding:var(--ds-sp-3);margin:var(--ds-sp-2) 0;background:var(--ds-gray-50);border:var(--ds-line) solid var(--ds-primary);border-radius:var(--ds-radius-md);}
.cd-ct-edit .cd-row3{display:grid;grid-template-columns:1fr 1fr 1.4fr;gap:var(--ds-sp-2);}
.cd-ct-edit .cd-row-act{display:flex;justify-content:space-between;margin-top:var(--ds-sp-2);}
.cd-in{width:100%;height:36px;padding:0 10px;border:var(--ds-line) solid #cbd5e1;border-radius:var(--ds-radius-md);font-size:var(--ds-fs-base);color:var(--ds-gray-900);background:#fff;box-sizing:border-box;font-family:inherit;}
textarea.cd-in{height:auto;min-height:64px;padding:8px 10px;resize:vertical;}
.cd-lbl{font-size:var(--ds-fs-sm);color:var(--ds-gray-600);margin-bottom:var(--ds-sp-1);}
.cd-txt-btn{background:none;border:none;padding:4px 0;font-size:var(--ds-fs-md);color:var(--ds-gray-600);cursor:pointer;}
.cd-title .cd-txt-btn{white-space:nowrap;flex-shrink:0;font-weight:400;}
.cd-txt-btn--del{color:var(--ds-danger);}
/* 견적 줄 */
.cd-q{display:grid;grid-template-columns:auto minmax(0,1fr) 76px 112px 56px;gap:var(--ds-sp-3);align-items:center;padding:var(--ds-sp-2) 0;border-bottom:var(--ds-line) solid var(--ds-gray-200);font-size:var(--ds-fs-base);}
.cd-qtag{display:inline-block;padding:1px 6px;border-radius:var(--ds-radius-sm);background:#f1f5f9;color:var(--ds-gray-600);font-size:var(--ds-fs-xs);}
.cd-qnum{background:none;border:none;padding:0;font-size:var(--ds-fs-base);color:var(--ds-primary);text-decoration:underline;text-underline-offset:3px;cursor:pointer;text-align:left;font-family:inherit;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.cd-qdt{font-size:var(--ds-fs-sm);color:var(--ds-gray-400);}
.cd-qamt{text-align:right;font-weight:600;color:var(--ds-gray-900);}
.cd-q .sp-status-badge{justify-self:end;}
.cd-more{display:block;width:100%;padding:var(--ds-sp-2) 0;background:none;border:none;font-size:var(--ds-fs-md);color:var(--ds-primary);cursor:pointer;}
/* 기본 정보 */
.cd-info{display:grid;grid-template-columns:72px minmax(0,1fr) 28px;gap:var(--ds-sp-3);align-items:start;padding:var(--ds-sp-2) 0;border-bottom:var(--ds-line) solid var(--ds-gray-200);font-size:var(--ds-fs-base);color:var(--ds-gray-900);}
.cd-info-k{font-size:var(--ds-fs-sm);color:var(--ds-gray-600);padding-top:3px;word-break:keep-all;}
.cd-info-v{white-space:pre-line;line-height:1.5;padding-top:1px;word-break:keep-all;overflow-wrap:anywhere;}
/* 아래 버튼 — 영업 패널 버튼 3종과 같은 모양 */
.cd-foot{display:flex;align-items:center;gap:var(--ds-sp-2);padding:var(--ds-sp-3) var(--ds-sp-4);border-top:var(--ds-line) solid var(--ds-gray-200);background:#fff;flex-shrink:0;}
.cd-btn{height:36px;padding:0 var(--ds-sp-4);border-radius:var(--ds-radius-md);font-size:var(--ds-fs-base);font-family:inherit;cursor:pointer;border:var(--ds-line) solid var(--ds-gray-200);background:#fff;color:var(--ds-gray-900);}
.cd-btn--main{background:var(--ds-primary);border-color:var(--ds-primary);color:#fff;font-weight:600;}
.cd-btn--main:disabled{opacity:.45;cursor:not-allowed;}
.cd-btn--del{color:var(--ds-danger);margin-right:auto;}
.cd-spacer{margin-right:auto;}
/* 확인 창 */
.cd-confirm{width:440px;max-width:94vw;}
.cd-confirm .modal-header h2{font-size:var(--ds-fs-lg);font-weight:700;color:var(--ds-gray-900);}
.cd-move{display:flex;flex-direction:column;gap:var(--ds-sp-2);}
.cd-move-box{padding:var(--ds-sp-3);border:var(--ds-line) solid var(--ds-gray-200);border-radius:var(--ds-radius-md);}
.cd-move-box--keep{border-color:var(--ds-primary);background:var(--ds-primary-soft);}
.cd-move-k{font-size:var(--ds-fs-sm);color:var(--ds-gray-600);}
.cd-move-name{font-size:var(--ds-fs-base);font-weight:700;color:var(--ds-gray-900);margin-top:2px;}
.cd-move-name s{color:var(--ds-gray-400);font-weight:400;}
.cd-move-meta{font-size:var(--ds-fs-sm);color:var(--ds-gray-600);margin-top:2px;}
.cd-arrow{text-align:center;color:var(--ds-gray-400);font-size:var(--ds-fs-base);line-height:1;}
.cd-effects{word-break:keep-all;margin:var(--ds-sp-4) 0 0;padding:0;list-style:none;display:flex;flex-direction:column;gap:6px;font-size:var(--ds-fs-base);color:var(--ds-gray-900);line-height:1.5;}
.cd-effects li{padding-left:14px;position:relative;}
.cd-effects li::before{content:'';position:absolute;left:2px;top:9px;width:4px;height:4px;border-radius:50%;background:var(--ds-gray-400);}
.cd-lead{word-break:keep-all;margin:0 0 var(--ds-sp-3);font-size:var(--ds-fs-base);color:var(--ds-gray-900);line-height:1.5;}
.cd-warn{word-break:keep-all;margin-top:var(--ds-sp-3);font-size:var(--ds-fs-md);color:var(--ds-danger);}
.cd-confirm .cd-foot{justify-content:flex-end;}
/* 모바일 — 아래에서 올라오는 창 */
@media screen and (max-width:600px){
  .modal-overlay.open:has(> .cd-modal){align-items:flex-end !important;padding:0 !important;}
  .cd-modal{width:100vw;max-width:100vw;max-height:92dvh;border-radius:16px 16px 0 0;}
  .cd-body{padding:var(--ds-sp-3) var(--ds-sp-4);}
  .cd-ct{grid-template-columns:minmax(0,1fr) auto 28px;grid-template-areas:"n d p" "t t p" "m m p";row-gap:2px;column-gap:var(--ds-sp-2);}
  .cd-ct-name{grid-area:n;} .cd-ct-dt{grid-area:d;} .cd-ct .cd-pen{grid-area:p;align-self:center;}
  .cd-ct-tel{grid-area:t;font-size:var(--ds-fs-md);} .cd-ct-mail{grid-area:m;} .cd-ct-mail--nil{display:none;}
  .cd-ct-sub{grid-column:1 / 3;margin-top:2px;}
  .cd-ct-edit .cd-row3{grid-template-columns:1fr;}
  .cd-q{grid-template-columns:auto minmax(0,1fr) auto;grid-template-areas:"g n b" "d d a";row-gap:2px;column-gap:var(--ds-sp-2);}
  .cd-q .cd-qtag{grid-area:g;} .cd-q .cd-qnum{grid-area:n;} .cd-q .sp-status-badge{grid-area:b;}
  .cd-q .cd-qdt{grid-area:d;} .cd-q .cd-qamt{grid-area:a;}
  .cd-info{grid-template-columns:56px minmax(0,1fr) 28px;}
  .cd-foot .cd-btn{flex:1;} .cd-foot .cd-btn--del{flex:0 0 auto;}
  .cd-confirm .cd-foot .cd-btn{flex:1;}
  .modal-overlay.open:has(> .cd-confirm){align-items:flex-end !important;padding:0 !important;}
  .cd-confirm{width:100vw;max-width:100vw;border-radius:16px 16px 0 0;}
}
/* ── 회사명 입력 중 비슷한 고객사 목록 (.ccs-*, clients.js _ccSug*) — 2026-10-10 ⑥. 견적 작성 회사명 칸·고객사 추가 창 */
.ccs-wrap{position:relative;}
.ccs-list{position:absolute;left:0;right:0;top:calc(100% + 4px);z-index:50;max-height:min(60vh,480px);overflow-y:auto;background:#fff;border:var(--ds-line) solid #cbd5e1;border-radius:var(--ds-radius-md);box-shadow:0 6px 16px rgba(15,23,42,.12);}
.ccs-head{padding:8px 12px;font-size:var(--ds-fs-sm);color:var(--ds-gray-600);background:var(--ds-gray-50);border-bottom:var(--ds-line) solid var(--ds-gray-200);}
.ccs-item{display:block;width:100%;text-align:left;padding:10px 12px;border:0;border-bottom:var(--ds-line) solid var(--ds-gray-200);background:#fff;font-family:inherit;cursor:pointer;}
.ccs-item:last-child{border-bottom:0;}
.ccs-item.on{background:var(--ds-primary-soft);}
@media (hover:hover){.ccs-item:hover{background:var(--ds-primary-soft);}}
.ccs-name{font-size:var(--ds-fs-base);color:var(--ds-gray-900);word-break:keep-all;}
.ccs-name b{color:var(--ds-primary);font-weight:700;}
.ccs-sub{margin-top:2px;font-size:var(--ds-fs-sm);color:var(--ds-gray-600);}
.ccs-more{padding:8px 12px;font-size:var(--ds-fs-sm);color:var(--ds-gray-400);}

/* ── 직접입력 모달: 모바일 1컬럼 ── */
@media screen and (max-width: 480px) {
  #modal-manual-item .modal-box {
    width: 100vw !important;
    max-width: 100vw !important;
    border-radius: 0 !important;
  }
  .mi-grid-2col {
    grid-template-columns: 1fr !important;
  }
  #modal-manual-item input,
  #modal-manual-item textarea {
    font-size: 16px !important;
  }
}

/* ── 페이지네이션 모바일 ── */
@media screen and (max-width: 480px) {
  #client-pagination {
    flex-wrap: wrap;
    gap: 4px;
    font-size: 11px;
  }
  #client-pagination .btn {
    padding: 5px 10px;
    font-size: 11px;
  }
}

/* 2026-10-22 토스트 누름 통과: 떠 있는 동안에도 밑의 버튼이 눌리게 (core.css 의 pointer-events:auto 를 덮음) */
.toast-item { pointer-events: none; }

/* ── 토스트 모바일: 하단 전체 너비 ── */
@media screen and (max-width: 480px) {
  #toast {
    bottom: 12px;
    right: 8px;
    left: 8px;
  }
  .toast-item {
    width: 100% !important;
    max-width: 100% !important;
  }
}

/* ══════════════════════════════════════════════════════════
   ■ 공통 페이지 툴바 (관리 페이지 상단 공통 구조)
   ══════════════════════════════════════════════════════════ */
.page-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 8px;
  padding: 10px 14px;
  border-bottom: 1.5px solid var(--border);
  background: #fff;
  flex-shrink: 0;
  min-height: 48px;
}
.page-toolbar-left {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 8px;
  min-width: 0;
  flex: 1;
}
.page-toolbar-title {
  font-size: 15px;
  font-weight: 700;
  color: #1B3A6B;
  margin: 0;
}
.page-toolbar-sub {
  font-size: 11px;
  color: #94a3b8;
}
.page-toolbar-right {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
  flex-shrink: 0;
}

.toolbar-search:focus { border-color: var(--p-blue); }
.toolbar-divider {
  width: 1px;
  height: 20px;
  background: var(--border);
  flex-shrink: 0;
}
/* 위험 버튼 영역 */
.toolbar-danger-group {
  display: flex;
  gap: 4px;
}
@media (max-width: 600px) {
  .page-toolbar { padding: 10px 10px 8px; flex-wrap: wrap; }
  .page-toolbar-left { flex: 1; min-width: 0; flex-wrap: wrap; gap: 6px; }
  .page-toolbar-right { width: 100%; justify-content: flex-end; gap: 4px; }
  .toolbar-search { width: 100%; max-width: 100%; min-width: 0; flex: 1; }
  .toolbar-select { flex: 1; min-width: 90px; font-size: 12px; }
  .btn-ghost { font-size: 11px; padding: 0 8px; }
}

/* ===== 목록 툴바 — 2026-10-09 필터·검색 통일 (기준표 값) =====
   구성: [제목 건수 전체|내 견적] [검색] [드롭다운들] [⋯]
   PC 한 줄, 768px 이하는 제목 / 검색 / 드롭다운+⋯ 세 줄. 다른 목록 화면도 이 클래스로 맞춘다. */
.page-toolbar.list-toolbar{
  display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-start;
  gap:var(--ds-sp-2);padding:var(--ds-sp-3) var(--ds-sp-4);min-height:0;
  background:#ffffff;border-bottom:var(--ds-line) solid var(--ds-gray-200);
}
.list-toolbar .lt-head{display:flex;align-items:center;gap:var(--ds-sp-2);min-width:0;}
.list-toolbar .page-toolbar-title{font-size:var(--ds-fs-lg);font-weight:500;color:var(--ds-gray-900);}
.list-toolbar .page-toolbar-sub{font-size:var(--ds-fs-md);color:var(--ds-gray-400);}
.list-toolbar .lt-search{
  margin-left:auto;width:260px;max-width:none;min-width:0;height:36px;
  padding:0 var(--ds-sp-3);font-size:var(--ds-fs-base);color:var(--ds-gray-900);
  border:var(--ds-line) solid var(--ds-gray-200);border-radius:var(--ds-radius-md);background:#ffffff;
}
.list-toolbar .lt-search:focus{border-color:var(--ds-primary);}
.list-toolbar .lt-filters{display:flex;align-items:center;gap:var(--ds-sp-2);}
.list-toolbar .toolbar-select{
  height:36px;min-width:110px;padding:0 var(--ds-sp-3);
  font-size:var(--ds-fs-base);color:var(--ds-gray-900);background:#ffffff;
  border:var(--ds-line) solid var(--ds-gray-200);border-radius:var(--ds-radius-md);
}
.list-toolbar .toolbar-select:focus{border-color:var(--ds-primary);}
.lt-more{position:relative;flex-shrink:0;}
.lt-more-btn{
  width:36px;height:36px;display:flex;align-items:center;justify-content:center;
  font-size:var(--ds-fs-lg);line-height:1;color:var(--ds-gray-600);cursor:pointer;
  background:#ffffff;border:var(--ds-line) solid var(--ds-gray-200);border-radius:var(--ds-radius-md);
}
.lt-more-btn:hover{background:var(--ds-gray-50);}
.lt-more-menu{
  display:none;position:absolute;right:0;top:calc(100% + 4px);z-index:50;min-width:160px;padding:var(--ds-sp-1) 0;
  background:#ffffff;border:var(--ds-line) solid var(--ds-gray-200);border-radius:var(--ds-radius-md);
  box-shadow:0 8px 24px rgba(27,58,107,.12);
}
.lt-more.open .lt-more-menu{display:block;}
.lt-more-menu button{
  display:block;width:100%;text-align:left;padding:9px 14px;
  font-size:var(--ds-fs-md);color:var(--ds-gray-900);background:none;border:none;cursor:pointer;
}
.lt-more-menu button:hover{background:var(--ds-gray-50);}
@media (max-width: 768px) {
  .page-toolbar.list-toolbar{padding:var(--ds-sp-3);}
  .list-toolbar .lt-head{flex:0 0 100%;flex-wrap:wrap;row-gap:var(--ds-sp-2);}
  .list-toolbar .lt-head .hist-scope-btns{margin-left:auto;} #p-scope-btns .hist-scope-btn,#r-scope-btns .hist-scope-btn{padding:0 8px;} .list-toolbar .lt-head .page-toolbar-title,.list-toolbar .lt-head .page-toolbar-sub{white-space:nowrap;}
  .list-toolbar .lt-search{flex:0 0 100%;width:100%;margin-left:0;}
  .list-toolbar .lt-filters{flex:0 0 100%;}
  .list-toolbar .lt-filters .toolbar-select{flex:1;min-width:0;}
}

/* ══════════════════════════════════════════════════════════
   ■ 관리 UI 일관성 개선 추가분
   ══════════════════════════════════════════════════════════ */

/* history-wrap: toolbar 이후 콘텐츠 영역 — flex 컨테이너 (단일 정의) */
.history-wrap {
  display: flex;
  flex-direction: column;
  flex: 1;
  min-height: 0;
  overflow: hidden;
  background: #fff;
}
.history-wrap > .admin-card {
  flex: 1;
  margin: 10px;
  min-height: 0;
  overflow: hidden;
}

/* 고객사 목록: PC — 2026-10-09 ⑤ 영업 현황 > 고객사. 6칸 표 (모바일은 위쪽 '고객사 목록: 모바일' 묶음) */
.cl-list { flex: 1; min-height: 0; overflow: auto; padding: var(--ds-sp-2) var(--ds-sp-3); }
.cl-table { table-layout: fixed; }
.cl-table th:nth-child(1) { width: 24%; } .cl-table th:nth-child(2) { width: 20%; } .cl-table th:nth-child(3) { width: 20%; }
.cl-table th:nth-child(4) { width: 11%; } .cl-table th:nth-child(5) { width: 9%; text-align: right; }
.cl-table td { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cl-table tbody tr { cursor: pointer; }
.cl-table td.cl-cnt { text-align: right; }
.cl-co { font-weight: 600; color: var(--ds-brand); }
.cl-dt, .cl-muted { color: var(--ds-gray-400); }
.cl-m { display: none; }
.cl-qtag { display: inline-block; margin-right: 6px; padding: 1px 6px; font-size: var(--ds-fs-xs); color: var(--ds-gray-600); background: #f1f5f9; border-radius: var(--ds-radius-sm); }
.cl-qnum { padding: 0; font: inherit; color: var(--ds-primary); text-decoration: underline; text-underline-offset: 2px; background: none; border: none; cursor: pointer; }
.cl-add-btn { height: 36px; flex-shrink: 0; }

/* spec-cat-body: 카테고리 열은 높이 자동 */
#cat-admin-list.spec-cat-body {
  max-height: none;
  overflow-y: visible;
  padding: 0;
}

/* 스펙 옵션 테이블 버튼 통일 */
.spec-opt-body .btn-sm {
  font-size: 11px;
  padding: 3px 8px;
}

/* page-toolbar 이후 콘텐츠 여백 */
.page-toolbar + * {
  margin-top: 0;
}

/* 서브탭 → 콘텐츠 간 구분 */
.sub-tabs + .sub-panel,
.sub-tabs + .sub-panel.active {
  border-top: none;
}

/* 콘텐츠 시작 여백 */
.history-wrap > .table-scroll-wrap,
.history-wrap > .history-card-list {
  margin-top: 8px;
}

/* 섹션 title 안 span 없이 직접 텍스트 있을 때 */
.section-title:not(.section-title--with-btn),
.r-section-title:not(.section-title--with-btn) {
  justify-content: flex-start;
}

/* ══ 유틸리티 ══ */
.btn-hidden { display: none !important; }
/* 위험 버튼 소프트 변형 */
.btn-danger-soft {
  background: #fee2e2;
  color: #dc2626;
  border: 1.5px solid #fca5a5;
}
.btn-danger-soft:hover { background: #fecaca; border-color: #f87171; }

/* ══ 스펙 관리 3열 높이 통일 ══ */
.spec-3col-grid {
  align-items: start;
}
.spec-3col-grid .spec-section {
  min-height: 200px;
}
.spec-cat-body {
  padding: 0;
}
#cat-admin-list.spec-cat-body {
  max-height: none;
  overflow-y: visible;
}
/* spec-opt-body 테이블 정렬 */
.spec-opt-body td, .spec-opt-body th {
  white-space: nowrap;
}
.spec-opt-body td:first-child {
  white-space: normal;
  min-width: 80px;
}

/* spec-section-bar 안 버튼은 조금 작게 */
.spec-section-bar .btn-sm {
  height: 28px;
  padding: 0 10px;
  font-size: 11px;
}
/* 구매/렌탈 form-section 통일 */
.form-section {
  border: 1px solid #dde3ee;
  border-radius: 8px;
  padding: 16px;
  margin-bottom: 12px;
  background: #fff;
  box-shadow: 0 1px 3px rgba(0,0,0,.03);
}

/* ══════════════════════════════════════════════════════════
   ■ JS 렌더링 공통 클래스 (인라인 style 대체)
   ══════════════════════════════════════════════════════════ */

/* 빈 상태 / 로딩 / 에러 메시지 */
.tbl-empty {
  text-align: center;
  padding: 24px;
  color: var(--muted);
  font-size: 13px;
}
.tbl-error {
  text-align: center;
  padding: 24px;
  color: #ef4444;
  font-size: 13px;
}
.tbl-no-data {
  text-align: center;
  padding: 20px;
  color: #94a3b8;
  font-size: 12px;
}

/* 제품 관리 테이블 행 */
.admin-tbl-name {
  font-weight: 600;
  font-size: 12px;
  color: #1e293b;
}
.admin-tbl-meta {
  font-size: 10px;
  color: #64748b;
  margin-top: 2px;
}
.admin-tbl-actions {
  display: flex;
  gap: 4px;
  justify-content: flex-end;
  align-items: center;
}
.admin-tbl-price {
  text-align: right;
  font-weight: 600;
  white-space: nowrap;
}
.admin-tbl-center {
  text-align: center;
}

/* 스펙 옵션 테이블 */
.spec-opt-name { font-weight: 600; }
.spec-opt-price { text-align: right; white-space: nowrap; }
.spec-opt-order { text-align: center; }
.spec-opt-actions { text-align: right; white-space: nowrap; }

/* 견적 이력 테이블 */
.hist-empty {
  text-align: center;
  padding: 24px;
  color: #94a3b8;
  font-size: 13px;
}

/* 카탈로그 빈 상태 */
.no-products { padding: 16px 0; color: #94a3b8; font-size: 13px; text-align: center; }

/* 파일 임포트 label 버튼 */
.btn-file-import { cursor: pointer; }
.btn-file-import input[type="file"] { display: none; }

/* ══════════════════════════════════════════════════════════
   ■ 유틸리티 클래스 (인라인 style 대체)
   ══════════════════════════════════════════════════════════ */

/* 체크박스 */
.chk-col { width: 36px; }
.chk-input { width: 15px; height: 15px; cursor: pointer; }

/* 텍스트 정렬 */
.tar { text-align: right; }
.tac { text-align: center; }
.tal { text-align: left; }

/* 텍스트 색상 */
.text-muted  { color: #94a3b8; }
.text-subtle { color: #64748b; }
.text-navy   { color: #1B3A6B; }
.text-danger { color: #ef4444; }
.text-r-primary { color: var(--r-primary); }
.text-r-blue    { color: var(--r-blue); }

/* 폰트 크기 */
.fs-10 { font-size: 10px; }
.fs-11 { font-size: 11px; }
.fs-12 { font-size: 12px; }
.fs-13 { font-size: 13px; }

/* 폰트 굵기 */
.fw-600 { font-weight: 600; }
.fw-700 { font-weight: 700; }

/* 복합 유틸리티 */
.label-navy  { font-size: 12px; font-weight: 600; color: #1B3A6B; }
.label-muted { font-size: 10px; color: #94a3b8; }
.label-subtle { font-size: 10px; color: #64748b; }
.meta-text   { font-size: 10px; color: #94a3b8; margin-top: 2px; }
.meta-subtle { font-size: 10px; color: #64748b; margin-top: 2px; }

/* 렌더링 테이블 공통 */
.tbl-col-chk   { width: 36px; text-align: center; }
.tbl-col-num   { text-align: center; white-space: nowrap; }
.tbl-col-right { text-align: right; white-space: nowrap; }
.tbl-col-price { text-align: right; font-weight: 600; white-space: nowrap; }
.tbl-col-center { text-align: center; }
.tbl-name-cell { display: flex; flex-direction: column; gap: 3px; }
.tbl-name-main { font-weight: 600; font-size: 12px; color: #1e293b; }
.tbl-name-sub  { font-size: 10px; color: #64748b; }

/* badge 공통 */
.badge { display: inline-block; padding: 1px 8px; border-radius: 99px; font-size: 11px; font-weight: 600; }
.badge-rental  { background: #eff6ff; color: #2563eb; font-size: 11px; font-weight: 600; padding: 2px 7px; border-radius: 99px; }
.badge-daily   { background: #fef3c7; color: #d97706; padding: 2px 7px; border-radius: 99px; }
.badge-monthly { background: #dbeafe; color: #1a56a0; padding: 2px 7px; border-radius: 99px; }
.badge-custom  { background: #f3e8ff; color: #7c3aed; padding: 2px 7px; border-radius: 99px; }

/* 렌더 행 — td 자체는 일반 표 칸, flex는 내부 그룹에만 */
.render-actions { vertical-align: middle; text-align: left; }

/* 고객사 관리 테이블 */
.client-badge { background: #f1f5f9; padding: 2px 6px; border-radius: 4px; font-size: 11px; }

/* ══ 추가 유틸리티 ══ */
.d-flex-center { display: flex; align-items: center; gap: 6px; }

/* 할인 입력 width */
.discount-input-sm { width: 55px;  text-align: right; }
.discount-input-md { width: 90px;  text-align: right; }
.discount-input-lg { width: 100px; text-align: right; }

.h-logo-img { height: 30px; filter: none; }
.price-divider { border-bottom: 1px dashed var(--border); padding-bottom: 6px; margin-bottom: 4px; }
.price-divider-top { border-top: 1px dashed var(--border); margin-top: 6px; padding-top: 8px; }
.d-flex-wrap { display: flex; gap: 6px; flex-wrap: wrap; }
.client-badge-blue { padding: 3px 8px; font-size: 11px; background: #eef3fb; color: #1B3A6B; border: 1px solid #c7d7f5; border-radius: 4px; }

/* ══ 추가 클래스 ══ */
.cat-input { padding: 3px 8px; border: 1px solid #e2e8f0; border-radius: 4px; font-size: 11px; width: 100px; }

.badge-manual { font-size: 9px; background: #e0f2fe; color: #0369a1; border-radius: 3px; padding: 1px 5px; margin-left: 4px; vertical-align: middle; }
.status-badge { display: inline-block; padding: 1px 8px; border-radius: 99px; font-size: 11px; font-weight: 600; color: #fff; }
.dot-green { display: inline-block; width: 7px; height: 7px; background: #22c55e; border-radius: 50%; margin-right: 4px; }

.d-flex-between { display: flex; justify-content: space-between; align-items: center; }
.input-disabled  { background: #f1f5f9; color: #94a3b8; }
.text-label-md   { font-size: 13px; color: #475569; font-weight: 500; }
.text-success-lg { font-size: 16px; font-weight: 700; color: #166534; }
.info-box  { background: #f1f5f9; border-radius: 6px; padding: 8px 12px; font-size: 13px; display: flex; align-items: center; gap: 8px; }
.detail-cell { display: flex; flex-direction: column; gap: 4px; padding: 8px 12px; background: #fff; }
.form-stack  { display: flex; flex-direction: column; gap: 10px; }

/* 페이지네이션 + 모달 푸터 */
.pagination-wrap { display: flex; justify-content: center; align-items: center; gap: 6px; padding: 4px; font-size: 12px; margin-top: 8px; }
.modal-footer-row { display: flex; justify-content: flex-end; align-items: center; padding: 10px 14px; border-top: 1px solid var(--border); gap: 8px; }
.detail-cell--success { background: #f0fdf4; border-radius: 6px; border: 1px solid #86efac; }

.preview-modal-header { display:flex; justify-content:flex-end; align-items:center; padding:10px 14px; border-bottom:1px solid #dde3ee; flex-shrink:0; width:100%; box-sizing:border-box; }
.preview-modal-footer { display:flex; flex-direction:row; justify-content:flex-end; align-items:center; gap:8px; padding:10px 14px; border-top:1px solid #dde3ee; background:#f8fafc; flex-shrink:0; width:100%; box-sizing:border-box; }
.amount-success-box { display:flex; flex-direction:column; gap:4px; padding:8px 12px; background:#f0fdf4; border-radius:8px; border:1px solid #86efac; }
.calc-summary-box { background:#f1f5f9; border-radius:6px; padding:8px 12px; font-size:13px; display:flex; justify-content:space-between; align-items:center; }
.dot-green-super { display:inline-block; width:7px; height:7px; background:#22c55e; border-radius:50%; margin-left:5px; vertical-align:super; flex-shrink:0; }

/* 카테고리 항목은 클릭 없음 */
.spec-cat-item--cat { cursor: default; }
.spec-cat-item--cat:hover { background: #fff; }

/* ══ AQ 4방향 연동 추가 CSS ══ */
/* 마지막 수정 필드 하이라이트 */
.aq-last-edited {
  border-color: #1B3A6B !important;
  box-shadow: 0 0 0 2px rgba(27,58,107,0.15) !important;
  background: #f0f6ff !important;
}
.aq-right .aq-last-edited {
  border-color: #92400e !important;
  box-shadow: 0 0 0 2px rgba(146,64,14,0.15) !important;
  background: #fffbf5 !important;
}
/* 마진 힌트 행 */
.aq-margin-hint-row {
  display: flex;
  justify-content: flex-end;
  padding: 0 2px;
  min-height: 16px;
}
.aq-margin-hint {
  font-size: 10px;
  white-space: nowrap;
  font-weight: 600;
}
.aq-margin-hint.positive { color: #16a34a; }
.aq-margin-hint.negative { color: #dc2626; }

/* 품목 수정 버튼 */
.btn-edit-item {
  background: none; border: 1px solid #94a3b8; border-radius: 4px;
  color: #64748b; font-size: 11px; padding: 2px 5px; cursor: pointer;
  margin-right: 3px; transition: all .1s;
}
.btn-edit-item:hover { border-color: #1B3A6B; color: #1B3A6B; background: #eff6ff; }

/* 탭 버튼 포커스 아웃라인 제거 */
.top-tab:focus, .sub-tab:focus,
.top-tab:focus-visible, .sub-tab:focus-visible,
.h-nav-tab:focus-visible { outline: none !important; } /* 2026-10-21 머리 메뉴(.h-nav-tab) 추가 */