/* 카페24 상품관리 모듈 전용 스타일.
   전역(erp.css) 은 건드리지 않는다. 클래스 접두사: cf24-
   색상은 erp.css 의 :root 토큰을 재사용한다. */

.cf24-card {
  margin-bottom: var(--sp-16, 16px);
}

.cf24-card-head {
  display: flex;
  align-items: center;
  gap: var(--sp-8, 8px);
  margin-bottom: var(--sp-12, 12px);
}

.cf24-card-head h3 {
  margin: 0;
  font-size: var(--text-heading, 18px);
  letter-spacing: -0.45px;
}

.cf24-muted {
  color: var(--color-midtone-gray, #737373);
  font-size: var(--text-caption, 12px);
}

.cf24-err {
  color: var(--color-callout-red, #c22b10);
}

.cf24-nowrap {
  white-space: nowrap;
}

/* 상태 배지 */
.cf24-badge-ok {
  background: var(--color-success-green, #10c22b);
  color: #fff;
}

.cf24-badge-off {
  background: var(--color-ghost-gray, #f2f2f2);
  color: var(--color-rich-black, #0a0a0a);
}

/* 안내/오류 배너 */
.cf24-flash {
  padding: var(--sp-10, 10px) var(--sp-12, 12px);
  border-radius: var(--r-lg, 10px);
  margin-bottom: var(--sp-12, 12px);
  font-size: var(--text-body, 14px);
}

.cf24-flash-ok {
  background: #eefaf0;
  border: 1px solid var(--color-success-green, #10c22b);
}

.cf24-flash-err {
  background: #fdefec;
  border: 1px solid var(--color-callout-red, #c22b10);
}

/* 키-값 표 */
.cf24-kv th {
  width: 180px;
  text-align: left;
  color: var(--color-midtone-gray, #737373);
  font-weight: 500;
  white-space: nowrap;
}

.cf24-actions {
  display: flex;
  gap: var(--sp-8, 8px);
  align-items: center;
  margin-top: var(--sp-12, 12px);
}

/* 넓은 로그 표는 카드 안에서만 가로 스크롤 */
.cf24-scroll {
  overflow-x: auto;
}

.cf24-scroll code {
  font-family: var(--font-geist-mono, ui-monospace, monospace);
  font-size: 12px;
}

.cf24-empty {
  padding: var(--sp-24, 24px);
}

.cf24-empty h3 {
  margin: 0 0 var(--sp-8, 8px);
}