/* =============================================================
   계약서 작성 목록 탭 — 맥 표(사용자 승인 B안). 범위: #contract_docs-content 안쪽만, 값은 ui-tokens.css 에서만.
   제목 한 줄 · [새 계약서]만 채운 파랑 · 분할 단추 · 상태는 점 + 글자 · 한 줄 32px(휴대폰 44px).
   마크업: public/static/js/contract-docs.js (그대로). 되돌리기: index.tsx 의 이 파일 <link> 한 줄.
   ============================================================= */
html #contract_docs-content *:not(i):not(.fas){ font-family:var(--ui-font) !important }
html #contract_docs-content .cdoc-head{ align-items:center; margin-bottom:8px; flex-wrap:nowrap }
html #contract_docs-content .cdoc-title{ font-size:var(--ui-text-title2); font-weight:var(--ui-weight-bold); color:var(--ui-text-1) }
html #contract_docs-content .cdoc-title i{ display:none }
html #contract_docs-content .cdoc-sub{ display:none }
html #contract_docs-content .cdoc-actions{ gap:8px }
html #contract_docs-content .cdoc-tpl{ height:var(--ui-control); padding:0 12px; border:0; border-radius:var(--ui-radius-control); background:var(--ui-surface); box-shadow:var(--ui-elev-control); color:var(--ui-text-1); font-size:var(--ui-text-body); font-weight:var(--ui-weight-regular); cursor:default }
html #contract_docs-content .cdoc-new{ height:var(--ui-control); padding:0 14px; border-radius:var(--ui-radius-control); background:var(--ui-accent); color:var(--ui-on-accent); font-size:var(--ui-text-body); font-weight:var(--ui-weight-semibold); cursor:default }
html #contract_docs-content .cdoc-new:hover{ background:var(--ui-accent-hover) }
html #contract_docs-content .cdoc-new i{ display:none }
html #contract_docs-content .cdoc-bar{ gap:8px; margin-bottom:8px; flex-wrap:nowrap }
html #contract_docs-content .cdoc-bar input{ order:2; width:220px; height:26px; padding:0 10px; border:0; border-radius:var(--ui-radius-control); background:var(--ui-fill); font-size:var(--ui-text-footnote); color:var(--ui-text-1); margin-left:auto }
html #contract_docs-content .cdoc-bar input:focus{ outline:none; box-shadow:var(--ui-focus-ring); background:var(--ui-surface) }
html #contract_docs-content .cdoc-seg{ order:1; padding:2px; border:0; border-radius:var(--ui-radius-control); background:var(--ui-fill) }
html #contract_docs-content .cdoc-seg button{ height:22px; padding:0 12px; border-radius:calc(var(--ui-radius-control) - 2px); background:transparent; color:var(--ui-text-1); font-size:var(--ui-text-footnote); font-weight:var(--ui-weight-regular); cursor:default }
html #contract_docs-content .cdoc-seg button.on{ background:var(--ui-surface); color:var(--ui-text-1); box-shadow:var(--ui-elev-control); font-weight:var(--ui-weight-semibold) }
html #contract_docs-content .cdoc-list{ border:0; border-radius:var(--ui-radius-group); box-shadow:0 0 0 var(--ui-hairline) var(--ui-line); background:var(--ui-surface) }
html #contract_docs-content .cdoc-list table{ font-size:var(--ui-text-body) }
html #contract_docs-content .cdoc-list th{ height:28px; padding:0 12px; background:var(--ui-surface); border-bottom:var(--ui-hairline) solid var(--ui-line); font-size:var(--ui-text-caption); font-weight:var(--ui-weight-semibold); color:var(--ui-text-2); white-space:nowrap }
html #contract_docs-content .cdoc-list td{ height:var(--ui-row); padding:0 12px; border-bottom:var(--ui-hairline) solid var(--ui-line); color:var(--ui-text-1); white-space:nowrap }
html #contract_docs-content .cdoc-list tr:last-child td{ border-bottom:0 }
@media (hover:hover){ html #contract_docs-content .cdoc-list tbody tr:hover td{ background:var(--ui-fill-subtle) } }
html #contract_docs-content .cdoc-list td b{ font-weight:var(--ui-weight-semibold) }
html #contract_docs-content .cdoc-muted{ color:var(--ui-text-2); font-size:var(--ui-text-footnote) }
/* 상태 · 원문 수정: 색 알약 → 점 + 글자 */
html #contract_docs-content .cdoc-st{ display:inline-flex; align-items:center; gap:6px; padding:0; background:transparent !important; color:var(--ui-text-1) !important; font-size:var(--ui-text-footnote); font-weight:var(--ui-weight-regular) }
html #contract_docs-content .cdoc-st::before{ content:""; width:7px; height:7px; border-radius:50%; background:var(--ui-text-3) }
html #contract_docs-content .cdoc-st.draft::before{ background:var(--ui-accent) }
html #contract_docs-content .cdoc-st.review::before{ background:var(--ui-warning) }
html #contract_docs-content .cdoc-st.final::before{ background:var(--ui-success) }
html #contract_docs-content .cdoc-dev{ padding:0; background:transparent; color:var(--ui-warning); font-size:var(--ui-text-footnote); font-weight:var(--ui-weight-regular) }
html #contract_docs-content .cdoc-btn{ height:22px; padding:0 10px; border:0; border-radius:var(--ui-radius-control); background:var(--ui-surface); box-shadow:var(--ui-elev-control); color:var(--ui-text-1); font-size:var(--ui-text-footnote); font-weight:var(--ui-weight-regular); cursor:default }
html #contract_docs-content .cdoc-btn.ghost{ background:transparent; box-shadow:none; color:var(--ui-danger) }
html #contract_docs-content .cdoc-empty{ font-size:var(--ui-text-footnote); color:var(--ui-text-2) }
@media (max-width:767px){
  html #contract_docs-content .cdoc-bar{ flex-wrap:wrap }
  html #contract_docs-content .cdoc-bar input{ order:2; width:100%; height:32px; margin-left:0 }
  html #contract_docs-content .cdoc-seg button{ height:28px }
  html #contract_docs-content .cdoc-list td{ height:var(--ui-row-mobile) }
}