/* ============================================================
   Player Luna — estilos del reproductor (responsive)
   ============================================================ */

.pluna-wrap {
    position: relative;
    width: 100%;
    max-width: 100%;
    min-height: var(--pluna-h, 550px);
    height: var(--pluna-h, 550px);
    background-color: #091019;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    overflow: hidden;
    border-radius: 12px;
    box-sizing: border-box;
}

.pluna-inner {
    width: 100%;
    height: 100%;
    position: relative;
    overflow: hidden;
    box-sizing: border-box;
}

/* Nota de configuración (sin URL) */
.pluna-notice {
    padding: 16px 18px;
    border: 1px solid #fbbf24;
    background: #fffbeb;
    color: #92400e;
    border-radius: 10px;
    font-size: 14px;
    line-height: 1.5;
}

/* Vista previa en el panel */
.pluna-preview-box {
    max-width: 820px;
}

.pluna-preview-box .pluna-wrap {
    border: 1px solid var(--border, #e5e7eb);
}

/* Campos extra del tipo de stream (solo panel) */
.pluna-type-fields {
    display: none;
    padding-left: 12px;
    border-left: 3px solid var(--accent, #6366f1);
    margin-bottom: 8px;
}

/* ------------------------------------------------------------
   Ticker / texto deslizante
   Luna Radio crea 2 copias del texto para el bucle. Si no se recorta
   el contenedor, se apilan una encima de otra en pantallas estrechas.
   ------------------------------------------------------------ */
.pluna-inner [id*="scroll"],
.pluna-inner [id*="Scroll"],
.pluna-inner [class*="scroll"],
.pluna-inner [class*="Scroll"] {
    overflow: hidden;
    max-width: 100%;
    white-space: nowrap;
}

/* ------------------------------------------------------------
   Responsive — el player CRECE y llena el hero en móvil
   ------------------------------------------------------------ */

/* Fuera del hero (shortcode suelto, panel, etc.) */
@media (max-width: 768px) {
    .pluna-wrap {
        min-height: 480px;
        height: min(85vh, 640px);
        border-radius: 8px;
    }
}

@media (max-width: 480px) {
    .pluna-wrap {
        min-height: 420px;
        height: min(88vh, 620px);
        border-radius: 6px;
    }

    .pluna-notice {
        font-size: 13px;
        padding: 12px 14px;
    }
}

/* En el hero del theme onlyradio: pantalla completa (desktop y móvil) */
.or-hero .pluna-wrap {
    border-radius: 0;
    width: 100%;
}

@media (min-width: 769px) {
    .or-hero .pluna-wrap {
        min-height: 100vh;
        height: 100vh;
        --pluna-h: 100vh;
    }
}

@media (max-width: 768px) {
    .or-hero .pluna-wrap {
        /* El player llena el hueco del hero bajo la barra fija (60px) */
        min-height: calc(100vh - 60px);
        height: calc(100vh - 60px) !important;
        --pluna-h: calc(100vh - 60px) !important;
    }
}