.switch-to-desktop.btn-switch-view-wrapper {
    display: flex;
    flex-flow: row;
    flex-direction: row
}

.switch-to-desktop.btn-switch-view-wrapper .btn-wrapper-desktop {
    display: flex;
    width: 100%;
    justify-content: center
}

.switch-to-desktop.btn-switch-view-wrapper .btn-wrapper-desktop .btn-switch-to-desktop {
    display: flex;
    margin: 24px 24px 24px 24px;
    justify-self: center
}

.switch-to-desktop.btn-switch-view-wrapper .btn-wrapper-desktop .btn-switch-to-desktop.dark {
    color: var(--primary-mode-1);
    border-color: var(--primary-mode-1)
}

.switch-to-desktop.btn-switch-view-wrapper .btn-wrapper-desktop .btn-switch-to-desktop .background-color-dark {
    background-color: var(--primary-mode-1)
}

.switch-to-mobile.btn-switch-view-wrapper {
    display: flex;
    flex-flow: row;
    flex-direction: row
}

.switch-to-mobile.btn-switch-view-wrapper .btn-wrapper-mobile {
    display: flex;
    width: 100%;
    justify-content: center
}

.switch-to-mobile.btn-switch-view-wrapper .btn-wrapper-mobile .btn-switch-to-mobile {
    display: flex;
    margin: 24px 24px 24px 24px;
    justify-self: center
}

.switch-to-mobile.btn-switch-view-wrapper .btn-wrapper-mobile .btn-switch-to-mobile.dark {
    color: var(--primary-mode-1);
    border-color: var(--primary-mode-1)
}

.switch-to-mobile.btn-switch-view-wrapper .btn-wrapper-mobile .btn-switch-to-mobile .background-color-dark {
    background-color: var(--primary-mode-1)
}

footer .footer-content {
    max-width: 1360px
}

footer .footer-content .btn-switch-view-wrapper {
    display: flex;
    flex-flow: row;
    flex-direction: row
}

footer .footer-content .btn-switch-view-wrapper .btn-wrapper-mobile {
    display: flex;
    width: 100%;
    justify-content: flex-start
}

footer .footer-content .btn-switch-view-wrapper .btn-wrapper-mobile .btn-switch-to-mobile {
    display: flex;
    margin: 40px 0px 24px 24px;
    justify-self: flex-start
}

footer .footer-content .btn-switch-view-wrapper .btn-wrapper-mobile .btn-switch-to-mobile.white {
    color: var(--other-1);
    border-color: var(--other-1)
}

footer .footer-content .btn-switch-view-wrapper .btn-wrapper-mobile .btn-switch-to-mobile .background-color-white {
    background-color: var(--other-1)
}

footer .footer-content .footer-top:before {
    content: "";
    position: absolute;
    background-color: var(--secondary-1);
    width: 200vw;
    height: 100%;
    top: 0;
    right: 0;
    bottom: 0;
    left: -100vw
}

footer .footer-content .footer-top .payment-media-container .payment-container .payment-methods .method-container {
    position: relative
}

footer .footer-content .footer-top .payment-media-container .payment-container .payment-methods .method-container .payment-method {
    height: 32px
}

footer .footer-content .footer-top .payment-media-container .payment-container .payment-methods .method-container .color-image {
    height: 32px;
    position: absolute;
    top: 0;
    left: 0;
    opacity: 0;
    transition: opacity .5s
}

footer .footer-content .footer-top .payment-media-container .payment-container .payment-methods .method-container:hover .color-image {
    opacity: 1;
    transition: opacity .5s
}

footer .footer-content .footer-top .payment-media-container .payment-container .payment-methods .method-container:hover .grey-image {
    opacity: 0;
    transition: opacity .5s
}

footer .footer-content .footer-top .payment-media-container .social-media a:after {
    content: "";
    background-color: var(--primary-6);
    transition: background-color .5s;
    height: 24px;
    width: 24px
}

@media(min-width: 767.5px) {
    footer .footer-content .footer-top .payment-media-container .social-media a:after {
        height: 32px;
        width: 32px
    }
}

footer .footer-content .footer-center:before {
    content: "";
    position: absolute;
    background-color: var(--primary-1);
    width: 200vw;
    height: 100%;
    top: 0;
    right: 0;
    bottom: 0;
    left: -100vw
}

footer .footer-content .footer-center .game-providers {
    z-index: 1
}

footer .footer-content .footer-center .game-providers .providers-wrapper .provider-container {
    zoom: .6666666667
}

@media(min-width: 767.5px) {
    footer .footer-content .footer-center .game-providers .providers-wrapper .provider-container {
        zoom: .8333333333
    }
}

@media(min-width: 1023.5px) {
    footer .footer-content .footer-center .game-providers .providers-wrapper .provider-container {
        zoom: 1
    }
}

footer .footer-content .footer-center .game-providers .providers-wrapper .provider-container .provider-image {
    background: url(../../static/images/footer/game-providers/providers.png);
    position: relative;
    transition: opacity .5s;
    height: 48px;
    opacity: 1
}

