/* 네비게이션 메뉴 스타일 향상 */
.navbar .nav-item {
  margin: 0 35px !important; /* 여백 증가 */
}

.navbar .nav-link {
  position: relative !important;
  padding: 8px 5px !important; /* 좌우 패딩 추가 */
  font-size: 1.05em !important; /* 약간 더 큰 글꼴 크기 */
}

/* 메뉴 항목에 하단 하이라이트 효과 추가 */
.navbar .nav-link:after {
  content: '';
  position: absolute;
  width: 0;
  height: 2px;
  background: #fff;
  bottom: 0;
  left: 0;
  transition: width 0.3s;
}

.navbar .nav-link:hover:after,
.navbar .nav-item.active .nav-link:after {
  width: 100%;
}

/* 드롭다운 메뉴 스타일 개선 */
.navbar .dropdown-menu {
  margin-top: 0;
  border-radius: 0;
  border-top: none;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
}

.navbar .dropdown-item {
  padding: 8px 20px;
}

.navbar .dropdown-item:hover {
  background-color: #f8f9fa;
}

/* 네비게이션 로고와 첫 메뉴 항목 사이 여백 추가 */
.navbar-brand {
  margin-right: 20px;
}

/* 모바일 화면에서도 간격 유지 */
@media (max-width: 991.98px) {
  .navbar .nav-item {
    margin: 5px 0;
  }

  .navbar .nav-link {
    padding: 8px 10px;
  }
}

/* 버튼 스타일 개선 */
.btn-outline-primary {
  color: #0056b3;
  border-color: #0056b3;
  background-color: #fff;
}

.btn-outline-primary:hover,
.btn-outline-primary:focus,
.btn-outline-primary:active,
.btn-outline-primary.active {
  color: #fff;
  background-color: #0056b3;
  border-color: #0056b3;
}

.btn-outline-secondary {
  color: #5a6268;
  border-color: #5a6268;
  background-color: #fff;
}

.btn-outline-secondary:hover,
.btn-outline-secondary:focus,
.btn-outline-secondary:active,
.btn-outline-secondary.active {
  color: #fff;
  background-color: #5a6268;
  border-color: #5a6268;
}

.btn-outline-success {
  color: #28a745;
  border-color: #28a745;
  background-color: #fff;
}

.btn-outline-success:hover,
.btn-outline-success:focus,
.btn-outline-success:active,
.btn-outline-success.active {
  color: #fff;
  background-color: #28a745;
  border-color: #28a745;
}

/* 테이블 내 버튼 스타일 */
.table .btn-info {
  color: #fff;
  background-color: #17a2b8;
  border-color: #17a2b8;
}

.table .btn-info:hover {
  background-color: #138496;
  border-color: #117a8b;
}

.table .btn-danger {
  color: #fff;
  background-color: #dc3545;
  border-color: #dc3545;
}

.table .btn-danger:hover {
  background-color: #c82333;
  border-color: #bd2130;
}

.table .btn-secondary {
  color: #fff;
  background-color: #6c757d;
  border-color: #6c757d;
}

.table .btn-secondary:hover {
  background-color: #5a6268;
  border-color: #545b62;
}

/* view-toggle 버튼 그룹 스타일 향상 */
.view-toggle .btn {
  background-color: #fff;
  border-color: #007bff;
  color: #007bff;
}

.view-toggle .btn.active {
  background-color: #007bff;
  color: white;
  font-weight: bold;
}

.view-toggle .btn:hover:not(.active) {
  background-color: #e6f2ff;
}

/* 기본 버튼 클래스 스타일 개선 */
.btn-primary {
  color: white !important;
  background-color: #2557a7 !important; /* 진한 파란색 */
  border-color: #1c4587 !important;
  text-shadow: 0 1px 0 rgba(0, 0, 0, 0.2) !important;
  font-weight: 500 !important;
}

.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active,
.btn-primary.active {
  color: white !important;
  background-color: #1c4587 !important; /* 더 어두운 파란색 */
  border-color: #1e7e34 !important;
}

/* 버튼에 약간의 그림자 효과 추가 */
.btn {
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
  transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
}

.btn:hover {
  box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16), 0 3px 6px rgba(0, 0, 0, 0.23);
}

