/* theme_custom_css */
/* ============================================================
   VAYBULL — DESKTOP V1
   Amaç:
   1) Stake esintili koyu lacivert + mavi renk sistemi
   2) GİRİŞ / ÜYE OL alanını sade ve premium yap
   3) Logoyu bozmadan büyüt

   Kullanım:
   - Ortak CSS dosyanız AYNI KALSIN.
   - Bu dosyayı masaüstü özel CSS olarak ortak CSS'ten SONRA yükleyin.
   ============================================================ */

@media (min-width: 701px) {

  /* ------------------------------------------------------------
     1. RENK SİSTEMİ
     ------------------------------------------------------------ */
  :root {
    --b: 15, 33, 46 !important;               /* #0f212e */
    --b-hover: 33, 55, 67 !important;         /* #213743 */

    --header: 15, 33, 46 !important;
    --header-hover: 33, 55, 67 !important;

    --menu: 15, 33, 46 !important;
    --menu-hover: 33, 55, 67 !important;

    --tab-navigation: 15, 33, 46 !important;
    --tab-navigation-hover: 33, 55, 67 !important;

    --hero: 20, 117, 225 !important;           /* #1475e1 */
    --hero-hover: 16, 94, 181 !important;

    --accent: 20, 117, 225 !important;
    --accent-hover: 16, 94, 181 !important;

    --oc-1: 20, 117, 225 !important;
    --oc-1-hover: 16, 94, 181 !important;
    --oc-1-sc: 255, 255, 255 !important;

    --oc-2: 20, 117, 225 !important;
    --oc-2-hover: 16, 94, 181 !important;

    --site-bg: #0f212e;
    --chrome-1: #0f212e;
    --chrome-2: #213743;

    --gold: #1475e1;
    --gold-hi: #5db7ff;
    --gold-deep: #0f5db3;
    --gold-line: rgba(20, 117, 225, .34);

    --site-bar-fg: #eaf6ff;
  }

  html,
  body,
  #root.layout-bc {
    background-color: #0f212e !important;
  }

  html body #root .layout-header-holder-bc {
    background: #0f212e !important;
    border-bottom: 1px solid rgba(255, 255, 255, .06) !important;
    box-shadow: none !important;
  }

  html body #root .header-bc,
  html body #root .hdr-main-content-bc {
    background: #0f212e !important;
  }


  /* ------------------------------------------------------------
     2. HEADER + LOGO
     ------------------------------------------------------------ */
  html body #root .hdr-main-content-bc {
    height: 76px !important;
    min-height: 76px !important;
  }

  html body #root .logo-container {
    display: flex !important;
    align-items: center !important;
    overflow: visible !important;
  }

  html body #root .logo-container .hdr-logo-bc {
    width: 220px !important;
    min-width: 220px !important;
    max-width: 220px !important;
    height: auto !important;
    max-height: 54px !important;
    object-fit: contain !important;
    object-position: left center !important;
  }


  /* ------------------------------------------------------------
     3. GİRİŞ / ÜYE OL — Stake-benzeri sade dil
     ------------------------------------------------------------ */
  html body #root .hdr-main-content-bc .hdr-user-bc {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
  }

  html body #root .hdr-main-content-bc
  .hdr-user-bc > button.btn.s-small.sign-in {
    appearance: none !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    height: 42px !important;
    padding: 0 14px !important;
    margin: 0 !important;

    border: 0 !important;
    border-radius: 4px !important;
    background: transparent !important;
    box-shadow: none !important;

    color: #ffffff !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    line-height: 1 !important;
    letter-spacing: 0 !important;
    text-decoration: none !important;
    text-shadow: none !important;
  }

  html body #root .hdr-main-content-bc
  .hdr-user-bc > button.btn.s-small.sign-in::after {
    display: none !important;
    content: none !important;
  }

  html body #root .hdr-main-content-bc
  .hdr-user-bc > button.btn.s-small.sign-in:hover {
    color: #dbeeff !important;
  }

  html body #root .hdr-main-content-bc
  .hdr-user-bc > button.btn.s-small.register {
    appearance: none !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    height: 42px !important;
    min-width: 84px !important;
    padding: 0 18px !important;
    margin: 0 !important;

    border: 0 !important;
    border-radius: 4px !important;
    background: #1475e1 !important;
    box-shadow: 0 1px 3px rgba(0, 0, 0, .24) !important;

    color: #ffffff !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    line-height: 1 !important;
    letter-spacing: 0 !important;
    text-decoration: none !important;
    text-shadow: none !important;
  }

  html body #root .hdr-main-content-bc
  .hdr-user-bc > button.btn.s-small.register:hover {
    background: #1a7fea !important;
  }

  html body #root .hdr-main-content-bc
  .hdr-user-bc > button.btn.s-small.register:active {
    background: #0f68ca !important;
    transform: translateY(1px);
  }
}


/* ============================================================
   PREMIUM NAV MOTION
   Video referansındaki dolaşan border efektinin Vaybull mavi yorumu.
   ============================================================ */

@property --vb-nav-angle {
  syntax: "<angle>";
  initial-value: 0deg;
  inherits: false;
}

@keyframes vbNavOrbit {
  to { --vb-nav-angle: 360deg; }
}

@keyframes vbNavBreathe {
  0%, 100% {
    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.035),
      0 4px 12px rgba(0,0,0,.12);
  }
  50% {
    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.055),
      0 5px 14px rgba(0,0,0,.16),
      0 0 13px rgba(20,117,225,.075);
  }
}

@media (min-width:701px) {

  /* ÜST NAV KABUĞU */
  html body #root .hdr-navigation-scrollable-bc-holder {
    position: relative !important;
    min-height: 64px !important;
    padding: 10px 12px !important;
    box-sizing: border-box !important;

    background:
      radial-gradient(circle at 20% -90%, rgba(70,175,255,.09), transparent 50%),
      linear-gradient(180deg, #132a37 0%, #0d202b 58%, #0b1b25 100%) !important;

    border-top: 1px solid rgba(255,255,255,.035) !important;
    border-bottom: 1px solid rgba(91,188,255,.11) !important;

    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.025),
      0 8px 22px rgba(0,0,0,.12) !important;
  }

  html body #root .hdr-navigation-scrollable-bc-holder::after {
    content: "" !important;
    position: absolute !important;
    left: 16px !important;
    right: 16px !important;
    bottom: 0 !important;
    height: 1px !important;

    background:
      linear-gradient(
        90deg,
        transparent,
        rgba(81,190,255,.13) 20%,
        rgba(81,190,255,.27) 50%,
        rgba(81,190,255,.13) 80%,
        transparent
      ) !important;

    pointer-events: none !important;
  }

  html body #root .hdr-navigation-scrollable-bc {
    min-height: 44px !important;
    background: transparent !important;
  }

  html body #root nav.hdr-navigation-scrollable-content {
    display: flex !important;
    align-items: center !important;
    gap: 9px !important;

    min-height: 44px !important;
    padding: 0 !important;

    background: transparent !important;
  }

  html body #root nav.hdr-navigation-scrollable-content
  > a.hdr-navigation-link-bc {
    --vb-nav-angle: 0deg;

    position: relative !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    height: 42px !important;
    padding: 0 18px !important;

    border: 1px solid transparent !important;
    border-radius: 12px !important;

    background:
      linear-gradient(180deg, rgba(25,51,65,.98), rgba(13,31,42,.98)) padding-box,
      conic-gradient(
        from var(--vb-nav-angle),
        transparent 0deg,
        transparent 255deg,
        rgba(92,205,255,.05) 280deg,
        rgba(114,220,255,.72) 314deg,
        #1475e1 335deg,
        rgba(20,117,225,.12) 348deg,
        transparent 360deg
      ) border-box !important;

    color: rgba(239,247,251,.88) !important;

    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.035),
      0 4px 12px rgba(0,0,0,.12) !important;

    text-decoration: none !important;

    animation:
      vbNavOrbit 6s linear infinite,
      vbNavBreathe 4s ease-in-out infinite !important;

    transition:
      transform .16s ease,
      filter .16s ease !important;
  }

  html body #root nav.hdr-navigation-scrollable-content
  > a.hdr-navigation-link-bc:nth-child(2) { animation-delay: -.9s, -.45s !important; }

  html body #root nav.hdr-navigation-scrollable-content
  > a.hdr-navigation-link-bc:nth-child(3) { animation-delay: -1.8s, -.9s !important; }

  html body #root nav.hdr-navigation-scrollable-content
  > a.hdr-navigation-link-bc:nth-child(4) { animation-delay: -2.7s, -1.35s !important; }

  html body #root nav.hdr-navigation-scrollable-content
  > a.hdr-navigation-link-bc:nth-child(5) { animation-delay: -3.6s, -1.8s !important; }

  html body #root nav.hdr-navigation-scrollable-content
  > a.hdr-navigation-link-bc > .nav-menu-title {
    color: inherit !important;
    font-size: 11px !important;
    line-height: 1 !important;
    font-weight: 700 !important;
    letter-spacing: .025em !important;
    text-transform: uppercase !important;
    white-space: nowrap !important;
    text-shadow: 0 1px 1px rgba(0,0,0,.22) !important;
  }

  /* Masaüstünde hover: efekt biraz hızlanır ve buton bir piksel yükselir */
  html body #root nav.hdr-navigation-scrollable-content
  > a.hdr-navigation-link-bc:hover {
    color: #fff !important;
    transform: translateY(-1px) !important;
    filter: brightness(1.08) !important;
    animation-duration: 3.2s, 2.5s !important;
  }

  html body #root nav.hdr-navigation-scrollable-content
  > a.hdr-navigation-link-bc.active,
  html body #root nav.hdr-navigation-scrollable-content
  > a.hdr-navigation-link-bc.selected,
  html body #root nav.hdr-navigation-scrollable-content
  > a.hdr-navigation-link-bc.current,
  html body #root nav.hdr-navigation-scrollable-content
  > a.hdr-navigation-link-bc[aria-current="page"] {
    color: #fff !important;

    background:
      linear-gradient(180deg, rgba(30,83,112,.99), rgba(16,50,69,.99)) padding-box,
      conic-gradient(
        from var(--vb-nav-angle),
        rgba(91,197,255,.16),
        #76d6ff,
        #1475e1,
        rgba(91,197,255,.16)
      ) border-box !important;

    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.07),
      0 6px 15px rgba(0,0,0,.15),
      0 0 15px rgba(20,117,225,.09) !important;
  }

  @media (prefers-reduced-motion: reduce) {
    html body #root nav.hdr-navigation-scrollable-content
    > a.hdr-navigation-link-bc {
      animation: none !important;
      background:
        linear-gradient(180deg, rgba(25,51,65,.98), rgba(13,31,42,.98)) padding-box,
        linear-gradient(90deg, rgba(92,205,255,.20), rgba(20,117,225,.45)) border-box !important;
    }
  }
}


/* ============================================================
   DESKTOP NAV V3 — GERÇEK MASAÜSTÜ DOM (.bg-nav*)
   Ortak CSS notlarına göre masaüstü navbarı overlay.css yönetiyor.
   Mobildeki .hdr-navigation-* yapısı masaüstünde kullanılmıyor.
   ============================================================ */

@media (min-width:701px) {

  /* Ana desktop nav kabuğu */
  html body #root .layout-header-holder-bc .nav-content-bc,
  html body #root .layout-header-holder-bc .bg-nav-wrap {
    position: relative !important;
  }

  html body #root .layout-header-holder-bc .bg-nav-wrap {
    padding: 8px 10px !important;

    background:
      radial-gradient(circle at 18% -90%, rgba(78,191,255,.10), transparent 48%),
      linear-gradient(180deg, #132a37 0%, #0e202b 58%, #0b1b25 100%) !important;

    border-top: 1px solid rgba(255,255,255,.035) !important;
    border-bottom: 1px solid rgba(91,188,255,.12) !important;

    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.025),
      0 8px 22px rgba(0,0,0,.12) !important;
  }

  html body #root .layout-header-holder-bc .bg-nav {
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
  }

  /* Gerçek masaüstü liste */
  html body #root .layout-header-holder-bc .bg-nav-list {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 9px !important;

    min-height: 44px !important;

    margin: 0 !important;
    padding: 0 !important;

    background: transparent !important;

    overflow-x: auto !important;
    overflow-y: visible !important;

    scrollbar-width: none !important;
    -ms-overflow-style: none !important;
  }

  html body #root .layout-header-holder-bc .bg-nav-list::-webkit-scrollbar {
    display: none !important;
  }


  /* ------------------------------------------------------------
     MENÜ KARTI
     Doğrudan çocuk ne olursa olsun (li / a / div) aynı premium yüzey.
     Bu sayede overlay DOM tag'i değişse bile tasarım bozulmaz.
     ------------------------------------------------------------ */
  html body #root .layout-header-holder-bc .bg-nav-list > * {
    --vb-nav-angle: 0deg;

    position: relative !important;

    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    flex: 0 0 auto !important;

    min-height: 42px !important;
    min-width: max-content !important;

    margin: 0 !important;
    padding: 0 !important;

    box-sizing: border-box !important;

    border: 1px solid transparent !important;
    border-radius: 12px !important;

    background:
      linear-gradient(180deg, rgba(25,51,65,.98), rgba(13,31,42,.98)) padding-box,
      conic-gradient(
        from var(--vb-nav-angle),
        transparent 0deg,
        transparent 252deg,
        rgba(92,205,255,.04) 276deg,
        rgba(118,220,255,.72) 312deg,
        #1475e1 335deg,
        rgba(20,117,225,.13) 349deg,
        transparent 360deg
      ) border-box !important;

    color: rgba(240,248,252,.90) !important;

    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.035),
      0 4px 12px rgba(0,0,0,.12) !important;

    animation:
      vbNavOrbit 6s linear infinite,
      vbNavBreathe 4s ease-in-out infinite !important;

    transition:
      transform .16s ease,
      filter .16s ease,
      box-shadow .16s ease !important;
  }

  /* Anchor içerideyse ölçüyü o doldursun */
  html body #root .layout-header-holder-bc .bg-nav-list > * > a,
  html body #root .layout-header-holder-bc .bg-nav-list > a {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    width: 100% !important;
    min-height: 40px !important;

    padding: 0 18px !important;

    color: inherit !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;

    text-decoration: none !important;
  }

  /* Metin dili */
  html body #root .layout-header-holder-bc .bg-nav-list > *,
  html body #root .layout-header-holder-bc .bg-nav-list > * > a,
  html body #root .layout-header-holder-bc .bg-nav-list .nav-menu-title,
  html body #root .layout-header-holder-bc .bg-nav-list .nav-menu-item {
    font-size: 11px !important;
    font-weight: 700 !important;
    letter-spacing: .025em !important;
    text-transform: uppercase !important;
    white-space: nowrap !important;
  }


  /* Her kutu aynı noktada parlamasın */
  html body #root .layout-header-holder-bc .bg-nav-list > *:nth-child(2) {
    animation-delay: -.9s, -.45s !important;
  }

  html body #root .layout-header-holder-bc .bg-nav-list > *:nth-child(3) {
    animation-delay: -1.8s, -.9s !important;
  }

  html body #root .layout-header-holder-bc .bg-nav-list > *:nth-child(4) {
    animation-delay: -2.7s, -1.35s !important;
  }

  html body #root .layout-header-holder-bc .bg-nav-list > *:nth-child(5) {
    animation-delay: -3.6s, -1.8s !important;
  }

  html body #root .layout-header-holder-bc .bg-nav-list > *:nth-child(6) {
    animation-delay: -4.5s, -2.25s !important;
  }


  /* Hover — video hissine yakın, ama temiz */
  @media (hover:hover) {
    html body #root .layout-header-holder-bc .bg-nav-list > *:hover {
      color: #fff !important;

      transform: translateY(-1px) !important;
      filter: brightness(1.08) !important;

      box-shadow:
        inset 0 1px 0 rgba(255,255,255,.055),
        0 6px 15px rgba(0,0,0,.15),
        0 0 16px rgba(20,117,225,.10) !important;

      animation-duration: 3.2s, 2.5s !important;
    }
  }


  /* Aktif sekme için yaygın state'ler */
  html body #root .layout-header-holder-bc .bg-nav-list > *.active,
  html body #root .layout-header-holder-bc .bg-nav-list > *.selected,
  html body #root .layout-header-holder-bc .bg-nav-list > *.current,
  html body #root .layout-header-holder-bc .bg-nav-list > *.vay-perf-nav-current,
  html body #root .layout-header-holder-bc .bg-nav-list > a[aria-current="page"] {
    color: #fff !important;

    background:
      linear-gradient(180deg, rgba(31,85,113,.99), rgba(16,51,70,.99)) padding-box,
      conic-gradient(
        from var(--vb-nav-angle),
        rgba(91,197,255,.15),
        #7bddff,
        #1475e1,
        rgba(91,197,255,.15)
      ) border-box !important;

    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.08),
      0 6px 15px rgba(0,0,0,.15),
      0 0 16px rgba(20,117,225,.11) !important;
  }


  /* Alt şerit varsa daha sakin kalsın */
  html body #root .layout-header-holder-bc .bg-subnav {
    background: #0d202b !important;
    border-top: 1px solid rgba(255,255,255,.025) !important;
  }

  html body #root .layout-header-holder-bc .bg-subnav-list {
    background: transparent !important;
  }


  @media (prefers-reduced-motion: reduce) {
    html body #root .layout-header-holder-bc .bg-nav-list > * {
      animation: none !important;

      background:
        linear-gradient(180deg, rgba(25,51,65,.98), rgba(13,31,42,.98)) padding-box,
        linear-gradient(90deg, rgba(92,205,255,.18), rgba(20,117,225,.42)) border-box !important;
    }
  }
}


/* ============================================================
   DESKTOP NAV V4 — FRAME FILL
   Menü artık çerçevenin tamamını eşit biçimde doldurur.
   ============================================================ */

@media (min-width:701px) {

  html body #root .layout-header-holder-bc .bg-nav-wrap {
    width: 100% !important;
    padding: 9px 10px !important;
  }

  html body #root .layout-header-holder-bc .bg-nav-list {
    width: 100% !important;
    min-height: 48px !important;

    display: flex !important;
    align-items: stretch !important;
    justify-content: stretch !important;

    gap: 8px !important;
  }

  /* Her ana kategori çerçevede eşit pay alır */
  html body #root .layout-header-holder-bc .bg-nav-list > * {
    flex: 1 1 0 !important;
    min-width: 0 !important;
    width: auto !important;

    min-height: 48px !important;
    height: 48px !important;

    border-radius: 12px !important;
  }

  html body #root .layout-header-holder-bc .bg-nav-list > * > a,
  html body #root .layout-header-holder-bc .bg-nav-list > a {
    width: 100% !important;
    height: 100% !important;
    min-height: 48px !important;

    padding: 0 12px !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    gap: 7px !important;

    overflow: hidden !important;
  }

  /* Metin biraz daha tok ve okunaklı */
  html body #root .layout-header-holder-bc .bg-nav-list .nav-menu-title,
  html body #root .layout-header-holder-bc .bg-nav-list .nav-menu-item,
  html body #root .layout-header-holder-bc .bg-nav-list > * > a {
    font-size: 11.5px !important;
    font-weight: 700 !important;
    letter-spacing: .018em !important;
  }

  /* İkonlar varsa bir tık büyüsün */
  html body #root .layout-header-holder-bc .bg-nav-list i,
  html body #root .layout-header-holder-bc .bg-nav-list svg {
    flex: 0 0 auto !important;
    font-size: 15px !important;
    width: 16px !important;
    height: 16px !important;
  }

  /* Çok geniş ekranlarda menü daha ferah */
  @media (min-width:1500px) {
    html body #root .layout-header-holder-bc .bg-nav-list > * {
      min-height: 50px !important;
      height: 50px !important;
    }

    html body #root .layout-header-holder-bc .bg-nav-list > * > a,
    html body #root .layout-header-holder-bc .bg-nav-list > a {
      min-height: 50px !important;
      padding-inline: 14px !important;
    }

    html body #root .layout-header-holder-bc .bg-nav-list .nav-menu-title,
    html body #root .layout-header-holder-bc .bg-nav-list .nav-menu-item,
    html body #root .layout-header-holder-bc .bg-nav-list > * > a {
      font-size: 12px !important;
    }
  }
}


