/* Chuyển theme dark. */
body.bg-dark section h2 {
  color: #ffd700;
}

body.bg-dark thead tr th {
  color: #393e46;
  background-color: #ffd700;
  border: 1px solid #000;
}

body.bg-dark tbody tr td {
  background-color: #fffbe0;
  border: 1px solid #000;
}

body.bg-dark .dropdown-content td {
  border-left: 1px solid #000;
  border-color: #000;
  background-color: #f0e19e;
}

body.bg-dark .table thead tr th:nth-child(3) {
  border-right: 1px solid #000;
}

body.bg-dark .swiper-container {
  background-color: #fffbe0;
  border: 5px solid #ffd700;
}

body.bg-dark .banner-section img {
  border-color: #ffd700;
}

/* Theme light. */
.slide-section h2 {
  text-align: center;
  margin-bottom: 20px;
}

.section-title {
  text-align: center;
  margin: 40px 0 20px;
  font-size: 36px;
  font-weight: bold;
  color: #393e46;
  text-transform: uppercase;
}

/* Ẩn phân trang */
.swiper-pagination {
  display: none;
}

.swiper-container {
  width: 100%;
  position: relative;
  height: auto;
  overflow: hidden;
  border: 5px solid #393e46; /* Viền xung quanh nhóm slide */
  border-radius: 15px; /* Tùy chỉnh để viền bo tròn nếu cần */
  padding: 15px 20px 15px 20px;
  box-sizing: border-box; /* Tính cả viền và padding trong kích thước container */
}

.swiper-slide {
  display: flex;
  flex-direction: column;
  align-items: center;
  cursor: pointer;
  transition: transform 0.3s ease;
}

.swiper-slide:hover {
  transform: scale(1.1); /* Phóng to slide khi hover */
  z-index: 10; /* Đảm bảo slide phóng to nằm trên các slide khác */
}

.swiper-slide img {
  width: 100%;
  max-width: 300px;
  border-radius: 10px;
}

.info {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  background: rgba(0, 0, 0, 0.5);
  text-align: center;
  font-size: 18px;
  color: white;
  padding: 10px;
  border-radius: 0 0 10px 10px;
  display: none;
  z-index: 11;
}

.swiper-slide-active .info {
  display: block;
}

table {
  width: 100%;
  border-collapse: collapse;
  margin: 20px 0;
}

.table {
  background-color: #f8f9fa; /* Màu nền mới (bạn có thể thay đổi mã màu này) */
}

.table th {
  background-color: #343a40; /* Màu nền cho tiêu đề */
  color: #ffffff; /* Màu chữ cho tiêu đề */
}

.table td {
  background-color: #ffffff; /* Màu nền cho ô dữ liệu */
}

thead tr th {
  text-align: left;
  padding-bottom: 8px;
  border: 1px solid #ccc;
}

.table th:nth-child(3),
.table td:nth-child(3) {
  border-right: none;
}

.table th:last-child,
.table td:last-child {
  border-left: none;
}

.table thead tr th:nth-child(3) {
  border-right: 1px solid #ccc;
}

th,
td {
  padding: 10px;
  text-align: left;
  border: none;
  border: 1px solid #ccc;
}

.dropdown-content {
  display: none; /* Ẩn mặc định */
  border: 1px solid #ccc; /* Đường viền cho dropdown */
  padding: 10px; /* Khoảng cách bên trong dropdown */
}

.dropdown-content tr {
  border-left: 1px solid #ccc;
}

.dropdown-content td {
  background-color: #eeeeee;
}

.dropdown-content p {
  line-height: 1.5; /* Khoảng cách giữa các dòng */
  color: #393e46; /* Màu chữ */
  margin-bottom: 10px;
  padding: 0 10px 0 15px;
}

.dropdown-content ul {
  padding: 0 0 0 50px;
}

.dropdown-content ul li {
  color: #393e46;
  margin-bottom: 5px; /* Khoảng cách giữa các mục trong danh sách */
}

.hightlight {
  color: #f95959;
  font-weight: bold;
}

.dropdown-button {
  cursor: pointer;
  color: #000;
  font-size: 20px;
}

.dropdown-button:hover {
  color: #000;
}

.size-6 {
  width: 24px; /* Thay đổi kích thước theo nhu cầu */
  height: 24px; /* Thay đổi kích thước theo nhu cầu */
}

.down-icon {
  transform: rotate(0deg); /* Mũi tên xuống */
  transition: transform 0.3s; /* Hiệu ứng chuyển đổi */
}

.up-icon {
  transform: rotate(180deg); /* Mũi tên lên */
  transition: transform 0.3s; /* Hiệu ứng chuyển đổi */
}

.banner-section {
  display: block; /* Đặt các banner theo chiều dọc */
  text-align: center; /* Căn giữa các ảnh nếu cần */
}

.banner-section img {
  width: 100%; /* Đảm bảo các banner chiếm toàn bộ chiều rộng của container */
  max-width: 1920px; /* Giới hạn chiều rộng tối đa cho banner, bạn có thể thay đổi giá trị này */
  height: auto; /* Giữ tỷ lệ ảnh */
  margin: 20px 0; /* Thêm khoảng cách giữa các ảnh */
  border: 3px solid #000;
}