/* 2026-11-02 미리보기 견적서가 창 높이에 맞춰 줄어들며 납품가능일 · 유효기간 · 특이사항 상자가 잘리던 것 → #preview-content .qdoc 의 flex 를 1 0 auto 로 (화면만, 인쇄 print.css 영향 없음) */
/* 2026-10-15 파일 나누기 (옮기기만, 선택자·선언·주석·순서 변경 없음): 원래 1~1112줄만 남김. 1113~2499줄 → core-legacy.css, 2500~3129줄 → core-ui.css, 3130줄~끝 → qm-modal.css. index.html 불러오는 순서 core → core-legacy → core-ui → qm-modal 을 바꾸지 말 것 (뒤 파일이 앞 파일 규칙을 덮음) */
/* 2026-10-10 ⑥ 회사명 입력 중 비슷한 고객사 목록(.ccs-*) — 고객사 창 묶음 바로 뒤 */
/* 2026-10-10 회사 배송지 → '이전 배송지'(값 있을 때만, clients.js), 기본 정보 이름표·값 단어 단위 줄바꿈 */
/* 2026-10-10 고객사 창 담당자별 배송지·메모 줄(.cd-ct-sub·.cd-ct-k·.cd-ct-v), 고치는 상자 넓은 줄(.cd-row-full) */
/* 2026-10-10 ⑤ 고객사 창: 옛 고객사 추가/수정 창 규칙(.cm-delete-mobile, #modal-client 모바일, .client-modal-body)을 새 창 규칙(.cd-*)으로 바꿈 */
/* 2026-10-09 ⑤ 고객사 탭 목록: 옛 #panel-clients 툴바·표 규칙을 .cl-* 로 고침 (PC 6칸 표, 600px 이하 3줄 카드), 안 쓰는 .client-addr-cell 삭제 */
/* 2026-10-09 style.css 에서 분리 (원래 1~2970줄) */
/* 2026-10-09 5-3 견적 이력 카드: 카드 목록 좌우 여백, 영업 상태 줄 위치, rev 카드 구분(뒤쪽 규칙에 덮이던 것 옮김), 렌탈 색 남색으로 통일 */
/* 2026-10-09 머리 영역 디자인 통일: 흩어진 머리 규칙 6곳 → 한 곳, 한 줄 머리 + 하위 메뉴 띠 / 목록 툴바(.list-toolbar) 추가 / 견적 품목 창(.qm-modal) 추가 */
/* 2026-10-09 디자인 기준표(--ds-*) 추가 — 정의만, 화면 변화 없음 */
/* 2026-10-09 견적 품목 표 정리: 모바일은 가로 밀기 대신 품목별 카드, 글자는 12px 하나(제품명·단가·수량은 굵게) */
/* ===== Style Block 1 ===== */
*{box-sizing:border-box;margin:0;padding:0;font-family:'Pretendard','Apple SD Gothic Neo','Noto Sans KR',sans-serif;}
/* ===== 색상 변수 ===== */
:root{
  /* 구매견적 – 진한 남색 */
  --p-navy:#1B3A6B; --p-blue:#2E7FC1; --p-accent:#e8f0f8;
  /* 렌탈견적 – 차분한 파란색 */
  --r-primary:#1a56a0; --r-blue:#3b82f6; --r-accent:#eff6ff; --r-light:#dbeafe;
  /* 공통 */
  --navy:#1B3A6B; --blue:#2E7FC1; --accent:#e8f0fd;
  --border:#dde3ee; --muted:#94a3b8; --bg:#f5f7fc;
  --success:#10b981; --danger:#ef4444; --warn:#f59e0b;
  /* 폰트 크기 */
  --fs-xs:10px;
  --fs-sm:11px;
  --fs-base:12px;
  --fs-md:13px;
  --fs-lg:14px;
  --fs-xl:16px;
  --fs-2xl:18px;

  /* ===== 2026-10-09 디자인 기준표 (--ds-*) =====
     새로 만들거나 고치는 화면부터 이 값만 쓴다. 위의 옛 변수(--fs-*, --navy 등)는
     기존 화면이 쓰고 있으므로 그대로 두고, 화면을 정리할 때 하나씩 옮긴다. */
  /* 글자 (6단계) */
  --ds-fs-xs:11px;    /* 배지, 아주 작은 표시 */
  --ds-fs-sm:12px;    /* 보조 설명, 날짜 */
  --ds-fs-md:13px;    /* 표 내용, 버튼, 모바일 메뉴 */
  --ds-fs-base:14px;  /* 본문, 입력칸, PC 메뉴 (기본) */
  --ds-fs-lg:16px;    /* 섹션 제목, 금액 강조 */
  --ds-fs-xl:20px;    /* 화면 제목 */
  /* 간격 (4의 배수) */
  --ds-sp-1:4px; --ds-sp-2:8px; --ds-sp-3:12px; --ds-sp-4:16px; --ds-sp-6:24px;
  /* 선 */
  --ds-line:1px;          /* 기본 */
  --ds-line-strong:2px;   /* 강조 */
  --ds-line-active:3px;   /* 선택 밑줄 */
  /* 모서리 */
  --ds-radius-sm:4px;     /* 배지 */
  --ds-radius-md:8px;     /* 버튼, 입력칸 */
  --ds-radius-lg:12px;    /* 카드 */
  --ds-radius-pill:999px;
  /* 색: 브랜드·선택 */
  --ds-brand:#1B3A6B;         /* 로고, 제목 */
  --ds-primary:#2E7FC1;       /* 선택 표시, 링크, 주요 버튼 (파랑 하나로 통일) */
  --ds-primary-dark:#236aa6;  /* 주요 버튼 누를 때 */
  --ds-primary-soft:#e8f0f8;  /* 연한 파랑 바탕 */
  --ds-band:#cfe3f5;          /* 상단 메뉴 띠 */
  --ds-band-text:#3d5f86;     /* 메뉴 띠 위 글자 */
  /* 색: 회색 5단계 */
  --ds-gray-900:#1e293b;  /* 본문 글자 */
  --ds-gray-600:#64748b;  /* 보조 글자 */
  --ds-gray-400:#94a3b8;  /* 흐린 글자, 비선택 */
  --ds-gray-200:#e2e8f0;  /* 선 */
  --ds-gray-50:#f5f7fc;   /* 화면 바탕 */
  /* 색: 상태 */
  --ds-progress:#2563eb;  /* 진행 */
  --ds-warn:#d97706;      /* 주의 (F/U 미정, 재검토) */
  --ds-danger:#dc2626;    /* 지연, 위험 */
  --ds-success:#059669;   /* 수주 */
  /* 머리 영역 */
  --ds-header-h:64px;        --ds-logo-h:48px;         /* PC */
  --ds-header-h-mobile:56px; --ds-logo-h-mobile:40px;  /* 모바일 */
  --ds-header-logo-w:160px;  /* 로고 칸 폭 = 하위 메뉴 띠 왼쪽 여백 (메인 메뉴 첫 글자 아래 맞춤) */
  --ds-subband-h:44px; --ds-subband-h-mobile:40px;  /* 하위 메뉴 띠 높이 */
}
/* ===== 로그인 화면 ===== */
#login-screen{display:flex;position:fixed;inset:0;background:linear-gradient(135deg,#1B3A6B 0%,#2E7FC1 100%);z-index:100;align-items:center;justify-content:center;}

