.modal.modal-video .modal-body {
    overflow: hidden;
}
.mini-program-description {
    display: block;
    max-width: 300px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;

}

/* .main-body {
    background-color: var(--main-body-bg);
    background-image: url("https://latinohitsradio.com/wp-content/uploads/2024/12/bg.png");
    background-repeat: repeat;
    background-position: center top;
    background-size: auto;
} */

.section {
    margin-bottom: 1.5rem;
}


.section-heading {
    display: flex;
    align-items: center;
    /* centra verticalmente todo dentro */
    gap: 10px;
    /* espacio entre el texto y la lÃƒÂ­nea */
}
.volume-dropdown {
    position: absolute;
    left: 50%;
    bottom: 100%;
    padding: 0.75rem;
    border-radius: 9999px;
    background-color: #fbfbfb;
    transform: translate(-50%, 0);
    box-shadow: var(--box-shadow-high);
    transition: opacity var(--player-duration), transform var(--player-duration);
}


.player-equalizer {
    border-radius: 0.5rem;
    overflow: hidden;
}
.modal-article-title{

    font-weight: 800;

}

.mobile-menu-list {
    font-size: 12px;
    font-weight: 600;
    gap: 12px;
}


.player.is-static {
    position: static;
}

.btn {
    border-radius: 50px;
}
.player.is-static .player-desc .artist-name {
    background-color: #000;
    font-weight: 800;
    padding: 0.25rem 0.5rem;
}

.modal-content {
    background-color: #4216F2;
    width: 100%;
    padding: 10px;
    max-width: 900px;
    border-radius: 15px;
    max-height: 90vh;
    display: flex;
    flex-direction: column;
    position: relative;
    animation: modalOpen var(--player-duration) ease;
}

.btn {

    font-weight: 700;

}

body {
    min-height: 100vh;
    /* asegura que cubra toda la pantalla */
    /* background: url("assets/bg.png") no-repeat center center fixed;
    background-size: cover; */
    /* ajusta la imagen para cubrir todo */
}

/* .player:not(.is-static) {
    --container-width: 1250px;
} */

/*.install-buttons-wrapper {

    background-color: #ffffff0d;
        -webkit-backdrop-filter: blur(1rem);
        backdrop-filter: blur(1rem);
}

.install-botton .install-button{
    align-items: center;
    gap: var(--button-gap, .5rem);
    padding: var(--button-padding, .75rem);
    text-transform: uppercase;
    transition: transform var(--duration);
    white-space: nowrap;
    background-color: rgba(255, 255, 255, .25);
    border-radius: 999px;
    font-size: .875rem;
    font-weight: 700;
    display: flex;
}

.install-botton .install-button {
    text-transform: capitalize;
    --btn-bg: #fff;
    --btn-color: #ffffff;
}

.install-botton .install-button:hover {
    transform: scale(1.1);
}

/*.install-botton .install-button {
    transition: transform 0.3s ease;

}*/

/* =====================================================
   REDES SOCIALES EN EL COVER (header-socials)
   Colores originales de cada red social
   ===================================================== */
#header-socials .social-item {
    border-radius: 50%;
    width: 38px;
    height: 38px;
    min-width: 38px;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: transform 0.2s ease, filter 0.2s ease;
    box-shadow: 0 2px 10px rgba(0,0,0,0.35);
    text-decoration: none;
}

#header-socials .social-item:hover {
    transform: scale(1.15);
    filter: brightness(1.15);
}

/* Tamaño y color base de SVG - funciona para fill Y stroke */
#header-socials .social-item svg {
    width: 18px;
    height: 18px;
    fill: #fff !important;
    stroke: #fff !important;
    color: #fff !important;
}

/* Facebook — azul oficial */
#header-socials .social-facebook {
    background-color: #1877F2 !important;
}

/* Instagram — gradiente oficial */
#header-socials .social-instagram {
    background: radial-gradient(circle at 30% 107%, #fdf497 0%, #fdf497 5%, #fd5949 45%, #d6249f 60%, #285AEB 90%) !important;
}

/* YouTube — rojo oficial */
#header-socials .social-youtube {
    background-color: #FF0000 !important;
}

/* TikTok — negro con acento */
#header-socials .social-tiktok {
    background-color: #010101 !important;
}

/* WhatsApp — verde oficial */
#header-socials .social-whatsapp {
    background-color: #25D366 !important;
}

/* X / Twitter — negro */
#header-socials .social-x {
    background-color: #000 !important;
}

/* Telegram — azul */
#header-socials .social-telegram {
    background-color: #229ED9 !important;
}

