/* ==========================================================
   ITEM INDIVIDUAL TAINACAN — PADRÃO GLOBAL
========================================================== */

body[data-prefix$="_item_single"] {
    --tainacan-single-text-color: #666;
    --tainacan-single-link-color: #333;
}


/* ==========================================================
   ÁREA DE METADADOS
========================================================== */

/* Largura base das colunas de metadados */
body[data-prefix$="_item_single"]
.tainacan-item-section__metadata {
    --metadata-column-width: 200px;
}


/* ==========================================================
   TÍTULOS DAS SEÇÕES
========================================================== */

body[data-prefix$="_item_single"]
.tainacan-single-item-section {
    --theme-font-weight: 600;
    --theme-font-size: 26px;
    --theme-line-height: 1.3;
    --section-alignment: left;
}


/* ==========================================================
   DOCUMENTO E ANEXOS
========================================================== */

body[data-prefix$="_item_single"]
.tainacan-media-component {
    --attachments-size: 140px;
    --thumbnails-size: 140px;
    --document-height: 60vh;
    --gallery-height: 60vh;
    --document-width: 100%;
    --attachments-carousel-width: 100%;
}


/* ==========================================================
   RÓTULOS DOS METADADOS
========================================================== */

body[data-prefix$="_item_single"]
.tainacan-metadata-label {
    --metadata-label-border: 0 solid transparent;
    --theme-font-family: Arial, sans-serif;
    --theme-font-weight: 600;
    --theme-font-size: 12px;
    --theme-line-height: 1.2;
    --metadata-label-alignment: left;
}


/* ==========================================================
   VALORES DOS METADADOS
========================================================== */

body[data-prefix$="_item_single"]
.tainacan-metadata-value {
    --metadata-value-border: 0 solid transparent;
    --theme-font-family: Arial, sans-serif;
    --theme-font-weight: 300;
    --theme-text-decoration: none;
    --theme-font-size: 14px;
    --metadata-value-alignment: left;

    overflow: visible;
}


/* ==========================================================
   EMBEDS GENÉRICOS

   Não altera a largura da coluna.
   Apenas impede que iframes ultrapassem o espaço disponível.
========================================================== */

body[data-prefix$="_item_single"]
.tainacan-metadata-value iframe {
    display: block;
    max-width: 100%;
    border: 0;
}


/* Remove espaços extras comuns gerados em embeds */
body[data-prefix$="_item_single"]
.tainacan-metadata-value p:has(iframe) {
    margin: 0;
}


/* Evita que wrappers internos ultrapassem o contêiner */
body[data-prefix$="_item_single"]
.tainacan-metadata-value > div {
    max-width: 100%;
}


/* ==========================================================
   METADADOS URL — COMPORTAMENTO PADRÃO

   Metadados do tipo URL NÃO devem ocupar duas colunas
   simplesmente porque possuem iframe/oEmbed.

   Isso preserva links comuns e embeds de páginas externas.
========================================================== */

body[data-prefix$="_item_single"]
.tainacan-item-section__metadata
.metadata-type-url {
    width: auto;
    max-width: 100%;
}


/* ==========================================================
   EMBEDS DE VÍDEO — DETECÇÃO POR PROVEDOR

   Somente provedores reconhecidos de vídeo recebem
   tratamento especial de largura total.

   Não depende:
   - do nome do metadado;
   - do slug;
   - do ID;
   - da coleção.

========================================================== */


/* ----------------------------------------------------------
   METADADO COMPLETO
---------------------------------------------------------- */

body[data-prefix$="_item_single"]
.tainacan-item-section__metadata
.metadata-type-url:has(
    iframe[src*="youtube.com/embed/"],
    iframe[src*="youtube-nocookie.com/embed/"],
    iframe[src*="player.vimeo.com/"]
) {
    display: block !important;

    /*
     O layout do Tainacan usa CSS Columns.
     Esta propriedade faz o metadado atravessar todas
     as colunas disponíveis.
    */
    column-span: all;

    width: 100% !important;
    max-width: none !important;

    margin-top: 24px;
    margin-bottom: 24px;
}


/* ----------------------------------------------------------
   VALOR DO METADADO DE VÍDEO
---------------------------------------------------------- */

body[data-prefix$="_item_single"]
.tainacan-item-section__metadata
.metadata-type-url:has(
    iframe[src*="youtube.com/embed/"],
    iframe[src*="youtube-nocookie.com/embed/"],
    iframe[src*="player.vimeo.com/"]
)
.tainacan-metadata-value {
    display: block !important;

    width: 100% !important;
    max-width: none !important;

    overflow: visible;
}


