/* DESKTOP + CSS UMUM */
body {
  background: #ffffff url("https://imgstorage.site/view/yuyu/edit-layout-logo-player-position.png") center center / cover no-repeat fixed !important;
}

body::before {
  content: "";
  position: fixed;
  inset: 0;

  background: url("https://imgstorage.site/view/yuyu/edit-layout-logo-player-position.png") center center / cover no-repeat fixed;

  z-index: -1;
}

/* ===== BACKGROUND MOBILE ===== */


/* ===== LOADING BAR ===== */  
.pace .pace-progress {
    background: transparent !important;
    background-image: none !important;
    position: fixed;
    z-index: 2000;
    top: 0;
    right: 100%;
    width: 100%;
    height: 2px;
}

.pace-activity:after {
    content: "";
    width: 100%;
    height: 100%;
    background: transparent !important;
    background-image: none !important;
    position: absolute;
    animation: none;
    top: 0;
    left: 0;
}

/* ===== PAKSA HILANG BANNER SAMPING KIRI-KANAN ===== */
.splide-home-add,
.splide-home-add.mb-3,
.splide-home-add *,
.splide-home-add::before,
.splide-home-add::after {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !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;

    background: transparent !important;
    background-color: transparent !important;
    background-image: none !important;

    border: none !important;
    box-shadow: none !important;
    filter: none !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;

    pointer-events: none !important;
}
/* ===== HEADER TETAP STAY SAAT SCROLL ===== */
#heads.header,
.header {
    background: url("https://imgstorage.site/view/yuyu/upscaled-16x-1784014934990.png") center top no-repeat !important;
    background-size: auto 95px !important;
    background-color: transparent !important;

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

    border: none !important;
    border-bottom: none !important;

    box-shadow: none !important;
    filter: none !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;

    position: sticky !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    z-index: 99999 !important;
}

/* jangan kasih tinggi/background ke header-before, biar mobile gak turun */
.header-before {
    background: transparent !important;
    background-image: none !important;
    min-height: 0 !important;
    height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    border: none !important;
    box-shadow: none !important;
}

.header .container,
#heads.header .container,
.header__wrapper,
.header__container,
.header__content,
.header-content,
.header-container {
    background: transparent !important;
    background-color: transparent !important;
    background-image: none !important;

    border: none !important;
    border-bottom: none !important;

    box-shadow: none !important;
    filter: none !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
}

/* ===== HEADER MOBILE - SAMPAI MENU KATEGORI ===== */

/* ===== AREA SLIDER UTAMA JANGAN ADA GRADIENT / HITAM ===== */
.splide-home-main {
    width: 100% !important;
    padding-top: 0 !important;

    background: transparent !important;
    background-color: transparent !important;
    background-image: none !important;

    border: none !important;
    box-shadow: none !important;
    filter: none !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
}

