.header-button .button{background:#006685;text-transform:capitalize;font-weight:400;position:relative;border:none;-webkit-box-shadow:0 2px 4px 0 rgba(0,0,0,0.1),0 2px 4px 0 rgba(0,0,0,0.1);box-shadow:0 2px 4px 0 rgba(0,0,0,0.1),0 2px 4px 0 rgba(0,0,0,0.1);display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-transition:all 0.3s;transition:all 0.3s}.header-button .button:hover{-webkit-transform:scale(1.05);transform:scale(1.05)}.header-button .button:before{background:-webkit-gradient(linear, left top, left bottom, from(#94b3ff), to(#5b7cfe));background:linear-gradient(180deg, #94b3ff, #FFC816);content:"";border-radius:6px;inset:0;padding:2px;position:absolute;-webkit-mask:-webkit-gradient(linear, left top, left bottom, color-stop(0, #fff)) content-box,-webkit-gradient(linear, left top, left bottom, color-stop(0, #fff));-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:exclude;mask-composite:exclude}.header-button .button span{display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;position:relative;gap:5px}.header-button .button span:before{content:"";display:inline-block;width:15px;height:15px}.section_downloadqr .section-bg img{-o-object-position:right bottom;object-position:right bottom;-o-object-fit:contain;object-fit:contain}.header-button-1 .button span:before{background:transparent url(../images/user.svg) center/cover no-repeat}.header-button-2 .button span:before{background:transparent url(../images/user-add.svg) center/cover no-repeat}.header-nav>.menu-item>a{border:1px solid transparent;padding-right:8px;padding-left:8px;-webkit-transition:0s;transition:0s}.header-nav>.menu-item>a:hover img{-webkit-filter:brightness(0) invert(1);filter:brightness(0) invert(1)}.header-nav>.header-nav>.menu-item.current-menu-item>a img{-webkit-filter:brightness(0) invert(1);filter:brightness(0) invert(1)}.section_title .section-title b{background-color:transparent;opacity:1;height:24px}.section_title .section-title b:first-of-type{background:transparent url(../images/bg-title-left.png) center right no-repeat;background-size:contain}.section_title .section-title b:last-of-type{background:transparent url(../images/bg-title-right.png) center left no-repeat;background-size:contain}.game_slider .gallery-box .box-image{background:#3e3f45;border-radius:16px;-webkit-box-shadow:inset 0 -2px 2px 0 rgba(0,0,0,0.1),inset 0 1px 0 0 rgba(255,255,255,0.11),0 1px 8px 0 rgba(0,0,0,0.08);box-shadow:inset 0 -2px 2px 0 rgba(0,0,0,0.1),inset 0 1px 0 0 rgba(255,255,255,0.11),0 1px 8px 0 rgba(0,0,0,0.08);cursor:pointer;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-flex:0;-ms-flex:0 13%;flex:0 13%;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-align:center;-ms-flex-align:center;align-items:center;position:relative;overflow:hidden}.game_slider .gallery-box .box-text{background:#002D4A;color:#D4C5B1;border-radius:0 0 6px 6px;font-size:14px;line-height:1;padding:8px 0;position:absolute;bottom:0;left:0;text-align:center;width:100%}.game_slider .gallery-box .box-text p{margin:0}.game_slider .gallery-box:hover .box-text{background:#FFFF00}.game_slider.slider-nav-push:not(.slider-nav-reveal) .flickity-prev-next-button{margin-top:0;bottom:calc(50% - 15px);-webkit-transform:translateY(-50%);transform:translateY(-50%);top:auto}.box_casino{background:transparent url(../images/anh-nen-casino-bcx88.png) center no-repeat;background-size:100% 100%;border-radius:24px;overflow:hidden}.box_casino .col_right{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.box_casino .col_right .btn_playgame{background-color:#fff;color:#24262b;margin-bottom:0}.box_casino .box_main .box-text{padding:10px}.box_casino .box_main .box-text p{font-size:14px}.box_sport{background:transparent url(../images/anh-nen-sport-bcx88.png) center no-repeat;background-size:100% 100%;border-radius:24px;overflow:hidden}.box_sport .col_left{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.box_sport .box_main .box-image{margin:0}.box_sport .box_main .box-text{padding-left:18px;padding-bottom:0}@media (max-width: 549px){.section_title .section-title b:first-of-type{background-size:cover}.section_title .section-title b:last-of-type{background-size:cover}.section_downloadqr .section-bg img{display:none}}

.bcx-feature-2x2-flex {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 24px;
  padding: 30px 10px;
  background: #01111C; /* tone nền tối sang trọng */
  border-radius: 20px;
}

.feature-item {
  display: flex;
  align-items: center;
  background: #0C1C36; /* nền block tối hơn */
  border-radius: 16px;
  padding: 20px;
  box-shadow: 0 6px 12px rgba(0, 0, 0, 0.3);
  transition: 0.3s ease;
  min-height: 150px;
}

.feature-item:hover {
  transform: translateY(-4px);
  box-shadow: 0 12px 20px rgba(43, 126, 255, 0.25); /* đổ bóng màu xanh */
}

.feature-icon {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-right: 16px;
}

.feature-icon img {
  width: 48px;
  height: 48px;
  display: block;
  filter: drop-shadow(0 0 4px rgba(43, 126, 255, 0.4));
}

.feature-content h3 {
  font-size: 18px;
  font-weight: 700;
  margin: 0 0 8px;
  color: #00CFFF; /* chữ tiêu đề xanh neon */
}

.feature-content p {
  font-size: 14px;
  color: #e0e0e0; /* chữ mô tả màu xám sáng */
  margin: 0;
  line-height: 1.6;
}

/* Responsive */
@media screen and (max-width: 767px) {
  .bcx-feature-2x2-flex {
    grid-template-columns: 1fr;
  }
  .feature-item {
    flex-direction: row;
  }
}

.speed-indicator-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  gap: 30px;
  justify-items: center;
  align-items: center;
  background: #051426; /* Nền xanh đậm đồng bộ */
  padding: 40px 20px;
  border-radius: 20px;
  font-family: "Montserrat", sans-serif;
  border: 1px solid rgba(49, 132, 255, 0.2);
  box-shadow: 0 0 12px rgba(31, 122, 255, 0.15) inset;
}
/********/
.speed-indicator-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  gap: 30px;
  justify-items: center;
  align-items: center;
  background: #04142B;
  padding: 40px 20px;
  border-radius: 20px;
  font-family: "Montserrat", sans-serif;
}