/* ----------------------------------------------------------
   FIGURE GERADO PELO TAINACAN / WORDPRESS
---------------------------------------------------------- */

body[data-prefix$="_item_single"]
.tainacan-item-section__metadata
.metadata-type-url:has(
    iframe[src*="youtube.com/embed/"],
    iframe[src*="youtube-nocookie.com/embed/"],
    iframe[src*="player.vimeo.com/"]
)
.tainacan-content-embed {
    display: block;

    width: 100% !important;
    max-width: none !important;

    margin-left: 0;
    margin-right: 0;
}


/* ----------------------------------------------------------
   WRAPPER INTERNO DO EMBED
---------------------------------------------------------- */

body[data-prefix$="_item_single"]
.tainacan-item-section__metadata
.metadata-type-url:has(
    iframe[src*="youtube.com/embed/"],
    iframe[src*="youtube-nocookie.com/embed/"],
    iframe[src*="player.vimeo.com/"]
)
.tainacan-content-embed__wrapper {
    display: block;

    width: 100% !important;
    max-width: none !important;

    position: relative;
}


/* ----------------------------------------------------------
   IFRAME DO YOUTUBE / VIMEO
---------------------------------------------------------- */

body[data-prefix$="_item_single"]
.tainacan-item-section__metadata
.metadata-type-url
iframe:is(
    [src*="youtube.com/embed/"],
    [src*="youtube-nocookie.com/embed/"],
    [src*="player.vimeo.com/"]
) {
    display: block;

    width: 100% !important;
    max-width: 100% !important;

    aspect-ratio: 16 / 9;

    height: auto !important;

    border: 0;

    margin: 0;
}


/* ==========================================================
   CORREÇÃO PARA O SISTEMA DE ASPECT-RATIO DO TAINACAN

   O Tainacan usa um pseudo-elemento ::before para manter
   a proporção do vídeo.

   Aqui garantimos que o wrapper ocupe toda a largura.
========================================================== */

body[data-prefix$="_item_single"]
.tainacan-item-section__metadata
.metadata-type-url:has(
    iframe[src*="youtube.com/embed/"],
    iframe[src*="youtube-nocookie.com/embed/"],
    iframe[src*="player.vimeo.com/"]
)
.tainacan-has-aspect-ratio
.tainacan-content-embed__wrapper {
    width: 100% !important;
}


/* ==========================================================
   IFRAMES QUE NÃO SÃO VÍDEO

   Exemplos:
   - Jornal USP
   - páginas externas
   - oEmbed de artigos
   - outros sites

   Permanecem dentro da coluna normal.
========================================================== */

body[data-prefix$="_item_single"]
.tainacan-item-section__metadata
.metadata-type-url:not(
    :has(
        iframe[src*="youtube.com/embed/"],
        iframe[src*="youtube-nocookie.com/embed/"],
        iframe[src*="player.vimeo.com/"]
    )
)
iframe {
    width: 100%;

    max-width: 100%;

    height: auto;
}


/* ==========================================================
   BLOCKQUOTES DE OEMBED

   Alguns sites, como o Jornal da USP, retornam:
   blockquote + iframe.

   Esses conteúdos NÃO devem receber largura total.
========================================================== */

body[data-prefix$="_item_single"]
.metadata-type-url
blockquote.wp-embedded-content {
    max-width: 100%;

    margin-top: 0;
    margin-left: 0;
    margin-right: 0;
}


/* ==========================================================
   RESPONSIVIDADE
========================================================== */

@media (max-width: 999.98px) {

    body[data-prefix$="_item_single"]
    .tainacan-item-section__metadata {
        --metadata-column-width: 180px;
    }

}


@media (max-width: 689.98px) {

    body[data-prefix$="_item_single"]
    .tainacan-item-section__metadata {
        --metadata-column-width: 100%;
    }


    /*
     Em telas pequenas, qualquer metadado já deve ocupar
     naturalmente toda a largura.
    */
    body[data-prefix$="_item_single"]
    .tainacan-item-section__metadata
    .metadata-type-url:has(
        iframe[src*="youtube.com/embed/"],
        iframe[src*="youtube-nocookie.com/embed/"],
        iframe[src*="player.vimeo.com/"]
    ) {
        width: 100% !important;
        margin-top: 20px;
        margin-bottom: 20px;
    }

}