/* 입력 박스 스타일 */
#inputBox { background-color: black; height: 200px; color: #00a300; padding: 10px; font-size: 1rem; overflow-y: auto; border: 1px solid #ccc; border-radius: 0; }

/* 플레이스홀더 텍스트 스타일 */
#placeholderText { color: #999; font-size: 0.95rem; position: absolute; top: 10px; left: 10px; pointer-events: none; }

/* 특수 문자 스타일 */
.special-char { background-color: red; color: white; padding: 0 2px; border-radius: 2px; font-weight: bold; }

/* 결과 박스 스타일 */
#result { background: #f8f9fa; border: 2px solid #007bff; border-radius: 4px; padding: 10px; margin-top: 30px; display: none; }

/* 정보 박스 스타일 */
.info-box { background-color: #ffffff; padding: 1rem; border-radius: 6px; }

/* 버튼 그룹 래퍼 스타일 */
.goods-button-group-wrapper { display: flex; align-items: center; gap: 50px; margin-top: 15px; }

/* 특수 문자 입력 스타일 */
.special-char-inputs { display: flex; gap: 10px; }

/* 특수 문자 입력 필드 스타일 */
.special-char-inputs input[type="text"] { width: 190px; height: 44px; font-size: 1rem; text-align: center; padding: 0 10px; border: 1px solid #ccc; border-radius: 4px; }

/* 계산 버튼 스타일 */
.goods-button-group-wrapper .btn-calc { min-width: 168px; padding: 0.5rem 1rem; font-size: 1rem; border-radius: 4px; border: 1px solid #007bff; background: linear-gradient(135deg, #0d6efd, #0d6efd); color: white; cursor: pointer; transition: background-color 0.2s, color 0.2s; }

/* 계산 버튼 호버 스타일 */
.goods-button-group-wrapper .btn-calc:hover { background-color: #0056b3; color: #fff; }

/* 커스텀 모달 콘텐츠 스타일 */
.custom-modal-content { padding: 10px; font-size: 0.9rem; }

/* 수수료 가이드 스타일 */
#feeGuide { display: none; margin-top: 20px; }

/* 수수료 가이드 표시 스타일 */
#feeGuide.show { display: flex; flex-wrap: wrap; gap: 20px; height: auto; max-height: none; }

/* 수수료 가이드 박스 스타일 */
.fee-guide-box { background-color: #fff; border: 2px solid #007bff; border-radius: 4px; padding: 15px; font-size: 0.95rem; line-height: 1.5; flex: 1 1 30%; min-width: 280px; box-sizing: border-box; }

/* 수수료 가이드 제목 스타일 */
.fee-guide-box h6 { margin: 0 0 8px 0; font-weight: bold; color: #0d6efd; }

/* 수수료 가이드 내용 스타일 */
.fee-guide-box p { margin: 4px 0; }

/* 모달 메시지 스타일 */
#modalMessage { display: flex; flex-direction: column; align-items: center; gap: 15px; }

#customModal {
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  display: none;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  background: #fff;
  border: 2px solid #007bff;
  border-radius: 8px;
  padding: 20px;
  z-index: 9999;
  width: 300px;
  max-width: 90%;
  height: auto;
  max-height: 700px;
  box-sizing: border-box;
  text-align: center;
  overflow-y: auto;
}

/* 중복 항목 모달 스타일 */
#customModal.show-duplicate { max-height: 600px; }

/* 중복 목록 스타일 */
#modalMessage .duplicate-list div { display: flex; align-items: center; gap: 10px; margin-bottom: 8px; }

/* 버튼 그룹 스타일 */
#modalMessage .button-group { display: flex; flex-direction: column; gap: 10px; width: 100%; }

/* 버튼 스타일 */
#modalMessage .button-group button { width: 100%; padding: 12px; font-weight: bold; border: none; border-radius: 4px; cursor: pointer; }

/* 삭제 버튼 스타일 */
#modalMessage .button-group button.delete { background: #dc3545; color: #fff; }

/* 취소 버튼 스타일 */
#modalMessage .button-group button.cancel { background: #6c757d; color: #fff; }

/* 버튼 그룹 스타일 */
.button-group { display: flex; flex-direction: column; gap: 10px; width: 100%; }

/* 버튼 스타일 */
.button-group button { padding: 12px; border: none; border-radius: 4px; font-weight: bold; cursor: pointer; }

/* 삭제 버튼 스타일 */
.button-group .delete { background: #dc3545; color: #fff; }

/* 취소 버튼 스타일 */
.button-group .cancel { background: #6c757d; color: #fff; }