footer .footer-content .footer-center .game-providers .providers-wrapper .provider-container .provider-image:hover {
    opacity: 0
}

footer .footer-content .footer-center .game-providers .providers-wrapper .provider-container .provider-image.hover {
    position: absolute;
    top: 0;
    left: 0;
    opacity: 0
}

footer .footer-content .footer-center .game-providers .providers-wrapper .provider-container .provider-image.hover:hover {
    opacity: 1
}

footer .footer-content .footer-center .game-providers .providers-wrapper .separation-line {
    height: 1px
}

footer .footer-content .footer-center .sponsorships-container {
    z-index: 1
}

@media(min-width: 767.5px) {
    footer .footer-content .footer-center .sponsorships-container {
        align-items: baseline
    }
}

footer .footer-content .footer-sponsors{
    text-size-adjust: none;
    -webkit-text-size-adjust: none;
    -moz-text-size-adjust: none;
    -ms-text-size-adjust: none;
  
}

footer .footer-content .footer-sponsors:before {
    content: "";
    background-color: var(--other-1) !important;
    width: 200vw;
    height: 100%;
    top: 0;
    right: 0;
    bottom: 0;
    left: -100vw
}

footer .footer-content .footer-bottom .terms-info {
    text-size-adjust: none;
    -webkit-text-size-adjust: none;
    -moz-text-size-adjust: none;
    -ms-text-size-adjust: none;
  
}

footer .footer-content .footer-bottom .terms-info :before {
    content: "";
    background-color: var(--primary-1) !important;
    width: 200vw;
    height: 100%;
    top: 0;
    right: 0;
    bottom: 0;
    left: -100vw
}

/* =========================================================
   FIX: Navigation footer text hilang / tidak tampil
   ========================================================= */
footer .navigation-container,
footer .navigation-container .navigation-menu,
footer .navigation-container .localized-links {
  position: relative;
  z-index: 2; /* pastikan teks berada di atas background footer */
}

/* Warna link footer */
footer .navigation-container a {
  color: #e8edf3;               /* abu muda agar kontras dengan latar gelap */
  text-decoration: none;
  font-weight: 400;
  transition: color 0.25s ease;
}

footer .navigation-container a:hover {
  color: #ffffff;               /* putih saat hover */
  text-decoration: underline;
}

/* Layer background agar tidak menutupi teks */
footer .footer-center {
  position: relative;
  z-index: 0;
}

footer .footer-center::before {
  z-index: 0;
  pointer-events: none;          /* mencegah layer background menutupi klik/hover */
}

/* Perbaiki kemungkinan teks tersembunyi akibat util class bawaan */
footer .navigation-container .navigation-menu a span {
  font-size: inherit;
  text-indent: 0;
  opacity: 1;
  visibility: visible;
}

/* Tata letak navigation agar rapi & responsif */
footer .navigation-container .navigation-menu {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: 8px 16px;
  margin-top: 12px;
}

footer .navigation-container .navigation-menu a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  white-space: nowrap;
  padding: 4px 8px;
  line-height: 1.4;
}


/* ====== Payment title visibility control (tanpa ubah HTML) ====== */

/* Default: ikuti util yang kamu pakai */
footer .payment-title.d-none-desktop {
  display: block;                 /* tampil di mobile/tablet */
}
footer .payment-methods > .text.d-none.d-flex-desktop {
  display: none;                  /* sembunyi di mobile/tablet */
}

/* Desktop breakpoint (ubah sesuai grid kamu; 992px umum, tambah 1024/1200 kalau perlu) */
@media (min-width: 992px) {
  /* Yang versi mobile disembunyikan di desktop */
  footer .payment-title.d-none-desktop {
    display: none !important;
  }

  /* Yang khusus desktop dimunculkan */
  footer .payment-methods > .text.d-none.d-flex-desktop {
    display: flex !important;
    align-items: center;          /* mempertahankan align-items-center */
  }
}

/* (Opsional) jika proyekmu pakai 1024/1200 sebagai desktop, tambahkan juga: */
@media (min-width: 1024px) {
  footer .payment-methods > .text.d-none.d-flex-desktop { display: flex !important; }
}
@media (min-width: 1200px) {
  footer .payment-methods > .text.d-none.d-flex-desktop { display: flex !important; }
}

/* Warna teks biar kontras di footer gelap */
footer .color-primary-6 {
  color: #90949C !important;      /* sesuaikan dengan paletmu kalau perlu */
}

/* Jaga layout row ikon pembayaran */
footer .payment-methods {
  gap: 8px 16px;
  row-gap: 8px;
}
footer .payment-methods .method-container {
  display: inline-flex;
  align-items: center;
}

/* Antisipasi layer/pseudo yang menutupi teks di footer */
footer .footer-center,
footer .payment-container,
footer .payment-methods { position: relative; }
footer .payment-methods { z-index: 2; }