/*
 * DB상세 «이관요청» 행 + 모달 (2026-10-11, 2단계) — 아이콘 없이 글자만.
 * 동작 = Stimulus transfer-request-form / 파셜 = workspace/_db_list_transfer_row · _db_list_transfer_request_modal. 색은 전부 테마 토큰.
 */
/* ---- 고객정보 › 이관요청 행 ---- */
.dtr-line { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.dtr-btn { padding: 3px 12px; border: 1.5px solid var(--ord-tint-red-fg); border-radius: 999px; background: var(--ord-surface); color: var(--ord-tint-red-fg); font-size: 12px; font-weight: 700; cursor: pointer; }
.dtr-btn:hover:not([disabled]) { background: var(--ord-tint-red-bg); }
.dtr-btn[disabled] { opacity: .5; cursor: not-allowed; border-color: var(--ord-line-2); color: var(--ord-text-3); }
.dtr-hint { font-size: 11px; color: var(--ord-text-3); font-weight: 500; }
.dtr-text { font-size: 12px; color: var(--ord-text-2); font-weight: 500; }
.dtr-chip { display: inline-flex; padding: 2px 10px; border-radius: 999px; font-size: 11.5px; font-weight: 700; }
.dtr-chip.is-done { background: var(--ord-tint-green-bg); color: var(--ord-tint-green-fg); }
.dtr-chip.is-no { background: var(--ord-band); color: var(--ord-text-3); }
.dtr-share { margin-top: 5px; padding: 6px 10px; background: var(--ord-tint-violet-bg); border: 1px solid var(--ord-tint-violet-line); border-radius: 8px; color: var(--ord-tint-violet-fg); font-size: 11.5px; font-weight: 500; line-height: 1.55; }

/* ---- 모달 본문 ---- */
.dtr-modal { padding: 16px; background: var(--ord-surface); }
.dtr-lbl { font-size: 11.5px; font-weight: 800; color: var(--ord-text-3); margin: 12px 0 5px; }
.dtr-lbl:first-child { margin-top: 0; }
.dtr-sub { font-size: 11px; font-weight: 500; color: var(--ord-text-4); }
.dtr-chips { display: flex; flex-wrap: wrap; gap: 6px; }
.dtr-pick { padding: 6px 14px; border: 1.5px solid var(--ord-line); border-radius: 999px; background: var(--ord-surface); color: var(--ord-text-2); font-size: 12.5px; font-weight: 700; cursor: pointer; }
.dtr-pick:hover { border-color: var(--ord-accent); }
.dtr-pick.is-on { border-color: var(--ord-tint-red-fg); background: var(--ord-tint-red-bg); color: var(--ord-tint-red-fg); }
.dtr-seg { display: inline-flex; padding: 3px; gap: 2px; background: var(--ord-surface); border: 1px solid var(--ord-line); border-radius: 999px; }
.dtr-seg button { border: 0; background: transparent; border-radius: 999px; padding: 5px 14px; font-size: 12.5px; font-weight: 700; color: var(--ord-text-3); cursor: pointer; }
.dtr-seg button.is-on { background: var(--ord-head-bg); color: var(--ord-on-solid); }
.dtr-fixed { font-size: 12.5px; font-weight: 700; color: var(--ord-text); }
.dtr-input { width: 100%; padding: 8px 10px; border: 1px solid var(--ord-line-2); border-radius: 8px; font-size: 12.5px; background: var(--ord-input-bg); color: var(--ord-text); outline: none; box-sizing: border-box; }
.dtr-input:focus { border-color: var(--ord-accent); box-shadow: 0 0 0 3px var(--ord-focus-ring); }
.dtr-ratio { border: 1px solid var(--ord-line); border-radius: 10px; padding: 10px 12px; background: var(--ord-surface-2); }
.dtr-bar { display: flex; height: 22px; border-radius: 999px; overflow: hidden; margin: 8px 0; font-size: 11px; font-weight: 800; color: var(--ord-on-solid); }
.dtr-bar i { display: flex; align-items: center; justify-content: center; font-style: normal; transition: width .15s; min-width: 0; overflow: hidden; }
.dtr-bar .is-me { background: var(--ord-solid-blue); }
.dtr-bar .is-other { background: var(--ord-solid-gray); }
.dtr-range { width: 100%; accent-color: var(--ord-accent); }

/* 방식 보조 설명(.dtr-desc)은 «간편» 레이어 [이관요청] 탭에서만 보인다(_db_history_preview.css) — 모달은 숨김 */
.dtr-seg .dtr-desc { display: none; }

/* DB리스트 NO 컬럼 배지 — «공유중»(보라) / «이관»(파랑). 번호 셀의 텍스트를 JS 가 바꿔도 남도록 ::after 로 그린다. */
td[data-no-badge]::after {
  content: attr(data-no-badge);
  display: block;
  width: fit-content;
  margin: 3px auto 0;
  padding: 1px 6px;
  border-radius: 8px;
  font-size: 9px;
  font-weight: 700;
  background: var(--ord-tint-violet-bg);
  color: var(--ord-tint-violet-fg);
}
td[data-no-badge-kind="transfer"]::after {
  background: var(--ord-tint-blue-bg);
  color: var(--ord-tint-blue-fg);
}