/* Start custom CSS for html, class: .elementor-element-a088f6d */.package-wrapper {
  display: flex;
  flex-wrap: nowrap; /* Không cho xuống hàng */
  overflow-x: auto;   /* Cho phép cuộn ngang */
  gap: 5px;
  margin: 0 auto;
  padding: 10px;
  max-width: 100%;
  scroll-snap-type: x mandatory;
  -webkit-overflow-scrolling: touch;
}

.package-wrapper::-webkit-scrollbar {
  height: 8px;
}
.package-wrapper::-webkit-scrollbar-thumb {
  background: #ccc;
  border-radius: 4px;
}

.package-item {
  flex-shrink: 0;
  width: 25%;           /* 4 cột = 100% / 4 = 25% */
  min-width: 210px;     /* Đảm bảo kích thước tối thiểu để cuộn mượt */
  background: #fff;
  border-radius: 10px;
  box-shadow: 0 4px 10px rgba(0,0,0,0.05);
  transition: all 0.3s ease;
  text-align: center;
  overflow: hidden;
  scroll-snap-align: center;
}

.package-item img {
  width: 100%;
  display: block;
  border-bottom: 1px solid #eee;
}

.div-package {
  padding: 10px;
}

.package-name {
  display: block;
  font-weight: bold;
  font-size: 18px;
  color: #005fcc;
  margin-bottom: 5px;
  text-decoration: none;
}

.div-price span {
  color: #e53935;
  font-weight: bold;
}

.link-register {
  display: block;
  background: #3b49df;
  color: #fff;
  padding: 10px;
  margin: 10px;
  border-radius: 6px;
  text-decoration: none;
}

/* Trên mobile nhỏ hơn */
@media (max-width: 768px) {
  .package-item {
    min-width: 60%;
  }
}/* End custom CSS */