/* ============================================================
   VAYBULL DESKTOP — COLOR FINAL V5
   Bu blok dosyanın EN SONUNDA kalmalı.
   Renkleri direkt gerçek desktop DOM'a basar.
   ============================================================ */

@media (min-width:701px){

  :root{
    --b: 7, 20, 30 !important;
    --b-hover: 15, 39, 53 !important;

    --header: 7, 20, 30 !important;
    --header-hover: 15, 39, 53 !important;

    --menu: 7, 20, 30 !important;
    --menu-hover: 15, 39, 53 !important;

    --tab-navigation: 7, 20, 30 !important;
    --tab-navigation-hover: 15, 39, 53 !important;

    --hero: 19, 123, 232 !important;
    --hero-hover: 24, 145, 255 !important;

    --accent: 19, 123, 232 !important;
    --accent-hover: 24, 145, 255 !important;

    --oc-1: 19, 123, 232 !important;
    --oc-1-hover: 24, 145, 255 !important;
    --oc-1-sc: 255,255,255 !important;

    --oc-2: 19, 123, 232 !important;
    --oc-2-hover: 24, 145, 255 !important;

    --site-bg:#07141e !important;
    --chrome-1:#091b26 !important;
    --chrome-2:#102a38 !important;

    --gold:#137be8 !important;
    --gold-hi:#69d9ff !important;
    --gold-deep:#0f5fae !important;
    --gold-line:rgba(19,123,232,.34) !important;
    --site-bar-fg:#eef8ff !important;
  }

  html,
  body,
  html body #root.layout-bc{
    background:#07141e !important;
    background-color:#07141e !important;
  }

  html body #root .layout-header-holder-bc,
  html body #root .header-bc,
  html body #root .hdr-main-content-bc{
    background:#091b26 !important;
    background-color:#091b26 !important;
  }

  html body #root .layout-header-holder-bc{
    border-bottom:1px solid rgba(105,217,255,.10) !important;
  }

  /* GİRİŞ */
  html body #root .hdr-main-content-bc
  .hdr-user-bc > button.btn.s-small.sign-in{
    color:#f4f9fc !important;
    background:transparent !important;
    border:0 !important;
    box-shadow:none !important;
  }

  /* ÜYE OL */
  html body #root .hdr-main-content-bc
  .hdr-user-bc > button.btn.s-small.register{
    background:#137be8 !important;
    color:#fff !important;
    border:0 !important;
    box-shadow:0 2px 7px rgba(19,123,232,.22) !important;
  }

  /* PARA YATIR gibi ana CTA'lar */
  html body #root .hdr-main-content-bc .btn.a-color{
    background:#137be8 !important;
    color:#fff !important;
    border-color:transparent !important;
  }

  /* DESKTOP PREMIUM NAV */
  html body #root .layout-header-holder-bc .bg-nav-wrap{
    background:
      radial-gradient(circle at 20% -80%,rgba(105,217,255,.10),transparent 48%),
      linear-gradient(180deg,#102a38 0%,#0c2230 58%,#091b26 100%) !important;

    border-top:1px solid rgba(255,255,255,.025) !important;
    border-bottom:1px solid rgba(105,217,255,.12) !important;
  }

  html body #root .layout-header-holder-bc .bg-nav-list > *{
    background:
      linear-gradient(180deg,#153241,#0d2431) padding-box,
      conic-gradient(
        from var(--vb-nav-angle),
        transparent 0deg,
        transparent 250deg,
        rgba(105,217,255,.05) 276deg,
        rgba(105,217,255,.70) 312deg,
        #137be8 336deg,
        rgba(19,123,232,.12) 349deg,
        transparent 360deg
      ) border-box !important;

    color:#eaf5fb !important;
  }

  html body #root .layout-header-holder-bc .bg-nav-list > *.active,
  html body #root .layout-header-holder-bc .bg-nav-list > *.selected,
  html body #root .layout-header-holder-bc .bg-nav-list > *.current,
  html body #root .layout-header-holder-bc .bg-nav-list > *.vay-perf-nav-current,
  html body #root .layout-header-holder-bc .bg-nav-list > a[aria-current="page"]{
    background:
      linear-gradient(180deg,#17608a,#103d59) padding-box,
      conic-gradient(
        from var(--vb-nav-angle),
        rgba(105,217,255,.18),
        #69d9ff,
        #137be8,
        rgba(105,217,255,.18)
      ) border-box !important;

    color:#fff !important;
    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.07),
      0 6px 14px rgba(0,0,0,.14),
      0 0 15px rgba(19,123,232,.10) !important;
  }

  html body #root .layout-header-holder-bc .bg-subnav{
    background:#0c2230 !important;
    border-top-color:rgba(255,255,255,.025) !important;
  }
}


/* ============================================================
   VAYBULL DESKTOP V6 — STEP 1
   1) Aktif üst menüyü daha premium ve belirgin yap
   2) "SİZDEN GELENLER" bölümünü komple kaldır
   Mevcut frame-fill / renk / animasyon yapısını bozmaz.
   ============================================================ */

@media (min-width:701px){

  /* ------------------------------------------------------------
     SİZDEN GELENLER — KOMPLE KALDIR
     ------------------------------------------------------------ */
  html body #root.is-home-page
  .hm-row-bc.vay-perf-featured-bk-row{
    display:none !important;
    height:0 !important;
    min-height:0 !important;
    max-height:0 !important;
    margin:0 !important;
    padding:0 !important;
    overflow:hidden !important;
  }

  html body #root.is-home-page .featuredGames.vay-perf-has-bk{
    display:none !important;
    height:0 !important;
    min-height:0 !important;
    margin:0 !important;
    padding:0 !important;
    overflow:hidden !important;
  }

  html body #root.is-home-page
  .page-view-more.vay-perf-before-bk,
  html body #root.is-home-page
  .serit-kenar.vay-perf-has-bk,
  html body #root.is-home-page
  .bk-serit{
    display:none !important;
  }


  /* ------------------------------------------------------------
     İNAKTİF ANA MENÜLER — biraz daha sakin
     ------------------------------------------------------------ */
  html body #root .layout-header-holder-bc .bg-nav-list > *{
    color:rgba(233,243,248,.80) !important;

    background:
      linear-gradient(180deg,#132d3a,#0c222e) padding-box,
      conic-gradient(
        from var(--vb-nav-angle),
        transparent 0deg,
        transparent 270deg,
        rgba(105,217,255,.025) 292deg,
        rgba(105,217,255,.34) 320deg,
        rgba(19,123,232,.48) 339deg,
        rgba(19,123,232,.06) 350deg,
        transparent 360deg
      ) border-box !important;

    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.018),
      0 3px 9px rgba(0,0,0,.10) !important;
  }


  /* ------------------------------------------------------------
     AKTİF MENÜ — tok petrol/mavi yüzey
     ------------------------------------------------------------ */
  html body #root .layout-header-holder-bc .bg-nav-list > *.active,
  html body #root .layout-header-holder-bc .bg-nav-list > *.selected,
  html body #root .layout-header-holder-bc .bg-nav-list > *.current,
  html body #root .layout-header-holder-bc .bg-nav-list > *.vay-perf-nav-current,
  html body #root .layout-header-holder-bc .bg-nav-list > a[aria-current="page"]{
    color:#ffffff !important;

    background:
      linear-gradient(180deg,#195b7b 0%,#123e55 100%) padding-box,
      conic-gradient(
        from var(--vb-nav-angle),
        rgba(105,217,255,.16),
        #72dcff,
        #1688ef,
        rgba(105,217,255,.16)
      ) border-box !important;

    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.09),
      inset 0 -1px 0 rgba(86,205,255,.16),
      0 6px 13px rgba(0,0,0,.15),
      0 0 11px rgba(19,123,232,.07) !important;

    animation-duration:4.4s, 3.5s !important;
  }

  html body #root .layout-header-holder-bc .bg-nav-list > *.active > a,
  html body #root .layout-header-holder-bc .bg-nav-list > *.selected > a,
  html body #root .layout-header-holder-bc .bg-nav-list > *.current > a,
  html body #root .layout-header-holder-bc .bg-nav-list > *.vay-perf-nav-current > a,
  html body #root .layout-header-holder-bc .bg-nav-list > a[aria-current="page"]{
    color:#ffffff !important;
  }

  html body #root .layout-header-holder-bc .bg-nav-list > *:focus-within{
    outline:2px solid rgba(105,217,255,.55) !important;
    outline-offset:2px !important;
  }
}
/* ============================================================
   VAYBULL DESKTOP — HEADER COLOR FIX V1
   MEVCUT DESKTOP V6 KODUNUN EN ALTINA EKLE.
   Sadece PARA YATIR / ÜYE OL tonlarını koyulaştırır.
   Navbar, slider, kartlar ve ölçüler değişmez.
   ============================================================ */

@media (min-width:701px){

  /* ÜYE OL — açık mavi yerine koyu royal/navy blue */
  html body #root .hdr-main-content-bc
  .hdr-user-bc > button.btn.s-small.register{
    background:#0d59aa !important;
    border:1px solid rgba(114,180,240,.14) !important;
    color:#fff !important;

    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.07),
      0 2px 5px rgba(0,0,0,.15) !important;

    text-shadow:none !important;
  }

  /* PARA YATIR — header'daki olası gerçek varyasyonların tamamı */
  html body #root .hdr-main-content-bc .btn.a-color,
  html body #root .hdr-main-content-bc a[href*="deposit"],
  html body #root .hdr-main-content-bc a[href*="/deposit"],
  html body #root .hdr-main-content-bc .header-icon-text.skipped{
    background:#0b4c91 !important;
    border-color:rgba(110,174,230,.13) !important;
    color:#fff !important;

    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.06),
      0 2px 5px rgba(0,0,0,.14) !important;

    text-shadow:none !important;
  }

  @media (hover:hover){
    html body #root .hdr-main-content-bc
    .hdr-user-bc > button.btn.s-small.register:hover{
      background:#1165bd !important;
    }

    html body #root .hdr-main-content-bc .btn.a-color:hover,
    html body #root .hdr-main-content-bc a[href*="deposit"]:hover,
    html body #root .hdr-main-content-bc a[href*="/deposit"]:hover,
    html body #root .hdr-main-content-bc .header-icon-text.skipped:hover{
      background:#105aa7 !important;
    }
  }
}
/* ============================================================
   VAYBULL DESKTOP — COLOR MERGE PATCH V1
   Mevcut çalışan DESKTOP kodunun EN ALTINA ekle.
   Sadece renk katmanlarını birleştirir; ölçü/geometri/animasyon değişmez.
   ============================================================ */

@media (min-width:701px){

  /* HEADER + NAV TEK GÖVDE */
  html body #root .layout-header-holder-bc{
    background:
      linear-gradient(180deg,#081a24 0%,#071923 100%) !important;
    border-bottom:1px solid rgba(101,211,255,.07) !important;
    box-shadow:0 8px 24px rgba(0,0,0,.14) !important;
  }

  html body #root .header-bc,
  html body #root .hdr-main-content-bc,
  html body #root .nav-content-bc{
    background:transparent !important;
  }

  /* CANLI BAHİS satırındaki ayrı açık bant kalksın */
  html body #root .layout-header-holder-bc .bg-nav-wrap{
    background:transparent !important;
    border-top:1px solid rgba(255,255,255,.025) !important;
    border-bottom:1px solid rgba(101,211,255,.06) !important;
    box-shadow:none !important;
  }

  html body #root .layout-header-holder-bc .bg-nav{
    background:transparent !important;
    border:0 !important;
    box-shadow:none !important;
  }

  /* Chip'ler gövdeden yalnız bir ton ayrı dursun */
  html body #root .layout-header-holder-bc .bg-nav-list > *{
    background:
      linear-gradient(180deg,#102a36,#0c222d) padding-box,
      conic-gradient(
        from var(--vb-nav-angle),
        transparent 0deg,
        transparent 272deg,
        rgba(101,211,255,.025) 294deg,
        rgba(101,211,255,.30) 320deg,
        rgba(19,123,232,.42) 339deg,
        rgba(19,123,232,.05) 350deg,
        transparent 360deg
      ) border-box !important;

    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.018),
      0 3px 8px rgba(0,0,0,.08) !important;
  }

  /* Aktif öğe tek belirgin vurgu olsun */
  html body #root .layout-header-holder-bc .bg-nav-list > *.active,
  html body #root .layout-header-holder-bc .bg-nav-list > *.selected,
  html body #root .layout-header-holder-bc .bg-nav-list > *.current,
  html body #root .layout-header-holder-bc .bg-nav-list > *.vay-perf-nav-current,
  html body #root .layout-header-holder-bc .bg-nav-list > a[aria-current="page"]{
    background:
      linear-gradient(180deg,#174b67,#113749) padding-box,
      conic-gradient(
        from var(--vb-nav-angle),
        rgba(101,211,255,.12),
        #64d4ff,
        #1687ed,
        rgba(101,211,255,.12)
      ) border-box !important;

    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.07),
      0 5px 12px rgba(0,0,0,.12),
      0 0 10px rgba(19,123,232,.06) !important;
  }

  /* Alt subnav varsa aynı ailede devam etsin */
  html body #root .layout-header-holder-bc .bg-subnav{
    background:#091d28 !important;
    border-top:1px solid rgba(255,255,255,.02) !important;
  }
}

/* ============================================================
   VAYBULL QUICK ACCESS TILES — METHOD 2
   Mevcut büyük reklam görsellerini gizler, AYNI linkleri koruyarak
   gerçek premium kategori tile'larına çevirir.
   Header / navbar / slider / winners alanlarına dokunmaz.
   ============================================================ */