/* 링크 버튼 내 텍스트 여백 추가 */
.btn > i + span,
.btn > i + [class^='fa-'] + span {
  margin-left: 5px;
}

/* 버튼 간 여백 확보 */
.btn + .btn {
  margin-left: 8px;
}

/* jQuery Mobile의 버튼 스타일 무효화 */
.ui-btn,
.ui-btn-active,
.ui-btn:visited,
.ui-btn:hover,
.ui-btn:active {
  background: none !important;
  box-shadow: none !important;
  text-shadow: none !important;
}

/* 버튼 클래스에 대한 jQuery Mobile 스타일 제거 */
.btn.ui-btn {
  padding: 6px 12px !important;
  margin: 0 !important;
  border-width: 1px !important;
}

/* jQuery Mobile의 글로벌 스타일 재정의 */
.ui-page-theme-a a:visited,
.ui-page-theme-a a,
html .ui-bar-a a:visited,
html .ui-bar-a a,
html .ui-body-a a:visited,
html .ui-body-a a,
html body .ui-group-theme-a a:visited,
html body .ui-group-theme-a a {
  color: #007bff !important;
  font-weight: normal !important;
}

/* 페이지 레이아웃을 jQuery Mobile의 영향에서 보호 */
.container {
  width: auto !important;
  max-width: 1170px !important;
  margin-right: auto !important;
  margin-left: auto !important;
  padding-right: 15px !important;
  padding-left: 15px !important;
}

/* 기본 폰트 스타일 강제 적용 */
body,
.ui-page {
  font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif !important;
  font-size: 14px !important;
  line-height: 1.42857143 !important;
}

/* 커스텀 버튼 클래스 - jQuery Mobile과 충돌 방지를 위한 접두사 사용 */
.cp-btn {
  display: inline-block;
  font-weight: 500;
  text-align: center;
  white-space: nowrap;
  vertical-align: middle;
  cursor: pointer;
  user-select: none;
  border: 1px solid transparent;
  padding: 6px 12px;
  font-size: 14px;
  line-height: 1.42857143;
  border-radius: 4px;
  text-decoration: none;
  margin-bottom: 5px;
  transition: all 0.2s ease-in-out;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
}

.cp-btn:hover,
.cp-btn:focus {
  text-decoration: none;
  box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16), 0 3px 6px rgba(0, 0, 0, 0.23);
}

/* 기본 버튼 */
.cp-btn-primary {
  color: white !important;
  background-color: #2557a7 !important; /* 진한 파란색 */
  border-color: #1c4587 !important;
  text-shadow: 0 1px 1px rgba(0, 0, 0, 0.3) !important;
  font-weight: 600 !important;
  border-radius: 4px !important;
}

.cp-btn-primary:hover,
.cp-btn-primary:focus,
.cp-btn-primary:active {
  color: white !important;
  background-color: #1c4587 !important; /* 더 어두운 파란색 */
  border-color: #143266 !important;
}

/* 아웃라인 버튼 */
.cp-btn-outline-primary {
  color: #2557a7 !important; /* 진한 파란색 */
  background-color: white !important;
  border-color: #2557a7 !important;
}

.cp-btn-outline-primary:hover,
.cp-btn-outline-primary:focus,
.cp-btn-outline-primary:active,
.cp-btn-outline-primary.active {
  color: white !important;
  background-color: #2557a7 !important;
  border-color: #1c4587 !important;
}

.cp-btn-outline-secondary {
  color: #6d6875; /* 어두운 회색 */
  background-color: transparent;
  border-color: #6d6875;
}

.cp-btn-outline-secondary:hover,
.cp-btn-outline-secondary:focus,
.cp-btn-outline-secondary:active,
.cp-btn-outline-secondary.active {
  color: #fff;
  background-color: #6d6875;
  border-color: #5a5661;
}

.cp-btn-outline-success {
  color: #2a9d8f; /* 청록색 */
  background-color: transparent;
  border-color: #2a9d8f;
}

.cp-btn-outline-success:hover,
.cp-btn-outline-success:focus,
.cp-btn-outline-success:active,
.cp-btn-outline-success.active {
  color: #fff;
  background-color: #2a9d8f;
  border-color: #238176;
}

/* 정보/위험 버튼 */
.cp-btn-info {
  color: #fff;
  background-color: #2ca58d; /* 청록색 */
  border-color: #258a76;
}

