/* door-butler main+card 레이아웃 이식 (properties 전용):
   <main>(p-0) 안에서 shell 이 여백을 만들고, .properties-page 를 흰 rounded 카드로 감쌈. */
.prop-shell {
  height: 100%;
  box-sizing: border-box;
  padding: 16px;
  overflow: hidden;
  background: #e9edf2; /* 카드 뒤 여백 톤 (카드보다 살짝 어둡게) */
}

.properties-page {
  display: flex;
  flex-direction: column;
  height: 100%;
  min-height: 0;
  overflow: hidden;
}
/* 카드화 — rounded + soft shadow (door-butler --db-shadow-card-soft 대응) */
.prop-shell > .properties-page--erp {
  border: 1px solid #e2e8f0; /* 필터바+그리드를 하나로 묶는 카드 보더 */
  border-radius: 14px;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.05), 0 4px 12px rgba(15, 23, 42, 0.035); /* 하단 그림자 살짝 연하게 */
}

.properties-page--erp {
  background: #fff; /* 카드 배경 흰색 */
  color: #1e293b;
  font-family: var(--db-font-sans);
  margin: 0 !important;
  padding: 26px 16px 16px !important; /* 상단 26px, 나머지 16px */
  gap: 12px; /* 필터바와 그리드 사이 간격 */
  top: 0;
}

.hdr {
  background: #fff;
  border-bottom: 1px solid #e2e8f0;
  margin: 0 !important;
  padding: 0 24px;
  height: 46px;
  display: flex;
  align-items: center;
  gap: 10px;
  flex-shrink: 0;
}
.hdr--filters {
  border-top: none;
  border-bottom: none; /* 검색바(필터바) 아래 보더 줄 제거 */
  height: 40px;
  background: #fff; /* 필터바 공간도 흰색 (카드와 동일) */
  padding: 0; /* 카드 패딩이 여백 담당 — 개별 패딩 제거 */
  flex-shrink: 0;
}

