/* 공용 나무 보기 — 줄 모양은 공용 ui-sidebar-row(ui_template_overlay.css) · * 탐색기 모양(들여쓰기 안내선 · 접기 화살 · 폴더/항목 아이콘 · 폴더 굵게 · 고른 줄 배경) */ .ui-tree__kids { position: relative; display: flex; flex-direction: column; gap: 2px; } /* 들여쓰기 안내선 — 부모 줄 화살 한가운데에서 자식 끝까지(줄 들임 = spacing-8 + 깊이 × spacing-16) */ .ui-tree__kids::before { content: ""; position: absolute; top: 0; bottom: 0; left: calc(var(--spacing-8) + var(--tree-depth, 0) * var(--spacing-16) + var(--spacing-12) / 2); border-left: 1px solid var(--color-border); pointer-events: none; } .ui-tree__label { display: inline-flex; align-items: center; min-width: 0; } .ui-tree__icon { display: inline-flex; flex: none; margin-right: var(--spacing-4); color: var(--color-text-secondary); } .ui-tree__row.is-branch .ui-tree__label { font-weight: 600; } .ui-tree__row.is-active .ui-tree__icon { color: inherit; } .ui-tree__branch { display: flex; flex-direction: column; gap: 2px; } .ui-tree__caret { display: inline-block; width: var(--spacing-12); color: var(--color-text-secondary); } .ui-tree__count { color: var(--color-text-secondary); font-size: var(--text-caption); } /* 오른쪽 클릭 메뉴 — 모달(z-index 1000) 위 */ .ui-tree__menu { position: fixed; z-index: 1100; display: flex; flex-direction: column; min-width: 10rem; padding: var(--spacing-4); border: 1px solid var(--color-border); border-radius: var(--radius-lg); background: var(--color-surface-raised); box-shadow: var(--shadow-lg); } .ui-tree__menu-item { padding: var(--spacing-8) var(--spacing-12); border: 0; border-radius: var(--radius-md); background: none; color: var(--color-text); font: inherit; text-align: left; cursor: pointer; } .ui-tree__menu-item:hover:not(:disabled), .ui-tree__menu-item:focus-visible { background: var(--color-surface-sunken); } .ui-tree__menu-item:disabled { color: var(--color-text-secondary); cursor: not-allowed; }