/* OKB212 premium black & gold theme – last stylesheet, CSS-only overrides. */
:root {
 --bg-color: #0b0d10; --text-first: #f5eddd; --text-second: #f5eddd;
 --first-color: #171819; --second-color: #292318; --third-color: #8e6225;
 --fourth-color: #a77e38; --fifth-color: #deb15e; --sixth-color: #131415;
 --g1: #8b5e1d; --g2: #f8d685; --marquee: #1d1a13;
 --tc-bg: #0b0d10; --tc-panel: #17191b; --tc-panel-2: #24211a;
 --tc-gold: #e1b962; --tc-lightgold: #ffe4a0; --tc-muted: #adaba4;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin:0; color:var(--text-first); font-family:system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif; background: radial-gradient(ellipse 88% 470px at 50% 0,#322618 0,transparent 74%), radial-gradient(ellipse 80% 500px at 50% 40%,#151614 0,transparent 100%),var(--tc-bg); padding-bottom:64px; }
a { color:var(--tc-gold); }
a:hover { color:var(--tc-lightgold); }
button, a, .icon-card-bg { -webkit-tap-highlight-color:transparent; }
button:focus-visible,a:focus-visible,input:focus-visible,.icon-card-bg:focus-visible{outline:2px solid var(--tc-lightgold);outline-offset:3px;}
.tc-topbar { position:sticky;top:0;z-index:100; background:rgba(11,12,14,.94); border-bottom:1px solid rgba(220,173,86,.29);backdrop-filter:blur(16px); box-shadow:0 8px 34px rgba(0,0,0,.23); }
.tc-topbar-inner { max-width:1200px; margin:auto; min-height:64px; display:flex;align-items:center;justify-content:space-between; padding:0 24px;gap:15px; }
.tc-topbar-brand { text-decoration:none; font-family:Georgia,serif;letter-spacing:2px;color:#f6d27e;font-weight:bold;font-size:19px;white-space:nowrap; }
.tc-topbar-brand:hover { text-decoration:none; }
.tc-diamond{font-size:16px;margin-right:7px;color:#ffe1a0;}
.tc-topbar-mini{font-family:Arial,sans-serif;font-size:9px;color:#a98b59;letter-spacing:3px;margin-left:5px;}
.tc-desktop-nav{display:flex;align-items:center;gap:29px;}
.tc-desktop-nav a{color:#ded8ca;text-decoration:none;font-size:13px;font-weight:650;transition:color .15s;}
.tc-desktop-nav a:hover{color:#f5cc72;}
.tc-desktop-nav .tc-top-register{color:#241707;background:linear-gradient(115deg,#ac7428,#f9dd91 48%,#d39835);border:1px solid #ffdf95; border-radius:9px;padding:10px 19px;box-shadow:0 4px 20px #d69f3333;}
main.container,footer.container{max-width:1200px !important;}
main.container {padding-left:16px;padding-right:16px;}
.tc-brand-panel { margin:21px 0 17px; padding:12px 22px 23px; background:radial-gradient(ellipse 50% 230px at 50% 0,#59401922,transparent),linear-gradient(135deg,rgba(30,31,31,.98),rgba(17,18,19,.98)); border:1px solid #8c682e4f; border-radius:19px;position:relative;overflow:hidden;box-shadow:0 16px 45px #0005; }
.tc-brand-panel:after {content:"";pointer-events:none;position:absolute;inset:0;border-radius:19px;background:linear-gradient(100deg,transparent 40%,#db9f3510 52%,transparent 64%);}
.tc-brand-head{display:flex;align-items:center;justify-content:space-between;gap:10px;}
.tc-brand-flair{font-size:10px;letter-spacing:3px;font-weight:800;color:#cfb074;}
.tc-status{color:#bbb3a4;font-size:11px;}
.tc-status-dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:#dcb761;vertical-align:middle;margin-right:5px;box-shadow:0 0 0 3px #e5b95719;}
.logo img{width:min(440px,90%);height:auto;display:block;margin:4px auto -4px;filter:drop-shadow(0 4px 24px #d0a14c24);}
.logo a{display:block;}
.tc-brand-subtitle{position:relative;text-align:center;margin:0;color:#aca99e;font-size:12px;letter-spacing:.3px;}
.slider-wrapper{border-radius:16px!important;overflow:hidden;background:#181715;border:1px solid #d4a65f52;box-shadow:0 15px 38px #0006!important;}
.running-text{padding:8px 16px;background:linear-gradient(90deg,#18150e,#342819,#18150e);color:#e8c981;border-bottom:1px solid #d7a65043;}
.tc-marquee-line{white-space:nowrap;text-overflow:ellipsis;overflow:hidden;text-align:center;font-size:11px;letter-spacing:1.65px;font-weight:700;}
.slider-img{display:block;width:100%;height:auto;max-height:none;object-fit:contain;border-radius:0!important;}
.slider-wrapper+.row {display:flex;flex-wrap:nowrap;gap:12px; margin:13px 0 0;}
.slider-wrapper+.row .col{padding:0;flex:1 1 0!important;width:0!important;max-width:none!important;}
.btn-login,.btn-daftar{width:100%;min-height:46px;border-radius:11px;letter-spacing:.75px;font-size:13px;font-weight:800;transition:filter .18s, transform .18s;}
.btn-login{border:1px solid #c2a06c;background:linear-gradient(110deg,#292018,#49351d);color:#f9df99;}
.btn-daftar{border:1px solid #fff1ba;background:linear-gradient(125deg,#9b651f,#fce29b 50%,#c58d35);color:#221707;box-shadow:0 5px 22px #dcab4b33;}
.btn-login:hover,.btn-daftar:hover{filter:brightness(1.13);transform:translateY(-1px);}
.icon-prov{gap:6px;overflow:auto!important;scrollbar-color:#795a2e #1a1b1c;border:1px solid #b98a423d;background:linear-gradient(180deg,#29241c,#171819);border-radius:13px;padding:9px;margin:18px 0 14px;}
.item-prov{padding:0;flex:0 0 96px;}
.icon-card-bg{height:100%;padding:7px 4px!important;border:1px solid transparent;border-radius:11px;transition:background .2s,border-color .2s, transform .2s;}
.icon-card-bg:hover,.icon-card-bg.active{background:#56412670;border-color:#c79d55aa;transform:translateY(-2px);}
.icon-card-bg .p-2{padding:3px!important;}
.icon-card-bg p{color:#eee1bf!important;font-size:10px!important;margin:6px 0 0;white-space:normal!important;line-height:1.25;}
.img-prov{width:45px!important;height:45px!important;object-fit:contain;}
main > .d-flex.justify-content-between{background:#181a1b;border:1px solid #73613a40;color:#cdb889;border-radius:11px;padding:1px 12px;margin:8px 0 14px;}
main > .d-flex h6{margin:11px 0;font-size:12px;}
main > .d-flex i {color:var(--tc-gold)!important;}
.navbar-search{padding:10px 11px!important;background:linear-gradient(180deg,#24231e,#151718)!important;border:1px solid #bd91466b!important;border-radius:13px!important;}
.navbar-search .row{align-items:center;gap:5px;}
.navbar-search .row>.col-2{flex:1 1 125px;min-width:120px;max-width:none;padding:0!important;}
.btn-nav-recent,.btn-nav-hot,.btn-nav-new{border:1px solid #6c5c3d5e;border-radius:9px;padding:7px 9px!important;background:#20201d;display:flex;align-items:center;justify-content:center;gap:6px;}
.btn-nav-recent strong,.btn-nav-hot strong,.btn-nav-new strong{color:#e7dbc0!important;}
.btn-nav-recent img,.btn-nav-hot img,.btn-nav-new img{max-width:32px;max-height:25px;object-fit:contain;}
.navbar-search input,.navbar-search .form-control{border:1px solid #8d7446;background:#111415!important;color:#f4e8cd!important;box-shadow:none!important;}
.navbar-search input::placeholder{color:#b3a994;}
.navbar-search .search-button,.navbar-search .input-group-text{background:linear-gradient(110deg,#ac7b30,#eed08a)!important;color:#1a140e!important;border-color:#b98842!important;}
.tc-catalog-head{margin:23px 0 5px;display:flex;gap:16px;justify-content:space-between;align-items:flex-end;}
.tc-catalog-head .tc-eyebrow{color:#d7b167;letter-spacing:2.5px;font-size:10px;font-weight:800;}
.tc-catalog-head h1{color:#fff6e2;font-size:28px;line-height:1.15;margin:8px 0 4px;font-weight:850;}
.tc-catalog-head h1 em{color:#e3b95f;font-style:normal;}
.tc-catalog-head p{font-size:12px;color:#a8a69f;margin:0;}
.tc-view-all{border:1px solid #94754188;border-radius:10px;color:#f3d390;text-decoration:none;font-size:12px;padding:10px 15px;white-space:nowrap;background:#201c15;}
.tc-view-all:hover{text-decoration:none;background:#30271a;}
#slot_leaks{margin-top:12px!important;row-gap:13px;}
#slot_leaks>.col-lg-4{padding-left:6px;padding-right:6px;}
.rtp-card{width:100%;max-width:none;background:linear-gradient(160deg,#242421,#111517 90%);border:1px solid #a6803c70;padding:10px;border-radius:15px;text-align:left;box-shadow:0 8px 23px #0006;transition:transform .2s,border-color .2s;}
.rtp-card:hover{transform:translateY(-3px);border-color:#f0c76d;}
.rtp-card>.row{height:100%;margin:0;}
.rtp-card .col-lg-6{padding:4px;}
.place-img-rtp{box-shadow:none;border-radius:10px;background:#090b0d;border:1px solid #ad85454a;min-height:132px;display:flex;align-items:center;padding:4px;}
.rtp-card-img{width:100%;max-height:163px;object-fit:contain;background:#0b0e10;border-radius:7px;box-shadow:none!important;}
.btn-play{min-height:34px;padding:8px 5px;margin-top:8px;border:1px solid #e7ba65;border-radius:8px;background:linear-gradient(112deg,#b17b29,#f3d382,#c28c38);color:#261908;box-shadow:0 5px 16px #e0ad4626!important;line-height:1.15;font-size:11px;text-transform:none;}
.btn-play:hover{background:linear-gradient(112deg,#dcaa54,#ffeba9,#d79e42);color:#1e1408;}
.pola-wrapper{height:100%;background:#161819;border:1px solid #68604365;border-radius:9px;padding:9px 6px;display:flex;flex-direction:column;justify-content:center;}
.pola-wrapper h4{font-size:12px;color:#f2da9f;margin:6px 0 10px;}
.pola-wrapper h4 i{color:#f5c772;}
.pola-wrapper hr{border-color:#997d4b;opacity:.3;margin:3px 0 8px;}
.pola-wrapper h5{color:#e0c48d;}
.table-pola{color:#dad5c9;}
.table-pola td{padding:4px 2px;border-bottom:1px solid #6f665147;}
.percent{height:23px;background:#3a3326;border-radius:8px;border:1px solid #c79b4d4a;}
.percent p{top:auto;transform:none;margin:0;line-height:21px;color:#fff8e1;text-shadow:0 1px 3px #000;font-size:11px;}
.percent-bar.good{background-color:#c7993c;}.percent-bar.great{background-color:#509b62;}.percent-bar.bad{background-color:#b64f4f;}
.top-game,.hot-game{transform:scale(.78);transform-origin:top left;}
.icon-providers{right:3px;top:0;}.icon-providers img{width:20px;}
.tc-rtp-note{margin:18px 0 24px;font-size:11px;line-height:1.6;color:#aca493;background:#1b1d1e;border:1px solid #7e6b3f44;border-radius:10px;padding:12px 14px;}
footer.container{margin-top:25px;background:linear-gradient(180deg,#1c1b18,#101215);border:1px solid #a783474b;border-radius:17px;padding:24px!important;}
.tc-footer-inner{display:flex;justify-content:space-between;align-items:center;gap:20px;}
.tc-footer-brand img{width:175px;display:block;}
.tc-footer-brand p{max-width:360px;font-size:12px;color:#aaa59a;margin:0;}
.tc-footer-links{display:flex;gap:18px;flex-wrap:wrap;}
.tc-footer-links a{font-size:12px;color:#e1cb9b;text-decoration:none;}
.tc-footer-links a:hover{text-decoration:underline;}
.tc-footer-bottom{display:flex;justify-content:space-between;gap:12px;margin-top:22px;padding-top:15px;border-top:1px solid #6552375c;color:#9d9483;font-size:11px;}
.nav-bottom{display:flex;justify-content:space-around;max-width:100%;border-top:1px solid #d3a75d96;background:rgba(16,17,17,.97);box-shadow:0 -6px 30px #0008;padding:5px 10px env(safe-area-inset-bottom);}
.item-nav-bottom{background:none!important;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;flex:1;text-decoration:none;color:#e3d2ac;font-size:10px;padding:5px 0;}
.item-nav-bottom:hover{color:#ffe2a2;text-decoration:none;}
.tc-nav-icon{font-size:21px;font-weight:700;line-height:1.2;}
.btn-up{background:#3a2917!important;border:1px solid #e4bb68!important;color:#efd79e!important;right:12px;border-radius:10px;}
@media (min-width:768px){body{padding-bottom:0;}.nav-bottom{display:none;}}
/* Modal treatments, retain existing JS hooks */
.popup-container{background:rgba(0,0,0,.80);backdrop-filter:blur(7px);}
.popup-body{background:#20211f;border:1px solid #d1a3508a;border-radius:15px;box-shadow:0 14px 60px #0009;max-width:calc(100vw - 26px);}
.popup-header{background:linear-gradient(90deg,#6c481b,#c69544,#6d4a22);color:#fff8df;}
.popup-label{background:#181919;}.popup-content{color:#eee4d0;}
.popup-close,.popup-img-close{background:#d9ac5b;color:#14110e;display:flex;align-items:center;justify-content:center;}
.bg-blue-button{background:#c49442;color:#1d160b;}.bg-black-button{background:#37342e;}
@media (max-width:992px){
 .tc-desktop-nav{gap:14px;}.tc-topbar-brand{font-size:17px;}.tc-topbar-mini{display:none;}
 .rtp-card .col-lg-6{width:100%;}.rtp-card-img{max-height:170px;}.pola-wrapper{margin-top:4px;}
}
@media (max-width:767px){
 body{padding-bottom:77px;}
 .tc-topbar-inner{min-height:52px;justify-content:center;padding:0 12px;}.tc-desktop-nav{display:none;}
 main.container{padding:0 10px;}.tc-brand-panel{margin:12px 0;padding:10px 10px 15px;border-radius:14px;}
 .tc-brand-head{justify-content:center;}.tc-brand-flair{font-size:8px;letter-spacing:2px;}.tc-status{display:none;}
 .logo img{width:min(325px,96%);margin:2px auto 0;}.tc-brand-subtitle{font-size:10px;line-height:1.45;padding:0 5px;}
 .running-text{padding:8px 5px;}.tc-marquee-line{font-size:8px;letter-spacing:.5px;}
 .slider-img{height:auto;max-height:none;object-fit:contain;}
 .slider-wrapper+.row{gap:7px;margin:10px 0 0;}.btn-login,.btn-daftar{min-height:42px;font-size:10px;padding:7px 5px;}
 .icon-prov{margin:12px 0 11px;padding:6px;}.item-prov{flex-basis:83px;}.icon-card-bg p{font-size:9px!important;}.img-prov{width:38px!important;height:38px!important;}
 .navbar-search{padding:8px!important;}.navbar-search .row>.col-2{flex:1 1 85px;min-width:84px;}
 .btn-nav-recent,.btn-nav-hot,.btn-nav-new{padding:5px!important;}.btn-nav-recent img,.btn-nav-hot img,.btn-nav-new img{display:none;}
 .btn-nav-recent strong,.btn-nav-hot strong,.btn-nav-new strong{font-size:11px!important;}
 .tc-catalog-head{align-items:flex-start;}.tc-catalog-head h1{font-size:21px;}.tc-catalog-head p{max-width:230px;line-height:1.5;font-size:10px;}.tc-view-all{font-size:10px;padding:8px;white-space:normal;max-width:116px;}
 #slot_leaks>.col-6{padding:4px;}
 .rtp-card{padding:6px;border-radius:11px;}.rtp-card .col-lg-6{padding:2px;}
 .place-img-rtp{min-height:105px;padding:3px;}.rtp-card-img{max-height:142px;}
 .btn-play{font-size:9px;min-height:31px;}.pola-wrapper{padding:6px 4px;}
 .pola-wrapper h4{font-size:10px;margin:2px 0 7px;}.pola-wrapper hr{display:none;}
 .table-pola{display:none;}.percent{margin-top:8px!important;}.icon-providers img{width:16px;}.tc-rtp-note{font-size:10px;margin-bottom:8px;}
 footer.container{border-radius:13px;padding:17px!important;}.tc-footer-inner{flex-direction:column;align-items:flex-start;gap:11px;}
 .tc-footer-brand img{width:140px;}.tc-footer-links{gap:10px 18px;}
 .tc-footer-bottom{flex-direction:column;gap:4px;font-size:10px;}
}
@media (prefers-reduced-motion:reduce){.rtp-card,.btn-login,.btn-daftar,.icon-card-bg{transition:none;}html{scroll-behavior:auto;}}

/* V2: use the supplied official-style logo consistently in header and footer */
.tc-topbar-brand {display:inline-flex;align-items:center;line-height:1;flex:0 0 auto;}
.tc-topbar-brand img {display:block;width:190px;max-width:40vw;height:auto;object-fit:contain;}
.logo img {width:min(485px,96%);}
.tc-footer-brand img {width:185px;max-width:100%;height:auto;}
/* V2: live Indonesian date and WIB time with seconds */
.tc-catalog-livebar {
  display:flex;align-items:center;gap:13px;min-width:0;
  margin:8px 0 14px;padding:12px 16px;
  background:linear-gradient(105deg,#191a1b,#121515);
  border:1px solid #a57d4265;border-radius:12px;
  box-shadow:inset 0 1px 0 #eacb8620;
}
.tc-clock-icon {width:38px;height:38px;flex:0 0 38px;display:flex;align-items:center;justify-content:center;
  color:#f8d68c;background:#ac823324;border:1px solid #ad833c55;border-radius:10px;
  font-size:25px;line-height:1;}
.tc-clock-copy {flex:1 1 auto;min-width:0;display:flex;flex-direction:column;gap:3px;}
.tc-clock-label {font-size:11px;font-weight:700;letter-spacing:.4px;color:#e5bf70;}
.tc-live-time {color:#f8edda;font-size:14px;font-weight:700;line-height:1.35;font-variant-numeric:tabular-nums;}
.tc-live-chip {display:inline-flex;gap:6px;align-items:center;justify-content:center;
  color:#f7d28a;font-size:10px;font-weight:800;letter-spacing:1px;
  padding:6px 9px;border:1px solid #a57b37a1;border-radius:7px;background:#231e13;white-space:nowrap;}
.tc-live-dot{width:7px;height:7px;border-radius:50%;background:#6cd878;box-shadow:0 0 8px #74ed8b9b;}
@media(max-width:767px) {
 .tc-topbar-inner{justify-content:center;}
 .tc-topbar-brand img{width:155px;max-width:60vw;}
 .logo img{width:min(340px,98%);}
 .tc-catalog-livebar{gap:8px;margin:8px 0 12px;padding:10px 10px;}
 .tc-clock-icon{width:32px;height:32px;flex-basis:32px;font-size:22px;}
 .tc-clock-label{font-size:10px;letter-spacing:0;}
 .tc-live-time{font-size:clamp(10px,3.15vw,13px);line-height:1.45;}
 .tc-live-chip{padding:5px 6px;gap:4px;font-size:9px;letter-spacing:0;}
 .tc-live-dot{width:6px;height:6px;}
 /* Layout: the mobile filter is a single centered 3-column row, including at 320px. */
 .search-kecil > .row:last-child {display:flex!important;justify-content:center!important;
   align-items:stretch!important;flex-wrap:nowrap!important;gap:8px;
   margin:5px 0 0!important;padding:0 4px!important;}
 .search-kecil > .row:last-child > .col-4 {flex:0 0 calc((100% - 16px) / 3)!important;
   width:calc((100% - 16px) / 3)!important;max-width:calc((100% - 16px) / 3)!important;
   min-width:0!important;padding:0!important;margin:0!important;}
 .search-kecil > .row:last-child .btn-nav-recent,
 .search-kecil > .row:last-child .btn-nav-hot,
 .search-kecil > .row:last-child .btn-nav-new {width:100%;min-height:36px;display:flex;
   justify-content:center;align-items:center;padding:7px 3px!important;margin:0!important;}
 .search-kecil > .row:last-child strong {font-size:11px!important;top:auto!important;}
}
@media(max-width:350px){.tc-catalog-livebar{gap:5px;padding:8px 6px;}.tc-clock-icon{display:none;}
  .tc-live-time{font-size:11px;}.tc-live-chip{padding:4px;}}

/* Mobile card simplification v3 */
@media (max-width: 767.98px) {
  .rtp-card > .row > .col-lg-6:first-child {
    width: 100%;
    flex: 0 0 100%;
    max-width: 100%;
  }
  .rtp-card > .row > .col-lg-6:last-child {
    display: none;
  }
  .rtp-card .btn-play {
    width: 100%;
    font-size: 12px;
    line-height: 1.25;
    padding: 10px 12px;
    min-height: 46px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-align: center;
  }
}

/* Desktop: align Recent / Hot / Terbaru and search on exactly one baseline. */
@media (min-width: 993px) {
  .navbar-search.search-besar {
    height: auto !important;
  }
  .search-besar > .row {
    display: flex !important;
    align-items: center !important;
    flex-wrap: nowrap !important;
  }
  .search-besar > .row > .col-2,
  .search-besar > .row > .col-6 {
    display: flex;
    align-items: center;
    min-width: 0;
  }
  .search-besar > .row > .col-2 > .btn-nav-recent,
  .search-besar > .row > .col-2 > .btn-nav-hot,
  .search-besar > .row > .col-2 > .btn-nav-new {
    box-sizing: border-box;
    width: 100%;
    height: 42px;
    min-height: 42px;
    padding: 6px 9px !important;
    margin: 0 !important;
  }
  .search-besar > .row > .col-6 > div {
    display: flex;
    align-items: center;
    width: 100%;
    padding: 0 !important;
    margin: 0 !important;
  }
  .search-besar .input-group {
    min-height: 42px;
    margin: 0 !important;
  }
  .search-besar .input-search,
  .search-besar .search-button {
    height: 42px;
  }
  .search-besar .search-button {
    display: flex;
    justify-content: center;
    align-items: center;
  }
  .search-besar .input-group-prepend {
    display: flex;
    align-items: stretch;
  }
}

/* V7: show the FULL banner on desktop and mobile; never crop top/bottom/sides.
   Banner is responsive with its natural aspect ratio (1836 x 857).
   Do not set a fixed height / max-height on the banner element. */
.slider-wrapper .slider,
.slider-wrapper .swiper,
.slider-wrapper .swiper-wrapper,
.slider-wrapper .swiper-slide,
.slider-wrapper .swiper-slide > a,
.slider-wrapper .swiper-slide picture {
  width: 100%;
  max-width: 100%;
  height: auto !important;
  max-height: none !important;
}
.slider-wrapper .swiper-slide > a,
.slider-wrapper .swiper-slide picture {
  display: block;
}
.slider-wrapper .slider-img {
  display: block;
  width: 100% !important;
  max-width: 100% !important;
  height: auto !important;
  max-height: none !important;
  object-fit: contain !important;
  object-position: center center !important;
  border-radius: 0 !important;
}

/* V8: removed redundant Premium Game Catalog hero block; compact top spacing on both screen sizes */
main.container > .slider-wrapper:first-child{margin-top:18px;}
@media(max-width:767px){main.container > .slider-wrapper:first-child{margin-top:12px;}}

/* =====================================
   CAKRA33 ORANGE THEME - FINAL OVERRIDE
   Tempel paling bawah CAKRA33-theme.css
===================================== */

/* BACKGROUND */
html,
body {
    background: #100805 !important;
    color: #fff3e8 !important;
}

/* HEADER */
.tc-topbar {
    background: #160b06 !important;
    border-bottom: 2px solid #ff7518 !important;
}

/* MENU */
.tc-desktop-nav a {
    color: #ffe1c5 !important;
}

.tc-desktop-nav .tc-top-register {
    background: linear-gradient(
        135deg,
        #ff5e00,
        #ffb347,
        #ff6a00
    ) !important;

    color: #190b03 !important;
    border: 1px solid #ffbd78 !important;
}

/* PANEL */
.tc-brand-panel {
    background: linear-gradient(
        135deg,
        #291309,
        #120905
    ) !important;

    border: 1px solid #ff7518 !important;
}

/* BANNER FRAME */
.slider-wrapper {
    background: #160b06 !important;
    border: 2px solid #ff7518 !important;
}

/* RUNNING TEXT */
.running-text {
    background: linear-gradient(
        90deg,
        #241006,
        #873b0c,
        #241006
    ) !important;

    color: #ffc078 !important;
}

/* BUTTON MASUK */
.btn-login {
    background: linear-gradient(
        135deg,
        #a83e08,
        #ff7818,
        #d84c08
    ) !important;

    color: #ffffff !important;
    border: 1px solid #ff9b35 !important;
}

/* BUTTON DAFTAR */
.btn-daftar {
    background: linear-gradient(
        135deg,
        #ff5e00,
        #ffb347,
        #ff6a00
    ) !important;

    color: #190b03 !important;
    border: 1px solid #ffc078 !important;
}

/* PROVIDER */
.icon-prov {
    background: linear-gradient(
        180deg,
        #351909,
        #180b05
    ) !important;

    border: 1px solid #ff7518 !important;
}

.icon-card-bg:hover,
.icon-card-bg.active {
    background: #74300d !important;
    border-color: #ff8a24 !important;
}

/* LIVE BAR */
.tc-catalog-livebar {
    background: linear-gradient(
        135deg,
        #351909,
        #180b05
    ) !important;

    border: 1px solid #ff7518 !important;
}

/* SEARCH */
.navbar-search {
    background: #281308 !important;
    border: 1px solid #ff7518 !important;
}

/* SEARCH INPUT */
.navbar-search input,
.navbar-search .form-control {
    background: #130904 !important;
    color: #ffffff !important;
    border-color: #ff7518 !important;
}

/* SEARCH BUTTON */
.navbar-search .search-button,
.navbar-search .input-group-text {
    background: linear-gradient(
        135deg,
        #ff5e00,
        #ffb347
    ) !important;

    color: #190b03 !important;
    border-color: #ff9b35 !important;
}

/* RECENT / HOT / TERBARU */
.btn-nav-recent,
.btn-nav-hot,
.btn-nav-new {
    background: #351909 !important;
    border: 1px solid #ff7518 !important;
}

.btn-nav-recent strong,
.btn-nav-hot strong,
.btn-nav-new strong {
    color: #ffe3c9 !important;
}

/* KATALOG */
.tc-catalog-head .tc-eyebrow {
    color: #ff8a24 !important;
}

.tc-catalog-head h1 em {
    color: #ff7818 !important;
}

/* KARTU GAME */
.rtp-card {
    background: linear-gradient(
        135deg,
        #281308,
        #130904
    ) !important;

    border: 1px solid #ff7518 !important;
}

/* GAMBAR GAME */
.place-img-rtp {
    background: #130904 !important;
    border: 1px solid #ff7518 !important;
}

/* CEK POLA */
.btn-play {
    background: linear-gradient(
        135deg,
        #ff5e00,
        #ffb347,
        #ff6a00
    ) !important;

    color: #190b03 !important;
    border: 1px solid #ffc078 !important;
}

/* POLA SLOT */
.pola-wrapper {
    background: #1b0d06 !important;
    border: 1px solid #ff7518 !important;
}

.pola-wrapper h4 {
    color: #ffb347 !important;
}

/* RTP BAR */
.percent-bar.good {
    background-color: #ff8a24 !important;
}

.percent-bar.great {
    background-color: #ff5e00 !important;
}

.percent-bar.bad {
    background-color: #a83e08 !important;
}

/* FOOTER */
footer.container {
    background: linear-gradient(
        180deg,
        #281308,
        #130904
    ) !important;

    border: 1px solid #ff7518 !important;
}

/* MENU BAWAH MOBILE */
.nav-bottom {
    background: #160b06 !important;
    border-top: 2px solid #ff7518 !important;
}

.item-nav-bottom {
    color: #ffe3c9 !important;
}

/* POPUP */
.popup-body {
    background: #281308 !important;
    border: 1px solid #ff7518 !important;
}

.popup-header {
    background: linear-gradient(
        90deg,
        #a83e08,
        #ff7818,
        #a83e08
    ) !important;
}

/* MOBILE */
@media (max-width: 767px) {
    .tc-brand-panel,
    .slider-wrapper,
    .rtp-card {
        border-color: #ff7518 !important;
    }

    .btn-login,
    .btn-daftar,
    .btn-play {
        border-radius: 8px !important;
    }
	
/* FIX RTP MOBILE - FINAL */
@media screen and (max-width: 767px) {

  /* KARTU RTP */
  .rtp-card {
    height: auto !important;
    overflow: visible !important;
  }

  .rtp-card > .row {
    display: flex !important;
    flex-wrap: wrap !important;
    height: auto !important;
  }

  /* GAMBAR GAME */
  .rtp-card > .row > .col-lg-6:first-child {
    display: block !important;
    width: 100% !important;
    flex: 0 0 100% !important;
    max-width: 100% !important;
  }

  /* INFORMASI RTP */
  .rtp-card > .row > .col-lg-6:last-child {
    display: block !important;
    width: 100% !important;
    flex: 0 0 100% !important;
    max-width: 100% !important;
    height: auto !important;
  }

  /* POLA RTP */
  .pola-wrapper {
    display: flex !important;
    height: auto !important;
    min-height: 100px !important;
    width: 100% !important;
    margin-top: 8px !important;
  }

  /* TABEL */
  .table-pola {
    display: table !important;
    width: 100% !important;
  }

  /* PERSENTASE */
  .percent {
    display: block !important;
    width: 100% !important;
    height: 23px !important;
    margin-top: 5px !important;
    overflow: visible !important;
  }

  .percent p {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
  }

  /* BAR RTP */
  .percent-bar {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
  }
}
/* =====================================
   FIX RTP CAKRA33 - TAMPILKAN PERSENTASE
   ===================================== */

.rtp-card .percent {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    width: 100% !important;
    height: auto !important;
    min-height: 35px !important;
    margin-top: 8px !important;
    overflow: visible !important;
    position: relative !important;
}

.rtp-card .percent-txt {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    position: relative !important;
    z-index: 20 !important;
    width: 100% !important;
    height: auto !important;
    min-height: 20px !important;
    margin: 0 0 5px !important;
    color: #ffffff !important;
    font-size: 14px !important;
    font-weight: bold !important;
    text-align: center !important;
}

.rtp-card .percent-bar {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    height: 8px !important;
    min-height: 8px !important;
    max-width: 100% !important;
    background: linear-gradient(
        90deg,
        #ff7a00,
        #ffb000,
        #ffd700
    ) !important;
    border-radius: 10px !important;
    overflow: visible !important;
}

@media (max-width: 767px) {
    .rtp-card .percent {
        display: block !important;
        width: 100% !important;
        margin-top: 8px !important;
    }

    .rtp-card .percent-txt {
        display: block !important;
        font-size: 13px !important;
        color: #ffffff !important;
    }

    .rtp-card .percent-bar {
        display: block !important;
        height: 8px !important;
    }
}
/* FINAL RTP MOBILE VISIBILITY FIX */
@media (max-width: 767px) {
  .percent, .rtp-card .percent {
    display: block !important; visibility: visible !important; opacity: 1 !important;
    position: relative !important; height: auto !important; min-height: 32px !important;
    overflow: visible !important;
  }
  .percent p, .percent-txt, .rtp-card .percent-txt {
    display: block !important; visibility: visible !important; opacity: 1 !important;
    position: relative !important; inset: auto !important; transform: none !important;
    color: #fff !important; font-size: 13px !important; line-height: 20px !important;
    text-align: center !important; z-index: 99 !important;
  }
  .percent-bar, .rtp-card .percent-bar {
    display: block !important; visibility: visible !important; opacity: 1 !important;
    position: relative !important; height: 8px !important; min-height: 8px !important;
  }
}