@media (min-width:701px) {

  html body #root .hm-row-bc-inner
  .product-banner-container-bc.col-5.product-banner-without-titles
  :is(img.product-banner-img-bc) {
    display:none !important;
  }

  html body #root .hm-row-bc-inner
  .product-banner-container-bc.col-5.product-banner-without-titles
  :is(a.product-banner-bc, a.product-banner-info-bc) > * {
    display:none !important;
  }

  html body #root .hm-row-bc-inner
  .product-banner-container-bc.col-5.product-banner-without-titles.vay-perf-quick-access-container {
    display:grid !important;
    grid-template-columns:repeat(8,minmax(0,1fr)) !important;
    gap:10px !important;
    width:100% !important;
    margin:12px 0 16px !important;
    padding:0 !important;
  }

  html body #root .hm-row-bc-inner
  .product-banner-container-bc.col-5.product-banner-without-titles.vay-perf-quick-access-container > div {
    min-width:0 !important;
    width:auto !important;
    margin:0 !important;
    padding:0 !important;
  }

  html body #root .hm-row-bc-inner
  .product-banner-container-bc.col-5.product-banner-without-titles.vay-perf-quick-access-container
  > div > a {
    position:relative !important;
    isolation:isolate !important;

    display:flex !important;
    flex-direction:column !important;
    align-items:center !important;
    justify-content:center !important;

    width:100% !important;
    height:92px !important;
    min-height:92px !important;

    margin:0 !important;
    padding:12px 8px 10px !important;

    border:1px solid rgba(101,211,255,.12) !important;
    border-radius:12px !important;

    background:
      radial-gradient(circle at 50% -22%,rgba(101,211,255,.085),transparent 47%),
      linear-gradient(180deg,#102a36 0%,#0c202b 100%) !important;

    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.025),
      0 5px 14px rgba(0,0,0,.12) !important;

    color:#e9f5fb !important;
    text-decoration:none !important;

    overflow:hidden !important;

    transition:
      transform .16s ease,
      border-color .16s ease,
      background .16s ease,
      box-shadow .16s ease !important;
  }

  html body #root .hm-row-bc-inner
  .product-banner-container-bc.col-5.product-banner-without-titles.vay-perf-quick-access-container
  > div > a::before {
    content:"" !important;

    width:34px !important;
    height:34px !important;
    margin-bottom:9px !important;

    background:linear-gradient(180deg,#e4f8ff 0%,#61ceff 100%) !important;

    -webkit-mask:var(--quick-icon) center / contain no-repeat !important;
    mask:var(--quick-icon) center / contain no-repeat !important;

    filter:drop-shadow(0 0 7px rgba(82,199,255,.16)) !important;

    flex:0 0 auto !important;
  }

  html body #root .hm-row-bc-inner
  .product-banner-container-bc.col-5.product-banner-without-titles.vay-perf-quick-access-container
  > div > a::after {
    content:var(--quick-label,"Kategori") !important;
    display:block !important;

    color:#edf7fb !important;

    font-size:11px !important;
    line-height:1.1 !important;
    font-weight:700 !important;
    letter-spacing:.015em !important;
    text-align:center !important;
    text-transform:none !important;
    white-space:nowrap !important;
  }

  @media (hover:hover) {
    html body #root .hm-row-bc-inner
    .product-banner-container-bc.col-5.product-banner-without-titles.vay-perf-quick-access-container
    > div > a:hover {
      transform:translateY(-2px) !important;
      border-color:rgba(101,211,255,.32) !important;

      background:
        radial-gradient(circle at 50% -22%,rgba(101,211,255,.13),transparent 49%),
        linear-gradient(180deg,#153542 0%,#0e2632 100%) !important;

      box-shadow:
        inset 0 1px 0 rgba(255,255,255,.04),
        0 8px 20px rgba(0,0,0,.16),
        0 0 14px rgba(19,123,232,.055) !important;
    }
  }

  html body #root .hm-row-bc-inner
  .product-banner-container-bc.col-5.product-banner-without-titles
  a[href*="/live-casino"] {
    --quick-icon:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Crect%20x%3D%224%22%20y%3D%225%22%20width%3D%2216%22%20height%3D%2214%22%20rx%3D%223%22%2F%3E%3Cpath%20d%3D%22M8%2010h3M8%2014h2M15%209l2%202-2%202%22%2F%3E%3C%2Fsvg%3E");
    --quick-label:"Canlı Casino";
  }

  html body #root .hm-row-bc-inner
  .product-banner-container-bc.col-5.product-banner-without-titles
  a[href*="/casino/slots"] {
    --quick-icon:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Crect%20x%3D%225%22%20y%3D%223.5%22%20width%3D%2214%22%20height%3D%2217%22%20rx%3D%223%22%2F%3E%3Cpath%20d%3D%22M8%207h8M8%2011h2M11%2011h2M14%2011h2M8%2016h8M12%2016v2%22%2F%3E%3C%2Fsvg%3E");
    --quick-label:"Slot";
  }

  html body #root .hm-row-bc-inner
  .product-banner-container-bc.col-5.product-banner-without-titles
  a[href*="/sports/pre-match"] {
    --quick-icon:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Ccircle%20cx%3D%2212%22%20cy%3D%2212%22%20r%3D%228%22%2F%3E%3Cpath%20d%3D%22M9.5%208.5%2012%207l2.5%201.5-.8%203H10.3l-.8-3ZM10.3%2011.5%208%2014l1%203M13.7%2011.5%2016%2014l-1%203%22%2F%3E%3C%2Fsvg%3E");
    --quick-label:"Spor";
  }

  html body #root .hm-row-bc-inner
  .product-banner-container-bc.col-5.product-banner-without-titles
  a[href*="/games/home"] {
    --quick-icon:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M7.5%208h9a4.5%204.5%200%200%201%204.2%206.1l-1.2%203.2a2%202%200%200%201-3.2.8l-2.2-1.8H9.9l-2.2%201.8a2%202%200%200%201-3.2-.8l-1.2-3.2A4.5%204.5%200%200%201%207.5%208Z%22%2F%3E%3Cpath%20d%3D%22M8%2011v4M6%2013h4M16%2012h.01M18%2014h.01%22%2F%3E%3C%2Fsvg%3E");
    --quick-label:"Hızlı Oyunlar";
  }

  html body #root .hm-row-bc-inner
  .product-banner-container-bc.col-5.product-banner-without-titles
  a[href*="t.me"] {
    --quick-icon:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22m21%204-7.2%2016-3.7-6.2L4%2010.5%2021%204Z%22%2F%3E%3Cpath%20d%3D%22m10.1%2013.8%204.3-4.2%22%2F%3E%3C%2Fsvg%3E");
    --quick-label:"Telegram";
  }

  html body #root .hm-row-bc-inner
  .product-banner-container-bc.col-5.product-banner-without-titles
  a[href*="wa.me"],
  html body #root .hm-row-bc-inner
  .product-banner-container-bc.col-5.product-banner-without-titles
  a[href*="whatsapp"] {
    --quick-icon:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M20%2011.5A8%208%200%200%201%208.2%2018.6L4%2020l1.4-4.1A8%208%200%201%201%2020%2011.5Z%22%2F%3E%3Cpath%20d%3D%22M9.2%208.6c.4%202.4%201.8%203.8%204.2%204.2l1.2-1.1c.3-.3.7-.3%201-.1l1.6.8c.3.2.5.5.4.9-.2%201.2-1.5%202.4-2.8%202.4-4.1%200-7.5-3.4-7.5-7.5%200-1.3%201.2-2.6%202.4-2.8.4-.1.7.1.9.4l.8%201.6c.2.3.1.7-.1%201L10.2%209.6%22%2F%3E%3C%2Fsvg%3E");
    --quick-label:"WhatsApp";
  }

  html body #root .hm-row-bc-inner
  .product-banner-container-bc.col-5.product-banner-without-titles
  a[href*="openLiveChat"] {
    --quick-icon:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M4%2013v-1a8%208%200%200%201%2016%200v1%22%2F%3E%3Cpath%20d%3D%22M4%2013h3v5H5a1%201%200%200%201-1-1v-4ZM20%2013h-3v5h2a1%201%200%200%200%201-1v-4ZM17%2018c-.8%201.3-2.3%202-4.5%202%22%2F%3E%3C%2Fsvg%3E");
    --quick-label:"Canlı Destek";
  }

  html body #root .hm-row-bc-inner
  .product-banner-container-bc.col-5.product-banner-without-titles
  a[href*="/promotions"],
  html body #root .hm-row-bc-inner
  .product-banner-container-bc.col-5.product-banner-without-titles
  a[aria-label="PROMOSYONLAR" i] {
    --quick-icon:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Crect%20x%3D%224%22%20y%3D%229%22%20width%3D%2216%22%20height%3D%2211%22%20rx%3D%222%22%2F%3E%3Cpath%20d%3D%22M12%209v11M3%209h18V6H3v3ZM12%206c-1.8%200-4-.6-4-2%200-1%20.8-1.7%201.8-1.7%201.7%200%202.2%201.9%202.2%203.7ZM12%206c1.8%200%204-.6%204-2%200-1-.8-1.7-1.8-1.7-1.7%200-2.2%201.9-2.2%203.7Z%22%2F%3E%3C%2Fsvg%3E");
    --quick-label:"Promosyonlar";
  }
}
/* VAYBULL DESKTOP — QUICK TILE ENGLISH LABELS
   Mevcut desktop Quick Tiles kodunun EN ALTINA ekle. */
@media (min-width:701px){
  html body #root a[aria-label="CANLI CASİNO" i],
  html body #root a[aria-label="CANLI CASINO" i]{
    --quick-label:"Live Casino";
  }

  html body #root a[aria-label="SLOT" i]{
    --quick-label:"Slots";
  }

  html body #root a[aria-label="SPOR" i]{
    --quick-label:"Sports";
  }

  html body #root a[aria-label="OYUNLAR" i]{
    --quick-label:"Fast Games";
  }

  html body #root a[aria-label="Telegram" i]{
    --quick-label:"Telegram";
  }

  html body #root a[aria-label="Whatsapp" i],
  html body #root a[aria-label="WhatsApp" i],
  html body #root a[href*="t2ly.io"]{
    --quick-label:"WhatsApp";
  }

  html body #root a[aria-label="Canlı Destek" i],
  html body #root a[href*="openLiveChat"]{
    --quick-label:"Live Support";
  }

  html body #root a[aria-label="PROMOSYONLAR" i],
  html body #root a[href*="/promotions"]{
    --quick-label:"Promotions";
  }
}
/* ============================================================
   VAYBULL DESKTOP — QUICK ACCESS REAL DOM FIX V3
   Mevcut desktop kodunun EN ALTINA ekle.
   GERÇEK desktop container: .home-quick-access
   Mobil koduna dokunmaz.
   ============================================================ */

@media (min-width:701px){

  /* Desktop quick access gerçek kabuğu */
  html body #root .home-quick-access{
    display:grid !important;
    grid-auto-flow:row !important;
    grid-auto-columns:auto !important;

    grid-template-columns:repeat(5,minmax(150px,180px)) !important;
    justify-content:center !important;
    align-items:stretch !important;

    gap:10px !important;

    width:100% !important;
    max-width:none !important;

    margin:14px auto 20px !important;
    padding:0 12px !important;

    box-sizing:border-box !important;
  }

  html body #root .home-quick-access > div{
    min-width:0 !important;
    width:auto !important;
    margin:0 !important;
    padding:0 !important;
  }

  /* Link = gerçek premium tile */
  html body #root .home-quick-access .product-banner-bc{
    position:relative !important;

    display:flex !important;
    flex-direction:column !important;
    align-items:center !important;
    justify-content:center !important;

    width:100% !important;
    height:92px !important;
    min-height:92px !important;

    margin:0 !important;
    padding:12px 8px 10px !important;

    box-sizing:border-box !important;

    border:1px solid rgba(101,211,255,.13) !important;
    border-radius:12px !important;

    background:
      radial-gradient(circle at 50% -20%,rgba(101,211,255,.075),transparent 48%),
      linear-gradient(180deg,#102a36 0%,#0c202b 100%) !important;

    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.022),
      0 5px 14px rgba(0,0,0,.12) !important;

    text-decoration:none !important;
    overflow:hidden !important;

    transition:
      transform .16s ease,
      border-color .16s ease,
      background .16s ease,
      box-shadow .16s ease !important;
  }

  /* Ortak CSS'teki altın glow / float animasyonunu iptal */
  html body #root .home-quick-access .product-banner-bc::before{
    content:"" !important;

    position:static !important;
    inset:auto !important;

    display:block !important;

    width:34px !important;
    height:34px !important;

    margin:0 0 9px !important;
    padding:0 !important;

    opacity:1 !important;

    background:linear-gradient(180deg,#e7f9ff 0%,#62ceff 100%) !important;

    -webkit-mask:var(--quick-icon) center / contain no-repeat !important;
    mask:var(--quick-icon) center / contain no-repeat !important;

    filter:drop-shadow(0 0 7px rgba(82,199,255,.14)) !important;

    animation:none !important;
    transform:none !important;
    pointer-events:none !important;
  }

  /* Eski geniş reklam görselini tamamen kapat */
  html body #root .home-quick-access .product-banner-img-bc{
    display:none !important;
    width:0 !important;
    height:0 !important;
    margin:0 !important;
    padding:0 !important;
    animation:none !important;
  }

  /* İngilizce başlık */
  html body #root .home-quick-access .product-banner-bc::after{
    content:var(--quick-label,"Category") !important;

    position:static !important;

    display:block !important;
    width:100% !important;

    color:#edf7fb !important;

    font-size:11px !important;
    line-height:1.1 !important;
    font-weight:700 !important;
    letter-spacing:.012em !important;
    text-align:center !important;

    white-space:nowrap !important;

    background:none !important;
    border:0 !important;
    box-shadow:none !important;

    animation:none !important;
    transform:none !important;
    pointer-events:none !important;
  }

  /* Eski iç metin / overlay varsa görünmesin */
  html body #root .home-quick-access .product-banner-bc > *:not(img){
    display:none !important;
  }

  /* ------------------------------------------------------------
     ICON + LABEL MAPPING
     ------------------------------------------------------------ */

  html body #root .home-quick-access a[aria-label="CASINO" i],
  html body #root .home-quick-access a[href*="/casino/home"]{
    --quick-label:"Casino";
    --quick-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 7h16v10H4z'/%3E%3Cpath d='M8 10h2M8 14h2M14 10h2M14 14h2'/%3E%3C/svg%3E");
  }

  html body #root .home-quick-access a[aria-label="CANLI CASİNO" i],
  html body #root .home-quick-access a[aria-label="CANLI CASINO" i],
  html body #root .home-quick-access a[href*="/live-casino"]{
    --quick-label:"Live Casino";
    --quick-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='4' y='5' width='16' height='14' rx='3'/%3E%3Cpath d='M8 10h3M8 14h2M15 9l2 2-2 2'/%3E%3C/svg%3E");
  }

  html body #root .home-quick-access a[aria-label="SLOT" i],
  html body #root .home-quick-access a[href*="/casino/slots"]{
    --quick-label:"Slots";
    --quick-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='5' y='3.5' width='14' height='17' rx='3'/%3E%3Cpath d='M8 7h8M8 11h2M11 11h2M14 11h2M8 16h8'/%3E%3C/svg%3E");
  }

  html body #root .home-quick-access a[aria-label="SPOR" i],
  html body #root .home-quick-access a[href*="/sports/pre-match"]{
    --quick-label:"Sports";
    --quick-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='8'/%3E%3Cpath d='M9.5 8.5 12 7l2.5 1.5-.8 3h-3.4l-.8-3ZM10.3 11.5 8 14l1 3M13.7 11.5 16 14l-1 3'/%3E%3C/svg%3E");
  }

  html body #root .home-quick-access a[aria-label="OYUNLAR" i],
  html body #root .home-quick-access a[href*="/games/home"]{
    --quick-label:"Fast Games";
    --quick-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M7.5 8h9a4.5 4.5 0 0 1 4.2 6.1l-1.2 3.2a2 2 0 0 1-3.2.8l-2.2-1.8H9.9l-2.2 1.8a2 2 0 0 1-3.2-.8l-1.2-3.2A4.5 4.5 0 0 1 7.5 8Z'/%3E%3Cpath d='M8 11v4M6 13h4M16 12h.01M18 14h.01'/%3E%3C/svg%3E");
  }

  html body #root .home-quick-access a[aria-label="Telegram" i],
  html body #root .home-quick-access a[href*="t.me"]{
    --quick-label:"Telegram";
    --quick-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m21 4-7.2 16-3.7-6.2L4 10.5 21 4Z'/%3E%3Cpath d='m10.1 13.8 4.3-4.2'/%3E%3C/svg%3E");
  }

  html body #root .home-quick-access a[aria-label="PROMOSYONLAR" i],
  html body #root .home-quick-access a[href*="/promotions"]{
    --quick-label:"Promotions";
    --quick-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='4' y='9' width='16' height='11' rx='2'/%3E%3Cpath d='M12 9v11M3 9h18V6H3v3M12 6c-1.8 0-4-.6-4-2 0-1 .8-1.7 1.8-1.7 1.7 0 2.2 1.9 2.2 3.7ZM12 6c1.8 0 4-.6 4-2 0-1-.8-1.7-1.8-1.7-1.7 0-2.2 1.9-2.2 3.7Z'/%3E%3C/svg%3E");
  }

  @media (hover:hover){
    html body #root .home-quick-access .product-banner-bc:hover{
      transform:translateY(-2px) !important;
      border-color:rgba(101,211,255,.30) !important;

      background:
        radial-gradient(circle at 50% -20%,rgba(101,211,255,.12),transparent 48%),
        linear-gradient(180deg,#143441,#0e2632) !important;

      box-shadow:
        inset 0 1px 0 rgba(255,255,255,.035),
        0 8px 18px rgba(0,0,0,.16),
        0 0 13px rgba(19,123,232,.05) !important;
    }
  }

  /* 701–1050px arası taşmasın */
  @media (max-width:1050px){
    html body #root .home-quick-access{
      grid-template-columns:repeat(5,minmax(120px,1fr)) !important;
    }
  }
}
/* ============================================================
   VAYBULL DESKTOP — QUICK ACCESS V4 FULL WIDTH + REAL IMAGES
   Mevcut Desktop Quick Access V3 kodunun EN ALTINA ekle.
   Amaç:
   - 5 kart slider genişliğine tam yayılsın
   - Kartlar daha büyük/premium dursun
   - Gerçek <img> görselleri tekrar kullanılsın
   - İngilizce başlıklar korunur
   ============================================================ */

@media (min-width:701px){

  /* Slider ile aynı genişlikte tam satır */
  html body #root .home-quick-access{
    display:grid !important;
    grid-template-columns:repeat(5,minmax(0,1fr)) !important;
    grid-auto-flow:row !important;
    grid-auto-columns:auto !important;

    width:100% !important;
    max-width:100% !important;

    margin:16px 0 22px !important;
    padding:0 !important;

    gap:12px !important;

    justify-content:stretch !important;
    align-items:stretch !important;
    box-sizing:border-box !important;
  }

  html body #root .home-quick-access > div{
    width:100% !important;
    min-width:0 !important;
    margin:0 !important;
    padding:0 !important;
  }

  /* Büyük premium tile */
  html body #root .home-quick-access .product-banner-bc{
    width:100% !important;
    height:122px !important;
    min-height:122px !important;

    display:flex !important;
    flex-direction:column !important;
    align-items:center !important;
    justify-content:center !important;

    padding:14px 12px 12px !important;

    border:1px solid rgba(101,211,255,.14) !important;
    border-radius:14px !important;

    background:
      radial-gradient(circle at 50% -15%,rgba(101,211,255,.10),transparent 46%),
      linear-gradient(180deg,#112d3a 0%,#0c202b 100%) !important;

    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.025),
      0 7px 18px rgba(0,0,0,.13) !important;

    overflow:hidden !important;
    text-decoration:none !important;
  }

  /* V3'teki çizgi ikonunu kaldır — artık gerçek image kullanıyoruz */
  html body #root .home-quick-access .product-banner-bc::before{
    display:none !important;
    content:none !important;
  }

  /* Gerçek görseli yeniden aç */
  html body #root .home-quick-access .product-banner-img-bc{
    display:block !important;

    width:64px !important;
    min-width:64px !important;
    max-width:64px !important;

    height:64px !important;
    min-height:64px !important;
    max-height:64px !important;

    margin:0 0 10px !important;
    padding:0 !important;

    object-fit:contain !important;
    object-position:center !important;

    border:0 !important;
    border-radius:0 !important;

    background:transparent !important;

    box-shadow:none !important;
    filter:
      drop-shadow(0 6px 10px rgba(0,0,0,.20))
      drop-shadow(0 0 8px rgba(67,190,255,.08)) !important;

    animation:none !important;
    transform:none !important;
  }

  /* İngilizce title */
  html body #root .home-quick-access .product-banner-bc::after{
    content:var(--quick-label,attr(aria-label)) !important;

    display:block !important;
    width:100% !important;

    color:#edf7fb !important;

    font-size:12px !important;
    line-height:1.1 !important;
    font-weight:700 !important;
    letter-spacing:.015em !important;
    text-align:center !important;

    white-space:nowrap !important;

    background:none !important;
    border:0 !important;
    box-shadow:none !important;
  }

  @media (hover:hover){
    html body #root .home-quick-access .product-banner-bc:hover{
      transform:translateY(-2px) !important;

      border-color:rgba(101,211,255,.32) !important;

      background:
        radial-gradient(circle at 50% -15%,rgba(101,211,255,.15),transparent 47%),
        linear-gradient(180deg,#163846 0%,#0f2733 100%) !important;

      box-shadow:
        inset 0 1px 0 rgba(255,255,255,.04),
        0 10px 24px rgba(0,0,0,.16),
        0 0 14px rgba(19,123,232,.055) !important;
    }

    html body #root .home-quick-access .product-banner-bc:hover
    .product-banner-img-bc{
      transform:translateY(-1px) scale(1.035) !important;
    }
  }

  /* İngilizce label mapping */
  html body #root .home-quick-access a[aria-label="CANLI CASİNO" i],
  html body #root .home-quick-access a[aria-label="CANLI CASINO" i],
  html body #root .home-quick-access a[href*="/live-casino"]{
    --quick-label:"Live Casino";
  }

  html body #root .home-quick-access a[aria-label="SLOT" i],
  html body #root .home-quick-access a[href*="/casino/slots"]{
    --quick-label:"Slots";
  }

  html body #root .home-quick-access a[aria-label="SPOR" i],
  html body #root .home-quick-access a[href*="/sports/pre-match"]{
    --quick-label:"Sports";
  }

  html body #root .home-quick-access a[aria-label="Telegram" i],
  html body #root .home-quick-access a[href*="t.me"]{
    --quick-label:"Telegram";
  }

  html body #root .home-quick-access a[aria-label="PROMOSYONLAR" i],
  html body #root .home-quick-access a[href*="/promotions"]{
    --quick-label:"Promotions";
  }

  /* Orta boy masaüstünde yükseklik bir tık küçülsün */
  @media (max-width:1100px){
    html body #root .home-quick-access{
      gap:9px !important;
    }

    html body #root .home-quick-access .product-banner-bc{
      height:108px !important;
      min-height:108px !important;
    }

    html body #root .home-quick-access .product-banner-img-bc{
      width:54px !important;
      min-width:54px !important;
      max-width:54px !important;
      height:54px !important;
      min-height:54px !important;
      max-height:54px !important;
    }
  }
}
/* ============================================================
   VAYBULL DESKTOP — QUICK TILES ORBIT BORDER V1
   Mevcut çalışan DESKTOP Quick Access V4 kodunun EN ALTINA EKLE.
   Kart ölçüsü/görsel/yazı yapısını bozmaz.
   ============================================================ */