@font-face {
  font-family: "Hakgyoansim Dunggeunmiso";
  src: url("/assets/HakgyoansimDunggeunmiso-R-9c519b65.otf") format("opentype");
  font-weight: 400;
  font-display: swap;
}
@font-face {
  font-family: "Hakgyoansim Dunggeunmiso";
  src: url("/assets/HakgyoansimDunggeunmiso-B-5265a793.otf") format("opentype");
  font-weight: 700;
  font-display: swap;
}
.logo { font-family: "Hakgyoansim Dunggeunmiso", "Wanted Sans Variable", "Wanted Sans", sans-serif; font-weight: 800; font-size: 16px; color: #1e40af; letter-spacing: -.3px; white-space: nowrap; text-decoration: none; cursor: pointer; }
.logo:hover { color: #1e3a8a; }
.sep { width: 1px; height: 18px; background: #e2e8f0; margin: 0 2px; }
.nav-links { display: flex; gap: 2px; }
/* 모바일 드래그 홀드(200ms)와 iOS 길게누름 링크 미리보기("새창")가 충돌 — 콜아웃/선택 차단.
   안드로이드 컨텍스트메뉴는 menu_order_controller가 터치 중에만 preventDefault.
   ⚠️ -webkit-user-drag: none 금지 — SortableJS 데스크톱 드래그가 네이티브 HTML5 DnD라
   드래그 시작 자체가 죽는다(2026-07-13 실측: 그 속성 하나로 메뉴 드래그 전면 먹통). */
.nav-links .nav-link { -webkit-touch-callout: none; -webkit-user-select: none; user-select: none; }
.nav-link { font-size: 12px; font-weight: 500; color: #64748b; padding: 5px 10px; border-radius: 5px; cursor: default; white-space: nowrap; background: none; border: none; font-family: inherit; }
.nav-link:hover { background: #f1f5f9; color: #1e293b; }
.nav-link.active { background: #1e40af; color: #fff; font-weight: 600; }

/* ── door-butler-web_v1 이식: --db-* 토큰(라이트) + db-select + db-btn (HTML/CSS 동일) ── */
:root {
  --db-font-sans: 'Wanted Sans Variable', 'Wanted Sans', system-ui, sans-serif;
  --db-color-card: #FFFFFF;
  --db-color-bg-alt: #F4F4F5;
  --db-color-text: #1D1B20;
  --db-color-text-sub: #70737C;
  --db-color-primary: #306AFF;
  --db-color-primary-hover: #2B5FE6;
  --db-color-primary-pressed: #2655CC;
  --db-color-on-primary: #FFFFFF;
  --db-color-outline: rgba(112,115,124,0.22);
  --db-color-fill-subtle: rgba(112,115,124,0.05);
  --db-color-fill-light: rgba(112,115,124,0.08);
  --db-color-fill-medium: rgba(112,115,124,0.16);
  --db-text-label-2: 500 12px/1.385 var(--db-font-sans);
  --db-text-body-2: 500 15px/1.467 var(--db-font-sans); /* door-butler-web_v1 이식 — 우클릭 메뉴 폰트 */
  --db-radius-xs: 4px;
  --db-radius-input: 10px;
  --db-radius-md: 12px; /* door-butler-web_v1 이식 — M3 medium (우클릭 메뉴 radius) */
  --db-radius-btn: 10px;
  --db-shadow-overlay: 0 16px 40px rgba(0,0,0,.12), 0 4px 12px rgba(0,0,0,.08);
  --db-space-2: 8px;
  --db-duration-fast: 150ms;
}

/* 커스텀 셀렉트 (button + panel) */
.db-select-wrap { position: relative; display: inline-block; }
/* native <select> 숨김 — JS 미연결/캐시 시에도 커스텀 버튼과 이중 렌더 방지(값은 유지) */
.db-select-wrap > select[data-db-select-target="native"] { display: none; }
.db-select-button {
  display: flex; align-items: center; gap: 6px;
  /* 높이 = 공용 검색바 인풋(height:32px)과 동일 정렬. box-sizing:border-box 로 보더 포함 32px 고정. */
  height: 32px; box-sizing: border-box;
  width: 100%; padding: 0 30px 0 10px;
  background-color: var(--db-color-card);
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12' fill='none' stroke='%2370737C' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'><polyline points='2.5,4.5 6,8 9.5,4.5'/></svg>");
  background-repeat: no-repeat; background-position: right 10px center; background-size: 12px;
  border: 1px solid var(--db-color-outline);
  border-radius: var(--db-radius-input);
  font: var(--db-text-label-2); color: var(--db-color-text);
  text-align: left; cursor: pointer; outline: none;
  transition: border-color var(--db-duration-fast), box-shadow var(--db-duration-fast);
}
.db-select-wrap .db-select-button:hover { background-color: var(--db-color-fill-medium); }
.db-select-button:focus,
.db-select--open .db-select-button { border-color: var(--db-color-outline); }
.db-select-panel {
  position: absolute; top: calc(100% + 4px); left: 0;
  min-width: 100%; max-height: 280px; overflow-y: auto; overflow-x: hidden;
  /* 스크롤 체이닝 차단 — 패널이 사이드바(overflow-y:auto) 자식이라, 없으면 휠이 사이드바로 새어
     스크롤/reposition churn 으로 패널이 닫힘. contain 으로 내부 스크롤에 가둠. */
  overscroll-behavior: contain;
  /* 스크롤바 숨김 — 스크롤 기능(overflow-y:auto)은 유지, 바만 감춘다.
     (닫힘 버그는 lib/single_dropdown.js 스크롤 리스너 가드로 해결됨 — 스크롤바 유무와 무관.) */
  scrollbar-width: none; -ms-overflow-style: none;
  background: var(--db-color-card); border: 1px solid var(--db-color-outline);
  border-radius: var(--db-radius-input); box-shadow: var(--db-shadow-overlay);
  padding: 4px; z-index: 50; box-sizing: border-box;
}
.db-select-panel::-webkit-scrollbar { display: none; }
.db-select__option {
  display: flex; align-items: center; gap: 8px;
  padding: 6px 10px; border-radius: var(--db-radius-xs);
  font: var(--db-text-label-2); color: var(--db-color-text);
  cursor: pointer; white-space: nowrap;
  overflow: hidden; text-overflow: ellipsis;
}
.db-select__option:hover { background: var(--db-color-fill-subtle); }
.db-select__option--selected { color: var(--db-color-primary); font-weight: 600; }
.db-select__option--selected::after { content: "✓"; margin-left: auto; color: var(--db-color-primary); }

/* Tabulator list 드롭다운 + 우클릭 메뉴 CSS는 공용 컴포넌트로 분리 →
   app/assets/stylesheets/shared_tabulator_popup.css (정본 1곳). 여기엔 두지 않는다. */

/* 메모·비고·특이사항(c-note-cell) 편집 시 브라우저 기본 파란 아웃라인 제거 */
.c-note-cell textarea,
.c-note-cell input,
.c-note-cell textarea:focus,
.c-note-cell input:focus {
  outline: none !important;
  box-shadow: none !important;
}

/* 공용 인풋 (텍스트/숫자/textarea) — 셀렉박스(.db-select-button)와 동일 토큰·패딩·높이.
   정본 1곳: 폼 인풋은 이 클래스만 쓴다. (인라인 스타일 금지) */
.db-input {
  width: 100%; box-sizing: border-box; margin-top: 2px;
  padding: 6px 10px;
  border: 1px solid var(--db-color-outline);
  border-radius: var(--db-radius-input);
  /* 폼 컨트롤은 font-family 를 상속 안 함 — Tailwind preflight 없는 화면(독립 팝업 등)에서
     UA 기본(textarea=monospace)으로 떨어지는 것 방지. 공용 컴포넌트 자립. */
  font-family: inherit;
  font-size: 12px; font-weight: 500; line-height: 1.385; /* 셀렉박스 line-height 와 동일 → 높이 일치 */
  color: var(--db-color-text);
  background-color: var(--db-color-card);
  outline: none;
  transition: border-color var(--db-duration-fast);
}
/* 인풋 높이 = 셀렉박스(.db-select-button)와 동일 32px 정렬. textarea 는 제외(여러 줄 높이 보존). */
input.db-input, select.db-input { height: 32px; }
.db-input::placeholder { color: var(--db-color-text-sub); }

/* 공용 체크박스는 shared_checkbox.css(.db-checkbox = label+SVG 토글, shared/_db_checkbox) 로 이관. 기존 native accent 방식(미사용)은 삭제. */

/* 커스텀 우클릭 컨텍스트 메뉴 (고객 리스트 등) — --db 토큰 룩. JS(clients_nav_controller)가 커서 위치에 띄운다. */
.clients-ctx-menu {
  position: fixed; z-index: 2000;
  min-width: 160px; padding: 4px;
  background: var(--db-color-card); border: 1px solid var(--db-color-outline);
  border-radius: var(--db-radius-input); box-shadow: var(--db-shadow-overlay);
}
.clients-ctx-menu__item {
  display: flex; align-items: center; gap: 8px; width: 100%;
  padding: 8px 12px; border: none; background: none;
  font: var(--db-text-label-2); color: var(--db-color-text);
  text-align: left; border-radius: var(--db-radius-xs); cursor: pointer;
}
.clients-ctx-menu__item:hover { background: var(--db-color-fill-subtle); }
.clients-ctx-menu__item--danger { color: #dc2626; }
.clients-ctx-menu__item--danger:hover { background: rgba(220, 38, 38, 0.08); }

/* 거래유형 토글 버튼(체크박스 대체) — 인풋과 동일 높이/보더/라운드. active=남색. 다중선택. */
.rc-deal-type-btn {
  box-sizing: border-box;
  padding: 6px 12px;
  border: 1px solid var(--db-color-outline);
  border-radius: var(--db-radius-input);
  background: var(--db-color-card); color: var(--db-color-text-sub);
  font-size: 12px; line-height: 1.385; cursor: pointer;
  transition: background var(--db-duration-fast), border-color var(--db-duration-fast), color var(--db-duration-fast);
}
.rc-deal-type-btn:hover { background: var(--db-color-fill-subtle); }
.rc-deal-type-btn.active {
  background: #1e40af; border-color: #1e40af; color: #fff; font-weight: 600;
}
/* 클릭(포커스) 시 파란 아웃라인/보더 하이라이트 제거 — 기본 보더색 유지 */
.db-input:focus {
  outline: none !important;
  box-shadow: none !important;
  border-color: var(--db-color-outline) !important;
}

/* 버튼 (검색바 검색/초기화 등) */
.db-btn {
  height: 32px; box-sizing: border-box; padding: 0 10px;
  border-radius: var(--db-radius-btn); font: var(--db-text-label-2); font-family: inherit;
  cursor: pointer; border: 1px solid transparent; white-space: nowrap;
  display: inline-flex; align-items: center; justify-content: center;
  -webkit-appearance: none; appearance: none; text-decoration: none; line-height: 1;
}
.db-btn-primary {
  background: var(--db-color-primary) !important; color: var(--db-color-on-primary) !important;
  border-color: var(--db-color-primary) !important;
}
.db-btn-primary:hover { background: var(--db-color-primary-hover) !important; border-color: var(--db-color-primary-hover) !important; }
.db-btn-primary:active { background: var(--db-color-primary-pressed) !important; border-color: var(--db-color-primary-pressed) !important; }
.db-btn-secondary { background: var(--db-color-fill-light); color: var(--db-color-text-sub); text-decoration: none; }
.db-btn-secondary:hover { background-color: var(--db-color-fill-medium); }

/* 공용 confirm 모달 (window.dbConfirm / dbAlert — 삭제 확인 등). db_confirm.js 참조. */
.db-confirm-modal__overlay {
  position: fixed; inset: 0; z-index: 10000;
  background: rgba(15, 23, 42, 0.45);
  display: flex; align-items: center; justify-content: center; padding: 16px;
}
.db-confirm-modal {
  background: var(--db-color-card, #fff);
  border-radius: 14px;
  box-shadow: var(--db-shadow-overlay);
  padding: 20px; min-width: 300px; max-width: 420px;
  display: flex; flex-direction: column; gap: 8px; /* 본문↔버튼 등 세로 간격 축소 */
  font-family: var(--db-font-sans);
}
.db-confirm-modal__title { font-size: 14px; font-weight: 600; color: #1e293b; }
.db-confirm-modal__body { font-size: 14px; color: #334155; white-space: pre-wrap; line-height: 1.5; margin-top: -4px; /* 제목↔본문 위쪽 살짝 띄움(카드 gap 8px 중 4px만 상쇄) */ }
.db-confirm-modal__actions { display: flex; justify-content: flex-end; gap: 8px; }
/* confirm 모달 확인 버튼 = 남색(#1e40af). danger variant 는 아래 규칙이 빨강으로 덮음(뒤에 옴). */
/* dbConfirm 이 열리며 확인 버튼을 auto-focus → 브라우저 기본 outline(검정 보더) 제거 */
.db-confirm-modal .db-btn:focus, .db-confirm-modal .db-btn:focus-visible { outline: none; box-shadow: none; }
.db-confirm-modal .db-btn-primary { background: #1e40af !important; border-color: #1e40af !important; }
.db-confirm-modal .db-btn-primary:hover { background: #1e3a8a !important; border-color: #1e3a8a !important; }
.db-confirm-modal--danger .db-confirm-modal__title { color: #dc2626; }
.db-confirm-modal--danger .db-btn-primary { background: #dc2626 !important; border-color: #dc2626 !important; }
.db-confirm-modal--danger .db-btn-primary:hover { background: #b91c1c !important; border-color: #b91c1c !important; }
/* 고객 정보 모달 연락처 입력 — 값은 Pretendard monospace(숫자 정렬), placeholder(한글)는 본문 sans 폰트로. */
.cust-tel-input::placeholder { font-family: var(--db-font-sans); }

/* 공용 액션 버튼 (shared/_action_button) — 배경색은 --btn-color 로 변경 가능, hover 자동 */
.db-action-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 4px;
  height: 32px; padding: 0 12px; box-sizing: border-box;
  border: none; border-radius: var(--db-radius-btn); /* .db-btn(10px)과 radius 통일 — 닫기/저장 동일 */
  background: var(--btn-color, #1e40af); color: #fff;
  font: var(--md-sys-typescale-label-medium); font-family: inherit; font-size: 12px; font-weight: 600;
  cursor: pointer; user-select: none; white-space: nowrap;
  transition: filter 0.12s;
}
.db-action-btn:hover { filter: brightness(0.92); }
.db-action-btn:active { filter: brightness(0.85); }

/* 로딩 오버레이 — Tabulator 5.6.1 은 .tabulator-alert / .tabulator-alert-msg 를 씀(.tabulator-loader 아님).
   기본 흰 박스 + 검정 4px 보더(.tabulator-alert-state-msg)를 제거하고 어두운 오버레이만 남긴다. */
.tabulator .tabulator-alert { background: rgba(15,23,42,0.32) !important; align-items: center !important; justify-content: center !important; }
.tabulator .tabulator-alert .tabulator-alert-msg,
.tabulator .tabulator-alert .tabulator-alert-msg.tabulator-alert-state-msg,
.tabulator .tabulator-alert .tabulator-alert-msg.tabulator-alert-state-error {
  padding: 0 !important; margin: 0 !important;
  border: 0 none !important; border-radius: 0 !important;
  background: none !important; background-color: transparent !important; box-shadow: none !important;
  color: #fff !important; font-weight: 600 !important;
}
.ds-loader { display: flex; flex-direction: column; align-items: center; gap: 14px; }
/* 매물등록 모달 로딩 — 공용 ds-spinner 재사용. 밝은 배경이라 흰 바 대신 slate + 상하 여백 */
.register-loading { padding: 48px 0; }
.register-loading .ds-spinner i { background: #94a3b8; }
.register-loading .ds-loading-text { font-size: 12px; color: #94a3b8; }
.ds-spinner { position: relative; width: 60px; height: 60px; animation: ds-spin 1s steps(12, end) infinite; }
.ds-spinner i { position: absolute; top: 4px; left: calc(50% - 2px); width: 4px; height: 13px; border-radius: 4px; background: #fff; transform-origin: 2px 26px; }
.ds-spinner i:nth-child(1)  { transform: rotate(0deg);   opacity: 1;   }
.ds-spinner i:nth-child(2)  { transform: rotate(30deg);  opacity: .92; }
.ds-spinner i:nth-child(3)  { transform: rotate(60deg);  opacity: .84; }
.ds-spinner i:nth-child(4)  { transform: rotate(90deg);  opacity: .75; }
.ds-spinner i:nth-child(5)  { transform: rotate(120deg); opacity: .66; }
.ds-spinner i:nth-child(6)  { transform: rotate(150deg); opacity: .57; }
.ds-spinner i:nth-child(7)  { transform: rotate(180deg); opacity: .48; }
.ds-spinner i:nth-child(8)  { transform: rotate(210deg); opacity: .40; }
.ds-spinner i:nth-child(9)  { transform: rotate(240deg); opacity: .33; }
.ds-spinner i:nth-child(10) { transform: rotate(270deg); opacity: .27; }
.ds-spinner i:nth-child(11) { transform: rotate(300deg); opacity: .21; }
.ds-spinner i:nth-child(12) { transform: rotate(330deg); opacity: .15; }
.ds-loading-text { color: #fff; font-size: 13px; font-weight: 600; letter-spacing: 1px; font-family: "Wanted Sans Variable", "Wanted Sans", sans-serif; }
@keyframes ds-spin { to { transform: rotate(360deg); } }

.deal-tabs { display: flex; gap: 2px; }
.deal-tab { font-size: 11px; color: #64748b; padding: 4px 10px; border-radius: 5px; cursor: pointer; white-space: nowrap; font-weight: 500; border: 1px solid transparent; }
.deal-tab:hover { background: #f8fafc; color: #1e293b; }
.deal-tab.active { border-color: #1e40af; color: #1e40af; font-weight: 700; background: #eff6ff; }

.spacer { flex: 1; }
.register-btn {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  height: 32px; /* 셀렉박스(db-select)와 동일 높이 */
  padding: 0 10px;
  border-radius: var(--md-sys-shape-sm);
  border: none; /* 보더 제거 */
  background: #1e40af; /* 남색 (로고·nav와 동일) */
  color: #fff;
  font: var(--md-sys-typescale-label-medium);
  box-shadow: var(--md-sys-elevation-0);
  cursor: pointer;
  user-select: none;
  transition: background-color var(--md-sys-motion-short) var(--md-sys-motion-standard),
              box-shadow var(--md-sys-motion-short) var(--md-sys-motion-standard);
}
.register-btn:hover {
  background: #1e3a8a; /* hover 시 더 진한 남색 */
  box-shadow: var(--md-sys-elevation-1);
}
.register-btn:active {
  background: #172f6f;
  box-shadow: var(--md-sys-elevation-0);
}
.register-btn .material-symbols-outlined {
  font-size: 14px;
  line-height: 1;
}
.search-wrap { position: relative; }
.search-wrap input { width: 320px; height: 28px; border: 1px solid #e2e8f0; border-radius: 5px; padding: 0 8px 0 26px; font-size: 11px; font-family: inherit; outline: none; transition: all .15s; }
.search-wrap input:focus { border-color: #3b82f6; width: 400px; }
.search-wrap::before { content: "\2315"; position: absolute; left: 7px; top: 50%; transform: translateY(-50%); color: #94a3b8; font-size: 12px; }
.user-chip { font-size: 10px; color: #94a3b8; }

.sub-hdr { display: flex; align-items: center; padding: 6px 16px; flex-shrink: 0; gap: 8px; }
.crumb { font-size: 11px; color: #94a3b8; }
.crumb b { color: #1e293b; font-weight: 600; }
.crumb .s { margin: 0 5px; color: #cbd5e1; }
.count-label { margin-left: auto; font-size: 11px; color: #64748b; }
.count-label b { color: #1e40af; font-weight: 700; }
.count-label-inline { margin-left: 8px; font-size: 12px; }
.src-label { font-size: 9px; color: #94a3b8; background: #f1f5f9; padding: 2px 6px; border-radius: 3px; }

.status-chips { display: flex; gap: 2px; flex-wrap: wrap; }
.status-chip { font-size: 10px; color: #64748b; padding: 2px 7px; border-radius: 4px; cursor: pointer; font-weight: 500; border: 1px solid transparent; }
.status-chip:hover { background: #f8fafc; }
.status-chip.active { border-color: #059669; color: #059669; font-weight: 700; background: #ecfdf5; }
.sub-actions { display: flex; align-items: center; gap: 10px; margin-left: 0; }
.sub-sep { width: 1px; height: 20px; background: #e2e8f0; }

.view-toggle { display: inline-flex; gap: 2px; }
.view-toggle-btn {
  display: inline-flex; align-items: center; justify-content: center;
  width: 28px; height: 28px; border-radius: 4px;
  color: #94a3b8; cursor: pointer; text-decoration: none;
  transition: background 0.15s, color 0.15s;
}
.view-toggle-btn:hover { background: #f1f5f9; color: #475569; }
.view-toggle-btn.active { background: #1e40af; color: #fff; }
.view-toggle-btn .material-symbols-outlined { font-size: 18px; }

.grid-wrap {
  flex: 1;
  min-height: 0;
  display: flex;
  overflow: hidden;
  padding: 0; /* 카드 uniform 패딩이 여백 담당 */
}
#grid {
  flex: 1;
  min-height: 0;
  height: 100%;
  border: 1px solid #e2e8f0; /* 데이터 그리드 영역 정의 (카드 패딩 안의 패널) */
  border-radius: 8px;
  overflow: hidden;
  background: #f1f5f9;
}

.c-price { font-weight: 600; color: #b45309; }
.c-area { color: #0f766e; }
.c-phone { color: #1e293b; font-size: 12px; font-family: var(--db-font-sans); }
.c-date { color: #475569; font-size: 12px; font-weight: 500; }
.c-date-miss { color: #cbd5e1; font-size: 12px; font-style: italic; }
.c-memo { color: #64748b; font-size: 12px; overflow: visible; text-overflow: clip; white-space: nowrap; }
.c-spec { color: #7c3aed; font-size: 12px; }
.c-loc { font-weight: 500; display: block; max-width: 100%; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.c-unit { color: #6366f1; font-weight: 600; }

.bd { display: inline-block; padding: 2px 6px; border-radius: 4px; font-size: 10px; font-weight: 600; }
.bd-s { background: #fef3c7; color: #92400e; }
.bd-r { background: #dbeafe; color: #1e40af; }
.bd-u { background: #ede9fe; color: #6d28d9; }

.tabulator { border: none !important; font-family: var(--db-font-sans) !important; font-size: 12px !important; }
.tabulator .tabulator-header { background: #f8fafc !important; border-bottom: 2px solid #e2e8f0 !important; }
.tabulator .tabulator-header .tabulator-col { border-right: 1px solid #e2e8f0 !important; }
.tabulator .tabulator-header .tabulator-col-content { padding: 5px 6px !important; }
.tabulator .tabulator-col-title { font-weight: 700 !important; font-size: 12px !important; color: #0f172a !important; }
/* 빈 목록 placeholder("데이터 없음") — 기본 bold(700) → 500 */
.tabulator .tabulator-placeholder .tabulator-placeholder-contents { font-weight: 500 !important; }
/* 상세행 저장상태 뱃지(되돌리기 버튼 옆) — 저장 메시지가 없을 땐 배경/패딩까지 안 보이게 */
.save-status-badge:empty { display: none !important; }
/* 되돌리기 버튼 클릭/포커스 시 검정 포커스 링(outline·box-shadow) 완전 제거 — 전역 !important 규칙 무력화 */
.detail-undo-btn,
.detail-undo-btn:hover,
.detail-undo-btn:focus,
.detail-undo-btn:focus-visible,
.detail-undo-btn:active {
  outline: none !important;
  box-shadow: none !important;
  -webkit-tap-highlight-color: transparent !important;
}
.tabulator .tabulator-row { border-bottom: 1px solid #f1f5f9 !important; min-height: 40px !important; }
.tabulator .tabulator-row:hover,
.tabulator .tabulator-row.tabulator-row-even:hover,
.tabulator .tabulator-row.tabulator-row-odd:hover { background: #f1f5f9 !important; }
.tabulator .tabulator-row .tabulator-cell { padding: 4px 6px !important; border-right: 1px solid #f1f5f9 !important; font-size: 12px !important; line-height: 1.3 !important; }
.tabulator .tabulator-col-title,
.tabulator .tabulator-row .tabulator-cell {
  text-overflow: clip !important;
}
.tabulator .tabulator-row.tabulator-row-even { background: #fff !important; }
.tabulator .tabulator-row.tabulator-row-odd { background: #fafbfc !important; }
.tabulator .tabulator-footer { display: none !important; }
/* 그리드 하단(마지막 행 아래) 빈 영역 색 = 좌우 여백색(#f1f5f9)과 동일하게 통일.
   행은 각자 배경(#fff/#fafbfc)을 가지므로 데이터 영역은 유지, 빈 띠만 여백색으로 blend. */
.tabulator, .tabulator .tabulator-tableholder { background: #f1f5f9 !important; }
/* 타뷸레이터 내부 스크롤 유지 + 스크롤바 시각 숨김 (세로·가로 모두). */
.tabulator .tabulator-tableholder { overflow: auto !important; scrollbar-width: none !important; -ms-overflow-style: none !important; }
.tabulator .tabulator-tableholder::-webkit-scrollbar { width: 0 !important; height: 0 !important; display: none !important; }

/* 연결매물(자식) 그리드는 좁은 폼 폭에 12컬럼이 들어가 항상 가로로 넘친다 — 위 전역 숨김 규칙을
   이 그리드에서만 되돌려 가로 스크롤바를 보이게 한다(세로는 전역 규칙 그대로 숨김 유지).
   register_window.html.erb/new.html.erb/edit.html.erb 3곳 공유(dsv2_property_children_controller.js
   connect()가 gridTarget에 이 클래스를 부여, 2026-07-16 양희 요청). */
.dsv2-linked-grid .tabulator-tableholder {
  scrollbar-width: thin !important;
}
.dsv2-linked-grid .tabulator-tableholder::-webkit-scrollbar:horizontal {
  height: 8px !important;
  display: block !important;
}
.dsv2-linked-grid .tabulator-tableholder::-webkit-scrollbar-thumb {
  background: #cbd5e1 !important;
  border-radius: 4px !important;
}
.dsv2-linked-grid .tabulator-tableholder::-webkit-scrollbar-track {
  background: transparent !important;
}

.tabulator .tabulator-page.active { background: #1e40af !important; color: #fff !important; }

.property-detail-expand,
.property-detail-expand .tabulator {
  border-radius: 0 !important;
}

/* 7: 상세 tabulator = 상위 tabulator 완전 동일. 전용 override(darker header·회색배경·그림자) 제거 →
   전역 .tabulator 규칙(header #f8fafc, row #fff/#fafbfc, cell 1px #f1f5f9) 그대로 상속.
   1(구 6-1) 접수일자 시작정렬(padding-left 36px)만 유지, 배경은 상위 그리드영역과 동일한 흰색. */
.property-detail-expand {
  border: 1px solid #e2e8f0 !important;
  background: #fff;
  padding-left: 0; /* 좌측 공백 제거 — 접수일자 정렬 offset은 서브테이블 spacer 선두컬럼(DETAIL_LEADING_SPACER)이 담당해 표가 좌측끝까지 채워짐 */
}
/* 하위 tabulator 그림자 끄기 — .tabulator 에 걸린 M3 elevation box-shadow 가 스택된 서브테이블에서 노출됨.
   상위 그리드는 #grid overflow:hidden 으로 클리핑돼 평평 → 서브테이블도 평평하게(상위 복제). */
.property-detail-expand .tabulator {
  box-shadow: none !important;
  border: 1px solid #f1f5f9 !important; /* 5: 상세 서브테이블 바깥 프레임 — 내부 셀 border(#f1f5f9)와 동일색. !important 로 전역 .tabulator{border:none!important}(L162) override */
}

/* 6: 편집 중 input 을 엑셀처럼 넓게 — 좁은 컬럼도 값 전체가 보이도록.
   좁은 셀에선 input 이 셀 밖으로 넘쳐 인접 셀 위에 표시(overflow:visible + z-index),
   넘친 부분이 인접 셀을 가리도록 불투명 흰 배경. 넓은 셀(≥240px)은 그대로 100%. */
#grid .tabulator-cell.tabulator-editing {
  overflow: visible !important;
  z-index: 60 !important;
}
#grid .tabulator-cell.tabulator-editing input {
  /* 폭은 JS(cellEditing)가 값 길이에 맞춰 인라인 설정(content-fit). 여기선 배경만 불투명(넘친 부분이 인접 셀 가리게). */
  box-sizing: border-box;
  background: #fff !important;
}