/* 공통 인라인 편집 스타일 — 행 단위 편집 모드
 *
 * 사용 화면별 prefix 와 충돌하지 않게 ie-* 네이밍 사용.
 * records 의 .rec-row-saved / .editing 패턴을 일반화한 표준.
 *
 * 적용 패턴:
 *   <tr class="ie-row" data-editable>...</tr>
 *   편집 진입:  tr.classList.add('ie-editing')
 *   저장 직후:  tr.classList.add('ie-row-saved')   (1.2s 페이드)
 *   삭제 직전:  tr.classList.add('ie-row-deleted') (0.4s 페이드)
 */

/* 편집 가능 힌트 (호버 시 cursor cell) */
.ie-row[data-editable]:hover:not(.ie-editing) {
  cursor: cell;
}
.ie-row[data-editable]:hover:not(.ie-editing) > td {
  background: #f5f3ff;
}

/* 편집 모드 행 — 보라/파랑 톤 강조 */
.ie-editing {
  background: #eef2ff;
}
.ie-editing > td {
  background: #eef2ff;
  vertical-align: middle;
}
.ie-editing > td > .ie-input,
.ie-editing > td > .ie-input--num,
.ie-editing > td > .ie-input--mono {
  display: block;
}

/* 공통 input 룩 */
.ie-input,
.ie-input--num,
.ie-input--mono,
.ie-select {
  width: 100%;
  min-width: 0;
  box-sizing: border-box;
  padding: 4px 6px;
  border: 1px solid #d1d5db;
  border-radius: 4px;
  font: inherit;
  font-variant-numeric: tabular-nums;
  background: #fff;
}
.ie-input:focus,
.ie-input--num:focus,
.ie-input--mono:focus,
.ie-select:focus {
  outline: none;
  border-color: #6366f1;
  box-shadow: 0 0 0 2px rgba(99, 102, 241, 0.18);
}
.ie-input--num { text-align: right; }
.ie-input--mono { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 0.78rem; }

/* 저장 성공 애니메이션 */
@keyframes ie-row-saved-flash {
  0%   { background: #d1fae5; }
  100% { background: transparent; }
}
.ie-row-saved,
.ie-row-saved > td { animation: ie-row-saved-flash 1.2s ease-out; }

/* 삭제 애니메이션 */
@keyframes ie-row-deleted-flash {
  0%   { background: #fee2e2; opacity: 1; }
  100% { background: #fee2e2; opacity: 0; }
}
.ie-row-deleted,
.ie-row-deleted > td { animation: ie-row-deleted-flash 0.4s ease-out forwards; }

/* 편집 모드의 액션 버튼 (저장 / 삭제) */
.ie-row-btn {
  background: transparent;
  border: 1px solid transparent;
  cursor: pointer;
  padding: 4px 7px;
  border-radius: 4px;
  color: #6b7280;
}
.ie-row-btn:hover { background: rgba(99, 102, 241, 0.1); }
.ie-row-btn--save {
  color: #16a34a;
  border-color: #86efac;
  background: #f0fdf4;
}
.ie-row-btn--save:hover { background: #dcfce7; }
.ie-row-btn--del {
  color: #9ca3af;
}
.ie-row-btn--del:hover { color: #dc2626; background: #fee2e2; }