/* work-surface 캐스케이드 2/7 — 업무 등록 드로어.
   ax-work-surface.css 바로 다음에 로드된다. 로드 순서가 곧 캐스케이드다. */

/* ===== 업무 등록 드로어 =====
   인라인 삽입은 보드를 아래로 밀어낸다. 표시될 때만 우측 드로어로 띄워
   보드를 가리지 않고 등록 맥락을 유지한다. 닫기는 "업무 등록" 토글/백드롭/취소로.
   위계·리듬은 상세 사이드패널(헤더/본문/푸터 3분할 + 섹션 카드)과 통일한다. */

/* 백드롭(딤) — 상세 사이드패널과 같은 패턴으로 드로어 위계를 세운다. */
.work-register-backdrop {
  position: fixed;
  inset: 0;
  z-index: 44;
  border: 0;
  background: rgba(15, 23, 42, 0.18); /* token-exempt: 상세 백드롭과 동일 */
  cursor: pointer;
}

.work-register-form-root:not([hidden]) {
  position: fixed;
  top: 0;
  right: 0;
  z-index: 45;
  width: min(460px, 100vw);
  height: 100%;
  padding: 0;
  overflow: hidden;
  border-left: 1px solid var(--border);
  background: var(--surface-panel);
  box-shadow: var(--shadow);
  display: flex;
}

/* 폼이 드로어를 채우고, 헤더 sticky top · 본문 스크롤 · 푸터 sticky bottom으로 리듬을 잡는다. */
#work-register-form {
  flex: 1;
  min-height: 0;
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;
}

.work-register-drawer-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  padding: 16px 18px;
  border-bottom: 1px solid var(--border);
  background: var(--surface-panel);
}

/* 상세 패널의 타입 라벨(.ax-detail-sidepanel-type)을 미러링해 위계를 통일한다. */
.work-register-drawer-eyebrow {
  font-size: 11px;
  font-weight: 600;
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

.work-register-drawer-title {
  margin-top: 3px;
  font-size: 16px;
  font-weight: 700;
  letter-spacing: -0.01em;
}

.work-register-drawer-body {
  min-height: 0;
  overflow-y: auto;
  padding: 14px 18px;
  display: grid;
  gap: 12px;
  align-content: start;
}

.work-register-drawer-footer {
  display: flex;
  gap: 8px;
  padding: 12px 18px;
  border-top: 1px solid var(--border);
  background: var(--surface-panel);
}

.work-register-drawer-footer .ax-button--primary {
  flex: 1;
}

/* 필드 그룹을 섹션 카드로 — 상세 패널 .work-collab-block과 같은 톤으로 "폼 벽"을 없앤다. */
.work-register-section {
  display: grid;
  gap: 10px;
  padding: 13px 14px;
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
  background: var(--surface-panel-soft);
}

.work-register-section > .work-register-section-label {
  font-size: 12px;
  font-weight: 700;
  color: var(--text);
}

/* 우선순위·초기 상태처럼 짧고 관련된 필드는 2열로 묶어 세로로 길게 쌓이지 않게 한다. */
.work-register-field-2col {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}

.work-register-collab-picker {
  display: flex;
  gap: 8px;
  align-items: center;
}

.work-register-collab-picker select {
  flex: 1;
  min-width: 0;
}

.work-register-hint {
  color: var(--muted);
  font-weight: 400;
  font-size: 12px;
}