.login-box{background:#fff;border-radius:16px;padding:36px 32px 32px;width:360px;max-width:95vw;box-shadow:0 8px 40px rgba(0,0,0,.18);}
.login-logo{text-align:center;margin-bottom:28px;}
.login-logo img{max-width:180px;margin-bottom:10px;}
.login-logo h1{font-size:18px;font-weight:700;color:var(--p-navy);margin-bottom:4px;}
.login-logo p{font-size:12px;color:var(--muted);}
.login-logo .phone{font-size:13px;color:var(--p-navy);font-weight:600;margin-top:6px;}
.form-group{margin-bottom:14px;}
.form-group label{font-size:12px;font-weight:600;color:#374151;display:block;margin-bottom:5px;}
.form-group input{width:100%;padding:10px 12px;border:1.5px solid var(--border);border-radius:8px;font-size:13px;color:#1a2e5a;outline:none;transition:border .15s;}
.form-group input:focus{border-color:var(--p-blue);}
.btn-login{width:100%;padding:12px;background:var(--p-navy);color:#fff;border:none;border-radius:8px;font-size:14px;font-weight:700;cursor:pointer;transition:background .2s;}
.btn-login:hover{background:var(--p-blue);}
.login-err{color:#ef4444;font-size:12px;margin-top:8px;display:none;}
/* ===== 앱 레이아웃 ===== */
#app{display:none;flex-direction:column;height:100vh;height:100dvh;overflow:clip;font-size:var(--fs-base);}
/* ===== 헤더 ===== */
/* ===== 머리 영역 — 2026-10-09 디자인 통일 (한 줄 + 하위 메뉴 띠) =====
   PC  : [로고][메인 메뉴 … ][회원] 한 줄 (흰색). 메인 선택 = 파란 글자 + 글자 바로 아래 2px 밑줄
   아래: 하위 메뉴 띠(하늘색, 높이 고정). 하위 선택 = 진한 파랑 칸
         하위 메뉴는 항상 메인 메뉴 첫 글자 아래에서 시작 (로고 칸 폭 = 띠 왼쪽 여백)
   모바일(600px 이하): 로고 줄 / 메뉴 줄 / 하위 메뉴 띠
   머리 영역 규칙은 여기와 아래 '머리 영역 모바일' @media 에만 둔다. */
.app-header{
  display:flex;flex-wrap:nowrap;align-items:center;
  height:var(--ds-header-h);padding:0 var(--ds-sp-6) 0 0;gap:0;
  background:#ffffff;border-bottom:none;
  flex-shrink:0;position:relative;z-index:10;
}
.h-nav-tabs{
  order:2;display:flex;align-items:center;flex:1 1 auto;min-width:0;
  height:100%;margin:0;padding:0;gap:0;background:transparent;
  overflow-x:auto;scrollbar-width:none;
}
.h-nav-tabs::-webkit-scrollbar{display:none;}
.h-nav-tab{
  display:flex;align-items:center;
  height:100%;padding:0 14px;
  font-size:var(--ds-fs-base);font-weight:400;color:var(--ds-gray-600);
  background:transparent;border:none;border-radius:0;
  white-space:nowrap;flex-shrink:0;cursor:pointer;
  text-decoration:none;text-underline-offset:6px;text-decoration-thickness:var(--ds-line-strong);
  transition:color .15s;
  font-family:'Pretendard',system-ui,sans-serif;
}
.h-nav-tab i{display:none;} /* 메뉴 아이콘 숨김 (HTML 은 그대로 둠) */
.h-nav-tab:hover{color:var(--ds-brand);background:transparent;}
.h-nav-tab.active,
.h-nav-tab.active.rental,
.h-nav-tab.active.admin,
.h-nav-tab.active.clients,
.h-nav-tab.active.dashboard{
  color:var(--ds-primary);font-weight:500;background:transparent;
  text-decoration:underline;text-decoration-color:var(--ds-primary);
}
/* h-right: 회원 동그라미 */
.h-right{order:3;display:flex;align-items:center;gap:var(--ds-sp-2);margin-left:auto;padding-left:var(--ds-sp-3);height:100%;flex-shrink:0;}
.h-avatar{width:32px;height:32px;border-radius:50%;background:var(--ds-primary-soft);color:var(--ds-brand);font-size:var(--ds-fs-md);font-weight:500;display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;}
.h-user-name{font-size:var(--ds-fs-base);color:var(--ds-gray-600);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.h-logo-label{font-size:var(--fs-md);font-weight:800;color:#1B3A6B;margin-left:8px;letter-spacing:-0.3px;white-space:nowrap;}
/* h-email = profile-trigger 버튼 — 항상 표시 */
.h-email{font-size:var(--fs-base);color:#64748b;display:block;}
/* 로그아웃 버튼 (데스크탑 전용) */
.btn-logout{padding:5px 12px;border:1.5px solid #e2e8f0;border-radius:6px;background:transparent;color:#64748b;font-size:var(--fs-sm);font-weight:500;cursor:pointer;transition:all .15s;}
.btn-logout:hover{background:#f1f5f9;color:#1e293b;border-color:#cbd5e1;}
.app-header.rental-theme,.app-header.admin-theme{background:#ffffff;}
.h-logo{order:1;display:flex;align-items:center;gap:0;width:var(--ds-header-logo-w);height:100%;padding-left:var(--ds-sp-4);text-decoration:none;flex-shrink:0;cursor:default;}
.h-logo img{height:var(--ds-logo-h);width:auto;border-radius:0;display:block;}
/* 하위 메뉴가 없는 화면의 빈 띠 (머리 높이 고정용, config.js _hdrSyncEmptyBand 가 표시/숨김) */
.sub-band-empty{height:var(--ds-subband-h);background:var(--ds-band);flex-shrink:0;}
@media screen and (max-width: 900px) {
  .h-user-name{display:none;}
}
/* 머리 영역 모바일 (600px 이하) — 2026-10-09 */
@media screen and (max-width: 600px) {
  .app-header{flex-wrap:wrap;height:auto;padding:0;}
  .h-logo{width:auto;height:var(--ds-header-h-mobile);padding-left:var(--ds-sp-3);}
  .h-logo img{height:var(--ds-logo-h-mobile);}
  .h-right{order:2;height:var(--ds-header-h-mobile);padding-right:var(--ds-sp-4);}
  .h-nav-tabs{order:3;flex:0 0 100%;height:auto;justify-content:space-around;padding:var(--ds-sp-1) var(--ds-sp-1) var(--ds-sp-2);}
  .h-nav-tab{height:auto;padding:var(--ds-sp-1) 6px;font-size:var(--ds-fs-md);}
  .sub-band-empty{height:var(--ds-subband-h-mobile);}
}
.h-divider{width:1px;height:20px;background:#e2e8f0;margin:0 4px;}
.h-badge.admin-badge{display:inline-flex;align-items:center;background:#e0e7ef;color:#1B3A6B;font-weight:700;font-size:var(--fs-xs);}
.h-spacer{flex:1;}

/* ===== 최상위 탭 (구매/렌탈/관리자) ===== */
/* .top-tabs 제거됨 - 옵션B 적용 (h-nav-tab으로 통합) */

/* ===== top-panel: 구매/렌탈/관리자 패널 ===== */
.top-panel{
  display:none;flex:1;flex-direction:column;min-height:0;overflow:hidden;
}
.top-panel.active{display:flex;}
.sub-tabs{
  display:none; /* 외부 서브바로 대체 — p-sub/r-sub는 숨김 */
  display:flex;background:#f8fafc;border-bottom:1.5px solid #e2e8f0;
  padding:0 16px;flex-shrink:0;gap:2px;
  height:44px;align-items:center;
  overflow-x:auto;scrollbar-width:none;
}
.sub-tabs::-webkit-scrollbar{display:none;}
.sub-tab{
  padding:0 20px;height:34px;font-size:var(--fs-base);font-weight:600;
  min-width:90px;
  color:#94a3b8;cursor:pointer;border:none;background:transparent;
  border-bottom:2.5px solid transparent;transition:all .15s;
  font-family:'Pretendard','Apple SD Gothic Neo','Noto Sans KR',sans-serif;
  display:flex;align-items:center;gap:5px;border-radius:6px 6px 0 0;
}
.sub-tab:hover{color:#475569;background:#f1f5f9;}
.sub-tab.active.p-sub{color:#1d4ed8;border-bottom-color:#1d4ed8;background:rgba(29,78,216,.06);}
.sub-tab.active.r-sub{color:#2563eb;border-bottom-color:#2563eb;background:rgba(37,99,235,.06);}
.sub-tab.active.a-sub{color:#374151;border-bottom-color:#6b7280;}
/* ===== 서브패널 ===== */
.sub-panel{display:none;flex:1;flex-direction:column;min-height:0;overflow:hidden;}
.sub-panel.active{display:flex;flex-direction:column;}
/* ===== 공통 레이아웃 ===== */
.split-layout{display:flex;flex:1;min-height:0;gap:0;overflow:hidden;}
.catalog-panel{width:240px;min-width:200px;background:#fff;border-right:1.5px solid var(--border);display:flex;flex-direction:column;overflow:hidden;}
.panel-header{padding:9px 12px;font-size:var(--fs-base);font-weight:700;color:var(--navy);border-bottom:1px solid var(--border);background:#f8fafc;}
.panel-header.r-header{color:var(--r-primary);}
.filter-area{padding:8px 10px;border-bottom:1px solid var(--border);background:#fff;}
.filter-select{width:100%;padding:5px 8px;border:1px solid var(--border);border-radius:6px;font-size:var(--fs-sm);color:var(--navy);outline:none;margin-bottom:6px;background:#fff;}
.filter-select:last-child{margin-bottom:0;}
.d-flex-wrap .filter-select{margin-bottom:0;}
.filter-select:focus{border-color:var(--p-blue);}
.r-filter-select:focus{border-color:var(--r-blue);}
.product-list{flex:1;overflow-y:auto;overflow-x:hidden;padding:6px;min-height:0;}
.product-card{padding:8px 10px;border:1px solid var(--border);border-radius:8px;margin-bottom:6px;cursor:pointer;transition:all .15s;background:#fff;}
.product-card:hover{border-color:var(--p-blue);background:var(--p-accent);}
.product-card.r-card:hover{border-color:var(--r-blue);background:var(--r-accent);}
.product-card .pc-name{font-size:var(--fs-base);font-weight:700;color:var(--p-navy);margin-bottom:2px;}
.product-card.r-card .pc-name{color:var(--r-primary);}
.product-card .pc-brand{font-size:var(--fs-xs);color:var(--muted);}
.pc-spec{font-size:10px;color:#475569;margin-top:4px;line-height:1.5;}
.product-card .pc-price{font-size:var(--fs-base);font-weight:700;color:var(--p-blue);margin-top:4px;}
.product-card.r-card .pc-price{color:var(--r-blue);}
.no-products{ display:none; }
/* ===== 폼 패널 ===== */
.form-panel{flex:1;display:flex;flex-direction:column;min-width:0;overflow:hidden;background:var(--bg);}
.form-scroll{flex:1;overflow-y:auto;overflow-x:hidden;padding:10px 8px;-webkit-overflow-scrolling:touch;overscroll-behavior:contain;min-height:0;}
.section-title,
.r-section-title {
  font-size: var(--fs-base); font-weight: 700; color: #fff;
  background: #1B3A6B;
  padding: 0 14px; margin: -14px -14px 14px -14px;
  border-radius: 6px 6px 0 0;
  display: flex; align-items: center; justify-content: space-between;
  gap: 8px; height: 44px; flex-shrink: 0;
  letter-spacing: 0.02em;
  -webkit-print-color-adjust: exact; print-color-adjust: exact;
}
.section-title > span:first-child,
.r-section-title > span:first-child {
  display: flex; align-items: center; gap: 6px;
}
/* with-btn은 이제 기본값과 동일 (하위 호환) */
.section-title.section-title--with-btn,
.r-section-title.section-title--with-btn { justify-content: space-between; }
.section-title.section-title--with-btn span,
.r-section-title.section-title--with-btn span { display:flex;align-items:center;gap:6px; }
/* 섹션 헤더 안 공통 버튼 */
.section-action-btn {
  font-size: 11.5px; padding: 0 10px;
  height: 28px; line-height: 28px;
  background: rgba(255,255,255,0.18); border: 1.5px solid rgba(255,255,255,0.55);
  color: #fff; border-radius: 6px;
  cursor: pointer; font-weight: 600;
  transition: all .15s; white-space: nowrap;
  display: inline-flex; align-items: center;
}
.section-action-btn:hover { background: rgba(255,255,255,0.32); border-color: #fff; }
.form-section{background:#fff;border-radius:8px;padding:14px;margin-bottom:10px;border:1px solid #f1f5f9;box-shadow:0 1px 3px rgba(0,0,0,.03);}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:10px;}
.form-row.full{grid-template-columns:1fr;}
.field-label{font-size:var(--fs-sm);font-weight:600;color:#374151;margin-bottom:4px;}
.field-input{width:100%;padding:7px 10px;border:1.5px solid var(--border);border-radius:7px;font-size:var(--fs-base);color:#1a2e5a;outline:none;transition:border .15s;background:#fff;}
.field-input:focus{border-color:var(--p-blue);}
.r-field-input:focus{border-color:var(--r-blue);}
.field-input.small{padding:4px 8px;}
textarea.field-input{resize:vertical;min-height:52px;}
/* ===== 수정견적(rev) 이력 배지 & 행 스타일 ===== */
/* rev 배지 — 견적번호 옆 작은 태그 */
.rev-badge {
  display: inline-block;
  margin-left: 5px;
  padding: 1px 6px;
  font-size: 10px;
  font-weight: 700;
  border-radius: 4px;
  background: #fef3c7;
  color: #b45309;
  border: 1px solid #fcd34d;
  vertical-align: middle;
  line-height: 1.5;
  letter-spacing: 0.02em;
}
.rev-badge--rental {
  background: #eff6ff;
  color: #1d4ed8;
  border-color: #bfdbfe;
}
/* rev 행 — 살짝 구분되는 배경 */
tr.tr-rev > td {
  background: #fafafa;
}
tr.tr-rev:hover > td {
  background: #f5f5f5;
}

/* ===== 수정견적(rev) 배너 ===== */
.rev-banner-wrap {
  margin-bottom: 8px;
}
.rev-banner {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 16px;
  background: #fffbeb;
  border: 1.5px solid #f59e0b;
  border-left: 4px solid #d97706;
  border-radius: 8px;
  font-size: 12.5px;
  color: #92400e;
  line-height: 1.4;
  box-shadow: 0 2px 6px rgba(245,158,11,0.12);
}
.rev-banner-icon {
  font-size: 18px;
  flex-shrink: 0;
  line-height: 1;
}
.rev-banner-body {
  flex: 1;
  min-width: 0;
}
.rev-banner-title {
  font-weight: 700;
  font-size: 13px;
  color: #78350f;
  margin-bottom: 2px;
}
.rev-banner-reason {
  color: #b45309;
  font-size: 12px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.rev-banner-hint {
  flex-shrink: 0;
  font-size: 11px;
  color: #a16207;
  background: rgba(245,158,11,0.12);
  border-radius: 4px;
  padding: 3px 8px;
  white-space: nowrap;
}
/* ===== 견적 품목 ===== */
.quote-items-header{display:flex;justify-content:space-between;align-items:center;margin:-14px -14px 10px -14px;border-radius:6px 6px 0 0;overflow:hidden;}
.items-table{width:100%;border-collapse:collapse;font-size:var(--fs-base);}
.items-table th{background:#dbeafe;padding:6px 8px;font-weight:700;color:#1B3A6B;border-bottom:2px solid #93c5fd;text-align:left;white-space:nowrap;font-size:var(--ds-fs-md);}
.items-table th.tar{text-align:right;} /* 2026-10-09 렌탈 '단가' 제목을 숫자와 같은 오른쪽으로 */
.items-table th.tac{text-align:center;} /* 2026-10-09 렌탈 '단위'·'수량 / 기간' 제목 가운데 */
#r-quote-items-area td:nth-child(5){font-size:var(--ds-fs-sm);font-weight:700;white-space:nowrap;} /* 2026-10-09 렌탈 단가(5번째 칸) = 구매 단가와 같게 */
/* 2026-10-09 품목 표 글자 12px 하나로 통일 (견적 작성 화면의 다른 글자와 같은 크기). 제품명·단가·수량은 굵기로 구분 */
.items-table .label-muted,
.items-table .fs-10,
.items-table .badge,
.items-table .qi-internal-item,
.items-table .qi-order-btn { font-size: var(--ds-fs-sm); }
.items-table .col-unit,
#r-quote-items-area td:nth-child(5) { color: var(--ds-gray-900); }
.items-table td{padding:7px 8px;border-bottom:1px solid var(--border);vertical-align:middle;}
.qty-display{display:inline-block;min-width:28px;text-align:center;font-size:var(--ds-fs-sm);font-weight:700;color:#1B3A6B;}
.qty-stepper{display:inline-flex;align-items:center;gap:4px;}
.qty-btn{width:24px;height:24px;border:1px solid #cbd5e1;border-radius:5px;background:#f8fafc;color:#1B3A6B;font-size:14px;font-weight:700;cursor:pointer;display:flex;align-items:center;justify-content:center;line-height:1;transition:background .15s;}
.qty-btn:hover{background:#dbeafe;border-color:#93c5fd;}
.btn-rm{background:#fee2e2;color:#ef4444;border:none;border-radius:5px;padding:3px 7px;font-size:11px;cursor:pointer;}
/* ===== 금액 요약 (구매) ===== */
.price-summary{background:#fff;border-radius:10px;padding:12px 14px;margin-bottom:10px;border:1px solid var(--border);}
.price-row{display:flex;justify-content:space-between;align-items:center;padding:5px 0;font-size:var(--fs-base);}
.price-row.total{font-weight:700;font-size:var(--fs-lg);border-top:2px solid var(--p-navy);margin-top:6px;padding-top:8px;}
.discount-row{display:flex;align-items:center;gap:6px;padding:5px 0;font-size:12px;flex-wrap:wrap;}
.discount-input{width:70px;padding:4px 6px;border:1px solid var(--border);border-radius:5px;font-size:11px;text-align:right;}
/* ===== 금액 요약 (렌탈) ===== */
.r-price-summary{background:#fff;border-radius:10px;padding:12px 14px;border:1px solid var(--border);}
.ps-row{display:flex;justify-content:space-between;align-items:center;padding:5px 0;font-size:var(--fs-base);}
.ps-row.total{font-weight:700;font-size:var(--fs-lg);border-top:2px solid var(--r-primary);margin-top:6px;padding-top:8px;}
.ps-editable{display:flex;align-items:center;gap:5px;flex-wrap:wrap;}
/* ===== 액션 바 ===== */
/* ===== 액션바 ===== */
.action-bar{padding:10px 12px;background:#fff;border-top:1px solid var(--border);display:flex;gap:8px;justify-content:flex-end;flex-shrink:0;z-index:10;}
/* ===== 버튼 ===== */
.btn{padding:7px 14px;border-radius:7px;font-size:var(--fs-base);font-weight:600;cursor:pointer;border:none;transition:all .15s;display:inline-flex;align-items:center;gap:5px;font-family:inherit;}
.btn-sm{height:32px;padding:0 12px;font-size:12px;line-height:1;display:inline-flex;align-items:center;gap:4px;white-space:nowrap;}
.btn-primary{background:var(--p-navy);color:#fff;}
.btn-mobile-share{display:none;}
.btn-primary:hover{background:var(--p-blue);}
.btn-r-primary{background:var(--r-primary);color:#fff;}
.btn-r-primary:hover{background:var(--r-blue);}
.btn-secondary{background:var(--p-accent);color:var(--p-navy);border:1.5px solid var(--border);}
.btn-secondary:hover{background:#dde8fc;}
.btn-r-secondary{background:var(--r-accent);color:var(--r-primary);border:1.5px solid var(--r-light);}
.btn-r-secondary:hover{background:var(--r-light);}
.btn-success{background:var(--success);color:#fff;}
.btn-danger{background:var(--danger);color:#fff;}
.btn-outline{background:#fff;font-weight:600;border-radius:8px;border:1.5px solid var(--p-blue);color:var(--p-blue);padding:6px 14px;font-size:12px;cursor:pointer;font-family:inherit;transition:all .15s;display:inline-flex;align-items:center;gap:5px;}
/* ===== 이력 ===== */
/* .history-wrap → 주 정의는 하단 page-toolbar 영역에 통합 */
.history-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px;}
.history-title{font-size:15px;font-weight:700;color:var(--p-navy);}
.r-history-title{font-size:15px;font-weight:700;color:var(--r-primary);}
/* ── 백업 바 ── */
.backup-bar {
  display: flex; align-items: center; gap: 6px;
  padding: 7px 10px; margin-bottom: 10px;
  background: #f0f4ff; border: 1px solid #c7d7f5;
  border-radius: 8px;
}
.r-backup-bar { background: #eff6ff; border-color: #bfdbfe; }
.backup-bar-label { font-size: 11.5px; font-weight: 700; color: #1B3A6B; margin-right: 4px; }
.r-backup-bar .backup-bar-label { color: var(--r-primary); }
.backup-btn {
  background: #fff; border: 1.5px solid #93c5fd;
  color: #1B3A6B; font-size: 11.5px; font-weight: 600;
  padding: 4px 10px; border-radius: 6px;
  cursor: pointer; transition: all .15s;
  display: inline-flex; align-items: center; gap: 3px;
}
.backup-btn:hover { background: #1B3A6B; color: #fff; border-color: #1B3A6B; }
.r-backup-btn { border-color: #93c5fd; color: var(--r-primary); }
.r-backup-btn:hover { background: var(--r-primary); color: #fff; border-color: var(--r-primary); }
.data-table{width:100%;border-collapse:collapse;font-size:var(--fs-base);}
.data-table th{background:#f8fafc;padding:9px 12px;font-weight:700;color:#1e293b;border-bottom:1.5px solid var(--border);text-align:left;font-size:var(--fs-base);}
.data-table td{padding:9px 12px;border-bottom:1px solid var(--border);vertical-align:middle;}
.data-table tr:last-child td{border-bottom:none;}
.data-table tr:hover td{background:#f8fafc;}
.history-card{background:#fff;border:1px solid var(--border);border-radius:8px;padding:10px 14px;margin-bottom:8px;display:flex;align-items:center;gap:10px;flex-wrap:wrap;}
.hc-num{font-size:11px;font-weight:700;color:var(--p-navy);min-width:100px;}
.r-hc-num{font-size:11px;font-weight:700;color:var(--r-primary);min-width:100px;}
.hc-info{flex:1;}
.hc-company{font-size:13px;font-weight:700;color:#1a2e5a;}
.hc-meta{font-size:11px;color:var(--muted);margin-top:2px;}
.hc-total{font-size:13px;font-weight:700;color:var(--p-navy);}
.r-hc-total{font-size:13px;font-weight:700;color:var(--r-primary);}
.hc-actions{display:flex;gap:6px;}
/* ===== 관리자 탭 ===== */
.admin-wrap{flex:1;overflow-y:auto;padding:12px;background:var(--bg);}
.admin-sub-tabs{
  display:flex;background:#f8fafc;border-bottom:1.5px solid #e2e8f0;
  padding:0 16px;flex-shrink:0;gap:2px;height:44px;align-items:center;
}
.admin-sub-tab{
  padding:0 20px;height:34px;font-size:12px;font-weight:600;
  color:#94a3b8;cursor:pointer;border:none;background:transparent;
  border-bottom:2.5px solid transparent;transition:all .15s;
  font-family:'Pretendard',system-ui,sans-serif;
  display:flex;align-items:center;gap:5px;white-space:nowrap;border-radius:6px 6px 0 0;
}
.admin-sub-tab:hover{color:#475569;background:#f1f5f9;}
.admin-sub-tab.active{color:#1B3A6B;border-bottom-color:#1B3A6B;font-weight:700;background:rgba(27,58,107,.06);}

.qdoc .q-header{
  display:flex;flex-direction:row;justify-content:space-between;align-items:flex-start;
  padding-bottom:20px;border-bottom:2.5px solid #1B3A6B;margin-bottom:20px;
}
.qdoc .q-logo-area{display:flex;flex-direction:column;align-items:flex-end;gap:6px;}
.qdoc .q-logo-area img{height:64px;}
.qdoc .q-logo-area .q-tel{display:none;}
.qdoc h1{font-size:28px;font-weight:800;margin-bottom:4px;letter-spacing:0.15em;}
.qdoc .q-date{font-size:11px;color:var(--muted);}
.q-section{margin-bottom:20px;}
.q-section-title{
  font-size:12px;font-weight:800;color:#1B3A6B;
  text-transform:uppercase;letter-spacing:.08em;
  padding-bottom:6px;border-bottom:1.5px solid #dde3ee;
  margin-bottom:10px;
}
.r-q-section-title{font-size:12px;font-weight:800;color:#1B3A6B;text-transform:uppercase;letter-spacing:.08em;padding-bottom:6px;border-bottom:1.5px solid #dde3ee;margin-bottom:10px;}
.q-party-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:10px;}
/* ── 납품/유효기간 · 특이사항 — quote-view.html과 동일 스타일 ── */
.q-info-grid{
  display:flex;flex-direction:column;gap:0;
  background:#f5f7fc;border:1px solid #d0d8ee;
  border-radius:8px;padding:0;overflow:hidden;
}
.q-info-item{
  display:flex;align-items:baseline;gap:10px;
  padding:8px 16px;border-bottom:1px solid #e2e8f0;
}
.q-info-item:last-child{border-bottom:none;}
.q-info-item .label{
  font-size:11px;color:#1e6fd9;font-weight:600;
  min-width:90px;flex-shrink:0;
}
.q-info-item .value{
  font-size:12px;font-weight:700;color:#1a2e5a;
}
.q-party-box{border:1px solid var(--border);border-radius:8px;padding:10px;}
.q-party-box h4{font-size:11px;font-weight:700;margin-bottom:6px;}
.q-party-box.supplier h4{color:var(--p-navy);}
.q-party-box.r-supplier h4{color:var(--r-primary);}
.q-table{
  min-width: 0;
  width:100%;border-collapse:collapse;margin-top:8px;font-size:12.5px;
  table-layout: auto;
}
.q-table th{
  background:#1B3A6B;color:#ffffff;padding:8px 10px;font-size:11.5px;
  font-weight:700;letter-spacing:0.03em;text-align:left;
  border-bottom:2px solid #0f2a52;
  -webkit-print-color-adjust:exact;print-color-adjust:exact;
}
.q-table td{
  padding:8px 10px;border-bottom:1px solid #e8edf5;vertical-align:middle;
  font-size:12px;
}
.q-table tbody tr:hover td{background:#f0f5ff;}
/* ── 합계 박스 (구매/렌탈 공통) ── */
/* ── 합계 테이블: 품목 테이블과 동일한 전체 너비 ── */
.q-summary-box {
  width: 100%;
  margin-top: 0;
  border: none;          /* 소계 위 선 없음 */
  border-radius: 0;
  overflow: hidden;
  background: #fff;
}
.q-summary-row {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  gap: 0;
  padding: 6px 10px;
  font-size: 12px;
  color: #4b5563;
  border-bottom: 1px solid #f1f5f9;
}
.q-summary-row span:first-child {
  width: 90px;
  text-align: right;
  color: #64748b;
  padding-right: 16px;
  flex-shrink: 0;
  white-space: nowrap;
}
.q-summary-row span:last-child {
  width: 120px;
  text-align: right;
  font-variant-numeric: tabular-nums;
}
.q-summary-row:last-child { border-bottom: none; }
/* 할인 행 */
.q-summary-disc { background: #fff8f8; }
.q-summary-disc span { color: #ef4444 !important; }
/* 공급가액 행 */
.q-summary-sub { font-weight: 600; background: #f8fafc; }
.q-summary-sub span { color: #1e293b !important; }
/* 합계 행 */
.q-summary-total {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  padding: 9px 10px;
  background: #1B3A6B;
  color: #fff !important;
  font-size: 14px;
  font-weight: 800;
  letter-spacing: 0.02em;
}
.q-summary-total span:first-child {
  width: 90px;
  text-align: right;
  padding-right: 16px;
  color: #fff !important;
  flex-shrink: 0;
}
.q-summary-total span:last-child {
  width: 120px;
  text-align: right;
  color: #fff !important;
  font-variant-numeric: tabular-nums;
}
/* 렌탈 합계: 파란 계열 */
.r-summary-box { border-top: none; }
.r-summary-total { background: #1565c0 !important; }

/* 구형 table 스타일 — 하위 호환 유지 */
.q-summary-table{
  width:260px;margin-top:12px;margin-left:auto;border-collapse:collapse;
}
.q-summary-table td{padding:5px 8px;font-size:12px;color:#374151;}
.q-summary-table td:last-child{text-align:right;}
.q-total-row td{font-weight:800;font-size:14px;color:#1B3A6B;border-top:2px solid var(--p-navy);padding-top:8px;}
.r-q-total-row td{font-weight:800;font-size:14px;color:#1a56a0;border-top:2px solid var(--r-primary);padding-top:8px;}
      .sv-info-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:14px;}
      .sv-info-box{border:1px solid #e2e8f0;border-radius:6px;overflow:hidden;}
      .sv-info-hd{background:#f1f5f9;padding:5px 10px;font-size:11px;font-weight:700;color:#1B3A6B;}
      .sv-info-body{padding:8px 12px;background:#fff;font-size:12px;min-height:40px;}
/* 화면 미리보기: modal-body → flex column (qdoc가 flex:1로 늘어나기 위한 조건) */
#modal-preview .modal-body,
#r-modal-preview .modal-body {
  display: flex !important;
  flex-direction: column !important;
}
#preview-content,
#r-preview-content {
  display: flex !important;
  flex-direction: column !important;
  flex: 1 !important;
  min-height: 0 !important;
  overflow-y: auto !important;
}
/* qdoc: preview-content(overflow-y:auto) 안에서 최소 100% 높이를 채워야
   margin-top:auto(q-bottom-fixed)가 하단에 붙음 */
#preview-content .qdoc,
#r-preview-content .qdoc {
  display: flex !important;
  flex-direction: column !important;
  flex: 1 0 auto !important;   /* 2026-11-02 줄어들지 않게 (예전 flex:1 → 창보다 길면 납품가능일·특이사항 상자가 눌려 사라짐) */
  min-height: 100% !important;
  box-sizing: border-box !important;
}



/* q-spacer: 화면·인쇄 모두 숨김 */
.q-spacer { display: none !important; }

/* 화면 미리보기: 합계+푸터 래퍼
   - 품목 적을 때: margin-top:auto → 하단으로 밀림
   - 품목 많을 때: qdoc가 늘어나므로 내용 아래 자연스럽게 붙음 */
.q-bottom-fixed {
  margin-top: auto;
  padding-top: 0;
  flex-shrink: 0;
}
/* 화면에서 푸터 바: 일반 흐름 */
.q-footer-bar { display: block; margin-top: 8px; border-top: 1px solid var(--border); padding: 8px 0 4px; text-align: center; font-size: 10px; color: #94a3b8; line-height: 1.6; }
.q-rental-info-box{background:#f0f8ff;border:1px solid var(--r-light);border-radius:8px;padding:10px 14px;margin-bottom:14px;}
.q-rental-info-grid{display:grid;grid-template-columns:1fr 1fr;gap:0;}
.q-rental-info-item .label{font-size:10px;color:var(--r-primary);font-weight:600;margin-bottom:2px;}
.q-rental-info-item .value{font-size:12px;font-weight:700;}
/* 스크롤바 */
::-webkit-scrollbar{width:5px;height:5px;}
::-webkit-scrollbar-track{background:transparent;}
::-webkit-scrollbar-thumb{background:#cbd5e1;border-radius:4px;}
.spinner{width:36px;height:36px;border:3.5px solid rgba(255,255,255,.25);border-top-color:#fff;border-radius:50%;animation:spin .8s linear infinite;}
@keyframes spin{to{transform:rotate(360deg)}}


/* ===== 모바일 반응형 ===== */
@media screen and (max-width: 768px) {
  .split-layout{flex-direction:column;overflow:visible;}
  .catalog-panel{height:260px;min-width:unset;flex-shrink:0;}
  .form-panel{flex:1;min-height:0;overflow:hidden;display:flex;flex-direction:column;}
  .top-tab{padding:0 12px;height:44px;font-size:12px;gap:4px;}
  .top-tabs{padding:0 8px;}
  /* 2026-10-09 머리 영역 규칙 제거 (core.css 위쪽 '머리 영역'으로 통합) */
  .h-logo-text .name{font-size:13px;}
  .h-badge{display:none;}
  .form-row{grid-template-columns:1fr!important;}
  /* q-party-grid: 768px에서는 건드리지 않음 (600px 이하에서만 처리) */
  .history-header{flex-direction:column;align-items:flex-start;gap:8px;}
  .data-table th, .data-table td{font-size:11px;padding:6px 4px;}
  .admin-card{padding:10px;}
  .qdoc{padding:16px 12px!important;}
  /* .q-header 좌우 유지 – row 유지 */
  .q-table th, .q-table td{font-size:11px;padding:5px 4px;}
  .q-summary-table td{font-size:12px;}
  .modal-box{width:96vw;max-height:92vh;}
  .btn{font-size:12px;padding:7px 12px;}
}

@media screen and (max-width: 480px) {
  .top-tab{padding:0 8px;font-size:11px;}
  .split-layout{gap:0;overflow:visible;}
  .catalog-panel{height:220px;flex-shrink:0;}
  .form-panel{flex:1;min-height:0;overflow:hidden;display:flex;flex-direction:column;}
  .form-section{padding:10px 12px;}
  .q-party-grid{gap:8px;}
  .qdoc { padding: 14px 10px; }
  .top-tab { padding: 0 8px; font-size: 11px; gap: 2px; }
  .sub-tab { padding: 0 10px; font-size: 11.5px; }
  .q-table th, .q-table td { padding: 5px 6px; font-size: 10.5px; }

}

/* ===== 모바일 최적화 (미리보기 및 전체) ===== */
@media screen and (max-width:600px) {
  .qdoc {
    padding:12px 10px !important;
    font-size:11px !important;
    min-width:unset !important;
    width:100% !important;
  }
  .qdoc .q-header {
    flex-direction:row !important;
    align-items:flex-start !important;
    gap:8px !important;
    justify-content:space-between !important;
  }
  .qdoc .q-header > div:first-child {
    flex:1 !important;
    min-width:0 !important;
  }
  .q-header-meta {
    flex-direction:column !important;
    align-items:flex-start !important;
    gap:3px !important;
  }
  .qdoc .q-logo-area img {
    height:36px !important;
  }
  .qdoc h1 {
    font-size:16px !important;
    letter-spacing:0 !important;
  }
  /* 수신/공급 박스: 모바일 2열 유지, 폰트/패딩 축소 */
  .q-party-grid {
    grid-template-columns: 1fr 1fr !important;
    gap: 5px !important;
  }
  .q-party-grid > div > div:first-child {
    padding: 4px 8px !important;
  }
  .q-party-grid > div > div:first-child span {
    font-size: 10px !important;
    letter-spacing: 0.06em !important;
  }
  .q-party-grid table {
    font-size: 10px !important;
  }
  .q-party-grid table td {
    padding: 2px 0 !important;
    font-size: 10px !important;
  }
  .q-table th, .q-table td {
    padding:4px 5px !important;
    font-size:10.5px !important;
    word-break:keep-all !important;
  }
  .q-summary-table {
    width:100% !important;
    margin-left:0 !important;
  }
  .q-summary-table td:last-child {
    text-align:right !important;
  }
  .q-rental-info-grid,
  [style*="grid-template-columns:1fr 1fr"],
  [style*="grid-template-columns: 1fr 1fr"] {
    grid-template-columns:1fr !important;
  }
  /* 납품/유효기간 · 특이사항 모바일 폰트 축소 */
  .q-info-hd-text { font-size:10px !important; }
  .q-info-label   { font-size:10px !important; min-width:50px !important; }
  .q-info-val     { font-size:10px !important; }
  .q-info-memo    { font-size:10px !important; }
  #preview-content.modal-body,
  #r-preview-content.modal-body {
    padding:0 !important;
  }
  .q-footer-bar {
    font-size:9px !important;
    line-height:1.6 !important;
  }
  .modal-content {
    width:95vw !important;
    max-width:95vw !important;
  }
  .modal-box.wide {
    width:100vw !important;
    max-width:100vw !important;
    max-height:100dvh !important;
    border-radius:0 !important;
    overflow:hidden !important;
  }
  /* 미리보기 모달 body: 스크롤 허용 */
  #modal-preview .modal-body,
  #r-modal-preview .modal-body {
    overflow-y:auto !important;
    overflow-x:auto !important;
    -webkit-overflow-scrolling:touch !important;
    padding:8px !important;
  }
  /* qdoc 내부 가로 넘침 방지 */
  #preview-content .qdoc,
  #r-preview-content .qdoc {
    min-width:0 !important;
    width:100% !important;
    box-sizing:border-box !important;
  }
  .modal-overlay.open {
    padding:0 !important;
    align-items:flex-start !important;
  }
  #preview-content, #r-preview-content {
    padding:0 !important;
    overflow-x:auto !important;
    -webkit-overflow-scrolling:touch !important;
  }
  .form-row {
    flex-direction:column !important;
    gap:6px !important;
  }
  .form-row > div {
    min-width:100% !important;
  }
  /* 2026-10-09 .items-table 11px 강제 → 1394줄 '견적 품목' 묶음으로 일원화 */
  .split-layout {
    flex-direction:column !important;
    overflow:visible !important;
  }
  .catalog-panel {
    height:220px !important;
    flex:none !important;
    flex-shrink:0 !important;
  }
  .form-panel {
    flex:1 !important;
    min-height:0 !important;
    overflow:hidden !important;
    display:flex !important;
    flex-direction:column !important;
  }
  /* form-scroll은 남은 공간 차지하며 스크롤 */
  .form-scroll {
    flex:1 !important;
    overflow-y:auto !important;
    min-height:0 !important;
  }
  /* 액션바: form-panel 하단에 고정 */
  .action-bar {
    flex-shrink:0 !important;
    position:sticky !important;
    bottom:0 !important;
    z-index:20 !important;
    background:#fff !important;
    box-shadow:0 -2px 8px rgba(0,0,0,.07) !important;
  }
  .top-tab {
    font-size:11px !important;
    padding:8px 10px !important;
  }
  /* 2026-10-09 모바일 머리 규칙(!important 포함) 제거 — core.css 위쪽 '머리 영역'으로 통합 */
  /* 모바일: 인쇄(PDF) 버튼 숨김 */
  .btn-desktop-only { display:none !important; }
}

/* ===== 관리자 서브패널 ===== */
.admin-sub-panel { display:none; flex:1; flex-direction:column; min-height:0; overflow:hidden; padding:0; }
.admin-sub-panel.active { display:flex; flex-direction:column; }
.admin-sub-tabs { display:flex; background:#fff; border-bottom:1.5px solid var(--border); padding:0 16px; flex-shrink:0; }
.admin-sub-tab { padding:0 18px; height:40px; font-size:12px; font-weight:600; color:#94a3b8; cursor:pointer; border:none; background:transparent; border-bottom:2.5px solid transparent; }
.admin-sub-tab:hover { color:#1B3A6B; }
.admin-sub-tab.active { color:#1B3A6B; border-bottom-color:#1B3A6B; }
.admin-card { background:#fff; border-radius:8px; border:1px solid var(--border); padding:0; overflow:hidden; display:flex; flex-direction:column; flex:1; margin:12px; }
.admin-card-header { display:flex; justify-content:space-between; align-items:center; padding:10px 16px; border-bottom:1px solid var(--border); flex-shrink:0; min-height:48px; }
/* admin-card 안의 page-toolbar */
.admin-card > .admin-card > .page-toolbar { border-radius:8px 8px 0 0; }

/* ── 렌탈 단위 토글 버튼 ─────────────────────── */
.rental-type-toggle {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
}
.rtt-btn {
  flex: 1;
  min-width: 70px;
  padding: 7px 12px;
  border: 1.5px solid var(--r-primary, #1B6B3A);
  border-radius: 6px;
  background: #fff;
  color: var(--r-primary, #1B6B3A);
  font-size: 12px;
  font-weight: 600;
  cursor: pointer;
  transition: all .15s;
  text-align: center;
}
.rtt-btn:hover {
  background: #e8f5ee;
}
.rtt-btn.active {
  background: var(--r-primary, #1B6B3A);
  color: #fff;
  border-color: var(--r-primary, #1B6B3A);
}

/* ===== .hidden 유틸리티 ===== */
.hidden { display: none !important; }

/* ===== 모달 오버레이 ===== */
.modal-overlay {
  display: none;
  position: fixed; inset: 0; z-index: 1000;
  background: rgba(0,0,0,.45);
  align-items: center; justify-content: center;
  overflow-y: auto; padding: 20px;
}
/* 견적서 미리보기 모달 — 영업 패널(z-index:1101) 위에 표시 */
#modal-preview, #r-modal-preview {
  z-index: 1200;
}
.modal-overlay.open {
  display: flex;
}
.modal-box {
  background: #fff;
  border-radius: 12px;
  width: 520px; max-width: 96vw;
  max-height: 90vh;
  display: flex; flex-direction: column;
  box-shadow: 0 20px 60px rgba(0,0,0,.22);
  overflow: hidden;
}
.modal-box.wide {
  width: 860px;
  max-width: 96vw;
  max-height: 94vh;
}

/* ===== 미리보기 모달 전용 크기 ===== */
.preview-modal-box {
  /* PC: 최대 900px, 화면 높이 95% */
  width: 900px !important;
  max-width: 94vw !important;
  height: 95dvh !important;
  max-height: 95dvh !important;
  border-radius: 12px !important;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}

/* 미리보기 overlay: PC에서 중앙 정렬 */
#modal-preview.modal-overlay,
#r-modal-preview.modal-overlay {
  align-items: center;
  justify-content: center;
  padding: 20px;
}

.modal-header {
  display: flex; justify-content: space-between; align-items: center;
  padding: 16px 20px;
  border-bottom: 1px solid var(--border);
  flex-shrink: 0;
}
.modal-header h2 { font-size: 15px; font-weight: 700; color: var(--p-navy); }
.modal-close {
  background: none; border: none; font-size: 18px;
  cursor: pointer; color: var(--muted); line-height: 1;
  padding: 4px 8px; border-radius: 4px;
  transition: background .15s;
}
.modal-close:hover { background: #f1f5f9; color: #334155; }
.modal-body {
  padding: 20px; overflow-y: auto; overflow-x: auto; flex: 1;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior: contain;
}
.modal-footer {
  padding: 14px 20px;
  border-top: 1px solid var(--border);
  display: flex; flex-direction: row; justify-content: flex-end; align-items: center; gap: 8px;
  flex-shrink: 0; background: #f8fafc;
}
.modal-footer .btn { flex: 0 0 auto; width: auto; }

/* ===== 고객사 선택 팝업 ===== */
.client-picker-box {
  width: 460px; max-width: 96vw;
  height: 560px; max-height: 82vh;
  min-height: 320px;
  display: flex; flex-direction: column;
}
.cpi-search-wrap {
  padding: 10px 16px 6px;
  border-bottom: 1px solid var(--border);
  flex-shrink: 0;
}
.cpi-search-input {
  width: 100%; font-size: 13px; padding: 8px 12px;
  border-radius: 8px;
}
.r-cpi-search-input:focus { border-color: var(--r-blue) !important; }
.cpi-body {
  flex: 1; overflow-y: auto; padding: 8px 0 !important;
  min-height: 0;
}
.cpi-loading, .cpi-empty {
  text-align: center; padding: 32px 16px;
  font-size: 12px; color: var(--muted);
}
.cpi-item {
  padding: 10px 16px; cursor: pointer;
  border-bottom: 1px solid #f1f5f9;
  transition: background .12s;
}
.cpi-item:last-child { border-bottom: none; }
.cpi-item:hover { background: #eef3fb; }
.r-cpi-item:hover { background: #eff6ff; }
.cpi-company {
  font-size: 13px; font-weight: 700; color: #1e293b;
  margin-bottom: 3px;
}
.cpi-detail {
  display: flex; flex-wrap: wrap; gap: 6px;
  font-size: 11.5px; color: #64748b;
}
.cpi-detail span::before { content: ''; }
.cpi-detail span + span::before { content: '·'; margin-right: 6px; }

/* section-title-row: 제목 + 버튼 한 줄 */
.section-title-row {
  display: flex; align-items: center;
  justify-content: space-between;
  margin-bottom: 8px;
}
.section-title-row .section-title,
.section-title-row .r-section-title { margin-bottom: 0 !important; }
/* client-pick-btn / r-client-pick-btn → section-action-btn 별칭 */
.client-pick-btn, .r-client-pick-btn { }
.client-pick-btn:hover, .r-client-pick-btn:hover { }

/* ===== 토스트 알림 ===== */
#toast {
  position: fixed; bottom: 24px; right: 24px;
  z-index: 9999;
  display: flex; flex-direction: column; gap: 8px;
  pointer-events: none;
}
.toast-item {
  padding: 10px 16px;
  border-radius: 8px;
  font-size: 13px; font-weight: 600;
  color: #fff;
  box-shadow: 0 4px 12px rgba(0,0,0,.18);
  animation: slideIn .25s ease;
  pointer-events: auto;
  max-width: 320px;
}
.toast-item.success { background: var(--success); }
.toast-item.error   { background: var(--danger); }
.toast-item.info    { background: var(--p-navy); }
@keyframes slideIn {
  from { transform: translateX(100%); opacity: 0; }
  to   { transform: translateX(0);    opacity: 1; }
}

/* ===== 이력 empty-state ===== */
.empty-state {
  display: flex; flex-direction: column;
  align-items: center; justify-content: center;
  padding: 40px 20px; color: var(--muted);
  font-size: 13px; gap: 10px; text-align: center;
}
.empty-state .icon { font-size: 36px; }

/* ===== 링크 복사 버튼 ===== */
.btn-link-copy {
  background: #f0f9ff; color: #0369a1;
  border: 1px solid #bae6fd; border-radius: 6px;
  padding: 4px 10px; font-size: 11px; font-weight: 600;
  cursor: pointer; transition: background .15s;
}
.btn-link-copy:hover { background: #e0f2fe; }

/* 링크 복사 버튼 */
.btn-link-copy{
  padding:3px 8px;font-size:11px;font-weight:600;
  background:#f0fdf4;color:#16a34a;border:1.5px solid #bbf7d0;
  border-radius:5px;cursor:pointer;transition:all .15s;
}
.btn-link-copy:hover{ background:#dcfce7;border-color:#86efac; }

/* 히스토리 헤더 */
.history-header { padding:12px 4px;border-bottom:1px solid #f1f5f9;margin-bottom:12px;
  display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:8px; }
.history-title, .r-history-title { font-size:14px;font-weight:700;color:#1e293b; }

/* 데이터 테이블 호버/마지막행 */
.data-table tr:hover td { background:#fafbff; }

/* 빈 상태 */
.empty-state { text-align:center;padding:40px 20px;color:#94a3b8; }
.empty-state .icon { font-size:32px;margin-bottom:8px; }

/* 미리보기 모달 테이블 overflow */
#preview-content, #r-preview-content { overflow-x:auto; }
.modal-body { overflow-x:auto; }

/* ===== 견적 추가 모달 공통 스타일 ===== */
.atq-product-info {
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  padding: 10px 14px;
  margin-bottom: 10px;
}
.atq-product-info .atq-name {
  font-size: 13px; font-weight: 700; color: #1B3A6B; margin-bottom: 3px; letter-spacing: -0.2px;
  display: flex; align-items: center; gap: 0;
}
.atq-product-info .atq-meta {
  font-size: 11px; color: #64748b; margin-bottom: 6px; font-weight: 600;
  display: flex; align-items: center; gap: 6px;
}
.atq-product-info .atq-spec {
  font-size: 10.5px; color: #64748b; line-height: 1.7;
  background: #fff; border-radius: 4px; padding: 6px 10px; margin-bottom: 0;
  white-space: normal; word-break: keep-all;
}
.atq-product-info .atq-feature {
  font-size: 10.5px; color: #94a3b8; line-height: 1.6; margin-top: 5px;
}
.atq-row-2col {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}
.atq-row-2col .form-group { margin-bottom: 0; }
.atq-row-2col label, .form-group > label {
  display: block; font-size: 12px; font-weight: 600;
  color: #475569; margin-bottom: 6px;
}