/* Stats Section - pzstats.html */
.stats {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    margin: 20px auto;
    max-width: 1200px;
}

@media (max-width: 768px) {
    .iframe-container {
        width: 100%; /* Make chat box full-width on smaller screens */
        height: 300px; /* Adjust height for smaller screens */
    }
}

/* Footer Styling */

.chat-messages {
    height: 300px;
    overflow-y: auto;
    scrollbar-width: none; /* Firefox-specific property */
    -ms-overflow-style: none; /* IE and Edge */
}

.chat-messages::-webkit-scrollbar {
    display: none; /* Chrome, Safari, and Edge */
}


/* Responsive Styling for Player Bar */
@media (max-width: 768px) {
    .player-bar {
        font-size: 1rem; /* Adjust font size for smaller screens */
        padding: 8px 0; /* Adjust padding for smaller screens */
    }
}
        /* Flexbox Container for Map and Chat */
        .info-wrapper {
            display: flex;
            justify-content: space-between;
            align-items: flex-start;
            gap: 20px;
            margin: 20px 0;
        }

        /* Map Section */
        .map-container {
            flex: 2;
            display: flex;
            justify-content: center;
            align-items: center;
            max-width: 600px;
        }

        .map-image {
            max-width: 100%;
            border: 2px solid #4b0082; /* Optional purple border */
            border-radius: 10px;
            box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2); /* Optional shadow */
        }

        /* Chat Section */
        .iframe-container {
            flex: 1;
            width: 300px; /* Fixed width for chat box */
            height: 400px; /* Fixed height for chat box */
            background-color: black; /* Black background for chat box */
            border: 2px solid #4b0082; /* Purple border */
            border-radius: 10px;
            overflow: hidden;
            box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
        }

        iframe {
            width: 100%;
            height: 100%;
            border: none;
            overflow: hidden;
        }