@property --vay-tile-angle{
  syntax:"<angle>";
  initial-value:0deg;
  inherits:false;
}

@keyframes vayTileOrbit{
  to{ --vay-tile-angle:360deg; }
}

@media (min-width:701px){

  html body #root .home-quick-access .product-banner-bc{
    --vay-tile-angle:0deg;

    border:1px solid transparent !important;

    background:
      radial-gradient(circle at 50% -15%,rgba(101,211,255,.08),transparent 46%) padding-box,
      linear-gradient(180deg,#112d3a 0%,#0c202b 100%) padding-box,
      conic-gradient(
        from var(--vay-tile-angle),
        transparent 0deg,
        transparent 270deg,
        rgba(101,211,255,.04) 288deg,
        rgba(101,211,255,.62) 316deg,
        #1687ed 337deg,
        rgba(22,135,237,.12) 349deg,
        transparent 360deg
      ) border-box !important;

    animation:vayTileOrbit 6.2s linear infinite !important;

    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.022),
      0 7px 18px rgba(0,0,0,.13) !important;
  }

  html body #root .home-quick-access > div:nth-child(2) .product-banner-bc{
    animation-delay:-1.1s !important;
  }

  html body #root .home-quick-access > div:nth-child(3) .product-banner-bc{
    animation-delay:-2.2s !important;
  }

  html body #root .home-quick-access > div:nth-child(4) .product-banner-bc{
    animation-delay:-3.3s !important;
  }

  html body #root .home-quick-access > div:nth-child(5) .product-banner-bc{
    animation-delay:-4.4s !important;
  }

  @media (hover:hover){
    html body #root .home-quick-access .product-banner-bc:hover{
      background:
        radial-gradient(circle at 50% -15%,rgba(101,211,255,.13),transparent 47%) padding-box,
        linear-gradient(180deg,#153744 0%,#0f2733 100%) padding-box,
        conic-gradient(
          from var(--vay-tile-angle),
          transparent 0deg,
          transparent 258deg,
          rgba(101,211,255,.10) 280deg,
          #73ddff 315deg,
          #1687ed 340deg,
          transparent 360deg
        ) border-box !important;

      animation-duration:3.5s !important;
    }
  }

  @media (prefers-reduced-motion:reduce){
    html body #root .home-quick-access .product-banner-bc{
      animation:none !important;
    }
  }
}
/* =========================================================
   VAYBULL DESKTOP — QUICK ACCESS FULL IMAGE FIX
   ========================================================= */

@media (min-width: 701px){

  /* Kart alanı */
  html body #root .hm-row-bc-inner
  .product-banner-container-bc.col-5.product-banner-without-titles{
    min-height: 207px !important;
  }

  html body #root .hm-row-bc-inner
  .product-banner-container-bc.col-5.product-banner-without-titles > div{
    height: 207px !important;
  }

  /* Link alanı */
  html body #root .hm-row-bc-inner
  .product-banner-container-bc.col-5.product-banner-without-titles > div > a{
    position: relative !important;
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    padding: 0 !important;
    overflow: hidden !important;
    border-radius: 16px !important;
    background: transparent !important;
  }

  /* Başlık / eski label / küçük ikon mantığını kapat */
  html body #root .hm-row-bc-inner
  .product-banner-container-bc.col-5.product-banner-without-titles > div > a::before,
  html body #root .hm-row-bc-inner
  .product-banner-container-bc.col-5.product-banner-without-titles > div > a::after{
    display: none !important;
    content: none !important;
  }

  /* Eğer içeride ekstra text wrapper varsa kapat */
  html body #root .hm-row-bc-inner
  .product-banner-container-bc.col-5.product-banner-without-titles
  .product-banner-info-bc{
    display: none !important;
  }

  /* Gerçek banner görselini tam oturt */
  html body #root .hm-row-bc-inner
  .product-banner-container-bc.col-5.product-banner-without-titles
  img.product-banner-img-bc{
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    max-width: none !important;
    max-height: none !important;
    object-fit: cover !important;
    object-position: center !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 16px !important;
    opacity: 1 !important;
    visibility: visible !important;
    transform: none !important;
  }

  /* picture ile gelirse */
  html body #root .hm-row-bc-inner
  .product-banner-container-bc.col-5.product-banner-without-titles picture{
    display: block !important;
    width: 100% !important;
    height: 100% !important;
  }

  html body #root .hm-row-bc-inner
  .product-banner-container-bc.col-5.product-banner-without-titles picture img{
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    object-position: center !important;
    border-radius: 16px !important;
  }
}
/* ============================================================
   VAYBULL DESKTOP — QUICK ACCESS FULL BANNER FIX V5
   BUNU mevcut desktop CSS'in EN ALTINA ekle.

   Senin aktif kodundaki gerçek yapı:
   .home-quick-access
   .product-banner-bc
   .product-banner-img-bc

   Bu patch:
   - 5 kartı korur
   - görseli minicik thumbnail olmaktan çıkarır
   - 497.7 x 207.38 oranını korur
   - eski ::before ikonunu ve ::after yazısını kapatır
   - yüklediğin banner görselini kartın tamamına yayar
   ============================================================ */

@property --vay-quick-angle{
  syntax:"<angle>";
  initial-value:0deg;
  inherits:false;
}

@keyframes vayQuickBorder{
  to{ --vay-quick-angle:360deg; }
}

@media (min-width:701px){

  /* 5 kart aynı satırda, slider genişliğini doldursun */
  html body #root .home-quick-access{
    display:grid !important;
    grid-template-columns:repeat(5,minmax(0,1fr)) !important;
    grid-auto-flow:row !important;

    width:100% !important;
    max-width:100% !important;

    gap:12px !important;

    margin:16px 0 22px !important;
    padding:0 !important;

    justify-content:stretch !important;
    align-items:stretch !important;

    box-sizing:border-box !important;
  }

  html body #root .home-quick-access > div{
    width:100% !important;
    min-width:0 !important;

    margin:0 !important;
    padding:0 !important;
  }

  /* Kart artık banner kartı */
  html body #root .home-quick-access > div > a.product-banner-bc{
    --vay-quick-angle:0deg;

    position:relative !important;

    display:block !important;

    width:100% !important;
    height:auto !important;
    min-height:0 !important;

    /* 497.7 x 207.38 */
    aspect-ratio:497.7 / 207.38 !important;

    margin:0 !important;
    padding:0 !important;

    border:0 !important;
    border-radius:14px !important;

    background:
      conic-gradient(
        from var(--vay-quick-angle),
        rgba(25,99,132,.22) 0deg,
        rgba(25,99,132,.22) 245deg,
        rgba(88,204,255,.60) 300deg,
        rgba(20,126,222,.82) 332deg,
        rgba(25,99,132,.22) 360deg
      ) !important;

    box-shadow:
      0 7px 18px rgba(0,0,0,.16),
      inset 0 1px 0 rgba(255,255,255,.025) !important;

    overflow:hidden !important;
    text-decoration:none !important;

    animation:vayQuickBorder 8s linear infinite !important;
  }

  /* Eski çizgi ikonunu kapat */
  html body #root .home-quick-access > div > a.product-banner-bc::before{
    display:none !important;
    content:none !important;

    width:0 !important;
    height:0 !important;

    margin:0 !important;
    padding:0 !important;

    background:none !important;
    -webkit-mask:none !important;
    mask:none !important;

    animation:none !important;
  }

  /* Eski CSS başlığını kapat — yazı zaten banner görselinde */
  html body #root .home-quick-access > div > a.product-banner-bc::after{
    display:none !important;
    content:none !important;

    width:0 !important;
    height:0 !important;

    margin:0 !important;
    padding:0 !important;

    background:none !important;
  }

  /* Panelden yüklenen gerçek görsel */
  html body #root .home-quick-access
  > div > a.product-banner-bc
  > img.product-banner-img-bc{
    display:block !important;

    position:absolute !important;
    inset:1px !important;

    width:calc(100% - 2px) !important;
    min-width:0 !important;
    max-width:none !important;

    height:calc(100% - 2px) !important;
    min-height:0 !important;
    max-height:none !important;

    margin:0 !important;
    padding:0 !important;

    object-fit:cover !important;
    object-position:center !important;

    border:0 !important;
    border-radius:13px !important;

    background:transparent !important;

    opacity:1 !important;
    visibility:visible !important;

    filter:none !important;
    transform:none !important;
    animation:none !important;

    z-index:2 !important;
  }

  /* Bazı sürümlerde resim picture içinde gelirse */
  html body #root .home-quick-access
  > div > a.product-banner-bc
  > picture{
    display:block !important;

    position:absolute !important;
    inset:1px !important;

    width:calc(100% - 2px) !important;
    height:calc(100% - 2px) !important;

    margin:0 !important;
    padding:0 !important;

    z-index:2 !important;
  }

  html body #root .home-quick-access
  > div > a.product-banner-bc
  > picture > img{
    display:block !important;

    width:100% !important;
    max-width:none !important;
    height:100% !important;
    max-height:none !important;

    margin:0 !important;
    padding:0 !important;

    object-fit:cover !important;
    object-position:center !important;

    border:0 !important;
    border-radius:13px !important;

    filter:none !important;
    transform:none !important;
    animation:none !important;
  }

  /* img/picture harici eski içerikler görünmesin */
  html body #root .home-quick-access
  > div > a.product-banner-bc
  > *:not(img):not(picture){
    display:none !important;
  }

  @media (hover:hover){
    html body #root .home-quick-access
    > div > a.product-banner-bc:hover{
      transform:translateY(-2px) !important;

      box-shadow:
        0 10px 24px rgba(0,0,0,.20),
        0 0 14px rgba(33,144,218,.07) !important;

      animation-duration:4.5s !important;
    }
  }
}

@media (min-width:701px) and (max-width:1100px){
  html body #root .home-quick-access{
    gap:8px !important;
  }
}
/* ============================================================
   VAYBULL DESKTOP — WINNERS TICKER REMOVE
   Mevcut DESKTOP CSS'in EN ALTINA ekle.
   Slider ile quick-access kartları arasındaki kayan kazananlar şeridini gizler.
   ============================================================ */

@media (min-width:701px){

  /* F12'de gördüğümüz gerçek kayan şerit */
  html body #root .runningLine{
    display:none !important;
    visibility:hidden !important;

    width:0 !important;
    height:0 !important;
    min-height:0 !important;
    max-height:0 !important;

    margin:0 !important;
    padding:0 !important;

    border:0 !important;
    overflow:hidden !important;

    opacity:0 !important;
    pointer-events:none !important;

    animation:none !important;
    transform:none !important;
  }

  /* İçerideki winner item'ları da tamamen kapat */
  html body #root .runningLine .casinoWinnerWidgetItem{
    display:none !important;
  }

  /* runningLine kendi başına bir wrapper içindeyse boşluğu da kaldır */
  html body #root .vay-perf-runningline-parent{
    min-height:0 !important;
    height:0 !important;
    max-height:0 !important;

    margin-top:0 !important;
    margin-bottom:0 !important;
    padding-top:0 !important;
    padding-bottom:0 !important;

    border:0 !important;
    overflow:hidden !important;
  }
}
/* ============================================================
   VAYBULL DESKTOP — HEADER + HERO COMPACT V1
   Mevcut DESKTOP CSS'in EN ALTINA ekle.
   Sadece 3 şeyi değiştirir:
   1) Hero/slider daha kompakt ve ortalı olur
   2) Logo yanındaki Telegram / WhatsApp vb. sosyal ikonlar gizlenir
   3) Logo büyür, üst header ile ana nav arasındaki boşluk azalır
   ============================================================ */

@media (min-width:701px){

  /* =========================================================
     1) DESKTOP HERO / SLIDER — DAHA KOMPAKT
     ========================================================= */

  html body #root.is-home-page .slider-bc{
    width:min(92%, 1380px) !important;
    max-width:1380px !important;

    margin:12px auto 0 !important;

    border-radius:12px !important;
    overflow:hidden !important;
  }

  html body #root.is-home-page .slider-bc .carouselWrapper,
  html body #root.is-home-page .slider-bc .sdr-item-bc{
    width:100% !important;
    height:clamp(320px, 20vw, 380px) !important;

    border-radius:12px !important;
    overflow:hidden !important;
  }

  html body #root.is-home-page .slider-bc .sdr-item-bc img{
    display:block !important;

    width:100% !important;
    height:100% !important;

    aspect-ratio:auto !important;

    object-fit:cover !important;
    object-position:center !important;

    border-radius:12px !important;
  }


  /* =========================================================
     2) LOGO YANINDAKİ TG / WHATSAPP / SOSYAL İKONLAR
     SADECE HEADER İÇİNDE GİZLE
     ========================================================= */

  html body #root .layout-header-holder-bc
  a[href*="t.me"],
  html body #root .layout-header-holder-bc
  a[href*="telegram"],
  html body #root .layout-header-holder-bc
  a[href*="wa.me"],
  html body #root .layout-header-holder-bc
  a[href*="whatsapp"],
  html body #root .layout-header-holder-bc
  a[aria-label*="Telegram" i],
  html body #root .layout-header-holder-bc
  a[aria-label*="WhatsApp" i],
  html body #root .layout-header-holder-bc
  a[aria-label*="Whatsapp" i]{
    display:none !important;
  }

  /* Sosyal ikonların bulunduğu ek header blokları boş kaldıysa kapat */
  html body #root .header-bc > .hdr-additional-info-bc:empty,
  html body #root .header-bc > .hdr-crypto-content:empty,
  html body #root .header-bc > .hdr-crypto-content-bc:empty{
    display:none !important;
    width:0 !important;
    height:0 !important;
    margin:0 !important;
    padding:0 !important;
  }


  /* =========================================================
     3) LOGO BÜYÜT + HEADER/NAV ARASINI SIKILAŞTIR
     ========================================================= */

  html body #root .hdr-main-content-bc{
    height:60px !important;
    min-height:60px !important;
    max-height:60px !important;

    padding-top:0 !important;
    padding-bottom:0 !important;

    margin:0 !important;

    align-items:center !important;
  }

  html body #root .logo-container{
    display:flex !important;
    align-items:center !important;

    overflow:visible !important;
  }

  html body #root .logo-container .hdr-logo-bc{
    width:190px !important;
    min-width:190px !important;
    max-width:190px !important;

    height:auto !important;
    max-height:50px !important;

    object-fit:contain !important;
    object-position:left center !important;
  }

  /* Header ile nav arasında gereksiz dikey boşluk kalmasın */
  html body #root .header-bc{
    gap:0 !important;
    row-gap:0 !important;
  }

  html body #root .hdr-main-content-bc{
    margin-bottom:0 !important;
  }

  html body #root .hdr-navigation-scrollable-bc-holder{
    margin-top:0 !important;
    margin-bottom:0 !important;

    padding-top:4px !important;
    padding-bottom:4px !important;
  }

  html body #root .hdr-navigation-scrollable-bc,
  html body #root .hdr-navigation-scrollable-content{
    margin-top:0 !important;
    margin-bottom:0 !important;
  }


  /* 1920px+ ekranlarda slider gereksiz uzamasın */
  @media (min-width:1700px){
    html body #root.is-home-page .slider-bc{
      width:min(88%, 1380px) !important;
    }
  }

  /* Küçük desktop/laptop ekranlarında fazla daralmasın */
  @media (max-width:1200px){
    html body #root.is-home-page .slider-bc{
      width:94% !important;
    }

    html body #root.is-home-page .slider-bc .carouselWrapper,
    html body #root.is-home-page .slider-bc .sdr-item-bc{
      height:clamp(280px, 24vw, 340px) !important;
    }

    html body #root .logo-container .hdr-logo-bc{
      width:170px !important;
      min-width:170px !important;
      max-width:170px !important;
    }
  }
}
/* ============================================================
   VAYBULL DESKTOP — QUICK ACCESS ALIGN + HEADER CLEAN V1
   Mevcut DESKTOP CSS'in EN ALTINA ekle.

   Bu patch:
   1) Logo yanındaki yardımcı ikonu/sosyal alanı kaldırır
   2) 5'li hızlı erişim kartlarını slider ile AYNI genişliğe getirir
   3) Kartları slider'ın sol/sağ hizasına oturtur
   ============================================================ */

@media (min-width:701px){

  /* =========================================================
     ORTAK DESKTOP İÇERİK ÖLÇÜSÜ
     Slider'da kullandığımız ölçüyle aynı.
     ========================================================= */
  html body #root.is-home-page{
    --vay-desktop-content-width:92%;
    --vay-desktop-content-max:1380px;
  }


  /* =========================================================
     1) LOGO YANINDAKİ YARDIMCI İKONU KALDIR
     Ana kullanıcı butonlarına / para yatır / dil / saate dokunmaz.
     ========================================================= */

  html body #root .layout-header-holder-bc
  .hdr-additional-info-bc{
    display:none !important;
    visibility:hidden !important;

    width:0 !important;
    min-width:0 !important;
    max-width:0 !important;

    height:0 !important;
    min-height:0 !important;
    max-height:0 !important;

    margin:0 !important;
    padding:0 !important;

    overflow:hidden !important;
    pointer-events:none !important;
  }


  /* =========================================================
     2) SLIDER — REFERANS HİZA
     Mevcut kompakt yüksekliği değiştirmez, sadece ortak hizayı kilitler.
     ========================================================= */

  html body #root.is-home-page .slider-bc{
    width:var(--vay-desktop-content-width) !important;
    max-width:var(--vay-desktop-content-max) !important;

    margin-left:auto !important;
    margin-right:auto !important;

    box-sizing:border-box !important;
  }


  /* =========================================================
     3) 5'Lİ QUICK ACCESS — SLIDER İLE BİREBİR HİZALA
     ========================================================= */

  html body #root.is-home-page .home-quick-access{
    display:grid !important;
    grid-template-columns:repeat(5,minmax(0,1fr)) !important;

    width:var(--vay-desktop-content-width) !important;
    max-width:var(--vay-desktop-content-max) !important;

    margin:
      16px auto
      22px !important;

    padding:0 !important;
    gap:12px !important;

    box-sizing:border-box !important;
  }

  html body #root.is-home-page
  .home-quick-access > div{
    width:100% !important;
    min-width:0 !important;
    max-width:none !important;

    margin:0 !important;
    padding:0 !important;
  }

  html body #root.is-home-page
  .home-quick-access > div > a.product-banner-bc{
    width:100% !important;
    max-width:none !important;
    margin:0 !important;
  }


  /* =========================================================
     4) LAPTOP / DAR DESKTOP
     Slider ve quick-access yine aynı hizada kalır.
     ========================================================= */

  @media (max-width:1200px){
    html body #root.is-home-page{
      --vay-desktop-content-width:94%;
    }

    html body #root.is-home-page .home-quick-access{
      gap:9px !important;
    }
  }


  /* =========================================================
     5) ÇOK GENİŞ EKRAN
     Gereksiz yere tüm monitöre yayılmasın.
     ========================================================= */

  @media (min-width:1700px){
    html body #root.is-home-page{
      --vay-desktop-content-width:88%;
    }
  }
}
/* ============================================================
   VAYBULL DESKTOP — REMOVE LOGO SOCIAL ICON GROUP
   Mevcut DESKTOP CSS'in EN ALTINA ekle.
   F12'de görünen gerçek yapı: .bg-hdr-social
   ============================================================ */