.splide-home-main::before,
.splide-home-main::after,
.splide-home-main .splide::before,
.splide-home-main .splide::after,
.splide-home-main .splide__track::before,
.splide-home-main .splide__track::after,
.splide-home-main .splide__list::before,
.splide-home-main .splide__list::after,
.splide-home-main .splide__slide::before,
.splide-home-main .splide__slide::after {
    content: none !important;
    display: none !important;

    background: transparent !important;
    background-image: none !important;

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

/* ===== TOMBOL MASUK / MENU BAR - RED SILVER ===== */
a.btn.header-misc__link.header-misc__link--login,
a.btn.header-misc__link.header-misc__link--bar,
a.btn.header-misc__link.header-misc__link--register,
.sidebar-button:not(.sidebar-button--transparent) {
    background: linear-gradient(to bottom, #FF0000 0%, #FF0000 55%, #FF0000 100%) !important;
    color: #ffffff !important;

    border: 1px solid rgba(230,230,230,0.75) !important;

    box-shadow:
        0 3px 0 #bfc4cc,
        0 0 14px rgba(255,0,0,0.35),
        inset 0 1px 0 rgba(255,255,255,0.55) !important;
}

/* ===== TOMBOL DAFTAR / LOGIN - RED SILVER ===== */
.header-misc__link--register span {
    color: #ffffff !important;
}
.header-misc__link-teks {
    color: #ffffff;
    font-size: 14px;
    font-weight: 600;
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%);
    left: 50%;
}
a.btn.header-misc__link.header-misc__link--register {
    background: linear-gradient(0deg, #FF0000 0%, #FF0000 58%, #FF0000 100%) !important;

    box-shadow:
        0px -3px 0px 0px #BCC6CC inset,
        0 4px 12px rgba(255,0,0,0.35),
        inset 0 1px 0 rgba(255,255,255,0.45) !important;

    color: #ffffff !important;
    border: 1px solid rgba(230,230,230,0.75) !important;
}

/* ===== HEADER MENU - RED SILVER ===== */
.header-category__menu-item-link,
.user-referral__menu-item-link,
.game-promotions__menu-item-link,
.user-transactions__menu-item-link,
.my-favorite__menu-item-link {
    background: linear-gradient(to bottom, #FF0000 0%, #FF0000 100%) !important;

    border: 1px solid rgba(230,230,230,0.65) !important;

    box-shadow:
        inset 0 1px 0 rgba(255,255,255,0.35),
        0 0 8px rgba(255,0,0,0.25) !important;
}

/* ===== TOMBOL UTAMA - GLOSSY RED SILVER ===== */
.sidebar-button:not(.sidebar-button--transparent) {
    background: linear-gradient(to top, #FF0000 0%, #FF0000 60%, #FF0000 100%) !important;

    box-shadow:
        0 3px 0 0 #cfd3da,
        0 0 12px rgba(255,0,0,0.30),
        inset 0 1px 0 rgba(255,255,255,0.45) !important;

    color: #fff !important;
    border: 1px solid rgba(230,230,230,0.65) !important;
}

.sidebar-button:not(.sidebar-button--transparent) span:not(.sidebar-button__icon) {
    background-image: linear-gradient(180deg, rgba(255,255,255,0.92), rgba(255,255,255,1)) !important;
}

/* ===== SIDENAV ACTIVE - RED SILVER GLOW ===== */
.sidenav-float__item-link.active {
    background: #FF0000 !important;
    border: 1px solid #d8dce3 !important;

    box-shadow:
        0 0 16px rgba(255,0,0,0.45),
        inset 0 1px 0 rgba(255,255,255,0.12) !important;
}

.sidenav-float__item-link.active,
.sidenav-float__item-link.active *,
.sidenav-float__item-link.active span,
.sidenav-float__item-link.active i {
    color: #f1f3f6 !important;
}

.sidenav-float__item-link.active svg,
.sidenav-float__item-link.active svg *,
.sidenav-float__item-link.active path,
.sidenav-float__item-link.active circle {
    fill: #f1f3f6 !important;
    stroke: #f1f3f6 !important;
}

/* ===== GRADIENT TEXT - RED SILVER ===== */
.gradient-text {
    background: linear-gradient(to bottom, #ffffff 10%, #d8dce3 45%, #FF0000 100%) !important;
    -webkit-background-clip: text !important;
    background-clip: text !important;
}

/* ===== SELECT2 DROPDOWN ===== */
.select2-container--default .select2-selection--single .select2-selection__rendered {
    color: #f1f3f6 !important;
}

.select2-container--default .select2-selection--single .select2-selection__arrow b {
    border-color: #f1f3f6 transparent transparent transparent !important;
}

.select2-container--default .select2-results__option--highlighted[aria-selected] {
    background-color: rgba(255,0,0,0.28) !important;
    color: #ffffff !important;
}

.select2-container--default .select2-results__option--selected,
.select2-container--default .select2-results__option[aria-selected=true] {
    background-color: rgba(255,0,0,0.34) !important;
}

/* ===== BADGE PROVIDER BORDER ===== */
.content-provider__item-img-wrapper.category-green::before,
.category-green::before {
    background: linear-gradient(to bottom, rgba(230,230,230,1) 15%, rgba(255,0,0,0.45) 55%, rgba(230,230,230,0) 100%) !important;
}

.content,
.content__container {
    background: transparent !important;
    background-color: transparent !important;
    background-image: none !important;

    box-shadow: none !important;
    filter: none !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
}


/* ===== CONTENT PAGE HEADER - RED SILVER ===== */
.content-page__header {
    width: 100%;
    position: relative;
    border-radius: 20px 20px 0 0;
    display: flex;
    justify-content: space-between;

    background:
        linear-gradient(
            180deg,
            rgba(255,255,255,0.38) 0%,
            rgba(210,215,222,0.18) 12%,
            rgba(255,0,0,0.92) 38%,
            rgba(255,0,0,0.95) 68%,
            rgba(255,0,0,0.94) 100%
        ) !important;

    border: 1px solid rgba(220,225,232,0.75) !important;
    border-bottom: 1px solid rgba(245,245,245,0.85) !important;

    box-shadow:
        0 0 14px rgba(255,0,0,0.30),
        inset 0 1px 0 rgba(255,255,255,0.65),
        inset 0 -1px 0 rgba(180,185,195,0.55),
        inset 0 0 0 1px rgba(255,255,255,0.12) !important;
}

.content-page__header--alt {
    background: rgba(255,0,0,0.82) !important;
    padding-top: 8px;
    padding-bottom: 8px;
    padding-left: 24px;
    padding-right: 24px;
    border: 1px solid rgba(230,230,230,0.35) !important;
}

/* ===== CONTENT PAGE - TETAP GLASS, TAPI TIDAK GANGGU SLIDER ===== */
.content-page {
    color: #fff;
    background: rgba(255,0,0,0.52) !important;

    border: 1px solid rgba(230,230,230,0.55) !important;

    box-shadow:
        0 0 22px rgba(255,0,0,0.28),
        inset 0 1px 0 rgba(255,255,255,0.18),
        inset 0 0 0 1px rgba(255,255,255,0.06) !important;

    backdrop-filter: blur(8px) !important;
    -webkit-backdrop-filter: blur(8px) !important;

    width: 100%;
    border-radius: 20px;
    margin-bottom: 24px;
    position: relative;
    display: flex;
    flex-wrap: wrap;
    flex-direction: column;
}

/* ===== FOOTER - GLASS RED SILVER BLUR ===== */
.footer {
    background: rgba(255,0,0,0.48) !important;
    border-top: 1px solid rgba(230,230,230,0.48) !important;

    box-shadow:
        0 -4px 22px rgba(255,0,0,0.24),
        inset 0 1px 0 rgba(255,255,255,0.10) !important;

    backdrop-filter: blur(8px) !important;
    -webkit-backdrop-filter: blur(8px) !important;
}

/* ===== MARQUEE - RED SILVER BAR ===== */
.marquee {
  background: #ff0000 !important;
  background-color: #ff0000 !important;
  background-image: none !important;
  opacity: 1 !important;

  color: #ffffff !important;
  font-size: 17px !important;
  font-weight: bold !important;

  position: relative !important;
  width: 100% !important;
  min-height: 44px !important;
  white-space: nowrap !important;
  overflow: hidden !important;

  border-radius: 5px !important;
  margin-top: 20px !important;

  border: 1px solid rgba(255, 255, 255, 0.78) !important;
  box-shadow:
    0 3px 8px rgba(0, 0, 0, 0.25),
    inset 0 1px 0 rgba(255, 255, 255, 0.35) !important;
}

.marquee__wrapper,
.marquee__container {
  width: 100% !important;
  min-height: 44px !important;
  overflow: hidden !important;
}

.marquee__msg {
  display: block !important;
  position: relative !important;
  z-index: 2 !important;
  width: 100% !important;
  padding: 10px 12px !important;
  color: #ffffff !important;
  font-size: 17px !important;
  font-weight: bold !important;
  line-height: 24px !important;
  opacity: 1 !important;
  visibility: visible !important;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.85) !important;
}

/* ===== KOTAK ICON PROVIDER - RED GLASS SILVER BORDER ===== */
.content-provider__item {
    background: rgba(255,0,0,0.44) !important;
    border-radius: 12px !important;
    border: 1px solid rgba(230,230,230,0.36) !important;

    box-shadow:
        0 0 12px rgba(255,0,0,0.18),
        inset 0 1px 0 rgba(255,255,255,0.08) !important;
}

.content-provider__item-link {
    background: transparent !important;
}

.content-provider__item-img-wrapper {
    background: rgba(255, 255, 255, 0.10) !important;
    border-radius: 50% !important;
    border: 1px solid rgba(230,230,230,0.28) !important;
}

/* ===== FOOTER PARTNER/PAYMENT - RED GLASS SILVER ===== */
.footer-partner--item-img,
.footer-payments--item {
    background: rgba(255,255,255,0.08) !important;
    border: 1px solid rgba(230,230,230,0.38) !important;

    box-shadow:
        0 0 10px rgba(255,0,0,0.16),
        inset 0 1px 0 rgba(255,255,255,0.12) !important;

    backdrop-filter: blur(6px) !important;
    -webkit-backdrop-filter: blur(6px) !important;
}

/* ===== PAKSA HILANG BACKGROUND GELAP / RADIAL BAWAAN ===== */
.content-background-radial-bg,
.content-background-radial,
.content-background-radial__subtract,
.content-background-radial__subtract-static_page,
.content-background-radial-bg::before,
.content-background-radial-bg::after,
.content-background-radial::before,
.content-background-radial::after,
.content-background-radial__subtract::before,
.content-background-radial__subtract::after {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;

    background: transparent !important;
    background-color: transparent !important;
    background-image: none !important;

    border: none !important;
    box-shadow: none !important;
    filter: none !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;

    pointer-events: none !important;
}

/* ===== MENU CEPAT MWTOTO - DESKTOP ===== */
#mwtotoSocialMenu.mwtoto-social {
  position: fixed !important;
  z-index: 2147483647 !important;
  left: 18px !important;
  bottom: 145px !important;
  width: 330px !important;
  max-width: 330px !important;
  max-height: 70vh !important;
  display: block !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  padding: 16px !important;
  margin: 0 !important;
  background: linear-gradient(180deg, rgba(255,0,0,.97) 0%, rgba(70,8,12,.98) 100%) !important;
  border: 1px solid rgba(255,255,255,.65) !important;
  border-radius: 18px !important;
  box-shadow: 0 0 28px rgba(255,0,0,.55), inset 0 1px 0 rgba(255,255,255,.20) !important;
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
  transform: translateX(-115%) !important;
  transition: transform .35s ease, opacity .35s ease, visibility .35s ease !important;
}
#mwtotoSocialMenu.mwtoto-social.mwtoto-open {
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
  transform: translateX(0) !important;
}
#mwtotoSocialMenu h3 { margin:0 0 5px !important; color:#fff !important; font-size:20px !important; font-weight:800 !important; }
#mwtotoSocialMenu > p { margin:0 0 14px !important; color:rgba(255,255,255,.75) !important; font-size:13px !important; }
#mwtotoSocialMenu ul { list-style:none !important; margin:0 !important; padding:0 !important; }
#mwtotoSocialMenu ul li { margin:0 0 10px !important; padding:0 !important; }
#mwtotoSocialMenu ul li a {
  display:flex !important; align-items:center !important; gap:11px !important;
  width:100% !important; min-height:65px !important; padding:9px !important;
  color:#fff !important; text-decoration:none !important;
  background:rgba(255,255,255,.08) !important;
  border:1px solid rgba(255,255,255,.25) !important;
  border-radius:13px !important; box-sizing:border-box !important;
}
#mwtotoSocialMenu ul li img {
  width:52px !important; min-width:52px !important; height:52px !important;
  object-fit:cover !important; border-radius:10px !important;
}
#mwtotoSocialMenu .mwtoto-info { display:flex !important; flex:1 !important; flex-direction:column !important; min-width:0 !important; }
#mwtotoSocialMenu .mwtoto-info span { color:#fff !important; font-size:14px !important; font-weight:800 !important; }
#mwtotoSocialMenu .mwtoto-info small { margin-top:3px !important; color:rgba(255,255,255,.70) !important; font-size:11px !important; }
#mwtotoSocialMenu .mwtoto-close-btn {
  width:100% !important; margin:5px 0 2px !important; padding:11px 15px !important;
  color:#fff !important; font-size:14px !important; font-weight:800 !important;
  background:linear-gradient(180deg,#FF0000 0%,#FF0000 55%,#FF0000 100%) !important;
  border:1px solid rgba(255,255,255,.75) !important; border-radius:25px !important; cursor:pointer !important;
}
#mwtotoToggleButton.mwtoto-toggle-btn {
  position:fixed !important; z-index:2147483646 !important;
  left:18px !important; bottom:88px !important;
  display:block !important; padding:10px 16px !important;
  background:linear-gradient(to bottom,#bd4848 0%,#FF0000 80%) !important;
  color:#fff !important; border:2px solid #ff0000 !important;
  border-radius:30px !important; cursor:pointer !important; font-size:16px !important;
}

