/* For Tablet View */
@media screen and (min-device-width: 768px)
    and (max-device-width: 1024px) {

}
 
/* For Mobile Portrait View */
@media screen and (max-device-width: 480px)
    and (orientation: portrait) {

        html, body {
            max-width: 100%;
            overflow-y: scroll !important;
            overflow-x: hidden !important;
        }

        .logo img {
            width: 13rem !important;
        }

        .pola-wrapper {
            width: 100% !important;
            padding: 0.58rem !important;
        }

        .rtp-card-img {
            width: 100% !important;
        }
        .slider, .swiper {
            width: 100%;
            height: 100%;
        }

        .icon-card-bg p {
            font-size: 0.6rem !important;
            font-weight: bold !important;
        }

        .icon-prov {
            justify-content: start !important;
        }

        .icon-card-bg img {
            width: 3rem !important;
        }

        .title-game {
            font-size: 1.2rem !important;
        }

        .rtp-game-title{
    color:#ffd700;
    font-size:22px;
    font-weight:800;
    margin-bottom:10px;
}

        .item-nav-bottom {
            font-size: 0.7rem !important;
        }

        .icon-providers {
            top: 0.2rem !important;
            right: 0 !important;
        }

}
 
/* For Mobile Landscape View */
@media screen and (max-device-width: 850px)
    and (orientation: landscape) {
        
        html, body {
            max-width: 100%;
            overflow-y: scroll !important;
            overflow-x: hidden !important;
        }
}
 
/* For Mobile Phones Portrait or Landscape View */
@media screen
    and (max-device-width: 640px) {
        
        .btn-play {
            font-size: 0.6rem !important;
        }    
}

.rtp-box{
    background: linear-gradient(180deg,#000,#111,#1a1a1a);
    border: 2px solid #d4af37;
    border-radius: 16px;
    padding: 18px;
    margin-top: 15px;
    position: relative;
    overflow: hidden;
    box-shadow:
        0 0 15px rgba(212,175,55,.35),
        inset 0 0 10px rgba(212,175,55,.12);
}

/* Glow Effect */
.rtp-box::before{
    content:'';
    position:absolute;
    top:-50%;
    left:-50%;
    width:200%;
    height:200%;
    background: radial-gradient(circle, rgba(255,215,0,.08) 0%, transparent 70%);
    animation: glowRotate 8s linear infinite;
}

@keyframes glowRotate{
    0%{transform:rotate(0deg);}
    100%{transform:rotate(360deg);}
}

.rtp-content{
    position:relative;
    z-index:2;
}

.title-game{
    color:#ffd700 !important;
    font-size:22px !important;
    font-weight:800 !important;
    margin-bottom:10px !important;
    text-shadow:0 0 8px rgba(255,215,0,.4);
}

.rtp-box h6{
    color:#fff !important;
    font-size:15px;
    font-weight:600;
}

.rtp-box .text-warning{
    color:#ffd700 !important;
}

.rtp-box .text-light{
    color:#555 !important;
}

/* RTP Bar */
.rtp-bar{
    width:100%;
    height:10px;
    background:#222;
    border-radius:20px;
    overflow:hidden;
    margin-top:10px;
    border:1px solid #333;
}

.rtp-fill{
    width:92%;
    height:100%;
    background:linear-gradient(90deg,#ffd700,#ffae00);
    box-shadow:0 0 10px rgba(255,215,0,.5);
    border-radius:20px;
}

/* Status */
.rtp-status{
    display:inline-block;
    margin-top:12px;
    padding:5px 12px;
    background:#0f0;
    color:#000;
    font-size:12px;
    font-weight:700;
    border-radius:30px;
    animation: blink 1s infinite;
}

@keyframes blink{
    50%{
        opacity:.6;
    }
}

/* Jackpot */
.jackpot-box{
    margin-top:15px;
    background:rgba(255,215,0,.08);
    border:1px solid rgba(255,215,0,.3);
    border-radius:12px;
    padding:10px;
    text-align:center;
}

.jackpot-text{
    color:#ffd700;
    font-size:14px;
    font-weight:700;
}

.jackpot-amount{
    color:#fff;
    font-size:24px;
    font-weight:900;
    text-shadow:0 0 10px rgba(255,215,0,.5);
}

.rtp-box{
    background: linear-gradient(180deg,#000,#111,#1a1a1a);
}