/* =========================
   PALET WARNA BARU
   Hitam + Krem + Kuning Kalem
   ========================= */

:root{
    --bg-main:#0d0d0d;
    --bg-secondary:#171717;
    --bg-soft:#222222;

    --text-main:#f1e6cf;
    --text-soft:#d7ccb7;
    --text-muted:#aaa08f;

    --cream:#e7dcc3;
    --cream-dark:#c8b89a;

    --yellow-soft:#d4bf74;
    --yellow-hover:#bea85b;

    --border:#3a342b;
}

/* =========================
   GLOBAL
   ========================= */

body{
    background:var(--bg-main);
    color:var(--text-soft);
}

h1,h2,h3,h4,h5,h6{
    color:var(--cream);
}

p{
    color:var(--text-muted);
}

a{
    outline:0;
    color:var(--yellow-soft);
    transition:.3s ease;
}

a:hover,
a:focus{
    color:var(--yellow-hover);
    text-decoration:none;
}

/* =========================
   HEADER & MENU
   ========================= */

.site-header{
    background:#121212;
    border-color:#232323;
}

.topbar-container{
    background:#101010;
}

.top-menu>li>a{
    color:var(--cream-dark);
}

.top-menu>li>a:hover,
.top-menu>li[data-active="true"]>a{
    color:var(--yellow-soft);
}

.top-menu .game-list{
    background:rgba(16,16,16,.96);
    border-bottom:1px solid var(--border);
}

/* =========================
   SIDEBAR
   ========================= */

.standard-side-menu,
.standard-side-menu .menu-section{
    background:var(--bg-secondary);
}

.standard-side-menu a{
    background:var(--bg-secondary);
    color:var(--cream);
    transition:.3s ease;
}

.standard-side-menu a:hover,
.standard-side-menu a[data-active="true"]{
    background:#2a241d;
    color:var(--yellow-soft);
}

/* =========================
   BUTTON
   ========================= */

.play-now,
.standard-button-group .btn-primary,
.modal-footer .btn-primary,
.login-panel .register-button{
    background:linear-gradient(to bottom,#e8dcb5 0%, #cdbb73 100%);
    color:#1a1a1a;
    border:none;
    box-shadow:0 0 12px rgba(212,191,116,.18);
}

.play-now:hover,
.standard-button-group .btn-primary:hover,
.modal-footer .btn-primary:hover,
.login-panel .register-button:hover{
    background:linear-gradient(to bottom,#cdbb73 0%, #e8dcb5 100%);
    color:#000;
}

.free-play,
.modal-btn.blank{
    background:linear-gradient(to bottom,#5a5a5a 0%, #3d3d3d 100%);
    color:#fff;
}

/* =========================
   FORM
   ========================= */

.form-control{
    background:#111111;
    border-color:var(--border);
    color:var(--cream);
}

.form-control:focus{
    border-color:var(--yellow-soft);
    box-shadow:0 0 0 2px rgba(212,191,116,.12);
}

/* =========================
   CARD / PANEL
   ========================= */

.panel,
.standard-form-container,
.standard-form-content,
.modal-content,
.provider-info,
.large-game-list-container{
    background:var(--bg-secondary);
    color:var(--text-soft);
    border-color:#242424;
}

.panel-default>.panel-heading,
.info-center-content-title{
    background:#252525;
    color:var(--cream);
}

/* =========================
   GAME ITEM
   ========================= */

.game-list,
.game-list-title{
    background:#141414;
}

.game-list .game-item{
    background:#1b1b1b;
}

.game-list .game-name,
.slots-games-container .game-name,
.casino-games-container .game-name{
    background:#c5b178;
    color:#111111;
}

/* =========================
   SPORTS
   ========================= */

.sports-container,
.sports-matches-container{
    background:#101010;
}

.sport-match-item{
    background:linear-gradient(to bottom,#ddd0a0 0%, #b7a563 100%);
    color:#111111;
}

.sport-match-item .match-info-container{
    background:#1d1d1d;
}

.sport-match-item .match-teams{
    color:var(--cream);
}

/* =========================
   LOGIN PANEL
   ========================= */

.login-panel{
    color:var(--cream);
}

.login-panel input[type=text],
.login-panel input[type=password]{
    background:#0c0c0c;
    border-color:#8f835c;
    color:var(--cream);
}

.login-panel .login-button{
    background:linear-gradient(to bottom,#5c5c5c 0%, #404040 100%);
    color:#ffffff;
}

/* =========================
   MODAL
   ========================= */

.modal-header{
    border-bottom-color:#2c2c2c;
}

.modal-title{
    color:var(--yellow-soft);
}

.modal-body p{
    color:var(--text-soft);
}

.modal-footer{
    border-top-color:#2c2c2c;
}

/* =========================
   FOOTER
   ========================= */

.site-footer{
    background:#101010;
    border-top:1px solid #1f1f1f;
}

.footer-links>li>a{
    color:var(--cream-dark);
}

.footer-links>li>a:hover{
    color:var(--yellow-soft);
}

.footer-section-title{
    color:var(--cream);
}

/* =========================
   TABLE
   ========================= */

.table,
.standard-content-info,
.standard-content-info .standard-content-block{
    background:#181818;
    color:var(--text-soft);
}

.standard-content-info table>thead>tr>th{
    background:#242424;
    color:var(--cream);
}

/* =========================
   INFO BOX
   ========================= */

.standard-form-note,
.payment-maintenance-container,
.remarks-container{
    background:#2a241d;
    color:var(--cream);
    border-color:#b8a767;
}

/* =========================
   POPUP / TOOLTIP
   ========================= */

.popover,
.ztip-holder{
    background:#1b1b1b;
    color:var(--cream);
    border-color:#cdbb73;
}

/* =========================
   SCROLLBAR
   ========================= */

::-webkit-scrollbar{
    width:8px;
    height:8px;
}

::-webkit-scrollbar-track{
    background:#111111;
}

::-webkit-scrollbar-thumb{
    background:#5b5547;
    border-radius:10px;
}

::-webkit-scrollbar-thumb:hover{
    background:#7b725d;
}