/**
 * Estilos específicos para o acordeão de documentos dentro do content-listing-block
 */

/* Garantir que os documentos do acordeão sejam exibidos corretamente */
.documents-wrapper {
    display: block !important;
    width: 100% !important;
    visibility: visible !important;
    position: relative !important;
    z-index: 10 !important;
    margin-top: 1rem !important; /* Espaço entre o acordeon e o primeiro card */
}

.documents-wrapper .acc-document__list {
    display: grid !important;
    gap: 1rem !important;
    width: 100% !important;
}

.documents-wrapper .acc-document {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    padding: 1rem !important;
    border: 1px solid rgba(0, 0, 0, 0.3) !important;
    border-radius: 4px !important;
    transition: all 0.2s ease-in-out !important;
    visibility: visible !important;
}

.documents-wrapper .acc-document__infos {
    display: flex !important;
    align-items: center !important;
    gap: 0.5rem !important;
}

.documents-wrapper .acc-document__actions {
    display: flex !important;
    align-items: center !important;
    gap: 1rem !important;
}

/* Espaço para a descrição abaixo dos metadados do documento */
.documents-wrapper .acc-document__infos__title--desc {
    margin-top: 4px !important;
}

/* Garantir negrito no título do documento (nome do arquivo) */
.documents-wrapper .acc-bold { font-weight: 700 !important; }
.documents-wrapper .acc-document__infos__title--title header > span:first-child { font-weight: 700 !important; }

/* Garantir que os links dentro do acordeão não tenham nenhum estilo que os torne invisíveis */
.documents-wrapper a,
.documents-wrapper a:link,
.documents-wrapper a:visited,
.documents-wrapper a:hover,
.documents-wrapper a:active {
    display: flex !important;
    align-items: center !important;
    text-decoration: none !important;
    border: none !important;
    box-shadow: none !important;
    outline: none !important;
    opacity: 1 !important;
    visibility: visible !important;
}

/* Garantir que os ícones dentro do acordeão sejam visíveis */
.documents-wrapper svg {
    visibility: visible !important;
    opacity: 1 !important;
    display: block !important;
    width: 24px !important;
    height: 24px !important;
}

/* Estilos específicos para o tema escuro */
html.dark .documents-wrapper .acc-document {
    background-color: rgba(45, 45, 45, 0.95) !important;
    border: 1px solid rgba(255, 255, 255, 0.5) !important;
}

/* Estilos para os ícones SVG no modo dark */
html.dark .documents-wrapper .acc-document__infos__icon svg,
html.dark .documents-wrapper .acc-document__infos__icon svg path,
html.dark .documents-wrapper .acc-document__infos__icon svg polyline,
html.dark .documents-wrapper .acc-document__infos__icon svg line {
    stroke: rgba(255, 255, 255, 0.8) !important;
}

html.dark .documents-wrapper .acc-document__actions a svg,
html.dark .documents-wrapper .acc-document__actions a svg path,
html.dark .documents-wrapper .acc-document__actions a svg polyline,
html.dark .documents-wrapper .acc-document__actions a svg line,
html.dark .documents-wrapper .acc-document__actions a svg circle {
    stroke: rgba(255, 255, 255, 0.6) !important;
}

html.dark .documents-wrapper .acc-txt-coal,
html.dark .documents-wrapper .acc-txt-gray,
html.dark .documents-wrapper .acc-document__infos__title--title .acc-txt-smaller,
html.dark .documents-wrapper .acc-document__infos__title--meta,
html.dark .documents-wrapper .acc-document__actions a {
    color: rgba(255, 255, 255, 0.85) !important;
}

html.dark .documents-wrapper .acc-txt-gray.uppercase {
    color: rgba(255, 255, 255, 0.6) !important;
}

html.dark .documents-wrapper .acc-document__actions svg {
    stroke: rgba(255, 255, 255, 0.4) !important;
}

/* Hover no dark mode para posts (lilás mais claro) */
html.dark.single-post .documents-wrapper .acc-document:hover {
    border-color: #c78bc8 !important;
}

html.dark.single-post .documents-wrapper .acc-document:hover .acc-document__infos__icon svg {
    stroke: #c78bc8 !important;
}

html.dark.single-post .documents-wrapper .acc-document__actions a:hover svg {
    stroke: #c78bc8 !important;
}

/* Hover padrão para outras páginas no modo dark */
html.dark .documents-wrapper .acc-document:hover {
    border-color: var(--link-lilac-light, #9e629f) !important;
    background-color: rgba(45, 45, 45, 0.98) !important;
}

html.dark .documents-wrapper .acc-document:hover .acc-document__infos__icon svg {
    stroke: var(--link-lilac-light, #9e629f) !important;
}

html.dark .documents-wrapper .acc-document__actions a:hover svg {
    stroke: var(--link-lilac-light, #9e629f) !important;
}