/* Version inherited from index.php via BW_VERSION */

/* Main game section */
#pinballSection {
    width: 100%;
    min-height: 100vh;
    position: relative;
    padding: 24px 12px 32px;
    box-sizing: border-box;
    background: #000 url('/pinball/images/game/casinoNightFull1.png')
        center top / 100% 100% no-repeat;
    display: flex;
    flex-direction: column;
    align-items: center;
}

/* Game playfield */
#pinballSection .pinball-stage {
    position: relative;
    width: min(100%, 520px);
    aspect-ratio: 928 / 1650;
    background: transparent;
    border: 2px solid #168cff;
    border-radius: 12px;
    box-shadow: 0 0 18px #006bff66;
    overflow: hidden;
    touch-action: none;
    user-select: none;
}

#pinballCanvas {
    display: block;
    width: 100%;
    height: 100%;
    background: transparent;
}

/* Score and ball counter */

#pinballSection .pinball-hud {
    width: min(100%, 520px);
    display: flex;
    justify-content: space-between;
    align-items: center;
    color: #ffff00 !important;
    font-family: monospace;
    font-weight: bold;
    box-sizing: border-box;
    padding: 8px 4px;
    text-shadow: 2px 2px 3px #000,
                 0 0 10px #ff9900;
}

#pinballSection #pinballScore,
#pinballSection #pinballBalls {
    color: #ffff00 !important;
}


/* Game buttons */
#pinballSection button {
    cursor: pointer;
    color: #fff;
    background: #08183c;
    border: 1px solid #358dff;
    border-radius: 8px;
    padding: 12px 18px;
    font-family: monospace;
    font-weight: bold;
}

#pinballSection button:active {
    background: #2356b1;
}

#pinballSection .pinball-controls {
    width: min(100%, 520px);
    display: flex;
    justify-content: space-between;
    gap: 12px;
    padding-top: 12px;
}

/* Blog section */
#blogPostsMount,
#blogPagerMount {
    position: relative;
    z-index: 1;
}

#pinballSection + #blogPostsMount {
    margin-top: 0;
}

/* Starfield behind posts */
body {
    background: #000 url('/pinball/images/game/starBg1.png')
        center top / 928px auto repeat-y;
}

/* Responsive game sizing */
@media (max-width: 600px) {
    #pinballSection {
        min-height: auto;
        padding: 8px 4px 20px;
    }

    #pinballSection .pinball-stage {
        width: min(100%, 45vh);
        border-radius: 6px;
    }

    #pinballSection .pinball-hud,
    #pinballSection .pinball-controls {
        width: min(100%, 45vh);
    }

    #pinballSection button {
        padding: 10px 12px;
    }
}


/* Force all score display text to bright yellow */
#pinballSection .pinball-hud,
#pinballSection .pinball-hud *,
#pinballSection #pinballScore,
#pinballSection #pinballBalls {
    color: #ffff00 !important;
    -webkit-text-fill-color: #ffff00 !important;
    text-shadow: 2px 2px 4px #000,
                 0 0 10px #ff9900;
}


#pinballSection .pinball-topbar,
#pinballSection .pinball-topbar .pinball-score,
#pinballSection .pinball-topbar #pinballScore,
#pinballSection .pinball-topbar #pinballBalls {
    color: #ffff00 !important;
    -webkit-text-fill-color: #ffff00 !important;
    font-family: monospace;
    font-weight: bold;
    text-shadow: 2px 2px 4px #000;
}