.indicator {
  text-align: center;
  position: relative;
}

.circle {
  transform: rotate(-90deg);
}

.circle .bg {
  fill: none;
  stroke: #1d2939;
  stroke-width: 12;
}

.circle .progress {
  fill: none;
  stroke: #2B7EFF;
  stroke-width: 12;
  stroke-linecap: round;
  stroke-dasharray: 339.292;
  transition: stroke-dashoffset 0.5s ease-in-out;
}

.value {
  position: absolute;
  top: 30px;
  left: 0;
  right: 0;
  font-size: 14px;
  color: #00CFFF;
  font-weight: 600;
  line-height: 1.2;
}

.value .big {
  font-size: 26px;
  font-weight: 800;
  display: block;
  color: #00CFFF;
}

.value .unit {
  font-size: 13px;
  display: block;
  margin-top: 2px;
}

.label {
  margin-top: 20px;
  font-size: 13px;
  color: #FFE81F;
  font-weight: 600;
  text-transform: uppercase;
}


/* Mobile responsive */
@media screen and (max-width: 767px) {
  .bcx-feature-2x2-flex {
    grid-template-columns: 1fr;
  }
  .feature-item {
    flex-direction: row;
  }
}

.footer-partner-section {
  background: #020f1f;
  padding: 30px 10px;
  text-align: center;
  color: #ccc;
  font-size: 14px;
  line-height: 1.6;
}

.footer-menu-links {
  margin-bottom: 20px;
  font-weight: 500;
}

.footer-menu-links a {
  color: #ccc;
  margin: 0 8px;
  text-decoration: none;
}

.footer-menu-links a:hover {
  color: #FFD700;
}

.partner-logos img {
  max-width: 100%;
  height: auto;
  margin-bottom: 20px;
}

.footer-divider img {
  max-width: 180px;
  height: auto;
  margin: 20px auto;
}

.footer-warning {
  max-width: 800px;
  margin: 0 auto 20px;
  color: #aaa;
  font-size: 13px;
  line-height: 1.5;
}

.license-logos img {
  max-width: 100%;
  height: auto;
  margin-top: 10px;
  opacity: 0.9;
}

.game_slider_custom .gallery-box .box-text  {
  background: #002D4A;
  color: #D4BB8D; /* Đã sửa lỗi cú pháp */
  border-radius: 0 0 2px 2px; /* tăng bo góc */
  font-size: 20px; /* hơi lớn hơn 1 chút */
  line-height: 1.4;
  padding: 10px 0;
  position: absolute;
  bottom: 0;
  left: 0;
  text-align: center;
  width: 100%;
  font-weight: 500;
	font-size: 75px
  transition: background 0.3s ease;
}

.game_slider_custom .gallery-box:hover .box-text {
  background: #FFD700; /* màu nền khi hover */
  color: #000;
}
/* Áp dụng cho toàn bộ gallery block */
.game_slider_custom .gallery-box {
  position: relative;
  overflow: hidden;
  border-radius: 10px;
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}

/* Hiệu ứng nâng lên khi hover */
.game_slider_custom .gallery-box:hover {
  transform: translateY(-6px);
  box-shadow: 0 10px 20px rgba(0,0,0,0.25);
}

/* Ảnh trong box */
.game_slider_custom .gallery-box .box-image img {
  width: 100%;
  height: auto;
  transition: transform 0.4s ease, opacity 0.4s ease;
}

/* Zoom ảnh + mờ khi hover */
.game_slider_custom .gallery-box:hover .box-image img {
  transform: scale(1.05);
  opacity: 0.85;
}

/* Nút bắt đầu chơi - tự chèn bằng CSS */
.game_slider_custom .gallery-box .overlay-button {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  opacity: 0;
  z-index: 2;
  transition: opacity 0.3s ease;
}

/* Hiển thị overlay khi hover */
.game_slider_custom .gallery-box:hover .overlay-button {
  opacity: 1;
}

/* Tạo nút bằng CSS, không cần HTML */
.game_slider_custom .gallery-box::after {
  content: "Bắt đầu chơi";
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  background: linear-gradient(to bottom, #FFD700, #FFA500);
  padding: 10px 18px;
  border-radius: 6px;
  color: #000;
  font-weight: 600;
  font-size: 14px;
  text-align: center;
  opacity: 0;
  transition: opacity 0.3s ease;
  z-index: 2;
  pointer-events: none;
}

/* Hover mới hiện */
.game_slider_custom .gallery-box:hover::after {
  opacity: 1;
}

/* Tăng độ tối overlay nếu muốn (tùy chọn) */
.game_slider_custom .gallery-box::before {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,0.2);
  opacity: 0;
  transition: opacity 0.3s ease;
  z-index: 1;
}

.game_slider_custom .gallery-box:hover::before {
  opacity: 1;
}
