/* ========================================= NEON GREEN + GOLD PRO THEME OVERRIDE Struktur & class tetap sama Tempel di bagian PALING BAWAH file CSS ========================================= */ :root{ /* core palette */ --body-theme-bg:#050807; --body-color:#d8e6dc; --default:transparent; --neon-green-1:#8fff00; --neon-green-2:#49ff7a; --neon-green-3:#12d96b; --neon-green-4:#0a7d43; --gold-1:#ffe78a; --gold-2:#ffc94d; --gold-3:#d8a72f; --gold-4:#7c5711; --dark-1:#040706; --dark-2:#08110d; --dark-3:#0d1712; --dark-4:#122019; --dark-5:#17261e; --line-soft:rgba(143,255,0,.18); --line-gold:rgba(255,201,77,.28); --glass-dark:linear-gradient(180deg,rgba(12,24,18,.96) 0%,rgba(7,14,11,.98) 100%); --glass-panel:linear-gradient(180deg,rgba(13,26,20,.96) 0%,rgba(8,16,12,.98) 100%); --gold-green-btn:linear-gradient(180deg,#ffe78a 0%,#ffc94d 32%,#8fff00 100%); --green-gold-btn:linear-gradient(180deg,#49ff7a 0%,#19df6b 48%,#ffc94d 100%); --dark-border:1px solid rgba(143,255,0,.14); --gold-border:1px solid rgba(255,201,77,.22); /* main areas */ --topbar-cntr-bg:linear-gradient(180deg,#09110d 0%,#050807 100%); --site-header-bg:linear-gradient(180deg,#0b1510 0%,#07100c 100%); --site-header-border:1px solid rgba(143,255,0,.12); --site-footer-bg:linear-gradient(180deg,#07100c 0%,#040706 100%); --site-footer-border:1px solid rgba(255,201,77,.14); --home-info-cntr-bg:var(--glass-panel); --home-info-cntr-border:1px solid rgba(143,255,0,.16); --provider-cntr-border:rgba(143,255,0,.16); --std-content-info-border:1px solid rgba(143,255,0,.12); --std-form-cntr-bg:linear-gradient(180deg,#07100c 0%,#050807 100%); --std-form-title-bg:linear-gradient(90deg,#123820 0%,#1b5e35 55%,#d8a72f 100%); --std-form-title-color:#fffef7; --std-form-content-bg:linear-gradient(180deg,#0b1510 0%,#08110d 100%); --std-form-content-color:#dce8df; --form-control-bg:#0a120e; --form-control-border:#21442f; --form-control-color:#ecfff0; --std-inline-form-group-label-color:#9cc4a6; --std-form-note-bg:rgba(18,39,28,.82); --std-form-note-color:#e6f8ea; --std-form-note-span-strong-color:#ffe78a; --std-password-field-i-color:#9ef8ad; /* buttons */ --login-panel-login-btn-bg:linear-gradient(180deg,#143724 0%,#0f2318 100%); --login-panel-login-btn-color:#f4fff7; --login-panel-login-btn-border:1px solid rgba(143,255,0,.22); --login-panel-login-btn-hover-bg:linear-gradient(180deg,#1d4f32 0%,#123020 100%); --login-panel-login-btn-hover-color:#ffffff; --login-panel-register-btn-bg:var(--gold-green-btn); --login-panel-register-btn-color:#08110d; --login-panel-register-btn-border:1px solid rgba(255,231,138,.45); --login-panel-register-btn-hover-bg:linear-gradient(180deg,#8fff00 0%,#49ff7a 45%,#ffd15b 100%); --login-panel-register-btn-hover-color:#051008; --login-panel-register-btn-hover-ts:none; --std-btn-group-btn-primary-bg:var(--green-gold-btn); --std-btn-group-btn-primary-color:#07100c; --std-btn-group-btn-primary-hover-bg:linear-gradient(180deg,#8fff00 0%,#49ff7a 45%,#ffd15b 100%); --std-btn-group-btn-primary-hover-color:#041008; --std-btn-group-btn-primary-disabled-bg:linear-gradient(180deg,#45534b 0%,#27322b 100%); --std-btn-group-btn-primary-disabled-color:#dfe7e2; --std-reporting-cntrl-group-btn-primary-bg:var(--gold-green-btn); --std-reporting-cntrl-group-btn-primary-color:#07100c; --std-reporting-cntrl-group-btn-primary-border:transparent; --std-reporting-cntrl-group-btn-primary-hover-bg:linear-gradient(180deg,#8fff00 0%,#49ff7a 45%,#ffd15b 100%); --std-reporting-cntrl-group-btn-primary-hover-color:#041008; --play-now-bg:linear-gradient(180deg,#ffe78a 0%,#ffc94d 30%,#69ff6e 100%); --play-now-color:#08110d; --play-now-hover-bg:linear-gradient(180deg,#8fff00 0%,#49ff7a 40%,#ffd15b 100%); --play-now-hover-color:#041008; --free-play-bg:linear-gradient(180deg,#163122 0%,#0d1d15 100%); --free-play-color:#f1fff5; --free-play-hover-bg:linear-gradient(180deg,#204730 0%,#10251a 100%); --free-play-hover-color:#fff; /* links, tabs, nav */ --a-color:#ffe78a; --a-focus-hover-color:#8fff00; --top-menu-li-a-color:#d0ddd4; --top-menu-li-true-hover-a-color:#8fff00; --top-menu-li-true-hover-bg:radial-gradient(circle at top center,rgba(143,255,0,.18) 0,rgba(143,255,0,0) 100%); --top-menu-game-list-bg:rgba(4,10,7,.94); --top-menu-game-list-bbot:1px solid rgba(143,255,0,.14); --top-menu-game-list-li-a-background-bg:linear-gradient(90deg,rgba(0,0,0,0) 0%,rgba(73,255,122,.18) 100%); --top-menu-game-list-li-a-background-border:1px solid rgba(143,255,0,.18); --top-tab-cntr-border:1px solid rgba(143,255,0,.16); --top-tab-cntr-a-bg:#0b1510; --top-tab-cntr-a-color:#eefcf2; --top-tab-cntr-a-true-hover-bg:#143322; --top-tab-cntr-a-true-hover-color:#8fff00; --tab-content-cntr-bg:#08110d; /* cards, lists, tables */ --table-table-bg:#09110d; --grid-totals-bg:#122019; --grid-totals-color:#f2fff4; --transactions-table-bg:#09110d; --transactions-table-border:#143322; --transactions-table-head-bg:#0d1712; --transactions-table-head-color:#ffe78a; --transactions-table-head-border:#143322; --transactions-table-body-bg:#08110d; --transactions-table-body-color:#effff2; --transactions-table-body-span-app-color:#7dff90; --transactions-table-body-span-reject-color:#ff857f; --transactions-table-body-span-pending-color:#ffd15b; --transactions-table-body-tr-odd-bg:rgba(20,39,29,.72); --transactions-table-body-tr-even-bg:rgba(10,21,16,.95); --notification-list-item-bg:#08110d; --notification-list-item-border:1px solid rgba(143,255,0,.1); --notification-list-item-header-title-color:#fff; --notification-list-item-header-date-color:#9ab4a1; --notification-list-item-header-label-bg:#1d6d3e; --notification-list-item-header-label-color:#fff; --notification-list-item-content-p-color:#d8e6dc; /* modal */ --modal-content-bg:linear-gradient(180deg,#0b1510 0%,#050807 100%); --modal-content-border:#173121; --modal-header-close-color:#fff; --modal-footer-border:#173121; --modal-footer-btn-primary-color:#07100c; --modal-footer-btn-primary-bg:var(--gold-green-btn); --modal-footer-btn-primary-hover-bg:linear-gradient(180deg,#8fff00 0%,#49ff7a 45%,#ffd15b 100%); --popover-bg:#0b1510; --popover-border:#8fff00; --popover-color:#eaffee; --popover-top-arrow-border:#8fff00; --popover-top-arrow-after-border:#0b1510; /* footer */ --footer-links-li-a-color:#99af9f; --footer-links-li-a-hover-color:#8fff00; --copyright-color:#7f9787; --footer-section-title-color:#b9cfbf; --footer-description-header-color:#9fb4a6; --footer-description-note-color:#7b9082; --footer-sitemap-header-color:#dce8df; --footer-sitemap-link-color:#98b39f; --footer-featured-product-bg:#0b1510; --footer-card-container-border:#173121; --footer-hero-icon-bg:#102118; --footer-banking-card-bg:#0d1712; /* profile/user */ --std-profile-bar-bg:linear-gradient(180deg,#0c1712 0%,#07100c 100%); --std-profile-bar-color:#eefcf2; --std-profile-bar-a-color:#fff; --std-profile-bar-user-field-div-username-color:#ffe78a; --std-profile-bar-ref-code-cntr-border:1px dashed rgba(255,231,138,.55); --std-profile-bar-ref-code-cntr-bg:rgba(255,201,77,.08); --std-profile-bar-ref-code-cntr-color:#ffe78a; --user-info-color:#effff2; --user-info-main-info-bg:#102118; --user-info-main-info-bs:0 8px 24px rgba(0,0,0,.24); --user-info-wallet-cntr-balance-color:#ffe78a; --user-info-wallet-cntr-locked-balance-bg:#193124; --user-info-wallet-cntr-locked-balance-color:#9df6aa; --user-info-dropdown-menu-li-a-bg:#0d1712; --user-info-dropdown-menu-li-a-color:#effff2; --user-info-dropdown-menu-li-a-focus-bg:#143322; --user-info-dropdown-menu-li-a-focus-color:#8fff00; /* game cards */ --game-list-title-bg:#0d1712; --game-list-border:1px solid rgba(143,255,0,.12); --game-list-bg:#08110d; --game-list-game-item-bg:#09110d; --game-list-wrapper-cntr-hover-bg:#0f1d15; --game-list-game-name-color:#fff; --game-list-game-name-bg:linear-gradient(90deg,#1d6d3e 0%,#d8a72f 100%); --game-list-game-player-color:#eaffee; --large-game-list-cntr-bg:#08110d; --provider-page-large-game-list-cntr-bg:#08110d; --provider-info-bg:#0a120e; /* status / misc */ --bank-status-list-data-online-bg:#163122; --bank-status-list-data-online-true-before-bg:#56ff83; --bank-status-list-data-online-false-before-bg:#ff5757; --default-bank-list-online-bg:#4aff78; --default-bank-list-offline-bg:#ff4d4d; --progressbar-bg:#1c2b22; --progress-bg:linear-gradient(90deg,#49ff7a 0%,#ffe78a 100%); --exp-countdown-data-section-bg:#132219; --exp-countdown-data-section-color:#ffe78a; --exp-countdown-data-section-border:1px solid rgba(143,255,0,.18); --exp-countdown-data-section-title-bg:#1a3023; --exp-countdown-data-section-title-color:#f7fff9; --floating-action-btn-bg:linear-gradient(180deg,#49ff7a 0%,#17d86a 52%,#ffc94d 100%); --floating-action-btn-border:1px solid rgba(255,231,138,.35); --floating-action-btn-bs:0 10px 26px rgba(73,255,122,.22); --announcement-cntr-bg:#0c1712; --announcement-cntr-color:#ffe78a; --announcement-cntr-section-announcement-bg:#132219; --announcement-cntr-section-announcement-color:#fff; --announcement-cntr-list-li-color:#eaffee; } /* ========================================= LIGHTWEIGHT VISUAL ENHANCEMENT Tidak ubah struktur HTML ========================================= */ body{ background: radial-gradient(circle at 20% 0%, rgba(73,255,122,.08) 0%, transparent 34%), radial-gradient(circle at 80% 0%, rgba(255,201,77,.07) 0%, transparent 28%), linear-gradient(180deg,#050807 0%,#07100c 100%); color:var(--body-color); } .site-header, .topbar-cntr, .std-form-cntr, .home-info-cntr, .provider-cntr, .modal-content, .site-footer, .game-list, .large-game-list-cntr, .std-profile-bar, .user-info-main-info{ position:relative; overflow:hidden; box-shadow: 0 0 0 1px rgba(143,255,0,.05), 0 10px 30px rgba(0,0,0,.22); } .site-header::before, .std-form-cntr::before, .home-info-cntr::before, .provider-cntr::before, .modal-content::before{ content:""; position:absolute; inset:0; pointer-events:none; background:linear-gradient(120deg,transparent 0%,rgba(143,255,0,.03) 35%,rgba(255,201,77,.04) 65%,transparent 100%); } .login-panel-login-btn, .login-panel-register-btn, .std-btn-group .btn-primary, .std-reporting-cntrl-group .btn-primary, .play-now, .floating-action-btn, .modal-footer .btn-primary{ position:relative; transition: transform .22s ease, box-shadow .22s ease, filter .22s ease, background .22s ease; will-change:transform; box-shadow: 0 0 0 1px rgba(255,255,255,.04) inset, 0 6px 16px rgba(0,0,0,.18); } .login-panel-login-btn:hover, .login-panel-register-btn:hover, .std-btn-group .btn-primary:hover, .std-reporting-cntrl-group .btn-primary:hover, .play-now:hover, .floating-action-btn:hover, .modal-footer .btn-primary:hover{ transform:translateY(-1px); box-shadow: 0 0 0 1px rgba(255,255,255,.06) inset, 0 10px 20px rgba(73,255,122,.16), 0 0 18px rgba(255,201,77,.12); filter:saturate(1.05); } .form-control, input, select, textarea{ transition: border-color .2s ease, box-shadow .2s ease, background .2s ease; } .form-control:focus, input:focus, select:focus, textarea:focus{ border-color:#49ff7a !important; box-shadow: 0 0 0 1px rgba(73,255,122,.25), 0 0 0 4px rgba(73,255,122,.08); background:#0c1712; outline:none; } .top-menu li a, .footer-links li a, .user-info-dropdown-menu li a, .std-side-menu a{ transition: color .2s ease, background .2s ease, text-shadow .2s ease; } .top-menu li a:hover, .footer-links li a:hover, .user-info-dropdown-menu li a:hover, .std-side-menu a:hover{ text-shadow:0 0 10px rgba(143,255,0,.22); } .game-list-game-item, .notification-list-item, .transactions-table tbody tr, .promotion-item, .provider-slide-main-slide-item{ transition: transform .22s ease, box-shadow .22s ease, border-color .22s ease, background .22s ease; } .game-list-game-item:hover, .notification-list-item:hover, .transactions-table tbody tr:hover, .promotion-item:hover, .provider-slide-main-slide-item:hover{ transform:translateY(-2px); box-shadow:0 10px 24px rgba(0,0,0,.18); } /* glow line ringan */ .site-header, .topbar-cntr, .std-form-title, .game-list-title-bg, .modal-content, .site-footer{ border-image:linear-gradient(90deg,rgba(73,255,122,.08),rgba(255,201,77,.28),rgba(73,255,122,.08)) 1; } /* animasi hemat */ @keyframes pulseGlowGreen{ 0%,100%{ box-shadow:0 0 0 rgba(73,255,122,0), 0 0 0 rgba(255,201,77,0); } 50%{ box-shadow:0 0 12px rgba(73,255,122,.12), 0 0 20px rgba(255,201,77,.08); } } @keyframes titleSheen{ 0%{ background-position:0% 50%; } 100%{ background-position:100% 50%; } } .login-panel-register-btn, .play-now, .floating-action-btn{ animation:pulseGlowGreen 3.6s ease-in-out infinite; } .std-form-title{ background-size:200% 200% !important; animation:titleSheen 7s linear infinite alternate; } /* reduce motion */ @media (prefers-reduced-motion: reduce){ *, *::before, *::after{ animation:none !important; transition:none !important; } }