@media (min-width:701px){

  html body #root .layout-header-holder-bc
  .hdr-main-content-bc
  .logo-container
  .bg-hdr-social{
    display:none !important;
    visibility:hidden !important;

    width:0 !important;
    min-width:0 !important;
    max-width:0 !important;

    height:0 !important;
    min-height:0 !important;
    max-height:0 !important;

    margin:0 !important;
    padding:0 !important;

    gap:0 !important;

    overflow:hidden !important;
    opacity:0 !important;
    pointer-events:none !important;
  }

  /* logo ile kullanıcı alanı arasında gereksiz boşluk kalmasın */
  html body #root .layout-header-holder-bc
  .hdr-main-content-bc
  .logo-container{
    gap:0 !important;
  }
}
/* ============================================================
   VAYBULL DESKTOP — GAME SECTIONS ALIGN V1
   Mevcut DESKTOP CSS'in EN ALTINA ekle.

   ŞİMDİLİK SADECE HİZA:
   - En Popüler Casino Oyunları
   - En Popüler Canlı Casino Oyunları

   Bu iki bölüm slider ile aynı sol/sağ çizgiye oturur.
   Kart boyutu / görseller / linkler henüz değiştirilmez.
   ============================================================ */

@media (min-width:701px){

  /* Önceki desktop patch yoksa da çalışsın */
  html body #root.is-home-page{
    --vay-desktop-content-width:92%;
    --vay-desktop-content-max:1380px;
  }

  /* Casino oyunu içeren gerçek home satırını slider genişliğine getir */
  html body #root.is-home-page
  .hm-row-bc.vay-perf-game-row
  > .hm-row-bc-inner{
    width:var(--vay-desktop-content-width) !important;
    max-width:var(--vay-desktop-content-max) !important;

    margin-left:auto !important;
    margin-right:auto !important;

    padding-left:0 !important;
    padding-right:0 !important;

    box-sizing:border-box !important;
  }

  /* Başlık da aynı çizgide */
  html body #root.is-home-page
  .hm-row-bc.vay-perf-game-row
  .page-view-more{
    width:100% !important;
    max-width:none !important;

    margin-left:0 !important;
    margin-right:0 !important;

    padding-left:0 !important;
    padding-right:0 !important;

    box-sizing:border-box !important;
  }

  /* Oyun şeridini parent genişliğine kilitle */
  html body #root.is-home-page
  .hm-row-bc.vay-perf-game-row
  .serit-kenar,
  html body #root.is-home-page
  .hm-row-bc.vay-perf-game-row
  .product-banner-container-bc.pop-serit{
    width:100% !important;
    max-width:100% !important;

    margin-left:0 !important;
    margin-right:0 !important;

    box-sizing:border-box !important;
  }

  /* Şimdilik kart geometrisine dokunma */
  html body #root.is-home-page
  .hm-row-bc.vay-perf-game-row
  .product-banner-container-bc.pop-serit{
    padding-left:0 !important;
    padding-right:0 !important;
  }

  /* Bölüm spacing'i biraz temizle */
  html body #root.is-home-page
  .hm-row-bc.vay-perf-game-row{
    margin-top:18px !important;
    margin-bottom:14px !important;
  }

  /* Laptop */
  @media (max-width:1200px){
    html body #root.is-home-page{
      --vay-desktop-content-width:94%;
    }
  }

  /* Çok geniş monitör */
  @media (min-width:1700px){
    html body #root.is-home-page{
      --vay-desktop-content-width:88%;
    }
  }
}
/* ============================================================
   VAYBULL DESKTOP — GAME GRID 6 ACROSS V1
   Mevcut DESKTOP CSS'in EN ALTINA ekle.

   Şimdilik:
   - Casino oyunları 6 kart yan yana
   - Live Casino oyunları 6 kart yan yana
   - Mevcut link/görsel/hover yapısını korur
   - Slider ile hizalanmış mevcut section genişliğini bozmaz
   ============================================================ */

@media (min-width:701px){

  html body #root.is-home-page
  .hm-row-bc.vay-perf-game-row
  .product-banner-container-bc.pop-serit{
    display:grid !important;
    grid-template-columns:repeat(6,minmax(0,1fr)) !important;
    grid-auto-flow:row !important;

    gap:12px !important;

    width:100% !important;
    max-width:100% !important;

    overflow:visible !important;

    padding:0 !important;
    margin:0 !important;

    box-sizing:border-box !important;
  }

  html body #root.is-home-page
  .hm-row-bc.vay-perf-game-row
  .product-banner-container-bc.pop-serit > *{
    width:100% !important;
    min-width:0 !important;
    max-width:none !important;

    flex:none !important;
    flex-basis:auto !important;

    margin:0 !important;
    padding:0 !important;
  }

  html body #root.is-home-page
  .hm-row-bc.vay-perf-game-row
  .casinoGameItem{
    width:100% !important;
    max-width:none !important;
  }

  /* Çok geniş ekranlarda boşluk biraz daha ferah */
  @media (min-width:1700px){
    html body #root.is-home-page
    .hm-row-bc.vay-perf-game-row
    .product-banner-container-bc.pop-serit{
      gap:14px !important;
    }
  }

  /* Laptopta da 6 kalsın ama gap küçülsün */
  @media (max-width:1200px){
    html body #root.is-home-page
    .hm-row-bc.vay-perf-game-row
    .product-banner-container-bc.pop-serit{
      gap:9px !important;
    }
  }
}
/* ============================================================
   VAYBULL DESKTOP — SHOW ONLY FIRST 6 GAMES V2
   Mevcut DESKTOP CSS'in EN ALTINA ekle.

   Amaç:
   - Casino bölümünde sadece ilk 6 oyun
   - Live Casino bölümünde sadece ilk 6 oyun
   - 2. satıra düşen 7+ kartları tamamen gizle
   - Mevcut 6 kolon grid ve hizayı koru
   ============================================================ */

@media (min-width:701px){

  html body #root.is-home-page
  .hm-row-bc.vay-perf-game-row
  .product-banner-container-bc.pop-serit{
    display:grid !important;
    grid-template-columns:repeat(6,minmax(0,1fr)) !important;
    grid-auto-flow:row !important;

    gap:12px !important;

    width:100% !important;
    max-width:100% !important;

    margin:0 !important;
    padding:0 !important;

    overflow:visible !important;
    box-sizing:border-box !important;
  }

  /* Sadece ilk 6 kart */
  html body #root.is-home-page
  .hm-row-bc.vay-perf-game-row
  .product-banner-container-bc.pop-serit > *:nth-child(n+7){
    display:none !important;
  }

  /* İlk 6 kart grid hücresini tam doldursun */
  html body #root.is-home-page
  .hm-row-bc.vay-perf-game-row
  .product-banner-container-bc.pop-serit > *:nth-child(-n+6){
    display:block !important;

    width:100% !important;
    min-width:0 !important;
    max-width:none !important;

    margin:0 !important;
    padding:0 !important;

    flex:none !important;
    flex-basis:auto !important;
  }

  @media (max-width:1200px){
    html body #root.is-home-page
    .hm-row-bc.vay-perf-game-row
    .product-banner-container-bc.pop-serit{
      gap:9px !important;
    }
  }

  @media (min-width:1700px){
    html body #root.is-home-page
    .hm-row-bc.vay-perf-game-row
    .product-banner-container-bc.pop-serit{
      gap:14px !important;
    }
  }
}
/* ============================================================
   VAYBULL DESKTOP — SPORTS SECTION ALIGN V1
   Mevcut DESKTOP CSS'in EN ALTINA ekle.

   Amaç:
   "ÖNE ÇIKAN BAHİSLER" bölümünü slider / quick-access /
   casino bölümleriyle aynı sol-sağ hizada tutmak.
   Kart stiline dokunmaz.
   ============================================================ */

@media (min-width:701px){

  html body #root.is-home-page{
    --vay-desktop-content-width:92%;
    --vay-desktop-content-max:1380px;
  }

  /* Sports row'un iç kabuğu */
  html body #root.is-home-page
  .hm-row-bc.vay-perf-featured-row
  > .hm-row-bc-inner{
    width:var(--vay-desktop-content-width) !important;
    max-width:var(--vay-desktop-content-max) !important;

    margin-left:auto !important;
    margin-right:auto !important;

    padding-left:0 !important;
    padding-right:0 !important;

    box-sizing:border-box !important;
  }

  /* Featured games kendi parent'ını tam doldursun */
  html body #root.is-home-page
  .hm-row-bc.vay-perf-featured-row
  .featuredGames{
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;

    margin-left:0 !important;
    margin-right:0 !important;

    box-sizing:border-box !important;
  }

  /* Başlık ve kart şeridi aynı çizgide */
  html body #root.is-home-page
  .hm-row-bc.vay-perf-featured-row
  .page-view-more,
  html body #root.is-home-page
  .hm-row-bc.vay-perf-featured-row
  .featuredGamesContent{
    width:100% !important;
    max-width:100% !important;

    margin-left:0 !important;
    margin-right:0 !important;

    box-sizing:border-box !important;
  }

  @media (max-width:1200px){
    html body #root.is-home-page{
      --vay-desktop-content-width:94%;
    }
  }

  @media (min-width:1700px){
    html body #root.is-home-page{
      --vay-desktop-content-width:88%;
    }
  }
}
/* ============================================================
   VAYBULL DESKTOP — GAME COVERS / SIZE V1
   Desktop CSS'in EN ALTINA ekle.
   6 slot + 6 live casino kartını portrait premium düzene çeker.
   ============================================================ */

@media (min-width:701px){

  html body #root.is-home-page
  .vay-desktop-slot-grid,
  html body #root.is-home-page
  .vay-desktop-live-grid{
    display:grid !important;
    grid-template-columns:repeat(6,minmax(0,1fr)) !important;
    gap:14px !important;

    width:100% !important;
    max-width:100% !important;

    margin:0 !important;
    padding:0 !important;

    overflow:visible !important;
    box-sizing:border-box !important;
  }

  html body #root.is-home-page
  .vay-desktop-slot-grid > .vay-desktop-game-card,
  html body #root.is-home-page
  .vay-desktop-live-grid > .vay-desktop-game-card{
    position:relative !important;

    width:100% !important;
    min-width:0 !important;
    max-width:none !important;

    height:auto !important;
    min-height:0 !important;

    aspect-ratio:180 / 236 !important;

    margin:0 !important;
    padding:0 !important;

    overflow:visible !important;
  }

  html body #root.is-home-page
  .vay-desktop-slot-grid > .vay-desktop-game-card > .casinoGameItem,
  html body #root.is-home-page
  .vay-desktop-live-grid > .vay-desktop-game-card > .casinoGameItem{
    position:absolute !important;
    inset:0 !important;

    width:100% !important;
    height:100% !important;

    margin:0 !important;
    padding:0 !important;

    overflow:hidden !important;

    border:1px solid rgba(90,190,230,.12) !important;
    border-radius:12px !important;

    background:#081720 !important;

    box-shadow:
      0 8px 22px rgba(0,0,0,.22),
      inset 0 1px 0 rgba(255,255,255,.025) !important;

    transform:translateZ(0) !important;

    transition:
      transform .16s ease,
      border-color .16s ease,
      box-shadow .16s ease !important;
  }

  html body #root.is-home-page
  .vay-desktop-slot-grid img.casinoGameItemImage,
  html body #root.is-home-page
  .vay-desktop-live-grid img.casinoGameItemImage{
    position:absolute !important;
    inset:0 !important;

    width:100% !important;
    height:100% !important;
    min-width:100% !important;
    min-height:100% !important;
    max-width:100% !important;
    max-height:100% !important;

    margin:0 !important;
    padding:0 !important;

    object-fit:cover !important;
    object-position:center !important;

    border-radius:11px !important;

    filter:none !important;
    transform:none !important;
  }

  html body #root.is-home-page
  .vay-desktop-slot-grid .casinoGameItem:hover,
  html body #root.is-home-page
  .vay-desktop-live-grid .casinoGameItem:hover{
    transform:translateY(-4px) !important;

    border-color:rgba(86,192,235,.28) !important;

    box-shadow:
      0 14px 28px rgba(0,0,0,.27),
      0 0 0 1px rgba(55,158,210,.06) !important;
  }

  html body #root.is-home-page
  .vay-desktop-slot-grid .casinoGameItem:hover img.casinoGameItemImage,
  html body #root.is-home-page
  .vay-desktop-live-grid .casinoGameItem:hover img.casinoGameItemImage{
    transform:none !important;
    filter:brightness(.96) !important;
  }

  /* Eski shine/zoom katmanlarını kapat */
  html body #root.is-home-page
  .vay-desktop-slot-grid .casinoGameItem::after,
  html body #root.is-home-page
  .vay-desktop-live-grid .casinoGameItem::after{
    display:none !important;
    content:none !important;
  }

  /* Laptopta kartlar fazla uzun görünmesin */
  @media (max-width:1200px){
    html body #root.is-home-page
    .vay-desktop-slot-grid,
    html body #root.is-home-page
    .vay-desktop-live-grid{
      gap:10px !important;
    }
  }
}
/* ============================================================
   VAYBULL DESKTOP — FEATURED SPORTS CENTERED PREMIUM V1
   Mevcut DESKTOP CSS'in EN ALTINA ekle.

   Amaç:
   - "ÖNE ÇIKAN BAHİSLER" bölümünü sayfanın ortasına almak
   - Slider/oyunlardan biraz daha dar, premium bir panel yapmak
   - 4 maç kartını aynı anda göstermek
   - Mevcut link/maç verilerine dokunmamak
   ============================================================ */

@media (min-width:701px){

  /* =========================================================
     1) SPOR BÖLÜMÜNÜ ORTALA
     ========================================================= */

  html body #root.is-home-page
  .hm-row-bc.vay-perf-featured-row
  > .hm-row-bc-inner{
    width:92% !important;
    max-width:1380px !important;

    margin-left:auto !important;
    margin-right:auto !important;

    padding-left:0 !important;
    padding-right:0 !important;
  }

  html body #root.is-home-page
  .hm-row-bc.vay-perf-featured-row
  .featuredGames{
    position:relative !important;

    width:88% !important;
    max-width:1180px !important;

    margin:22px auto 26px !important;
    padding:14px 16px 16px !important;

    overflow:hidden !important;

    border:1px solid rgba(83,184,226,.10) !important;
    border-radius:16px !important;

    background:
      radial-gradient(
        120% 120% at 50% 0%,
        rgba(45,130,166,.10) 0%,
        rgba(7,20,29,0) 54%
      ),
      linear-gradient(
        180deg,
        #0a1d27 0%,
        #071720 100%
      ) !important;

    box-shadow:
      0 16px 34px rgba(0,0,0,.18),
      inset 0 1px 0 rgba(255,255,255,.025) !important;

    box-sizing:border-box !important;
  }

  /* üstte çok hafif premium ışık */
  html body #root.is-home-page
  .hm-row-bc.vay-perf-featured-row
  .featuredGames::before{
    content:"" !important;

    position:absolute !important;
    left:22% !important;
    right:22% !important;
    top:0 !important;

    height:1px !important;

    background:
      linear-gradient(
        90deg,
        transparent,
        rgba(92,205,248,.48),
        transparent
      ) !important;

    opacity:.75 !important;
    pointer-events:none !important;
  }


  /* =========================================================
     2) BAŞLIK — ORTADA
     ========================================================= */

  html body #root.is-home-page
  .hm-row-bc.vay-perf-featured-row
  .featuredGames .page-view-more{
    position:relative !important;

    display:flex !important;
    align-items:center !important;
    justify-content:center !important;

    width:100% !important;
    height:40px !important;
    min-height:40px !important;

    margin:0 0 12px !important;
    padding:0 88px !important;

    border-bottom:1px solid rgba(255,255,255,.05) !important;

    box-sizing:border-box !important;
  }

  html body #root.is-home-page
  .hm-row-bc.vay-perf-featured-row
  .featuredGames .view-title-more{
    position:relative !important;

    margin:0 !important;
    padding:0 14px !important;

    color:#f0f7fa !important;

    font-size:14px !important;
    font-weight:800 !important;
    line-height:1 !important;
    letter-spacing:.045em !important;
    text-transform:uppercase !important;
  }

  /* başlığın iki yanında kısa çizgi */
  html body #root.is-home-page
  .hm-row-bc.vay-perf-featured-row
  .featuredGames .view-title-more::before,
  html body #root.is-home-page
  .hm-row-bc.vay-perf-featured-row
  .featuredGames .view-title-more::after{
    content:"" !important;

    position:absolute !important;
    top:50% !important;

    width:28px !important;
    height:1px !important;

    background:
      linear-gradient(
        90deg,
        rgba(80,194,238,.15),
        rgba(80,194,238,.65)
      ) !important;

    transform:translateY(-50%) !important;
  }

  html body #root.is-home-page
  .hm-row-bc.vay-perf-featured-row
  .featuredGames .view-title-more::before{
    right:100% !important;
  }

  html body #root.is-home-page
  .hm-row-bc.vay-perf-featured-row
  .featuredGames .view-title-more::after{
    left:100% !important;
    transform:translateY(-50%) scaleX(-1) !important;
  }


  /* =========================================================
     3) TÜMÜ BUTONU — SAĞDA SABİT
     ========================================================= */

  html body #root.is-home-page
  .hm-row-bc.vay-perf-featured-row
  .featuredGames .page-view-more > a,
  html body #root.is-home-page
  .hm-row-bc.vay-perf-featured-row
  .featuredGames .page-view-more > button{
    position:absolute !important;
    right:0 !important;
    top:50% !important;

    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;

    min-width:72px !important;
    height:30px !important;

    padding:0 12px !important;

    border:1px solid rgba(92,190,230,.12) !important;
    border-radius:8px !important;

    background:
      linear-gradient(
        180deg,
        #17313e 0%,
        #102630 100%
      ) !important;

    color:#edf6fa !important;

    font-size:11px !important;
    font-weight:800 !important;

    transform:translateY(-50%) !important;

    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.025),
      0 4px 10px rgba(0,0,0,.12) !important;
  }


  /* =========================================================
     4) MAÇ ŞERİDİ — 4 KART
     ========================================================= */

  html body #root.is-home-page
  .hm-row-bc.vay-perf-featured-row
  .featuredGamesContent{
    width:100% !important;
    max-width:100% !important;

    margin:0 !important;
    padding:0 !important;
  }

  html body #root.is-home-page
  .hm-row-bc.vay-perf-featured-row
  .featuredGamesMobileRow.oto-serit.horizontal-scroll{
    display:flex !important;
    align-items:stretch !important;

    gap:12px !important;

    width:100% !important;
    max-width:100% !important;

    margin:0 !important;
    padding:0 0 3px !important;

    overflow-x:auto !important;
    overflow-y:hidden !important;

    scroll-snap-type:x proximity !important;
    scrollbar-width:none !important;
    -ms-overflow-style:none !important;
  }

  html body #root.is-home-page
  .hm-row-bc.vay-perf-featured-row
  .featuredGamesMobileRow.oto-serit.horizontal-scroll::-webkit-scrollbar{
    display:none !important;
  }

  html body #root.is-home-page
  .hm-row-bc.vay-perf-featured-row
  .featuredGamesMobileRow
  > a.featuredGameItem.Soccer{
    position:relative !important;

    flex:0 0 calc((100% - 36px) / 4) !important;
    width:calc((100% - 36px) / 4) !important;
    min-width:0 !important;
    max-width:none !important;

    height:148px !important;
    min-height:148px !important;
    max-height:148px !important;

    margin:0 !important;
    padding:0 !important;

    overflow:hidden !important;

    border:1px solid rgba(87,184,225,.12) !important;
    border-radius:12px !important;

    background:
      radial-gradient(
        90% 100% at 100% 0%,
        rgba(42,121,156,.11) 0%,
        transparent 60%
      ),
      linear-gradient(
        145deg,
        #102832 0%,
        #0c2029 58%,
        #091922 100%
      ) !important;

    box-shadow:
      0 8px 18px rgba(0,0,0,.18),
      inset 0 1px 0 rgba(255,255,255,.022) !important;

    color:inherit !important;
    text-decoration:none !important;

    scroll-snap-align:start !important;

    transform:translateZ(0) !important;

    transition:
      transform .16s ease,
      border-color .16s ease,
      box-shadow .16s ease !important;
  }

  /* hafif üst ışık */
  html body #root.is-home-page
  .hm-row-bc.vay-perf-featured-row
  .featuredGamesMobileRow
  > a.featuredGameItem.Soccer::before{
    content:"" !important;

    position:absolute !important;
    left:14px !important;
    right:14px !important;
    top:0 !important;

    height:1px !important;

    background:
      linear-gradient(
        90deg,
        transparent,
        rgba(89,198,239,.38),
        transparent
      ) !important;

    opacity:.7 !important;
    pointer-events:none !important;
  }


  /* =========================================================
     5) LİG HEADER
     ========================================================= */

  html body #root.is-home-page
  .hm-row-bc.vay-perf-featured-row
  .featuredGameItemHeader{
    height:36px !important;
    min-height:36px !important;

    padding:7px 11px 5px !important;

    border-bottom:1px solid rgba(255,255,255,.05) !important;

    background:rgba(255,255,255,.012) !important;

    color:#a9bac3 !important;

    font-size:11px !important;
    font-weight:700 !important;
  }


  /* =========================================================
     6) GÖVDE / ORANLAR
     ========================================================= */

  html body #root.is-home-page
  .hm-row-bc.vay-perf-featured-row
  .featuredGameItemBody{
    padding:8px 10px 10px !important;
    background:transparent !important;
  }

  html body #root.is-home-page
  .hm-row-bc.vay-perf-featured-row
  .featuredGameItemBody
  :is(
    [class*="odd"],
    [class*="market"],
    [class*="coef"],
    [class*="rate"]
  ){
    border:1px solid rgba(255,255,255,.025) !important;
    border-radius:7px !important;

    background:
      linear-gradient(
        180deg,
        #344a56 0%,
        #2b404b 100%
      ) !important;

    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.018) !important;
  }


  /* =========================================================
     7) HOVER
     ========================================================= */

  html body #root.is-home-page
  .hm-row-bc.vay-perf-featured-row
  .featuredGamesMobileRow
  > a.featuredGameItem.Soccer:hover{
    transform:translateY(-3px) !important;

    border-color:rgba(90,195,236,.23) !important;

    box-shadow:
      0 12px 24px rgba(0,0,0,.23),
      0 0 0 1px rgba(54,157,210,.05) !important;
  }


  /* =========================================================
     8) LAPTOP
     ========================================================= */

  @media (max-width:1200px){

    html body #root.is-home-page
    .hm-row-bc.vay-perf-featured-row
    .featuredGames{
      width:92% !important;
    }

    html body #root.is-home-page
    .hm-row-bc.vay-perf-featured-row
    .featuredGamesMobileRow
    > a.featuredGameItem.Soccer{
      flex-basis:calc((100% - 24px) / 3) !important;
      width:calc((100% - 24px) / 3) !important;
    }
  }
}
/* ============================================================
   VAYBULL DESKTOP — SPORTS ALIGN TO SLIDER V2
   Mevcut DESKTOP CSS'in EN ALTINA ekle.

   Önceki centered premium CSS'in görünümünü korur,
   sadece genişliği slider ile birebir hizalar.
   ============================================================ */