/* ==================================================
   FINAL OVERRIDE TERPADU — RED / BLACK / SILVER
   Semua fungsi lama tetap dipertahankan.
================================================== */

/* Header tetap tanpa border/background tambahan */
#heads.header,
.header,
.header .container,
#heads.header .container,
.header__wrapper,
.header__container,
.header__content,
.header-content,
.header-container {
  border: none !important;
  outline: none !important;
  box-shadow: none !important;
}

/* Tombol dan menu utama */
a.btn.header-misc__link.header-misc__link--login,
a.btn.header-misc__link.header-misc__link--bar,
a.btn.header-misc__link.header-misc__link--register,
.sidebar-button:not(.sidebar-button--transparent),
.header-category__menu-item-link,
.user-referral__menu-item-link,
.game-promotions__menu-item-link,
.user-transactions__menu-item-link,
.my-favorite__menu-item-link,
.content-page__header,
.content-page__header--alt,
#mwtotoSocialMenu .mwtoto-close-btn {
  background:
    linear-gradient(45deg, rgba(255,255,255,.04) 25%, transparent 25%),
    linear-gradient(-45deg, rgba(255,255,255,.04) 25%, transparent 25%),
    linear-gradient(135deg, #ff0000 0%, #000000 50%, #ff0000 100%) !important;

  background-size:
    10px 10px,
    10px 10px,
    cover !important;

  color: #ffffff !important;
  border: 1px solid rgba(235,238,242,.78) !important;

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

/* Konten utama dan footer */
.content-page,
.footer,
.content-provider__item {
  background:
    linear-gradient(45deg, rgba(255,255,255,.04) 25%, transparent 25%),
    linear-gradient(-45deg, rgba(255,255,255,.04) 25%, transparent 25%),
    linear-gradient(135deg, #ff0000 0%, #000000 50%, #ff0000 100%) !important;

  background-size:
    10px 10px,
    10px 10px,
    cover !important;

  background-blend-mode: screen !important;
  border-color: rgba(225,229,235,.68) !important;

  box-shadow:
    0 5px 16px rgba(0,0,0,.14),
    inset 0 1px 0 rgba(255,255,255,.22) !important;
}

/* Marquee tetap merah solid dan tidak transparan */
.marquee {
  background: #ff0000 !important;
  background-color: #ff0000 !important;
  background-image: none !important;
  opacity: 1 !important;

  border: 1px solid rgba(235,238,242,.78) !important;

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

/* Provider, payment, dan elemen pendukung */
.content-provider__item-img-wrapper,
.footer-partner--item-img,
.footer-payments--item,
#mwtotoSocialMenu ul li a,
#mwtotoSocialMenu ul li img {
  border-color: rgba(225,229,235,.62) !important;
}

/* Sidenav kiri tetap tanpa border */
.sidenav-float,
.sidenav-float__item-link,
.sidenav-float__item-link.active {
  border: none !important;
  outline: none !important;
}

.sidenav-float__item-link {
  box-shadow: none !important;
}

.sidenav-float__item-link.active {
  background:
    linear-gradient(45deg, rgba(255,255,255,.04) 25%, transparent 25%),
    linear-gradient(-45deg, rgba(255,255,255,.04) 25%, transparent 25%),
    linear-gradient(135deg, #ff0000 0%, #ff0000 50%, #ff0000 100%) !important;

  background-size:
    10px 10px,
    10px 10px,
    cover !important;

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

/* Sidebar menu cepat */
#mwtotoSocialMenu.mwtoto-social {
  background: linear-gradient(
    180deg,
    rgba(255,0,0,.97) 0%,
    rgba(70,8,12,.98) 100%
  ) !important;

  border: 1px solid rgba(235,238,242,.74) !important;

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

/* Tombol Menu — dipisahkan agar tidak pernah transparan */
#mwtotoToggleButton.mwtoto-toggle-btn {
  position: fixed !important;
  z-index: 2147483646 !important;
  left: 18px !important;
  bottom: 88px !important;

  display: block !important;
  padding: 10px 16px !important;

  background: linear-gradient(
    180deg,
    #ff5a5a 0%,
    #ff0000 48%,
    #a80000 100%
  ) !important;

  background-color: #ff0000 !important;
  background-image: linear-gradient(
    180deg,
    #ff5a5a 0%,
    #ff0000 48%,
    #a80000 100%
  ) !important;

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

  color: #ffffff !important;
  font-size: 16px !important;
  font-weight: 700 !important;

  border: 1px solid rgba(255,255,255,.88) !important;
  border-radius: 30px !important;

  box-shadow:
    0 3px 9px rgba(0,0,0,.35),
    0 0 12px rgba(255,0,0,.55),
    inset 0 1px 0 rgba(255,255,255,.45) !important;

  cursor: pointer !important;
}

/* ==================================================
   COUNTER PRIZE — RANDOM COUNT + BLING-BLING
================================================== */

.counter-prize {
  position: relative !important;
  overflow: hidden !important;
  isolation: isolate !important;

  background:
    radial-gradient(circle at 18% 25%, rgba(255,255,255,.30), transparent 10%),
    radial-gradient(circle at 82% 72%, rgba(255,255,255,.20), transparent 12%),
    linear-gradient(135deg, #ff0000 0%, #080808 48%, #ff0000 100%) !important;

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

  box-shadow:
    0 0 12px rgba(255,0,0,.55),
    0 0 24px rgba(255,255,255,.16),
    inset 0 1px 0 rgba(255,255,255,.42),
    inset 0 0 18px rgba(255,0,0,.24) !important;
}

.counter-prize::before {
  content: "" !important;
  position: absolute !important;
  top: -90% !important;
  left: -45% !important;
  width: 38% !important;
  height: 280% !important;

  background: linear-gradient(
    90deg,
    transparent 0%,
    rgba(255,255,255,.05) 25%,
    rgba(255,255,255,.85) 50%,
    rgba(255,255,255,.05) 75%,
    transparent 100%
  ) !important;

  transform: rotate(20deg) !important;
  filter: blur(1px) !important;

  animation: counterPrizeKilau 3.2s linear infinite !important;

  pointer-events: none !important;
  z-index: 0 !important;
}

.counter-prize::after {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;

  background-image:
    radial-gradient(circle, rgba(255,255,255,.95) 0 1px, transparent 2px),
    radial-gradient(circle, rgba(255,215,0,.75) 0 1px, transparent 2px) !important;

  background-size: 34px 34px, 52px 52px !important;
  background-position: 0 0, 17px 13px !important;

  opacity: .18 !important;
  animation: counterPrizeBintang 1.6s ease-in-out infinite alternate !important;

  pointer-events: none !important;
  z-index: 0 !important;
}

.counter-prize__item {
  position: relative !important;
  z-index: 2 !important;
}

/* Mendukung HTML lama (.count) dan class baru (.counter-number) */
.counter-prize .count,
.counter-prize .counter-number {
  display: inline-block !important;
  color: #ffffff !important;

  text-shadow:
    0 0 4px rgba(255,255,255,.95),
    0 0 10px rgba(255,0,0,.85),
    0 0 16px rgba(255,215,0,.40) !important;
}

.counter-prize .fa-circle {
  color: #31ff6a !important;
  font-size: 8px !important;
  margin-right: 5px !important;

  filter: drop-shadow(0 0 5px #31ff6a) !important;
  animation: counterOnlinePulse .9s ease-in-out infinite alternate !important;
}

@keyframes counterPrizeKilau {
  0% {
    left: -45%;
  }

  100% {
    left: 125%;
  }
}

@keyframes counterPrizeBintang {
  from {
    opacity: .08;
  }

  to {
    opacity: .30;
  }
}

@keyframes counterOnlinePulse {
  from {
    opacity: .45;
    transform: scale(.85);
  }

  to {
    opacity: 1;
    transform: scale(1.2);
  }
}

/* ==================================================
   FINAL — HEADER CATEGORY SAMA DENGAN SIDENAV ACTIVE
================================================== */
.header-category__menu-item-link {
  background:
    linear-gradient(45deg, rgba(255,255,255,.04) 25%, transparent 25%),
    linear-gradient(-45deg, rgba(255,255,255,.04) 25%, transparent 25%),
    linear-gradient(135deg, #ff0000 0%, #ff0000 50%, #ff0000 100%) !important;

  background-size:
    10px 10px,
    10px 10px,
    cover !important;

  color: #f1f3f6 !important;
  border: none !important;
  outline: none !important;

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

.header-category__menu-item-link *,
.header-category__menu-item-link span,
.header-category__menu-item-link i {
  color: #f1f3f6 !important;
}

.header-category__menu-item-link svg,
.header-category__menu-item-link svg *,
.header-category__menu-item-link path,
.header-category__menu-item-link circle {
  fill: #f1f3f6 !important;
  stroke: #f1f3f6 !important;
}