/* 병원경영 화면 모양: 왼쪽 메뉴 나무 170px, 오른쪽 내용(경영/통계 화면과 같은 배치).
   공통 부품만 여기에 둔다. 묶음별 모양은 manage_hr.css, manage_attend.css, manage_payroll.css, manage_biz.css 에 자기 접두어(.mgh-, .mga-, .mgp-, .mgb-)로 쓴다 */
.mg { display: grid; contain: size; grid-template-columns: 170px minmax(0, 1fr); grid-template-rows: minmax(0, 1fr); gap: 6px; }
.mg-nav { display: flex; flex-direction: column; gap: 6px; overflow-y: auto; min-height: 0; }
.mg-group { background: #fff; border: 1px solid var(--line); padding: 2px 0 3px; flex: 0 0 auto; }
.mg-group-title { font-weight: 700; padding: 1px 6px 2px; white-space: nowrap; }
.mg-item { display: block; width: 100%; height: 19px; line-height: 17px; text-align: left; border: 1px solid transparent; background: none; padding: 0 4px 0 22px; cursor: pointer; position: relative; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mg-item::before { content: ""; position: absolute; left: 11px; top: -1px; height: 10px; width: 8px; border-left: 1px dotted #7d8798; border-bottom: 1px dotted #7d8798; }
.mg-item:hover { background: var(--hover); }
.mg-item.on { background: var(--blue-soft); border-color: #a9c0e6; font-weight: 700; }
.mg-main { display: flex; flex-direction: column; min-height: 0; min-width: 0; }
/* 내용 화면의 뼈대: 머리 줄(제목, 조건, 단추) 아래에 내용. 내용이 길면 .mg-body 안에서만 스크롤 */
.mg-view { flex: 1 1 auto; display: flex; flex-direction: column; gap: 6px; min-height: 0; min-width: 0; }
.mg-head { display: flex; align-items: center; gap: 6px; background: #fff; border: 1px solid var(--line); padding: 3px 6px; min-height: 32px; flex: 0 0 auto; flex-wrap: wrap; }
.mg-title { font-weight: 700; font-size: 13px; white-space: nowrap; margin-right: 4px; }
.mg-body { flex: 1 1 auto; min-height: 0; overflow: auto; display: flex; flex-direction: column; gap: 6px; }
.mg-cols { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 6px; min-height: 0; }
.mg-pad { padding: 6px; }
.mg-note { margin-top: 6px; font-size: 11px; }
.mg-sum { display: flex; gap: 12px; flex-wrap: wrap; background: #fff; border: 1px solid var(--line); padding: 4px 8px; flex: 0 0 auto; }
.mg-sum b { margin-left: 4px; }
.mg-warn { color: var(--red); font-weight: 700; }
.mg-ok { color: var(--green); }