@media (min-width:701px){

  html body #root.is-home-page{
    --vay-desktop-content-width:92%;
    --vay-desktop-content-max:1380px;
  }

  /* Sports row ana kabuğu slider ile aynı genişlik */
  html body #root.is-home-page
  .hm-row-bc.vay-perf-featured-row
  > .hm-row-bc-inner{
    width:var(--vay-desktop-content-width) !important;
    max-width:var(--vay-desktop-content-max) !important;

    margin-left:auto !important;
    margin-right:auto !important;

    padding-left:0 !important;
    padding-right:0 !important;

    box-sizing:border-box !important;
  }

  /* Önceki V1'deki %88 / 1180px sınırını kaldır */
  html body #root.is-home-page
  .hm-row-bc.vay-perf-featured-row
  .featuredGames{
    width:100% !important;
    max-width:none !important;

    margin:18px 0 20px !important;

    box-sizing:border-box !important;
  }

  /* İçerik de tam genişlik */
  html body #root.is-home-page
  .hm-row-bc.vay-perf-featured-row
  .featuredGamesContent,
  html body #root.is-home-page
  .hm-row-bc.vay-perf-featured-row
  .featuredGamesMobileRow{
    width:100% !important;
    max-width:100% !important;

    margin-left:0 !important;
    margin-right:0 !important;
  }

  /* Taşındıktan sonra live casino ile arayı kontrollü tut */
  html body #root.is-home-page
  .hm-row-bc.vay-desktop-sports-before-live{
    margin-top:8px !important;
    margin-bottom:12px !important;
    padding-top:0 !important;
    padding-bottom:0 !important;
  }

  html body #root.is-home-page
  .hm-row-bc.vay-desktop-sports-before-live
  + .hm-row-bc{
    margin-top:0 !important;
    padding-top:0 !important;
  }

  @media (max-width:1200px){
    html body #root.is-home-page{
      --vay-desktop-content-width:94%;
    }
  }

  @media (min-width:1700px){
    html body #root.is-home-page{
      --vay-desktop-content-width:88%;
    }
  }
}
/* ============================================================
   VAYBULL DESKTOP — LIVE CASINO ROBUST 6 + SPORTS ORDER V3
   Desktop CSS'in EN ALTINA ekle.
   Mevcut desktop CSS'i bozmaz; sadece Live Casino bölümünü düzeltir.
   ============================================================ */

@media (min-width:701px){

  /* Native bozuk Live Casino carousel'ını sadece bu bölümde gizle */
  html body #root.is-home-page
  .vay-desktop-live-row-v3
  .vay-desktop-live-native-hidden-v3{
    display:none !important;
  }

  /* Live Casino row slider / diğer oyun alanlarıyla aynı genişlik */
  html body #root.is-home-page
  .hm-row-bc.vay-desktop-live-row-v3
  > .hm-row-bc-inner{
    width:var(--vay-desktop-content-width,92%) !important;
    max-width:var(--vay-desktop-content-max,1380px) !important;

    margin-left:auto !important;
    margin-right:auto !important;

    padding-left:0 !important;
    padding-right:0 !important;

    box-sizing:border-box !important;
  }

  /* 6 kart yan yana */
  html body #root.is-home-page
  .vay-desktop-live-manual-grid-v3{
    display:grid !important;
    grid-template-columns:repeat(6,minmax(0,1fr)) !important;

    gap:14px !important;

    width:100% !important;
    max-width:100% !important;

    margin:0 !important;
    padding:0 !important;

    box-sizing:border-box !important;
    overflow:visible !important;
  }

  html body #root.is-home-page
  .vay-desktop-live-manual-card-v3{
    position:relative !important;
    display:block !important;

    width:100% !important;
    min-width:0 !important;

    aspect-ratio:180 / 236 !important;

    margin:0 !important;
    padding:0 !important;

    overflow:hidden !important;

    border:1px solid rgba(90,190,230,.12) !important;
    border-radius:12px !important;

    background:#081720 !important;

    box-shadow:
      0 8px 22px rgba(0,0,0,.22),
      inset 0 1px 0 rgba(255,255,255,.025) !important;

    text-decoration:none !important;

    transform:translateZ(0) !important;

    transition:
      transform .16s ease,
      border-color .16s ease,
      box-shadow .16s ease,
      filter .16s ease !important;
  }

  html body #root.is-home-page
  .vay-desktop-live-manual-img-v3{
    position:absolute !important;
    inset:0 !important;

    display:block !important;

    width:100% !important;
    min-width:100% !important;
    max-width:100% !important;

    height:100% !important;
    min-height:100% !important;
    max-height:100% !important;

    margin:0 !important;
    padding:0 !important;

    object-fit:cover !important;
    object-position:center !important;

    border-radius:11px !important;

    filter:none !important;
    transform:none !important;
  }

  html body #root.is-home-page
  .vay-desktop-live-manual-card-v3:hover{
    transform:translateY(-4px) !important;

    border-color:rgba(86,192,235,.28) !important;

    box-shadow:
      0 14px 28px rgba(0,0,0,.27),
      0 0 0 1px rgba(55,158,210,.06) !important;

    filter:brightness(.97) !important;
  }

  /* Spor kesin Live Casino'nun hemen üstünde */
  html body #root.is-home-page
  .hm-row-bc.vay-desktop-sports-before-live-v3{
    margin-top:14px !important;
    margin-bottom:14px !important;

    padding-top:0 !important;
    padding-bottom:0 !important;
  }

  html body #root.is-home-page
  .hm-row-bc.vay-desktop-live-after-sports-v3{
    margin-top:0 !important;
    padding-top:0 !important;
  }

  html body #root.is-home-page
  .hm-row-bc.vay-desktop-live-after-sports-v3
  .page-view-more{
    margin-top:0 !important;
  }

  @media (max-width:1200px){
    html body #root.is-home-page
    .vay-desktop-live-manual-grid-v3{
      gap:10px !important;
    }
  }

  @media (min-width:1700px){
    html body #root.is-home-page
    .vay-desktop-live-manual-grid-v3{
      gap:14px !important;
    }
  }
}
/* ============================================================
   VAYBULL DESKTOP — LIVE CASINO LEFTOVER CLEANUP V4
   Mevcut Desktop Live Casino V3 CSS'in EN ALTINA ekle.
   Sadece Popüler Canlı Casino bölümünde kalan eski native kartı gizler.
   ============================================================ */

@media (min-width:701px){

  /* Native carousel / native oyun kartlarından kalan parçaları kapat */
  html body #root.is-home-page
  .hm-row-bc.vay-desktop-live-row-v3
  .casinoGameItemContent,
  html body #root.is-home-page
  .hm-row-bc.vay-desktop-live-row-v3
  .casinoGameItem{
    display:none !important;
  }

  /* Bizim manuel 6'lı grid kesin görünür kalsın */
  html body #root.is-home-page
  .hm-row-bc.vay-desktop-live-row-v3
  .vay-desktop-live-manual-grid-v3{
    display:grid !important;
  }

  html body #root.is-home-page
  .hm-row-bc.vay-desktop-live-row-v3
  .vay-desktop-live-manual-card-v3{
    display:block !important;
  }

  /* Eski strip / wrapper yüksekliği boşluk bırakmasın */
  html body #root.is-home-page
  .hm-row-bc.vay-desktop-live-row-v3
  .product-banner-container-bc.pop-serit,
  html body #root.is-home-page
  .hm-row-bc.vay-desktop-live-row-v3
  .serit-kenar.vay-perf-game-serit-holder{
    height:0 !important;
    min-height:0 !important;
    max-height:0 !important;

    margin:0 !important;
    padding:0 !important;

    overflow:hidden !important;
  }

  /* Live Casino bölümünün alt boşluğunu da toparla */
  html body #root.is-home-page
  .hm-row-bc.vay-desktop-live-row-v3{
    margin-bottom:16px !important;
    padding-bottom:0 !important;
  }
}
/* ============================================================
   VAYBULL DESKTOP — SPORTS / LEAGUES SLIDER ALIGN V5
   Desktop CSS'in EN ALTINA ekle.

   Slider ile aynı sol / sağ hizaya getirir:
   - Popüler ligler / turnuvalar (.popular-competitions-bc)
   - Popüler Maçlar (.popular-matches-bc)

   Casino / Live Casino / header alanlarına dokunmaz.
   ============================================================ */

@media (min-width:701px){

  /* ------------------------------------------------------------
     1) POPÜLER LİGLER / TURNUVALAR
     ------------------------------------------------------------ */

  html body #root.is-home-page
  .hm-row-bc.vay-perf-competitions-row
  > .hm-row-bc-inner{
    width:var(--vay-desktop-content-width,92%) !important;
    max-width:var(--vay-desktop-content-max,1380px) !important;

    margin-left:auto !important;
    margin-right:auto !important;

    padding-left:0 !important;
    padding-right:0 !important;

    box-sizing:border-box !important;
  }

  html body #root.is-home-page
  .hm-row-bc.vay-perf-competitions-row
  .popular-competitions-bc.isWidget{
    width:100% !important;
    max-width:100% !important;

    margin-left:0 !important;
    margin-right:0 !important;

    padding-left:0 !important;
    padding-right:0 !important;

    box-sizing:border-box !important;
  }

  html body #root.is-home-page
  .hm-row-bc.vay-perf-competitions-row
  .popular-competitions-container{
    width:100% !important;
    max-width:100% !important;

    margin-left:0 !important;
    margin-right:0 !important;

    padding-left:0 !important;
    padding-right:0 !important;

    box-sizing:border-box !important;
  }


  /* ------------------------------------------------------------
     2) POPÜLER MAÇLAR
     ------------------------------------------------------------ */

  html body #root.is-home-page
  .hm-row-bc.vay-perf-matches-row
  > .hm-row-bc-inner{
    width:var(--vay-desktop-content-width,92%) !important;
    max-width:var(--vay-desktop-content-max,1380px) !important;

    margin-left:auto !important;
    margin-right:auto !important;

    padding-left:0 !important;
    padding-right:0 !important;

    box-sizing:border-box !important;
  }

  html body #root.is-home-page
  .hm-row-bc.vay-perf-matches-row
  .popular-matches-bc{
    width:100% !important;
    max-width:100% !important;

    margin-left:0 !important;
    margin-right:0 !important;

    padding-left:0 !important;
    padding-right:0 !important;

    box-sizing:border-box !important;
  }

  html body #root.is-home-page
  .hm-row-bc.vay-perf-matches-row
  .page-view-more{
    width:100% !important;
    max-width:100% !important;

    margin-left:0 !important;
    margin-right:0 !important;

    box-sizing:border-box !important;
  }

  html body #root.is-home-page
  .hm-row-bc.vay-perf-matches-row
  .pm-body-bc{
    width:100% !important;
    max-width:100% !important;

    margin-left:0 !important;
    margin-right:0 !important;

    padding-left:0 !important;
    padding-right:0 !important;

    box-sizing:border-box !important;
  }


  /* ------------------------------------------------------------
     3) BOŞLUK / RİTİM
     ------------------------------------------------------------ */

  html body #root.is-home-page
  .hm-row-bc.vay-perf-competitions-row{
    margin-top:12px !important;
    margin-bottom:18px !important;
  }

  html body #root.is-home-page
  .hm-row-bc.vay-perf-matches-row{
    margin-top:0 !important;
    margin-bottom:18px !important;
  }


  /* Küçük desktop / laptop */
  @media (max-width:1200px){

    html body #root.is-home-page
    .hm-row-bc.vay-perf-competitions-row
    > .hm-row-bc-inner,

    html body #root.is-home-page
    .hm-row-bc.vay-perf-matches-row
    > .hm-row-bc-inner{
      width:var(--vay-desktop-content-width,94%) !important;
      max-width:var(--vay-desktop-content-max,1380px) !important;
    }
  }
}
/* ============================================================
   VAYBULL DESKTOP — BOTTOM DOUBLE BANNER ALIGN V6
   Desktop CSS'in EN ALTINA ekle.

   Hedef:
   Popüler Maçlar'ın hemen altındaki 2 adet promo slider/banner.
   - Slider ile aynı sol/sağ hizaya gelir
   - 2 eşit sütun olur
   - Aynı yükseklik / oran
   - Arada temiz gap
   - Ana hero slider'a dokunmaz
   ============================================================ */

@media (min-width:701px){

  /* Sadece Popüler Maçlar'ın hemen altındaki çift banner row */
  html body #root.is-home-page
  .hm-row-bc.vay-perf-matches-row
  + .hm-row-bc.has-slider{
    display:grid !important;
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;

    gap:18px !important;

    width:var(--vay-desktop-content-width,92%) !important;
    max-width:var(--vay-desktop-content-max,1380px) !important;

    margin:26px auto 30px !important;
    padding:0 !important;

    box-sizing:border-box !important;
    overflow:visible !important;
  }

  /* İki kolon da eşit genişlikte */
  html body #root.is-home-page
  .hm-row-bc.vay-perf-matches-row
  + .hm-row-bc.has-slider
  > .hm-row-bc-inner{
    width:100% !important;
    min-width:0 !important;
    max-width:100% !important;

    margin:0 !important;
    padding:0 !important;

    box-sizing:border-box !important;
    overflow:visible !important;
  }

  /* Her slider aynı oran / ölçü */
  html body #root.is-home-page
  .hm-row-bc.vay-perf-matches-row
  + .hm-row-bc.has-slider
  .slider-bc{
    width:100% !important;
    max-width:100% !important;

    aspect-ratio:500 / 209 !important;

    margin:0 !important;
    padding:0 !important;

    overflow:hidden !important;

    border:1px solid rgba(93,190,231,.10) !important;
    border-radius:13px !important;

    background:#081720 !important;

    box-shadow:
      0 10px 24px rgba(0,0,0,.20),
      inset 0 1px 0 rgba(255,255,255,.025) !important;

    box-sizing:border-box !important;
  }

  /* Swiper / slide tam alanı doldursun */
  html body #root.is-home-page
  .hm-row-bc.vay-perf-matches-row
  + .hm-row-bc.has-slider
  :is(
    .carouselWrapper,
    .swiper,
    .swiper-wrapper,
    .swiper-slide,
    .sdr-item-holder-bc,
    a.sdr-item-bc
  ){
    width:100% !important;
    max-width:100% !important;

    height:100% !important;
    min-height:100% !important;
    max-height:100% !important;

    margin:0 !important;
    padding:0 !important;

    box-sizing:border-box !important;
  }

  html body #root.is-home-page
  .hm-row-bc.vay-perf-matches-row
  + .hm-row-bc.has-slider
  .swiper-slide{
    flex:0 0 100% !important;
  }

  /* Görsel tam karta otursun */
  html body #root.is-home-page
  .hm-row-bc.vay-perf-matches-row
  + .hm-row-bc.has-slider
  img.sdr-image-bc{
    display:block !important;

    width:100% !important;
    min-width:100% !important;
    max-width:100% !important;

    height:100% !important;
    min-height:100% !important;
    max-height:100% !important;

    margin:0 !important;
    padding:0 !important;

    object-fit:cover !important;
    object-position:center !important;

    border:0 !important;
    border-radius:12px !important;

    transform:none !important;
  }

  /* Hafif premium hover */
  html body #root.is-home-page
  .hm-row-bc.vay-perf-matches-row
  + .hm-row-bc.has-slider
  .slider-bc{
    transition:
      transform .16s ease,
      border-color .16s ease,
      box-shadow .16s ease !important;
  }

  @media (hover:hover){
    html body #root.is-home-page
    .hm-row-bc.vay-perf-matches-row
    + .hm-row-bc.has-slider
    .slider-bc:hover{
      transform:translateY(-2px) !important;
      border-color:rgba(91,197,239,.22) !important;

      box-shadow:
        0 14px 28px rgba(0,0,0,.23),
        inset 0 1px 0 rgba(255,255,255,.03) !important;
    }
  }

  /* Küçük laptop */
  @media (max-width:1100px){
    html body #root.is-home-page
    .hm-row-bc.vay-perf-matches-row
    + .hm-row-bc.has-slider{
      gap:12px !important;
    }
  }
}
/* ============================================================
   VAYBULL DESKTOP — SPORTS PREMIUM V7
   Mevcut desktop CSS'in EN ALTINA ekle.

   Hedef:
   - Popüler Ligler / Süper Lig kartlarını premiumlaştırır
   - Popüler Maçlar alanını ana premium spor paneline çevirir
   - Mevcut tıklamalar / linkler / slider hizası korunur
   ============================================================ */

