/* main.css */

/* Sizning bazaviy (responsive bo'lmagan) CSS kodlaringiz bu yerda bo'ladi */


/* Loader Style */
.loader-wrapper {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #1a1a1a;
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 9999;
}

.loader-ball {
    width: 20px;
    height: 20px;
    margin: 0 6px;
    border-radius: 50%;
    animation: bounce 1s infinite ease-in-out;
}

.ball1 { background: #c0392b; animation-delay: 0s; }
.ball2 { background: #16a085; animation-delay: 0.1s; }
.ball3 { background: #117a8b; animation-delay: 0.2s; }
.ball4 { background: #c0392b; animation-delay: 0.3s; }
.ball5 { background: #e74c3c; animation-delay: 0.4s; }

@keyframes bounce {
    0%, 80%, 100% {
        /*transform: scale(0);*/
        transform: translateY(-40px);
        opacity: 0.3;
    }
    40% {
        /*transform: scale(1);*/
        transform: translateY(0px);
        opacity: 1;
    }
}


.nav-links {
    display: flex;
    gap: 20px;
    font-size: 14px;
    align-items: center;
}

.quran-player {
    width: 800px;
    margin: 30px auto;
#    background: #f5f5f5;
    padding: 20px;
    border-radius: 10px;
}

.upper_quran_player {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 20px;
}

.upper_quran_player .listen_quran_text {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 1.2rem;
}

.upper_quran_player select {
    padding: 8px;
    border-radius: 6px;
    border: 1px solid #ccc;
}

.surah-info {
    font-size: 1rem;
    padding: 15px;
#    background-color: #fff;
    border-radius: 8px;
    margin-bottom: 20px;
}

.controls {
    display: flex;
    justify-content: center;
    gap: 10px;
}

.controls button {
    background-color: #29d33c;
    color: white;
    border: none;
    padding: 10px 15px;
    border-radius: 5px;
    cursor: pointer;
}

/*.modal-content {*/
/*    background-color: white;*/
/*    border-radius: 10px;*/
/*    padding: 25px;*/
/*    max-width: 600px;*/
/*    margin: auto;*/
/*}*/

/*.filters {*/
/*    display: flex;*/
/*    gap: 20px;*/
/*    align-items: center;*/
/*    justify-content: space-between;*/
/*}*/

/*.filter-btns select {*/
/*    padding: 8px;*/
/*    border-radius: 5px;*/
/*    border: 1px solid #ccc;*/
/*}*/

.footer-content {
    display: flex;
    justify-content: space-between;
    padding: 20px;
    background-color: #1b1b1b;
    color: white;
}

.footer-bottom {
    padding: 10px;
    background-color: #111;
    color: #ccc;
    text-align: center;
}

/* Boshqa umumiy stillar ham shu faylga yoziladi */