/*
 * publicacoes.css — Estilos para a página /publicacoes/
 * Tema: hello-elementor-child
 *
 * Requer variáveis do child theme (style.css :root):
 *   --ucpa-color-3  (alias de --color-extra-2 / sage mist)
 *   --e-global-color-text
 */

/* ==========================================================================
   LISTAGEM — thumbnail com fundo (mobile)
   .listing_container_thumb_bg é aplicado via CSS class no container Elementor
   ========================================================================== */

@media (min-width: 1140px) {
    .listing_container_thumb_bg * {
        object-position: top;
    }
}

@media (max-width: 1024px) {
    .listing_container_thumb_bg {
        background-color: var(--e-global-color-text);
    }
}

/* ==========================================================================
   DESTAQUE — listing com badge "Em destaque"
   Aplicado via CSS class "listing_destaque" no JetEngine Listing Grid.
   O destaque é 100% data-driven: o marcador `.bit-destaque-flag` é renderizado
   pelo template do item (28187) apenas quando o post tem meta `destaque = 9`,
   via JetEngine Dynamic Visibility (JEDV). O `:has(.bit-destaque-flag)` isola
   os cards destacados sem depender de slug.

   Decisão de design: o card destaque fica VISUALMENTE IGUAL aos demais
   (sem fundo, sem cores invertidas) — o único diferencial é a badge "Em destaque"
   no topo e a ordenação (destaque primeiro). Título/data/botão = estilo normal.

   Cor da badge: Verde escuro / Color Extra 1 (--e-global-color-96a86ed) com
   texto branco. CLAUDE.md: usar sempre var(--e-global-color-*), nunca hex direto.
   ========================================================================== */

/* Ordenação: destaque(s) primeiro */
.listing_destaque .jet-listing-grid__item {
    order: 2;
}

.listing_destaque .jet-listing-grid__item:has(.bit-destaque-flag) {
    order: 1;
}

/* Badge "Em destaque" posicionada acima do container de título.
   .elementor-element-540275a é o container do item no template 28187. */
.listing_destaque .jet-listing-grid__item:has(.bit-destaque-flag) .elementor-element-540275a > .e-con-inner::before {
    content       : "Em destaque";
    position      : absolute;
    top           : -1.6rem;
    left          : 50%;
    transform     : translateX(-50%);
    background    : var(--e-global-color-96a86ed);
    padding       : 2px 6px;
    border-radius : 5px;
    font-size     : 12px;
    font-weight   : bold;
    text-transform: uppercase;
    color         : #FFFFFF;
}