.cp-btn-info:hover,
.cp-btn-info:focus,
.cp-btn-info:active {
  color: #fff;
  background-color: #227f6b;
  border-color: #1c6a5a;
}

.cp-btn-danger {
  color: #fff;
  background-color: #e63946; /* 밝은 빨간색 */
  border-color: #cf2838;
}

.cp-btn-danger:hover,
.cp-btn-danger:focus,
.cp-btn-danger:active {
  color: #fff;
  background-color: #c62a37;
  border-color: #a6232d;
}

/* 세컨더리 버튼 스타일 추가 */
.cp-btn-secondary {
  color: white !important;
  background-color: #6c757d !important; /* 회색 */
  border-color: #5a6268 !important;
  text-shadow: 0 1px 1px rgba(0, 0, 0, 0.3) !important;
  font-weight: 600 !important;
  border-radius: 4px !important;
}

.cp-btn-secondary:hover,
.cp-btn-secondary:focus,
.cp-btn-secondary:active {
  color: white !important;
  background-color: #5a6268 !important; /* 더 어두운 회색 */
  border-color: #494f54 !important;
}

/* 크기 변형 */
.cp-btn-sm {
  padding: 4px 8px;
  font-size: 12px;
  line-height: 1.5;
  border-radius: 3px;
}

.cp-btn-lg {
  padding: 8px 16px;
  font-size: 16px;
  line-height: 1.5;
  border-radius: 4px;
}

/* 버튼 그룹 */
.cp-btn-group {
  position: relative;
  display: inline-block;
  vertical-align: middle;
}

.cp-btn-group .cp-btn {
  position: relative;
  float: left;
  margin-right: -1px;
  border-radius: 0;
}

.cp-btn-group .cp-btn:first-child {
  border-top-left-radius: 4px;
  border-bottom-left-radius: 4px;
}

.cp-btn-group .cp-btn:last-child {
  border-top-right-radius: 4px;
  border-bottom-right-radius: 4px;
}

.cp-btn-group .cp-btn.active {
  z-index: 2;
}

/* 버튼 간 간격 */
.cp-btn + .cp-btn {
  margin-left: 5px;
}

/* 아이콘 + 텍스트 간격 */
.cp-btn > i + span {
  margin-left: 5px;
}

/* 블록 버튼 */
.cp-btn-block {
  display: block;
  width: 100%;
}

/* 선택된 버튼 스타일 개선 */
.cp-btn.active,
.cp-btn-group .cp-btn.active {
  color: white !important;
  background-color: #2557a7 !important; /* 진한 파란색 */
  border-color: #1c4587 !important;
  box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.2);
  font-weight: 500;
}

.cp-btn-outline-primary.active {
  color: white !important;
  background-color: #28a745 !important;
  border-color: #218838 !important;
}

/* 더 명확한 선택 상태를 위한 추가 효과 */
.cp-btn.selected,
a.cp-btn.selected {
  position: relative;
  outline: none;
}

.cp-btn.selected:after,
a.cp-btn.selected:after {
  content: '';
  position: absolute;
  bottom: -2px;
  left: 50%;
  transform: translateX(-50%);
  width: 80%;
  height: 2px;
  background-color: #ffcc00; /* 황금색 하이라이트로 변경하여 더 잘 보이게 함 */
}

/* 선택된 네비게이션 항목 스타일 */
.nav-item .nav-link.selected {
  font-weight: bold;
  position: relative;
}

.nav-item .nav-link.selected:after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 2px;
  background-color: #fff;
}

/* 뷰 토글 버튼 그룹의 선택된 항목 스타일 개선 */
.view-toggle .cp-btn.active {
  background-color: #2557a7 !important; /* 진한 파란색 */
  color: white !important;
  font-weight: bold;
  box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
}

/* 포커스 상태 개선 */
.cp-btn:focus,
.cp-btn.focus {
  outline: 0;
  box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25);
}

/* 비활성화된 버튼 스타일 */
.cp-btn.disabled,
.cp-btn:disabled {
  opacity: 0.65;
  cursor: not-allowed;
  box-shadow: none;
}

/* 폼 내의 버튼 특별 처리 */
.input-group-append .btn {
  color: white !important;
  background-color: #2557a7 !important; /* 진한 파란색 */
  border-color: #1c4587 !important;
}

