/* Supplementary fixes — rikbet scope nhiều rule vào .hot-matches, section .race-matches-block thiếu → nhân bản lại. Load sau rk-tailwind.css. */

/* Layout team trong card "Trận Đấu Sắp Tới" (World Cup canh giữa, đội-giờ-đội đều) */
.race-matches-block .item-style-1 .item-header{font-size:.75rem;line-height:1.125rem;margin-bottom:.625rem;padding-bottom:.625rem;position:relative;text-align:center;color:#fff}
.race-matches-block .item-style-1 .item-header:before{background-image:linear-gradient(90deg,#dfe3ec00,#dfe3ec 50.5%,#dfe3ec00 99.5%);bottom:0;height:1px;left:0;position:absolute;width:100%;content:""}
.race-matches-block .item-style-1 .league-name{display:-webkit-box;overflow:hidden;-webkit-box-orient:vertical;-webkit-line-clamp:1;text-transform:capitalize;word-break:break-all}
.race-matches-block .item-style-1 .item__teams{position:relative}
.race-matches-block .item-style-1 .team-time{display:flex;flex-direction:column;flex-shrink:0;order:2;padding-left:.75rem;padding-right:.75rem;text-align:center}
.race-matches-block .item-style-1 .team-time-t{background:linear-gradient(252.66deg,#1b68ff99 8.18%,#30b9ff99 63.48%,#1b68ff99 89.03%);border-radius:9999px;font-size:10px;font-weight:500;line-height:.75rem;margin-bottom:.125rem;padding:.125rem .5rem;color:#fff}
.race-matches-block .item-style-1 .team-time-d{font-size:.75rem;line-height:1.125rem}
.race-matches-block .item-style-1 .team-name{display:-webkit-box;overflow:hidden;-webkit-box-orient:vertical;-webkit-line-clamp:1;font-size:.75rem;font-weight:600;line-height:1.125rem;word-break:break-all;color:#fff}
.race-matches-block .item-style-1 .team-logo{flex-shrink:0}

/* Số tiền tổng giải "Đường Đua World Cup" -> vàng (gốc: label trắng, số vàng) */
.race-leaderboard .prize-text{color:#FFC93C}

/* Label "Tổng Giá Trị Hàng Tuần Lên Đến" gốc là text-violet-800 (tím, khó đọc trên nền hồng) -> trắng */
.race-leaderboard .text-violet-800{color:#fff !important}

/* Khung rank (giống ảnh 2 gốc): ô icon hạng nền TỐI màu trang, phần còn lại SÁNG hơn */
.race-leaderboard .top-item{background:linear-gradient(90deg,#1e4f97 0%,#2c5cab 100%);border-radius:8px;min-height:46px;height:auto !important;padding-top:5px;padding-bottom:5px;box-shadow:inset 0 1px 0 rgba(255,255,255,.12),0 2px 6px rgba(0,0,0,.22);position:relative;overflow:hidden}
/* ô icon hạng: nền tối (#0b1a35), mép phải xiên */
.race-leaderboard .top-item .rank-col{position:relative;align-self:stretch;width:60px !important;flex:0 0 60px;display:flex;align-items:center;justify-content:center}
/* panel tối hình bình hành nghiêng (skew đều) — mép phải có 2 viền chéo = divider, full đỉnh→đáy, đồng nhất mọi dòng */
.race-leaderboard .top-item .rank-col::before{content:"";position:absolute;left:-16px;top:-6px;bottom:-6px;right:0;z-index:0;background:#0b1a35;transform:skewX(13deg);border-right:2px solid rgba(152,184,230,.46)}
.race-leaderboard .top-item .rank-col::after{content:"";position:absolute;left:-16px;top:-6px;bottom:-6px;right:6px;z-index:0;transform:skewX(13deg);border-right:2px solid rgba(152,184,230,.24)}
.race-leaderboard .top-item .rank-col>*{position:relative;z-index:1}

/* === HEADER (chỉ màn rộng ≥1536px) — menu to + sát logo + nút to + header cao. Màn hẹp giữ header gốc nhỏ gọn để khỏi đè logo === */
@media (min-width:1536px){
  /* menu chữ to hơn — CHỈ target menu links trong ul.site-nav (KHÔNG đụng logo a[href=/]) */
  ul.site-nav .site-nav-item a, ul.site-nav li > a{font-size:15px !important;letter-spacing:.2px}
  /* nút đăng nhập/ký to hơn */
  header.header .auth-group-btn button{padding-left:24px !important;padding-right:24px !important;height:48px !important;font-size:16px !important;min-width:128px !important}
  /* header cao hơn (tăng chiều cao header row, KHÔNG pad vào link logo) */
  header.header .relative.mx-auto{min-height:90px}
  /* cụm (menu+nút) fill hết khoảng giữa logo và mép phải (flex-1) */
  header.header .relative.mx-auto > div:last-child{flex:1 1 0% !important}
  /* menu CĂN GIỮA khoảng trống logo↔đăng nhập (cách đều 2 bên, không dính logo) */
  header.header ul.site-nav{justify-content:center !important}
}

/* "Trận đấu hot" -> banner World Cup (ẩn nội dung mirror cũ vỡ ảnh CDN) */
.hot-matches>div{display:none}
.hot-matches .rk-hotbanner{display:block;margin-top:44px}
.hot-matches .rk-hotbanner img{display:block;width:100%;height:auto;border-radius:12px}

/* "Hot Game" -> RkGames no-hu (ẩn card mirror vỡ ảnh CDN) */
.hot-games>div:not(#rk-hotgame-mount){display:none}

/* "Top Winners" -> RkTopWinners (mirror podium không render) */
[data-v-fa1cd491]{display:none}
#rk-topwin-mount{display:block}

/* "Game Bài" -> RkGameBai (ẩn mirror vỡ ảnh) */
[data-v-ee7bb1cd]{display:none}
#rk-gamebai-mount{display:block}

/* "Nổ Hũ" -> RkNoHu (mirror jackpot rỗng/data động) */
[data-v-3d2de16a]{display:none}
#rk-nohu-mount{display:block}

/* "Khuyến Mãi" -> RkPromo (3 banner ảnh anh gửi; ẩn mirror .home-promotions) */
.home-promotions{display:none}
#rk-promo-mount{display:block}

/* "Nhà Cung Cấp" — thêm KHUNG chữ nhật nền sau mỗi logo (gốc logo trôi nổi, không khung) */
.partners .partner-item{background:linear-gradient(180deg,#13233f,#0e1a30);border:1px solid rgba(255,255,255,.07);border-radius:10px;height:64px !important;padding:0 8px;transition:border-color .2s,transform .2s}
.partners .partner-item:hover{border-color:rgba(96,150,230,.5);transform:translateY(-2px)}
.partners .partner-item img{height:auto !important;max-height:52px;max-width:94%;width:auto;object-fit:contain}

/* Logo ngân hàng/thanh toán (footer) — slider tự chạy CHẬM như gốc.
   Mirror là swiper đứng im (không có Swiper JS) -> chuyển thành CSS marquee.
   Slide đã nhân đôi (rk-bank-dup) nên translateX(-50%) = đúng 1 bộ -> loop liền mạch. */
.bank .swiper{overflow:hidden}
.bank .swiper-wrapper.rk-bank-dup{display:flex !important;width:max-content !important;transform:translateX(0);transition:none !important;animation:rk-bank-marquee 80s linear infinite;will-change:transform}
.bank .swiper-wrapper.rk-bank-dup:hover{animation-play-state:paused}
@keyframes rk-bank-marquee{from{transform:translateX(0)}to{transform:translateX(-50%)}}

/* KÊNH HỖ TRỢ — click header để xổ/đóng menu (RkSupport gắn toggle .rk-open). Mirror tĩnh: trượt bằng right. */
.floating-button{transition:right .35s cubic-bezier(.22,.61,.36,1) !important}
.floating-button.rk-open{right:0 !important}
.floating-button__header{cursor:pointer;user-select:none}
/* MINI GAME mirror (PNG bg/mini/game thiếu trên easygate) -> ẩn, dùng RkMiniGame tự dựng */
.draggable-icon.mini-game{display:none !important}
/* Widget nổi "Hũ Sắp Nổ / 216 tỷ" (mega-jackpot-touch, data-v-ec3a233b): PNG touch-icon/touch-logo/close thiếu
   -> icon vỡ + z-53 đè lên menu hỗ trợ khi xổ. Không cần (đã có section Nổ Hũ) -> ẩn hẳn. */
[data-v-ec3a233b]{display:none !important}
/* Menu KÊNH HỖ TRỢ luôn nổi trên mọi widget khác khi xổ */
.floating-button{z-index:60 !important}

/* === World Cup: cột "Trận Đấu Sắp Tới" (trái) cao BẰNG cột "Đường Đua" (phải) — gốc 2 cột đều đáy, mình bị ngắn ~24px === */
@media (min-width:1024px){
  /* hàng bọc 2 cột: bỏ items-start (lệch đáy) -> stretch cho 2 cột cao bằng nhau.
     Target chuẩn = phần tử có con trực tiếp .race-matches-block (chính là hàng đó) */
  :has(> .race-matches-block){align-items:stretch !important}
  /* cột matches -> flex-col để khối swiper fill phần dưới tiêu đề */
  .race-matches-block{display:flex;flex-direction:column}
  .race-matches-block .race-matches{flex:1 1 auto;min-height:0;display:flex;flex-direction:column}
  .race-matches-block .race-matches-swiper{flex:1 1 auto;min-height:0}
  .race-matches-block .race-matches-swiper>.swiper-wrapper{height:100%}
  .race-matches-block .race-matches-swiper .swiper-slide{height:100% !important}
  /* CHỈ grid ngoài (ô chứa 4 card) — KHÔNG đụng grid kèo HDP/OU bên trong card */
  .race-matches-block .swiper-slide>.grid{height:100%;grid-template-rows:1fr 1fr}
  .race-matches-block .item-style-1{height:100%}
}

/* ── floating-button (KÊNH HỖ TRỢ): class Tailwind -right-[179px] bị purge → fix cứng ── */
.floating-button{position:fixed !important;right:-179px !important;bottom:160px;z-index:60 !important;transition:right .35s cubic-bezier(.22,.61,.36,1) !important}
.floating-button.rk-open{right:0 !important}

/* ════════ MOBILE (responsive) ════════ */
/* Bottom nav (RkMobileNav): chỉ hiện < lg, ẩn trên desktop */
@media (min-width: 1024px) { .rk-mobile-nav { display: none !important; } }
/* Mobile: ẩn nút mini-game nổi (đã có ô giữa bottom nav) + floating KÊNH HỖ TRỢ (gộp vào ô Hỗ trợ) */
@media (max-width: 1023px) {
  .rk-minigame-float { display: none !important; }
  .floating-button { display: none !important; }
  /* Fix typo capture max-height:calc(100dvh - /80px) -> rail trái cuộn dọc đúng khi nhiều menu */
  .main-sidebar-menu { max-height: calc(100dvh - 80px) !important; }
  /* Footer mobile rỗng (chỉ desktop content hidden) -> bỏ chiếm chỗ, tránh che bottom nav */
  footer.fixed { position: static !important; }
}

/* Trận Đấu Sắp Tới: mobile -> FLATTEN tất cả trận thành 1 hàng ngang, 1 TRẬN/MÀN + scroll-snap.
   display:contents bỏ box của .swiper-slide + .grid -> mọi .item-style-1 thành flex item của .swiper-wrapper.
   transform:none đè translateX của RkMatchSlider; nút ‹ › wire sang scrollBy (RkMatchSlider nhánh mobile). */
@media (max-width: 900px) {
  .race-matches-block .race-matches-swiper { overflow: hidden; }
  .race-matches-block .swiper-wrapper {
    display: flex !important; flex-wrap: nowrap !important;
    overflow-x: auto; scroll-snap-type: x mandatory; -webkit-overflow-scrolling: touch;
    transform: none !important; scrollbar-width: none;
  }
  .race-matches-block .swiper-wrapper::-webkit-scrollbar { display: none; }
  .race-matches-block .swiper-slide,
  .race-matches-block .swiper-slide > .grid { display: contents !important; }
  .race-matches-block .item-style-1 {
    flex: 0 0 100% !important; width: 100% !important; max-width: 100% !important;
    scroll-snap-align: start;
  }
}

/* Rebuild Sòng Bài mobile: ẨN lobby tĩnh .home-tab (Game Hot/Chơi Nhiều/Top Winner — nhiều card
   fake + icon vỡ), thay bằng <RkLiveCasino/> (2 stream live thật + lưới game casino sạch).
   .home-tab vốn xl/lg:hidden (mobile-only) -> ẩn hẳn. Mount RkLiveCasino chỉ hiện < lg. */
.home-tab { display: none !important; }
.rk-lc-mount { display: block; }
@media (min-width: 1024px) { .rk-lc-mount { display: none !important; } }