@media (min-width:701px){

  /* =========================================================
     1) POPÜLER LİGLER / SÜPER LİG ALANI
     ========================================================= */

  html body #root.is-home-page
  .hm-row-bc.vay-perf-competitions-row
  > .hm-row-bc-inner{
    position:relative !important;
  }

  html body #root.is-home-page
  .popular-competitions-bc.isWidget{
    position:relative !important;

    width:100% !important;
    max-width:100% !important;

    margin:0 !important;
    padding:16px !important;

    border:1px solid rgba(85,178,217,.10) !important;
    border-radius:16px !important;

    background:
      radial-gradient(
        80% 130% at 100% 0%,
        rgba(37,126,165,.10) 0%,
        transparent 56%
      ),
      linear-gradient(
        155deg,
        #0a202b 0%,
        #071923 64%,
        #06151e 100%
      ) !important;

    box-shadow:
      0 14px 34px rgba(0,0,0,.18),
      inset 0 1px 0 rgba(255,255,255,.024) !important;

    box-sizing:border-box !important;
    overflow:hidden !important;
  }

  /* üstte çok hafif premium highlight */
  html body #root.is-home-page
  .popular-competitions-bc.isWidget::before{
    content:"" !important;

    position:absolute !important;
    left:18px !important;
    right:18px !important;
    top:0 !important;

    height:1px !important;

    background:
      linear-gradient(
        90deg,
        transparent,
        rgba(78,193,237,.22),
        transparent
      ) !important;

    pointer-events:none !important;
  }

  html body #root.is-home-page
  .popular-competitions-bc.isWidget
  .page-view-more{
    min-height:38px !important;
    height:38px !important;

    margin:0 0 12px !important;
    padding:0 4px 10px !important;

    display:flex !important;
    align-items:center !important;

    border-bottom:1px solid rgba(255,255,255,.055) !important;
  }

  html body #root.is-home-page
  .popular-competitions-bc.isWidget
  .view-title-more{
    color:#f3f8fb !important;

    font-size:14px !important;
    font-weight:850 !important;
    letter-spacing:.045em !important;
    text-transform:uppercase !important;
  }

  /* kart grid */
  html body #root.is-home-page
  .popular-competitions-bc.isWidget
  .popular-competitions-container{
    display:grid !important;
    grid-template-columns:repeat(3,minmax(0,1fr)) !important;

    gap:10px !important;

    width:100% !important;
    max-width:100% !important;

    margin:0 !important;
    padding:0 !important;

    overflow:visible !important;

    box-sizing:border-box !important;
  }

  html body #root.is-home-page
  .popular-competitions-bc.isWidget
  .popular-competitions-container
  > .sp-s-l-b-c-item-bc{
    position:relative !important;
    isolation:isolate !important;

    display:flex !important;
    align-items:center !important;

    min-height:68px !important;
    height:68px !important;

    margin:0 !important;
    padding:10px 14px !important;

    border:1px solid rgba(103,191,226,.12) !important;
    border-radius:13px !important;

    background:
      radial-gradient(
        85% 120% at 100% 0%,
        rgba(52,134,166,.11),
        transparent 60%
      ),
      linear-gradient(
        155deg,
        #122a35 0%,
        #0d222d 64%,
        #0a1b24 100%
      ) !important;

    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.026),
      0 6px 14px rgba(0,0,0,.12) !important;

    box-sizing:border-box !important;

    cursor:pointer !important;

    transition:
      transform .16s ease,
      border-color .16s ease,
      box-shadow .16s ease,
      background .16s ease !important;
  }

  /* solda ince accent */
  html body #root.is-home-page
  .popular-competitions-bc.isWidget
  .popular-competitions-container
  > .sp-s-l-b-c-item-bc::before{
    content:"" !important;

    position:absolute !important;
    left:0 !important;
    top:13px !important;
    bottom:13px !important;

    width:2px !important;

    border-radius:0 4px 4px 0 !important;

    background:
      linear-gradient(
        180deg,
        transparent,
        rgba(67,191,238,.78),
        transparent
      ) !important;

    opacity:.62 !important;
    pointer-events:none !important;
  }

  /* üst highlight */
  html body #root.is-home-page
  .popular-competitions-bc.isWidget
  .popular-competitions-container
  > .sp-s-l-b-c-item-bc::after{
    content:"" !important;

    position:absolute !important;
    left:18px !important;
    right:18px !important;
    top:0 !important;

    height:1px !important;

    background:
      linear-gradient(
        90deg,
        transparent,
        rgba(105,211,255,.18),
        transparent
      ) !important;

    pointer-events:none !important;
  }

  html body #root.is-home-page
  .popular-competitions-bc.isWidget
  .sp-s-l-b-c-i-fav-icon-bc{
    color:#76909c !important;
    opacity:.78 !important;

    margin-right:10px !important;

    transition:
      color .16s ease,
      transform .16s ease !important;
  }

  html body #root.is-home-page
  .popular-competitions-bc.isWidget
  .sp-s-l-b-c-i-sport-icon-bc{
    color:#d4e3e9 !important;

    margin-right:9px !important;
  }

  html body #root.is-home-page
  .popular-competitions-bc.isWidget
  .sp-s-l-b-c-i-region-container{
    flex:1 1 auto !important;
    min-width:0 !important;

    color:#edf5f8 !important;

    font-weight:650 !important;
  }

  /* sağ sayı badge */
  html body #root.is-home-page
  .popular-competitions-bc.isWidget
  .sp-s-l-b-c-i-g-count-bc{
    flex:0 0 auto !important;

    min-width:38px !important;
    height:36px !important;

    margin-left:10px !important;
    padding:0 10px !important;

    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;

    border:1px solid rgba(94,188,228,.13) !important;
    border-radius:9px !important;

    background:
      linear-gradient(
        180deg,
        #1b3b49 0%,
        #14313e 100%
      ) !important;

    color:#9addfa !important;

    font-size:13px !important;
    font-weight:850 !important;

    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.03) !important;
  }

  @media (hover:hover){
    html body #root.is-home-page
    .popular-competitions-bc.isWidget
    .popular-competitions-container
    > .sp-s-l-b-c-item-bc:hover{
      transform:translateY(-2px) !important;

      border-color:rgba(85,192,235,.25) !important;

      background:
        radial-gradient(
          85% 120% at 100% 0%,
          rgba(57,153,192,.16),
          transparent 60%
        ),
        linear-gradient(
          155deg,
          #163340 0%,
          #102833 68%,
          #0b202a 100%
        ) !important;

      box-shadow:
        inset 0 1px 0 rgba(255,255,255,.04),
        0 10px 21px rgba(0,0,0,.18) !important;
    }

    html body #root.is-home-page
    .popular-competitions-bc.isWidget
    .popular-competitions-container
    > .sp-s-l-b-c-item-bc:hover
    .sp-s-l-b-c-i-fav-icon-bc{
      color:#8bdcff !important;
      transform:scale(1.05) !important;
    }
  }


  /* =========================================================
     2) POPÜLER MAÇLAR — PREMIUM SPORTS PANEL
     ========================================================= */

  html body #root.is-home-page
  .hm-row-bc.vay-perf-matches-row{
    margin-top:18px !important;
    margin-bottom:22px !important;
  }

  html body #root.is-home-page
  .popular-matches-bc{
    position:relative !important;

    width:100% !important;
    max-width:100% !important;

    margin:0 !important;
    padding:16px !important;

    border:1px solid rgba(86,187,229,.11) !important;
    border-radius:17px !important;

    background:
      radial-gradient(
        90% 120% at 100% 0%,
        rgba(30,118,157,.10) 0%,
        transparent 55%
      ),
      linear-gradient(
        160deg,
        #091e29 0%,
        #071923 60%,
        #06151e 100%
      ) !important;

    box-shadow:
      0 18px 40px rgba(0,0,0,.20),
      inset 0 1px 0 rgba(255,255,255,.028) !important;

    box-sizing:border-box !important;
    overflow:hidden !important;
  }

  html body #root.is-home-page
  .popular-matches-bc::before{
    content:"" !important;

    position:absolute !important;
    left:20px !important;
    right:20px !important;
    top:0 !important;

    height:1px !important;

    background:
      linear-gradient(
        90deg,
        transparent,
        rgba(84,200,245,.28),
        transparent
      ) !important;

    pointer-events:none !important;
  }

  /* başlık alanı */
  html body #root.is-home-page
  .popular-matches-bc
  > .page-view-more{
    position:relative !important;

    display:flex !important;
    align-items:center !important;

    min-height:48px !important;
    height:48px !important;

    margin:0 0 12px !important;
    padding:0 0 12px 16px !important;

    border-bottom:1px solid rgba(255,255,255,.065) !important;

    box-sizing:border-box !important;
  }

  html body #root.is-home-page
  .popular-matches-bc
  > .page-view-more::before{
    content:"" !important;

    position:absolute !important;
    left:0 !important;
    top:9px !important;
    bottom:21px !important;

    width:3px !important;

    border-radius:3px !important;

    background:
      linear-gradient(
        180deg,
        #64d6ff 0%,
        #238ee9 100%
      ) !important;

    box-shadow:
      0 0 10px rgba(63,181,239,.17) !important;

    pointer-events:none !important;
  }

  html body #root.is-home-page
  .popular-matches-bc
  > .page-view-more
  .view-title-more{
    color:#f4f9fb !important;

    font-size:15px !important;
    font-weight:850 !important;
    letter-spacing:.045em !important;
    text-transform:uppercase !important;
  }

  /* TÜMÜ butonu */
  html body #root.is-home-page
  .popular-matches-bc
  > .page-view-more
  :is(a,button){
    border:1px solid rgba(103,193,231,.12) !important;
    border-radius:9px !important;

    background:
      linear-gradient(
        180deg,
        #173542 0%,
        #102a35 100%
      ) !important;

    color:#dcebf2 !important;

    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.025) !important;

    transition:
      background .15s ease,
      border-color .15s ease,
      transform .15s ease !important;
  }

  html body #root.is-home-page
  .popular-matches-bc
  > .page-view-more
  :is(a,button):hover{
    border-color:rgba(96,197,239,.24) !important;
    background:#173b4a !important;
    transform:translateY(-1px) !important;
  }

  /* ana maç gövdesi */
  html body #root.is-home-page
  .popular-matches-bc
  .pm-body-bc{
    width:100% !important;
    max-width:100% !important;

    margin:0 !important;
    padding:10px !important;

    border:1px solid rgba(101,184,217,.07) !important;
    border-radius:13px !important;

    background:
      linear-gradient(
        180deg,
        rgba(8,25,35,.90),
        rgba(6,20,29,.94)
      ) !important;

    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.018) !important;

    box-sizing:border-box !important;
    overflow:hidden !important;
  }

  /* pm-body içindeki doğrudan ana gruplar */
  html body #root.is-home-page
  .popular-matches-bc
  .pm-body-bc
  > *{
    border-radius:8px !important;
  }

  /* select / market / filtre düğmeleri */
  html body #root.is-home-page
  .popular-matches-bc
  .pm-body-bc
  :is(button,select){
    min-height:36px !important;

    border:1px solid rgba(97,186,224,.10) !important;
    border-radius:8px !important;

    background:#102733 !important;

    color:#dbe9ef !important;

    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.02) !important;
  }

  /* tablo içindeki link / bahis hücreleri */
  html body #root.is-home-page
  .popular-matches-bc
  .pm-body-bc
  a{
    text-decoration:none !important;
  }

  /* oranları biraz daha canlı ama neon olmayan şekilde */
  html body #root.is-home-page
  .popular-matches-bc
  .pm-body-bc
  :is(
    [class*="odd"],
    [class*="Odd"],
    [class*="coef"],
    [class*="Coef"]
  ){
    color:#29a8f3 !important;

    font-weight:750 !important;
  }

  /* hover row hissi — sadece pm gövdesinde etkileşimli bloklara */
  @media (hover:hover){
    html body #root.is-home-page
    .popular-matches-bc
    .pm-body-bc
    :is(a,button):hover{
      filter:brightness(1.07) !important;
    }
  }


  /* =========================================================
     3) RESPONSIVE DESKTOP
     ========================================================= */

  @media (max-width:1200px){

    html body #root.is-home-page
    .popular-competitions-bc.isWidget{
      padding:13px !important;
    }

    html body #root.is-home-page
    .popular-competitions-bc.isWidget
    .popular-competitions-container{
      gap:8px !important;
    }

    html body #root.is-home-page
    .popular-competitions-bc.isWidget
    .popular-competitions-container
    > .sp-s-l-b-c-item-bc{
      height:64px !important;
      min-height:64px !important;

      padding:9px 11px !important;
    }

    html body #root.is-home-page
    .popular-matches-bc{
      padding:13px !important;
    }
  }
}

/* ============================================================
   VAYBULL DESKTOP — FOOTER CLEAN FINAL V5
   Clean Desktop JS V5 ile birlikte kullanılır.

   ÖNEMLİ:
   - Eski Footer V1/V2/V3/V4 CSS blokları bu dosyada YOK.
   - Eski footer arka plan resmi tamamen kaldırılır.
   - Sol: Hakkında + Kurallar
   - Sağ: Büyük GCB + Şikayetvar / Yüksek Memnuniyet
   - Alt: GambleAware + 18+ / copyright
   ============================================================ */