/* jQuery Mobile 스타일 강제 재정의 */
.ui-btn {
  color: inherit !important;
  background: transparent !important;
  font-weight: normal !important;
  text-shadow: none !important;
  box-shadow: none !important;
}

/* 특정 페이지 내 버튼 스타일 보장 */
.container .cp-btn-primary,
.jumbotron .cp-btn-primary,
.card .cp-btn-primary {
  color: white !important;
  background-color: #2557a7 !important; /* 진한 파란색 */
  border-color: #1c4587 !important;
}

/* 버튼 내 텍스트 확실히 보이게 */
.cp-btn-primary,
.btn-primary,
.cp-btn-info,
.cp-btn-danger {
  color: white !important;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.4) !important;
  font-weight: 600 !important;
}

/* 모든 버튼 형태 링크(a 태그)의 글자색을 흰색으로 강제 설정 - 방문한 링크도 포함 */
a.cp-btn,
a.btn,
a.cp-btn-primary,
a.cp-btn-info,
a.cp-btn-secondary,
a.cp-btn-danger,
a.cp-btn-outline-primary.active,
a.cp-btn-outline-secondary.active,
a.cp-btn-outline-success.active,
a.cp-btn:visited,
a.btn:visited,
a.cp-btn-primary:visited,
a.cp-btn-info:visited,
a.cp-btn-secondary:visited,
a.cp-btn-danger:visited,
a.cp-btn-outline-primary.active:visited,
a.cp-btn-outline-secondary.active:visited,
a.cp-btn-outline-success.active:visited {
  color: white !important;
  text-decoration: none !important;
}

/* 버튼에 호버했을 때도 글자색은 항상 흰색 유지 */
a.cp-btn:hover,
a.btn:hover,
a.cp-btn-primary:hover,
a.cp-btn-info:hover,
a.cp-btn-secondary:hover,
a.cp-btn-danger:hover {
  color: white !important;
}

/* jQuery Mobile 링크 재정의 - 방문한 링크도 포함 */
.ui-btn a,
.ui-btn a:visited {
  color: white !important;
}

/* 테이블 내 버튼의 방문한 링크도 흰색으로 */
.table a.cp-btn,
.table a.cp-btn:visited,
.table a.btn-info,
.table a.btn-info:visited,
.table a.btn-danger,
.table a.btn-danger:visited {
  color: white !important;
}

/* 아웃라인 버튼의 비활성 상태(방문했지만 활성화되지 않은 상태)는 원래 색상 유지 */
a.cp-btn-outline-primary:not(.active):visited {
  color: #2557a7 !important;
}

a.cp-btn-outline-secondary:not(.active):visited {
  color: #6d6875 !important;
}

a.cp-btn-outline-success:not(.active):visited {
  color: #2a9d8f !important;
}

/* 특수 케이스: 인라인 스타일이 적용된 버튼도 방문 후에도 흰색 유지 */
a[style*='color: white'].cp-btn:visited,
a[style*='color: white'].btn:visited,
a[style*='color: white'].cp-btn-primary:visited {
  color: white !important;
}

/* 모든 버튼 형태 링크(a 태그)의 글자색을 흰색으로 강제 설정 */
a.cp-btn,
a.btn,
a.cp-btn-primary,
a.cp-btn-info,
a.cp-btn-secondary,
a.cp-btn-danger,
a.cp-btn-outline-primary.active,
a.cp-btn-outline-secondary.active,
a.cp-btn-outline-success.active {
  color: white !important;
  text-decoration: none !important;
}

/* 버튼에 호버했을 때도 글자색은 항상 흰색 유지 */
a.cp-btn:hover,
a.btn:hover,
a.cp-btn-primary:hover,
a.cp-btn-info:hover,
a.cp-btn-secondary:hover,
a.cp-btn-danger:hover {
  color: white !important;
}

/* 테이블 내 버튼 스타일 추가 강화 */
.table .cp-btn-info,
.table .btn-info {
  color: white !important;
  background-color: #17a2b8 !important;
  border-color: #138496 !important;
}

.table .cp-btn-danger,
.table .btn-danger {
  color: white !important;
  background-color: #dc3545 !important;
  border-color: #c82333 !important;
}