/* 공용컴포넌트 · 뱃지(badge) shape — 상태/라벨 등 pill 형태의 공통 룩.
 *
 * 대상: Tabulator 상태 컬럼 등 JS 포매터가 렌더하는 뱃지.
 * 색은 동적(STATUS_STYLE 등)이라 인라인 style 로 background/color 를 주고,
 * 모양(shape: inline-flex·padding·radius·font)만 이 클래스가 공용으로 담당한다.
 *
 * 사용(JS 포매터):
 *   `<span class="db-badge" style="background:${bg};color:${fg}">${label}</span>`
 *
 * 정본: 이 파일 1곳. 뱃지 shape 를 다른 곳에 인라인으로 중복 정의하지 않는다.
 */
.db-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  line-height: 1;
  padding: 4px 8px;
  border-radius: 10px;
  font-size: 12px;
  font-weight: 700;
  background: #e2e8f0; /* fallback — 색 미지정 시 */
  color: #475569;
}

/* --sm : 표/그리드 행 안에 들어가는 작은 뱃지 (조이 확정 2026-07-27).
 *
 * 치수 출처 = 매물 그리드 의뢰상태 배지가 쓰던 인라인 오버라이드(2px 6px / 10px / 1.2 / 600).
 * 그 값의 근거: dsv2 grid 행높이 36px(content-box ~28px)에서 2행 배지가 수직 클리핑되지 않는
 * 실측 최소치(기본값이면 2행 42px > 28px). 이제 그 인라인을 지우고 이 클래스로 흡수했다.
 *
 * radius 만 기본(10px pill)과 다르게 4px = "네모" — 표 셀 안에서 각진 룩이 정렬돼 보인다.
 * 기본 .db-badge(10px pill)는 카드/설정 화면 쪽이 계속 쓰므로 건드리지 않았다.
 *
 * 색은 이 클래스가 관여하지 않는다(shape 전용). 인라인 style 또는 badge Stimulus 가 주입한다.
 * ※ 레이아웃상 tailwind.css 가 shared_badge.css 보다 **먼저** 로드된다(application.html.erb L48<L53).
 *   같은 특정성이면 뒤가 이기므로 bg-* 같은 Tailwind 색 유틸은 .db-badge 의 fallback 에 진다.
 *   → .db-badge 계열에 색을 줄 때는 Tailwind 유틸을 쓰지 말 것.
 *   2026-08-06 갱신: 이제 **이 파일 아래의 `.db-badge--<색이름>` 변형**이 첫 선택지다.
 *   (badge Stimulus 는 이 시트를 안 싣는 문서에서만 — 적재 범위 주석 참조.)
 */
.db-badge--sm {
  padding: 2px 6px;
  border-radius: 4px;
  font-size: 10px;
  line-height: 1.2;
  font-weight: 600;
}

/* ── 색 변형 (2026-08-06 신설) ────────────────────────────────────────────
 * 값 정본은 `app/javascript/lib/badge_colors.js` 의 **BADGE_COLORS** 1곳이고,
 * 여기는 그 팔레트를 **CSS 로 노출**한 것이다. 두 곳이 갈라지지 못하게
 * `test/integration/badge_color_canon_test.rb` 가 이름·값을 대조한다.
 *
 * 왜 필요했나: `dsv2_clients/_partner_list` 가 행별 badge Stimulus 대신
 * **서버 인라인 style** 로 색을 칠하고 있었다(전건 로드 longtask 절감, 2026-07-15 실측).
 * 그 결과 고객관리 화면 한 장에 인라인 style 속성이 **1,525개** 붙었는데,
 * 실제 값은 **5가지**뿐이었다(브라우저 실측 2026-08-06). 유한한 값이라 클래스가 맞다.
 * 게다가 그 뷰의 Ruby 미러는 6색만 베껴 정본 10색과 이미 **갈라져 있었다**.
 *
 * ⚠️ 적재 범위: 이 시트를 싣는 문서는 `layouts/application` 과
 * `dsv2_properties/public_summary_window` 뿐이다. 다른 문서(consult_window ·
 * register_window · embed_modal · print_form)에서 이 클래스를 쓰면 색이 안 붙는다 —
 * 거기선 기존대로 badge Stimulus 를 쓴다. */
.db-badge--amber  { background: #fef3c7; color: #b45309; }
.db-badge--green  { background: #dcfce7; color: #15803d; }
.db-badge--blue   { background: #bfdbfe; color: #2563eb; }
.db-badge--purple { background: #e9d5ff; color: #9333ea; }
.db-badge--red    { background: #fecaca; color: #dc2626; }
.db-badge--gray   { background: #e2e8f0; color: #475569; }
.db-badge--orange { background: #ffedd5; color: #c2410c; }
.db-badge--teal   { background: #ccfbf1; color: #0f766e; }
.db-badge--pink   { background: #fce7f3; color: #be185d; }
.db-badge--indigo { background: #e0e7ff; color: #4338ca; }

/* 화면 시트에서 올라온 변형 6종 (2026-08-06) — 값 그대로, 정의만 여기로.
   `-soft`/`-mint` 는 "같은 계열의 다른 값"이라는 뜻이다. 어느 쪽이 표준인지는 미결이라
   통일하지 않았다 — 통일하면 화면 색이 바뀌므로 그건 디자인 결정이다. */
.db-badge--green-mint { background: #ecfdf5; color: #047857; }
.db-badge--green-soft { background: #e7f8ef; color: #0f9d58; }
.db-badge--red-soft   { background: #fdecec; color: #d93434; }
.db-badge--blue-soft  { background: #e8efff; color: #1e40af; }
.db-badge--amber-soft { background: #fff3e0; color: #e08600; }
.db-badge--gray-soft  { background: #f3f4f6; color: #6b7280; }