@media (min-width:701px){

  /* =========================================================
     1) NATIVE FOOTER ARKA PLANINI TAMAMEN TEMİZLE
     ========================================================= */

  html body #root .layout-footer-holder-bc,
  html body #root .footerWrapper,
  html body #root .footerContainerWrapper{
    position:relative !important;

    background:#05141d !important;
    background-color:#05141d !important;
    background-image:none !important;
    background-attachment:scroll !important;

    border:0 !important;
    box-shadow:none !important;
  }

  html body #root .layout-footer-holder-bc::before,
  html body #root .layout-footer-holder-bc::after,
  html body #root .footerWrapper::before,
  html body #root .footerWrapper::after{
    background-image:none !important;
  }

  html body #root .footerContainerWrapper{
    padding:30px 0 22px !important;

    border-top:1px solid rgba(91,190,231,.09) !important;

    background:
      radial-gradient(
        52% 80% at 50% 0%,
        rgba(35,120,155,.075) 0%,
        transparent 68%
      ),
      linear-gradient(
        180deg,
        #061923 0%,
        #05141d 55%,
        #041119 100%
      ) !important;

    overflow:hidden !important;
  }

  html body #root .footerContainerWrapper::before{
    content:"" !important;

    position:absolute !important;
    inset:0 !important;

    background:
      linear-gradient(
        90deg,
        rgba(1,10,16,.22) 0%,
        transparent 22%,
        transparent 78%,
        rgba(1,10,16,.22) 100%
      ) !important;

    pointer-events:none !important;
  }


  /* =========================================================
     2) ANA FOOTER GRID — SLIDER HİZASI
     ========================================================= */

  html body #root
  .footerContainerWrapper
  .footerContainer.vay-desktop-footer-premium-v1{
    position:relative !important;
    z-index:1 !important;

    display:grid !important;

    grid-template-columns:
      minmax(0, .88fr)
      minmax(560px, 1.12fr) !important;

    grid-template-areas:
      "header header"
      "links license"
      "responsible copyright" !important;

    align-items:stretch !important;

    column-gap:18px !important;
    row-gap:16px !important;

    width:var(--vay-desktop-content-width,92%) !important;
    max-width:var(--vay-desktop-content-max,1380px) !important;

    margin:0 auto !important;
    padding:0 !important;

    background:transparent !important;

    box-sizing:border-box !important;
  }


  /* =========================================================
     3) ÜST BAR — X + TELEGRAM / SAAT / DİL
     ========================================================= */

  html body #root
  .vay-desktop-footer-premium-v1
  .vay-desktop-footer-header-v1{
    grid-area:header !important;

    display:flex !important;
    align-items:center !important;
    justify-content:space-between !important;

    width:100% !important;
    min-height:62px !important;

    margin:0 !important;
    padding:10px 13px !important;

    border:1px solid rgba(91,187,225,.10) !important;
    border-radius:14px !important;

    background:
      linear-gradient(
        160deg,
        rgba(10,35,47,.96) 0%,
        rgba(7,26,36,.94) 100%
      ) !important;

    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.025),
      0 9px 22px rgba(0,0,0,.14) !important;

    box-sizing:border-box !important;
  }

  html body #root
  .vay-desktop-footer-premium-v1
  .vay-desktop-footer-socials-v1{
    display:flex !important;
    align-items:center !important;

    gap:9px !important;

    width:auto !important;

    margin:0 !important;
    padding:0 !important;

    list-style:none !important;
  }

  html body #root
  .vay-desktop-footer-premium-v1
  .vay-desktop-footer-social-item-v1{
    display:block !important;

    flex:0 0 40px !important;

    width:40px !important;
    min-width:40px !important;
    max-width:40px !important;

    height:40px !important;
    min-height:40px !important;
    max-height:40px !important;

    margin:0 !important;
    padding:0 !important;

    list-style:none !important;
  }

  html body #root
  .vay-desktop-footer-premium-v1
  a.vay-desktop-footer-social-btn-v1{
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;

    width:40px !important;
    height:40px !important;

    margin:0 !important;
    padding:0 !important;

    border:1px solid rgba(101,199,238,.15) !important;
    border-radius:11px !important;

    background:
      linear-gradient(
        180deg,
        #12313f 0%,
        #091f2a 100%
      ) !important;

    background-image:none !important;

    color:#f3f9fc !important;

    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.04),
      0 5px 13px rgba(0,0,0,.17) !important;

    text-decoration:none !important;

    overflow:hidden !important;

    transition:
      transform .15s ease,
      border-color .15s ease,
      background .15s ease !important;
  }

  html body #root
  .vay-desktop-footer-premium-v1
  a.vay-desktop-footer-telegram-v1{
    color:#62cfff !important;
  }

  html body #root
  .vay-desktop-footer-premium-v1
  .vay-desktop-footer-svg-v1{
    display:block !important;

    width:20px !important;
    height:20px !important;

    color:inherit !important;

    filter:none !important;
  }

  html body #root
  .vay-desktop-footer-premium-v1
  .vay-desktop-footer-header-v1
  .footerTopButtonGroup,
  html body #root
  .vay-desktop-footer-premium-v1
  .vay-desktop-footer-header-v1
  .footerInnerLeftCol{
    min-width:0 !important;
  }


  /* =========================================================
     4) SOL PANEL — HAKKINDA + KURALLAR
     ========================================================= */

  html body #root
  .vay-desktop-footer-premium-v1
  .vay-desktop-footer-links-v1{
    grid-area:links !important;

    display:grid !important;
    grid-template-columns:
      repeat(auto-fit,minmax(235px,1fr)) !important;

    align-content:start !important;

    gap:14px 26px !important;

    width:100% !important;
    height:100% !important;
    min-height:330px !important;

    margin:0 !important;
    padding:22px !important;

    border:1px solid rgba(91,185,223,.10) !important;
    border-radius:16px !important;

    background:
      radial-gradient(
        95% 100% at 100% 0%,
        rgba(39,123,157,.075),
        transparent 61%
      ),
      linear-gradient(
        155deg,
        #0a2531 0%,
        #071c27 100%
      ) !important;

    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.025),
      0 12px 27px rgba(0,0,0,.15) !important;

    box-sizing:border-box !important;
    overflow:hidden !important;
  }

  html body #root
  .vay-desktop-footer-premium-v1
  .vay-desktop-footer-link-card-v1{
    min-width:0 !important;

    margin:0 !important;
    padding:0 !important;

    border:0 !important;
    background:transparent !important;
    box-shadow:none !important;
  }

  html body #root
  .vay-desktop-footer-premium-v1
  .vay-desktop-footer-link-card-v1
  :is(h3,h4){
    position:relative !important;

    margin:0 0 13px !important;
    padding:0 0 10px 13px !important;

    border-bottom:1px solid rgba(255,255,255,.055) !important;

    color:#f1f7fa !important;

    font-size:12.5px !important;
    font-weight:850 !important;
    line-height:1.2 !important;
    letter-spacing:.045em !important;

    text-transform:uppercase !important;
  }

  html body #root
  .vay-desktop-footer-premium-v1
  .vay-desktop-footer-link-card-v1
  :is(h3,h4)::before{
    content:"" !important;

    position:absolute !important;
    left:0 !important;
    top:2px !important;

    width:3px !important;
    height:14px !important;

    border-radius:3px !important;

    background:#4fc4ef !important;

    box-shadow:0 0 8px rgba(79,196,239,.14) !important;
  }

  html body #root
  .vay-desktop-footer-premium-v1
  .vay-desktop-footer-link-card-v1
  a{
    display:flex !important;
    align-items:center !important;

    width:max-content !important;
    max-width:100% !important;

    margin:0 0 5px !important;
    padding:6px 8px !important;

    border-radius:7px !important;

    color:rgba(205,221,228,.69) !important;

    font-size:11px !important;
    font-weight:600 !important;
    line-height:1.25 !important;

    text-decoration:none !important;

    transition:
      color .14s ease,
      background .14s ease,
      transform .14s ease !important;
  }


  /* =========================================================
     5) SAĞ PANEL HOST — NATIVE FOOTER İÇERİĞİNİ GİZLE
     ========================================================= */

  html body #root
  .vay-desktop-footer-premium-v1
  .vay-desktop-final-license-host-v4{
    grid-area:license !important;

    display:block !important;

    width:100% !important;
    height:100% !important;
    min-height:330px !important;

    margin:0 !important;
    padding:0 !important;

    border:0 !important;
    background:transparent !important;

    align-self:stretch !important;

    box-sizing:border-box !important;
  }

  html body #root
  .vay-desktop-footer-premium-v1
  .vay-desktop-final-license-host-v4
  > *:not(.vay-desktop-final-license-v4){
    display:none !important;
  }


  /* =========================================================
     6) SAĞ PANEL — GCB + GÜVEN & MEMNUNİYET
     ========================================================= */

  html body #root
  .vay-desktop-footer-premium-v1
  .vay-desktop-final-license-v4{
    display:grid !important;

    grid-template-columns:
      minmax(250px,.78fr)
      minmax(0,1.45fr) !important;

    align-items:stretch !important;

    gap:14px !important;

    width:100% !important;
    height:100% !important;
    min-height:330px !important;

    margin:0 !important;
    padding:0 !important;

    box-sizing:border-box !important;
  }

  html body #root
  .vay-desktop-footer-premium-v1
  .vay-desktop-final-gcb-panel-v4,
  html body #root
  .vay-desktop-footer-premium-v1
  .vay-desktop-final-trust-panel-v4{
    position:relative !important;

    min-width:0 !important;
    min-height:330px !important;

    margin:0 !important;
    padding:56px 18px 20px !important;

    border:1px solid rgba(96,192,230,.11) !important;
    border-radius:16px !important;

    background:
      radial-gradient(
        105% 105% at 50% 0%,
        rgba(40,130,166,.10),
        transparent 61%
      ),
      linear-gradient(
        155deg,
        #0b2936 0%,
        #081e29 100%
      ) !important;

    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.027),
      0 12px 27px rgba(0,0,0,.15) !important;

    overflow:hidden !important;

    box-sizing:border-box !important;
  }

  html body #root
  .vay-desktop-footer-premium-v1
  .vay-desktop-final-gcb-panel-v4{
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
  }

  html body #root
  .vay-desktop-footer-premium-v1
  .vay-desktop-final-trust-panel-v4{
    display:flex !important;
    flex-direction:column !important;
    align-items:stretch !important;
    justify-content:center !important;
  }

  html body #root
  .vay-desktop-footer-premium-v1
  .vay-desktop-final-gcb-panel-v4::before,
  html body #root
  .vay-desktop-footer-premium-v1
  .vay-desktop-final-trust-panel-v4::before{
    content:"" !important;

    position:absolute !important;
    left:20px !important;
    right:20px !important;
    top:0 !important;

    height:1px !important;

    background:
      linear-gradient(
        90deg,
        transparent,
        rgba(102,206,246,.22),
        transparent
      ) !important;

    pointer-events:none !important;
  }

  html body #root
  .vay-desktop-footer-premium-v1
  .vay-desktop-final-panel-title-v4{
    position:absolute !important;

    top:18px !important;
    left:19px !important;

    color:rgba(216,232,239,.72) !important;

    font-size:10px !important;
    font-weight:850 !important;
    line-height:1 !important;
    letter-spacing:.075em !important;

    text-transform:uppercase !important;
  }


  /* =========================================================
     7) GCB — TEK VE BÜYÜK
     ========================================================= */

  html body #root
  .vay-desktop-footer-premium-v1
  .vay-desktop-final-gcb-card-v4{
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;

    width:min(235px,92%) !important;
    max-width:235px !important;

    height:130px !important;
    min-height:130px !important;

    margin:0 !important;
    padding:18px 22px !important;

    border:1px solid rgba(108,206,245,.19) !important;
    border-radius:16px !important;

    background:
      radial-gradient(
        100% 120% at 50% 0%,
        rgba(52,151,188,.13),
        transparent 64%
      ),
      linear-gradient(
        155deg,
        #113846 0%,
        #092630 100%
      ) !important;

    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.04),
      0 12px 25px rgba(0,0,0,.18) !important;

    text-decoration:none !important;

    box-sizing:border-box !important;

    transition:
      transform .16s ease,
      border-color .16s ease,
      box-shadow .16s ease !important;
  }

  html body #root
  .vay-desktop-footer-premium-v1
  .vay-desktop-final-gcb-img-v4{
    display:block !important;

    width:178px !important;
    max-width:178px !important;

    height:auto !important;
    max-height:76px !important;

    object-fit:contain !important;

    filter:none !important;
    transform:none !important;
  }


  /* =========================================================
     8) ŞİKAYETVAR + YÜKSEK MEMNUNİYET
     ========================================================= */

  html body #root
  .vay-desktop-footer-premium-v1
  .vay-desktop-final-trust-grid-v4{
    display:grid !important;

    grid-template-columns:
      repeat(2,minmax(0,1fr)) !important;

    align-items:stretch !important;

    gap:12px !important;

    width:100% !important;

    margin:0 !important;
    padding:0 !important;

    box-sizing:border-box !important;
  }

  html body #root
  .vay-desktop-footer-premium-v1
  .vay-desktop-final-trust-card-v4{
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;

    width:100% !important;
    min-width:0 !important;

    height:152px !important;
    min-height:152px !important;

    margin:0 !important;
    padding:18px !important;

    border:1px solid rgba(96,189,227,.105) !important;
    border-radius:13px !important;

    background:
      radial-gradient(
        100% 100% at 50% 0%,
        rgba(38,119,151,.08),
        transparent 67%
      ),
      linear-gradient(
        155deg,
        #0d2d39 0%,
        #091f2a 100%
      ) !important;

    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.024) !important;

    text-decoration:none !important;

    box-sizing:border-box !important;

    transition:
      transform .15s ease,
      border-color .15s ease,
      background .15s ease !important;
  }

  html body #root
  .vay-desktop-footer-premium-v1
  .vay-desktop-final-trust-img-v4{
    position:static !important;

    display:block !important;

    width:100% !important;
    min-width:0 !important;
    max-width:195px !important;

    height:auto !important;
    max-height:78px !important;

    margin:0 auto !important;
    padding:0 !important;

    object-fit:contain !important;
    object-position:center !important;

    opacity:1 !important;

    filter:none !important;
    transform:none !important;
  }


  /* =========================================================
     9) GAMBLEAWARE + 18+
     ========================================================= */

  html body #root
  .vay-desktop-footer-premium-v1
  .vay-desktop-responsible-v1{
    grid-area:responsible !important;

    display:flex !important;
    align-items:center !important;
    justify-content:flex-start !important;

    gap:12px !important;

    width:100% !important;
    min-height:54px !important;

    margin:0 !important;
    padding:9px 14px !important;

    border:1px solid rgba(91,182,219,.075) !important;
    border-radius:12px !important;

    background:
      linear-gradient(
        160deg,
        rgba(8,29,39,.82),
        rgba(6,23,32,.80)
      ) !important;

    box-sizing:border-box !important;
  }

  html body #root
  .vay-desktop-footer-premium-v1
  .vay-desktop-responsible-v1
  img{
    display:block !important;

    width:auto !important;
    max-width:170px !important;

    height:auto !important;
    max-height:34px !important;

    object-fit:contain !important;

    opacity:.90 !important;
  }

  html body #root
  .vay-desktop-footer-premium-v1
  .vay-desktop-age-v1{
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;

    flex:0 0 34px !important;

    width:34px !important;
    min-width:34px !important;
    max-width:34px !important;

    height:34px !important;
    min-height:34px !important;
    max-height:34px !important;

    margin:0 !important;
    padding:0 !important;

    border:1px solid rgba(255,61,139,.50) !important;
    border-radius:50% !important;

    background:rgba(157,19,79,.075) !important;

    color:#ff428d !important;

    font-size:9.5px !important;
    font-weight:850 !important;
    line-height:1 !important;
  }


  /* =========================================================
     10) COPYRIGHT
     ========================================================= */

  html body #root
  .vay-desktop-footer-premium-v1
  .vay-desktop-copyright-v1{
    grid-area:copyright !important;

    display:flex !important;
    align-items:center !important;
    justify-content:flex-end !important;

    width:100% !important;
    min-height:54px !important;

    margin:0 !important;
    padding:9px 14px !important;

    border:1px solid rgba(91,182,219,.075) !important;
    border-radius:12px !important;

    background:
      linear-gradient(
        160deg,
        rgba(8,29,39,.82),
        rgba(6,23,32,.80)
      ) !important;

    color:rgba(195,211,219,.49) !important;

    font-size:10.5px !important;
    font-weight:600 !important;
    line-height:1.2 !important;
    text-align:right !important;

    box-sizing:border-box !important;
  }


  /* =========================================================
     11) HOVER
     ========================================================= */

  @media (hover:hover){

    html body #root
    .vay-desktop-footer-premium-v1
    a.vay-desktop-footer-social-btn-v1:hover{
      transform:translateY(-2px) !important;

      border-color:rgba(96,203,246,.28) !important;

      background:#123543 !important;
    }

    html body #root
    .vay-desktop-footer-premium-v1
    .vay-desktop-footer-link-card-v1
    a:hover{
      color:#ffffff !important;

      background:rgba(89,191,232,.07) !important;

      transform:translateX(2px) !important;
    }

    html body #root
    .vay-desktop-footer-premium-v1
    .vay-desktop-final-gcb-card-v4:hover{
      transform:translateY(-3px) !important;

      border-color:rgba(100,205,245,.32) !important;

      box-shadow:
        inset 0 1px 0 rgba(255,255,255,.045),
        0 16px 30px rgba(0,0,0,.21) !important;
    }

    html body #root
    .vay-desktop-footer-premium-v1
    .vay-desktop-final-trust-card-v4:hover{
      transform:translateY(-2px) !important;

      border-color:rgba(96,198,239,.22) !important;

      background:#10323f !important;
    }
  }
}


/* ============================================================
   LAPTOP DESKTOP
   ============================================================ */

@media (min-width:701px) and (max-width:1180px){

  html body #root
  .footerContainerWrapper
  .footerContainer.vay-desktop-footer-premium-v1{
    grid-template-columns:1fr !important;

    grid-template-areas:
      "header"
      "links"
      "license"
      "responsible"
      "copyright" !important;
  }

  html body #root
  .vay-desktop-footer-premium-v1
  .vay-desktop-footer-links-v1{
    min-height:auto !important;
  }

  html body #root
  .vay-desktop-footer-premium-v1
  .vay-desktop-final-license-host-v4,
  html body #root
  .vay-desktop-footer-premium-v1
  .vay-desktop-final-license-v4{
    min-height:300px !important;
  }

  html body #root
  .vay-desktop-footer-premium-v1
  .vay-desktop-final-gcb-panel-v4,
  html body #root
  .vay-desktop-footer-premium-v1
  .vay-desktop-final-trust-panel-v4{
    min-height:300px !important;
  }

  html body #root
  .vay-desktop-footer-premium-v1
  .vay-desktop-copyright-v1{
    justify-content:center !important;
    text-align:center !important;
  }

  html body #root
  .vay-desktop-footer-premium-v1
  .vay-desktop-responsible-v1{
    justify-content:center !important;
  }
}

/* ============================================================
   VAYBULL DESKTOP — PERFORMANCE FINAL P1
   Görünümü korur; sürekli style recalculation üreten animasyonları
   statik premium border halinde bırakır.
   ============================================================ */

@media (min-width:701px){

  /*
    Bu dört alan custom CSS property + conic-gradient'i sürekli
    animate ediyordu. Chrome her frame style recalculation yapıyordu.
    Border/gölge görünümü kalır, yalnız sürekli dönme/breathing durur.
  */
  html body #root nav.hdr-navigation-scrollable-content
  > a.hdr-navigation-link-bc,

  html body #root .layout-header-holder-bc
  .bg-nav-list > *,

  html body #root .home-quick-access
  .product-banner-bc,

  html body #root .home-quick-access
  > div > a.product-banner-bc{
    animation:none !important;
  }

  /* Hover yine premium hissi verir ama filtre repaint'i azaltılır. */
  html body #root nav.hdr-navigation-scrollable-content
  > a.hdr-navigation-link-bc:hover,

  html body #root .layout-header-holder-bc
  .bg-nav-list > *:hover{
    filter:none !important;
  }

}

/* ============================================================
   VAYBULL DESKTOP — STABLE SLOT 12 V6
   12 oyun = 6 x 2.
   Native React/Swiper oyun listesi gizlenir.
   12 kart bağımsız ve sabit custom grid olarak gösterilir.
   Son 2 kartın gidip gelmesini tamamen keser.
   ============================================================ */

@media (min-width:701px){

  html body #root.is-home-page
  .vay-desktop-slot-host-v6{
    position:relative !important;
    width:100% !important;
    max-width:100% !important;
    margin:0 !important;
    padding:0 !important;
    box-sizing:border-box !important;
  }

  /*
    Native oyun strip'i React tarafından güncellenmeye devam edebilir,
    fakat ekranda hiç çizilmez. Böylece bizim 12 kartımıza dokunamaz.
  */
  html body #root.is-home-page
  .vay-desktop-slot-row-final
  .vay-desktop-native-slot-strip-v6,
  html body #root.is-home-page
  .vay-desktop-slot-host-v6
  .vay-desktop-native-slot-strip-v6,
  html body #root.is-home-page
  .product-banner-container-bc.pop-serit.vay-desktop-native-slot-strip-v6{
    display:none !important;
    visibility:hidden !important;
    height:0 !important;
    min-height:0 !important;
    max-height:0 !important;
    margin:0 !important;
    padding:0 !important;
    overflow:hidden !important;
  }

  html body #root.is-home-page
  .vay-desktop-slot-custom-grid-v6{
    display:grid !important;
    grid-template-columns:repeat(6,minmax(0,1fr)) !important;
    gap:14px !important;

    width:100% !important;
    max-width:100% !important;

    margin:0 !important;
    padding:0 !important;

    box-sizing:border-box !important;
  }

  html body #root.is-home-page
  .vay-desktop-slot-card-v6{
    position:relative !important;
    display:block !important;

    width:100% !important;
    min-width:0 !important;

    aspect-ratio:180 / 236 !important;

    margin:0 !important;
    padding:0 !important;

    border:1px solid rgba(90,190,230,.12) !important;
    border-radius:12px !important;

    background:#081720 !important;

    box-shadow:
      0 8px 22px rgba(0,0,0,.22),
      inset 0 1px 0 rgba(255,255,255,.025) !important;

    overflow:hidden !important;
    text-decoration:none !important;

    box-sizing:border-box !important;

    contain:layout paint !important;

    transition:
      transform .16s ease,
      border-color .16s ease,
      box-shadow .16s ease !important;
  }

  html body #root.is-home-page
  .vay-desktop-slot-image-v6{
    position:absolute !important;
    inset:0 !important;

    display:block !important;

    width:100% !important;
    height:100% !important;

    min-width:100% !important;
    min-height:100% !important;

    max-width:100% !important;
    max-height:100% !important;

    margin:0 !important;
    padding:0 !important;

    object-fit:cover !important;
    object-position:center !important;

    border-radius:11px !important;

    opacity:1 !important;
    visibility:visible !important;

    filter:none !important;
    transform:none !important;
  }

  /* Carousel yok, native okları gösterme. */
  html body #root.is-home-page
  .vay-desktop-slot-row-final
  .page-view-more
  .serit-gez{
    display:none !important;
  }

  @media (hover:hover){
    html body #root.is-home-page
    .vay-desktop-slot-card-v6:hover{
      transform:translateY(-3px) !important;

      border-color:rgba(86,192,235,.25) !important;

      box-shadow:
        0 13px 25px rgba(0,0,0,.25),
        0 0 0 1px rgba(55,158,210,.05) !important;
    }
  }

  @media (max-width:1200px){
    html body #root.is-home-page
    .vay-desktop-slot-custom-grid-v6{
      gap:10px !important;
    }
  }
}