/* Estilos para el listado de PDFs con funcionalidad de acordeón */

/* Contenedor principal del acordeón */
.pdf-lister-accordion-container {
    background-color: #f9f9f9;
    border: 1px solid #e0e0e0;
    border-radius: 5px;
    padding: 20px;
    margin-bottom: 20px;
    box-shadow: 0 2px 4px rgba(0,0,0,0.05);
}

/* Título del acordeón (clicable para desplegar/colapsar) */
.pdf-lister-accordion-title {
    color: #333;
    font-size: 1.5em;
    margin-top: 0;
    margin-bottom: 15px;
    border-bottom: 2px solid #0073aa; /* Color de acento de WordPress */
    padding-bottom: 10px;
    cursor: pointer; /* Indica que es clicable */
    display: flex; /* Permite alinear el título y el icono */
    justify-content: space-between; /* Empuja el icono a la derecha */
    align-items: center; /* Centra verticalmente título e icono */
}

/* Estado al pasar el ratón por el título */
.pdf-lister-accordion-title:hover {
    color: #005177; /* Un tono más oscuro al pasar el ratón */
}

/* Estilo del icono (flecha de acordeón) */
.accordion-icon {
    font-size: 0.8em;
    transition: transform 0.3s ease; /* Suave transición para el giro del icono */
    margin-left: 10px; /* Espacio entre el título y el icono */
    display: inline-block; /* Asegura que la rotación funcione bien */
}

/* Rotación del icono cuando el acordeón está activo (desplegado) */
.pdf-lister-accordion-title.active .accordion-icon {
    transform: rotate(90deg); /* Gira 90 grados para que apunte hacia abajo */
}

/* Lista de archivos PDF */
.pdf-list {
    list-style: none; /* ¡Esto elimina las viñetas de lista! */
    padding: 0;
    margin: 0;
}

/* Clase para ocultar la lista inicialmente si no está 'expanded' */
.pdf-list-collapsed {
    display: none; /* Oculta la lista completamente al cargar la página */
}

/* Regla adicional para eliminar posibles círculos o íconos creados por pseudo-elementos del tema */
/* Esto cubre casos donde el tema añade viñetas con ::before o ::after */
.pdf-list-item::before,
.pdf-list-item::after {
    content: none !important; /* Asegura que no haya contenido de pseudo-elementos */
    display: none !important;  /* Y que tampoco se muestre el pseudo-elemento si lo hubiera */
}

/* Cada elemento individual de la lista */
.pdf-list-item {
    padding: 10px 0;
    border-bottom: 1px dashed #eee; /* Línea separadora */
    display: flex; /* Permite alinear el icono, nombre y tamaño */
    align-items: center; /* Centra verticalmente los elementos */
}

/* Elimina la línea en el último elemento de la lista para una mejor estética */
.pdf-list-item:last-child {
    border-bottom: none;
}

/* Estilo del enlace a cada archivo PDF */
.pdf-list-item a {
    text-decoration: none; /* Elimina el subrayado predeterminado */
    color: #0073aa; /* Color de enlace estándar de WordPress */
    font-weight: bold;
    display: flex;
    align-items: center;
    flex-grow: 1; /* Permite que el enlace ocupe el espacio disponible */
}

/* Estado del enlace al pasar el ratón */
.pdf-list-item a:hover {
    color: #005177; /* Un tono más oscuro al pasar el ratón */
    text-decoration: underline; /* Añade subrayado al pasar el ratón */
}

/* Icono visual de PDF */
.pdf-icon {
    font-size: 1.2em; /* Tamaño del icono */
    margin-right: 8px; /* Espacio a la derecha del icono */
    color: #d32f2f; /* Un color rojo distintivo para el icono de PDF */
}

/* Tamaño del archivo (opcional) */
.pdf-size {
    font-size: 0.9em; /* Tamaño de fuente más pequeño para el tamaño del archivo */
    color: #666; /* Color gris suave */
    margin-left: auto; /* Empuja el tamaño a la derecha del enlace */
    padding-left: 10px; /* Espacio a la izquierda del tamaño */
}

/* Mensajes de error */
.pdf-lister-error {
    color: #d63638; /* Color de error de WordPress */
    background-color: #ffe8e8;
    border: 1px solid #d63638;
    padding: 10px;
    border-radius: 4px;
}

/* Mensajes informativos (por ejemplo, "No se encontraron PDFs") */
.pdf-lister-message {
    color: #555;
    background-color: #f0f0f0;
    border: 1px solid #ddd;
    padding: 10px;
    border-radius: 4px;
}