/* 🏆 ชื่อทีม */
.team-name {
    font-size: 1.4rem;
    font-weight: bold;
    color: #ffffff;
}

/* 🏅 อันดับทีม */
.rank-text {
    font-size: 1rem;
    color: #bbbbbb;
}

/* 🎯 กล่องแสดงคะแนน */
.score-box {
    background: linear-gradient(145deg, #2a2a2a, #1a1a1a);
    border-radius: 10px;
    box-shadow: inset 2px 2px 5px #000, inset -2px -2px 5px #333;
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: 120px;
    min-height: 80px;
}

/* ⚽ คะแนน */
.score-display {
    font-size: 2.5rem;
    font-weight: bold;
    color: #00ff55;
    text-align: center;
}

/* 🎥 ส่วนแสดง Animation */
.menu-title {
    font-size: 1.2rem;
    color: #00c3ff;
    font-weight: bold;
}

/* ทำให้ iframe ขยายเต็มจอ */
#iframe-container {
    width: 100%;
    display: flex;
    justify-content: center;
}

/* ป้องกันขอบขาว */
#iframe-container iframe {
    width: 100%;
    max-width: 100%;
    aspect-ratio: 16/9; /* ปรับให้สัดส่วนสวยงาม */
}

/* Responsive */
@media (max-width: 768px) {
    #liveAnimationIframe {
        height: 400px !important;
    }
}
@media (min-width: 1024px) {
    #liveAnimationIframe {
        height: 700px !important;
    }
}
/* 📱 Responsive */
@media (max-width: 768px) {
    /* ปรับชื่อทีมให้เล็กลง */
    .team-name {
        font-size: 1.2rem;
    }

    /* ปรับขนาดสกอร์ให้เหมาะสม */
    .score-display {
        font-size: 2rem;
    }

    /* ปรับให้ iframe แสดงผลเต็มหน้าจอ */
    iframe#liveAnimationIframe {
        height: 300px; /* ลดขนาดลงสำหรับมือถือ */
    }
}