/* M01 마스터 요소 — 좌측 도킹 패널(그룹 탭 · 파일) / 우측 표 */ .m01-master [hidden] { display: none !important; } .m01-master__side { padding-top: var(--spacing-8); } /* 왼쪽 패널 — 공용 접기 컨테이너 여덟 */ .m01-side { display: flex; flex-direction: column; gap: var(--spacing-8); } .m01-side__group { padding: calc(var(--spacing-8) + var(--spacing-4)); border-radius: var(--radius-cards); background: var(--color-surface-raised); } .m01-side__group > h3 { margin: 0; color: var(--color-text); font-size: var(--text-body-sm); } .m01-side__leaf > h3::after { display: none; } .m01-side__leaf.is-active > h3 { color: var(--color-accent); } .m01-side__items { display: flex; flex-direction: column; gap: 2px; max-height: 50vh; margin-top: var(--spacing-8); overflow: auto; } .m01-side__item { display: flex; justify-content: space-between; gap: var(--spacing-8); padding: var(--spacing-4) var(--spacing-8); border: 0; border-radius: var(--radius-buttons); background: transparent; color: var(--color-text-body); font: inherit; font-size: var(--text-body-sm); text-align: left; cursor: pointer; } .m01-side__item:hover { background: var(--color-paper); } .m01-side__item.is-active { background: var(--color-mist-violet); color: var(--color-accent); } .m01-tree__kids { display: flex; flex-direction: column; gap: 2px; } .m01-tree__branch { display: flex; flex-direction: column; gap: 2px; } .m01-tree__caret { display: inline-block; width: var(--spacing-12); color: var(--color-text-muted); } .m01-side__muted, .m01-master__muted { color: var(--color-text-muted); font-size: var(--text-caption); } /* ── 우측 ── */ .m01-master__panel { display: flex; flex-direction: column; gap: var(--spacing-12); min-width: 0; padding: var(--spacing-16) var(--spacing-24); } .m01-master__head, .m01-master__bar { display: flex; flex-wrap: wrap; align-items: center; gap: var(--spacing-12); } .m01-master__title { flex: 1 1 auto; margin: 0; color: var(--color-text); font-size: var(--text-body); } .m01-master__summary { color: var(--color-accent); font-size: var(--text-body-sm); font-weight: var(--font-weight-bold); } .m01-master__notice { display: flex; flex-direction: column; gap: var(--spacing-4); padding: var(--spacing-8) var(--spacing-12); max-height: 30vh; overflow: auto; border-left: 4px solid var(--color-danger); background: color-mix(in srgb, var(--color-danger) 10%, var(--color-canvas)); color: var(--color-danger); font-size: var(--text-body-sm); } .m01-master__notice p { margin: 0; } .m01-master__body { display: flex; flex-direction: column; gap: var(--spacing-12); min-width: 0; } .m01-master__grid-wrap { max-height: calc(100vh - 300px); overflow: auto; border: 1px solid var(--color-border); border-radius: var(--radius-cards); } .m01-master__grid { border-collapse: collapse; font-size: var(--text-body-sm); } .m01-master__grid th, .m01-master__grid td { max-width: 320px; padding: var(--spacing-8) var(--spacing-12); overflow: hidden; border-bottom: 1px solid var(--color-border); text-align: left; text-overflow: ellipsis; white-space: nowrap; } .m01-master__grid th { position: sticky; top: 0; z-index: 1; background: var(--color-surface); color: var(--color-text-secondary); font-weight: var(--font-weight-medium); } .m01-master__grid td.is-editable { cursor: text; } /* 고친 칸 — 노랑 */ .m01-master__grid td.is-changed { background: color-mix(in srgb, var(--color-warning) 28%, var(--color-canvas)); } .m01-master__grid tr.is-deleted td { color: var(--color-text-muted); text-decoration: line-through; background: color-mix(in srgb, var(--color-danger) 8%, var(--color-canvas)); } .m01-master__cell-input { width: 100%; min-width: 6em; padding: 2px var(--spacing-4); } .m01-master__row-btn { padding: 2px var(--spacing-8); border: 1px solid var(--color-border); border-radius: var(--radius-buttons); background: var(--color-surface); color: var(--color-text-body); font: inherit; font-size: var(--text-caption); cursor: pointer; } .m01-master__pager { display: flex; align-items: center; gap: var(--spacing-12); margin-left: auto; color: var(--color-text-secondary); font-size: var(--text-body-sm); } .m01-master__tables { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: var(--spacing-8); } .m01-master__table-card { display: flex; flex-direction: column; gap: 2px; padding: var(--spacing-8) var(--spacing-12); border: 1px solid var(--color-border); border-radius: var(--radius-cards); background: var(--color-surface); color: var(--color-text-body); font: inherit; text-align: left; cursor: pointer; } .m01-master__table-card:hover { background: var(--color-paper); } .m01-master__table-card.is-changed { background: color-mix(in srgb, var(--color-warning) 28%, var(--color-canvas)); } .m01-master__empty { color: var(--color-text-muted); } /* 조달 찾기 모달 */ .m01-procure { position: fixed; inset: 0; z-index: 1000; display: flex; align-items: center; justify-content: center; background: rgba(0, 0, 0, 0.45); } .m01-procure__box { display: flex; flex-direction: column; gap: 8px; width: min(640px, 92vw); max-height: 80vh; padding: 16px; border-radius: 8px; background: var(--color-surface, #fff); } .m01-procure__list { display: flex; flex-direction: column; gap: 4px; overflow-y: auto; min-height: 120px; } .m01-procure__item { display: flex; flex-direction: column; align-items: flex-start; padding: 6px 8px; border: 1px solid var(--color-border, #ccc); border-radius: 4px; background: transparent; cursor: pointer; text-align: left; } .m01-procure__foot { display: flex; justify-content: flex-end; gap: 8px; } .m01-procure__cond { display: flex; flex-wrap: wrap; gap: 8px; }