/* --- 폰트 크기 및 테이블 정렬을 위한 추가 CSS --- */
html {
  /* rem 단위의 기준이 되는 기본 폰트 크기를 설정합니다. (브라우저 기본값은 보통 16px) */
  /* 이 값을 조절하여 전체 UI 크기를 비례적으로 변경할 수 있습니다. */
  /* 이 값은 JS로 동적으로 변경됩니다. */
}

/* --- 폰트 크기 및 테이블 정렬을 위한 추가 CSS --- */
.table th,
.table td {
  /* 칸 마다의 간격을 줄이기 위해 padding 조정 */
  padding: 0.3rem; /* 기존 Bootstrap 기본값(0.5rem 또는 0.75rem)보다 줄임 */
  text-align: center;
  vertical-align: middle;
}
/* 삭제 버튼 크기 줄이기 */
.table .btn.del {
  padding: 0.15rem 0.4rem; /* btn-sm보다 더 작은 padding */
  font-size: 0.8rem; /* btn-sm보다 더 작은 폰트 크기 (14px * 0.8 = 11.2px) */
}
.table .form-control {
  text-align: center;
}
/* --- 분류 그룹 헤더 스타일 --- */
/* .table-hover의 :hover 스타일보다 우선 적용되도록 선택자를 구체적으로 지정합니다. */
.table > tbody > tr.category-header > td {
  background-color: #f9fda4 !important; 
  font-weight: bold;
  text-align: left !important;
  padding-left: 1rem !important;
}

.fixed-width-container {
  /* 'min-width' 대신 'max-width'를 사용해야 화면이 커져도 UI가 늘어나지 않고 고정됩니다.
    'min-width'는 '최소' 너비라서 화면이 커지면 UI도 같이 커집니다.
  */
  max-width: 1900px; /* UI가 1900px보다 커지지 않도록 최대 너비를 고정 */
  
  /* margin-left: auto; 와 margin-right: auto; 가 없으면
    기본값(왼쪽 정렬)이 적용됩니다.
  */
}

/* 읽기 전용 필드를 일반 텍스트처럼 보이게 함 */
.readonly-text {
  background-color: transparent;
  border: none !important;
  box-shadow: none !important;
  padding-left: 0.3rem;
  padding-right: 0.3rem;
}

/* 가격 색상 강조 */
input[name="cash_supply_price"] { color: red !important; }
input[name="card_price"] { color: blue !important; }

/* 변동 발생 시 하이라이트 스타일 */
.highlight-change {
  background-color: #fff3cd !important; /* Bootstrap 'warning-subtle' color */
}
/* readonly-text에도 하이라이트가 적용되도록 우선순위 조정 */
.readonly-text.highlight-change {
  background-color: #fff3cd !important;
}

/* 테이블 스크롤 컨테이너 높이 */
.table-responsive {
  max-height: 75vh;
  overflow-y: auto;
}

/* 상단 헤더 고정 스타일 */
.sticky-top-container {
  position: sticky;
  top: 0;
  z-index: 1030; /* Bootstrap의 nav/modal보다 위에 오도록 설정 */
  background-color: white;
  padding-top: 1rem;
  box-shadow: 0 2px 4px rgba(0,0,0,.05);
}/* --- 추가: 최소 기본 스타일 --- */
body { font-family: system-ui, sans-serif; }
.container { max-width: 1200px; margin: 0 auto; padding: 16px; }
.table-wrap { overflow: auto; }