.accordion {
    width: 100%;
}

.accordion-item {
    border-bottom: 1px solid #ccc;
    margin-bottom: 10px;
}

.accordion-title {
    width: 100%;
    background: #f8f8f8;
    border: none;
    padding: 10px;
    display: flex;
    align-items: center;
    cursor: pointer;
    text-align: left;
    font-size: 1.2em;
    font-weight: bold;
    position: relative;
}

.accordion-title:hover {
    background: #e0e0e0;
}

.accordion-title img.album-thumb {
    width: 50px;
    height: 50px;
    margin-right: 10px;
    border-radius: 5px;
}

/* Icono de dirección para el acordeón */
.accordion-icon {
    position: absolute;
    right: 15px;
    width: 0;
    height: 0;
    border-left: 8px solid transparent;
    border-right: 8px solid transparent;
    border-top: 8px solid #666;
    transition: transform 0.3s ease;
}

/* Rotación del icono cuando está cerrado */
.accordion-item:not(.active) .accordion-icon {
    transform: rotate(-90deg);
}

.accordion-content {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.5s ease-out;
}

.accordion-content img.album-main {
    width: 100%;
    max-width: 300px;
    display: block;
    margin: 10px auto;
    border-radius: 5px;
}

.accordion-content table {
    width: 100%;
    border-collapse: collapse;
    margin-top: 10px;
}

.accordion-content table th,
.accordion-content table td {
    padding: 8px;
    border: 1px solid #ccc;
    text-align: left;
}

/* Si el contenido es muy largo, se agrega un scroll interno */




/* Estilo para que el acordeón ajuste su altura */
.accordion-item.active .accordion-content {
    max-height: 1000px; /* Un límite alto para permitir expansión */
}
.song-list {
    width: 100%;
    border-collapse: collapse;
    margin-top: 10px;
}

.song-list th, .song-list td {
    padding: 8px;
    border: 1px solid #ccc;
    text-align: left;
}

/* Estilos para la sección de Producción Musical */
.production-accordion {
    margin-bottom: 30px;
}

.section-description {
    margin-bottom: 20px;
    font-style: italic;
    color: #666;
}

/* Destacar el rol en la tabla de información */
.accordion-content table tr:nth-child(1) th,
.accordion-content table tr:nth-child(1) td {
    font-weight: bold;
    background-color:rgba(187, 226, 172, 0.65);
}

/* Ajuste para la visualización de artistas */
.accordion-content table tr:nth-child(1) td {
    font-weight: bold;
}

/* Estilos para la sección de Singles */
.singles-accordion {
    margin-bottom: 30px;
}

.singles-accordion .accordion-content table {
    margin-bottom: 20px;
}