/* 권한관리 모드 — 조직도 검색 + 드래그로 관리자 지정/해제.
   dmc-finance(자매 프로젝트) /admin 화면의 카드·아바타·접기형 트리 스타일에 맞췄다. */
.ad-panel{height:100%;overflow:hidden;padding:20px;display:flex;flex-direction:column;gap:16px}
.ad-loading,.ad-error{color:var(--text-sub);padding:24px;text-align:center}
.ad-columns{display:grid;grid-template-columns:1fr 1fr;gap:16px;flex:1;min-height:0}
.ad-col{background:var(--bg);border:1px solid var(--border);border-radius:var(--radius-lg);
  padding:16px;display:flex;flex-direction:column;gap:10px;height:100%;overflow:hidden}
.ad-col-admins{border-top:3px solid var(--success)}
.ad-col h2{font-size:14px;margin:0}
.ad-org-head{display:flex;align-items:baseline;justify-content:space-between;gap:8px}
.ad-org-count{font-size:12px;color:var(--text-muted);white-space:nowrap}
.ad-intro{font-size:12px;color:var(--text-sub);line-height:1.6;margin:0}
.ad-sync-error{
  color:var(--warn);background:var(--warn-bg);border:1px solid #FCA5A5;border-radius:var(--radius);
  padding:8px 10px;font-size:12px;font-family:ui-monospace,monospace;word-break:break-all;margin:0;
}
.ad-col input[type="search"]{padding:9px 12px;border:1px solid var(--border-strong);border-radius:999px}

.ad-tree{overflow:auto;flex:1;min-height:0;line-height:1.3}
.ad-dept{margin-bottom:0}
.ad-dept-head{
  display:flex;align-items:center;gap:6px;padding:2px 4px;border-radius:5px;cursor:pointer;
}
.ad-dept-head:hover,.ad-dept-head:focus-visible{background:var(--bg-tint);outline:none}
/* "미배정" 묶음 — 누를 수 있는 부서가 아니라 그냥 라벨이다 */
.ad-dept-head-static{cursor:default;font-size:12.5px;color:var(--text-sub);font-weight:600}
.ad-dept-head-static:hover{background:none}
.ad-dept-toggle{flex-shrink:0;width:12px;font-size:10px;color:var(--text-muted);text-align:center}
.ad-dept-icon{flex-shrink:0;font-size:12px;line-height:1}
.ad-dept-name{font-size:12.5px;color:var(--text-sub);font-weight:500}
/* dmc-finance 참고화면에는 세로 안내선이 없다 — 들여쓰기만으로 계층을 표현한다 */
.ad-dept-body{margin-left:15px}

/* 공용 행 골격(아바타·이름/직함·배지) — 조직도(.ad-tree)와 관리자 카드(.ad-list)가
   같은 마크업을 쓰되 아래에서 컨테이너별로 다르게 입힌다. */
.ad-person{display:flex;align-items:center;gap:8px}
.ad-person-info{display:flex;min-width:0}
.ad-person-name{font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ad-person-title{color:var(--text-muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ad-avatar{
  flex-shrink:0;border-radius:50%;display:flex;align-items:center;justify-content:center;
  color:#fff;font-weight:700;
}
.ad-badge{flex-shrink:0;border-radius:999px;background:var(--accent-bg);color:var(--primary);font-weight:600}

/* 조직도 쪽 — 박스 없이 한 줄로 촘촘하게(참고 화면과 동일) */
.ad-tree .ad-person{padding:2px 4px;border-radius:5px;cursor:grab}
.ad-tree .ad-person:hover{background:var(--bg-tint)}
.ad-tree .ad-person[draggable="false"]{cursor:default}
.ad-tree .ad-person-info{align-items:baseline;gap:6px;flex:0 1 auto}
.ad-tree .ad-person-name{font-size:13px}
.ad-tree .ad-person-title{font-size:12px}
.ad-tree .ad-avatar{width:20px;height:20px;font-size:10px}
.ad-tree .ad-badge{padding:1px 7px;font-size:10px}
/* 계정 초기화 — 조직도 한 줄을 흔들지 않게 작게, 마우스를 올리거나 키보드로 갈 때만 보인다 */
.ad-tree .ad-account-reset{width:20px;height:20px;font-size:10.5px;margin-left:auto;opacity:0}
.ad-tree .ad-person:hover .ad-account-reset,.ad-tree .ad-account-reset:focus-visible{opacity:1}

/* 관리자 카드 쪽 — 카드형 유지(참고 화면의 우측 목록과 동일) */
.ad-list{flex:1;min-height:0;overflow:auto;border:1px dashed var(--border-strong);border-radius:var(--radius);padding:8px}
.ad-list .ad-person{padding:7px 9px;border:1px solid var(--border);border-radius:var(--radius);
  margin-bottom:5px;background:var(--bg-soft)}
.ad-list .ad-person-info{flex-direction:column;gap:1px;flex:1}
.ad-list .ad-person-name{font-size:13px}
.ad-list .ad-person-title{font-size:11.5px}
.ad-list .ad-avatar{width:26px;height:26px;font-size:11.5px}
.ad-entry{cursor:default}
.ad-entry-actions{flex-shrink:0;display:flex;gap:4px}
.ad-icon-btn{
  width:26px;height:26px;flex-shrink:0;border:1px solid var(--border-strong);border-radius:6px;
  background:var(--bg);cursor:pointer;font-size:12.5px;display:flex;align-items:center;justify-content:center;
  line-height:1;padding:0;
}
.ad-icon-btn:hover{border-color:var(--primary)}
.ad-icon-btn-danger:hover{border-color:var(--warn);color:var(--warn)}

@media (max-width:800px){
  .ad-panel{overflow:auto}
  .ad-columns{grid-template-columns:1fr;flex:none}
  .ad-col{height:auto;max-height:70vh}
}
