/* assets/css/category.css — listagem "Carregar mais" das pages de categoria
   + modo escuro via cookie yootheme_mode (classe abn-dark no <html>).
   Antes: estilos inline claros hardcoded direto no markup do AJAX (30/09). */

/* ── Botão "Carregar mais" ─────────────────────────────────────────────── */
#abn-cat-more-wrap { text-align: center; margin: 22px 0 10px; }
#abn-cat-more-btn {
    padding: 10px 26px;
    border: 1px solid #d8d8d8;
    border-radius: 8px;
    background: #fff;
    color: #444;
    cursor: pointer;
    font-size: 14px;
    font-weight: 600;
    transition: border-color .15s ease, color .15s ease;
}
#abn-cat-more-btn:hover { border-color: #e34b4a; color: #e34b4a; }
#abn-cat-more-btn[disabled] { opacity: .6; cursor: default; }

@media (max-width: 959px) {
}

/* ── DARK (cookie yootheme_mode=dark → html.abn-dark) ────────────────────
   Pinta a page de categoria inteira: fundo, seções padrão do builder e a
   listagem — "o fundo de acordo com a seleção" (Felipe, 30/09). Paleta da
   casa (a mesma do painel e da home escura). */
html.abn-dark body { background: #0b1220; }
html.abn-dark #tm-main,
html.abn-dark .uk-section-default { background: #0b1220; }
html.abn-dark #tm-main h1,
html.abn-dark #tm-main h2,
html.abn-dark #tm-main h3,
html.abn-dark #tm-main .el-title { color: #e2e8f0; }
html.abn-dark #tm-main p,
html.abn-dark #tm-main .el-meta { color: #c2c2c2; }
html.abn-dark .uk-card-default { background: #111a2e; color: #e2e8f0; }
/* divisor do grid da listagem (uk-grid-divider) no dark */
html.abn-dark .uk-grid-divider > :not(.uk-first-column) { border-left-color: #1e293b; }
html.abn-dark .uk-grid-divider.uk-grid-stack > .uk-margin-top { border-top-color: #1e293b; }
html.abn-dark .el-content, html.abn-dark .uk-text-meta { color: #c2c2c2; }


html.abn-dark #abn-cat-more-btn {
    background: #111a2e;
    border-color: #334155;
    color: #cbd5e1;
}
html.abn-dark #abn-cat-more-btn:hover { border-color: #f87171; color: #f87171; }

/* ── Muro 5-por-linha (referência do Felipe, 30/09): card vertical
   compacto — imagem dominante 16:9, kicker-data, título até 3 linhas,
   sem resumo. Denso e flat igual ao bloco de referência. ─────────── */
/* respiro entre blocos de 10 (a cada 2 linhas) — no futuro, anúncio aqui */
.abn-cat-grid + .abn-cat-grid { margin-top: 42px; }
/* margem lateral igual à do uk-container do tema (feed é injetado no main) */
#abn-cat-feed { padding-left: 15px; padding-right: 15px; }
@media (min-width: 640px) { #abn-cat-feed { padding-left: 30px; padding-right: 30px; } }
@media (min-width: 1200px) { #abn-cat-feed { padding-left: 40px; padding-right: 40px; } }
.abn-cat-grid img.el-image {
    width: 100%;
    height: auto;
    aspect-ratio: 16 / 9;
    object-fit: cover;
    border-radius: 6px;
    display: block;
}
.abn-cat-grid .el-title {
    font-size: 1.37rem;
    line-height: 1.35;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
/* sem hover no card (Felipe, 30/09): nada de cinza, nada de sublinhado.
   O estado NORMAL do link herda o cinza claro do título (o patch anterior
   tinha perdido o color:inherit e o <a> caia na cor azul de link global). */
.abn-cat-grid a,
.abn-cat-grid a:hover,
.abn-cat-grid a:visited { text-decoration: none !important; }
.abn-cat-grid .el-title a,
.abn-cat-grid .el-title a:hover,
.abn-cat-grid .el-title a:visited,
.abn-cat-grid .el-title a:any-link,
.abn-cat-grid .el-title.uk-link-heading a,
.abn-cat-grid .el-title.uk-link-heading a:hover,
.abn-cat-grid .el-title:hover,
.abn-cat-grid article:hover {
    color: inherit !important;
    background: transparent !important;
}
.abn-cat-grid .el-meta { font-size: .72rem !important; margin-top: 14px !important; }
/* intro (2 primeiras linhas) + ritmo compacto do print-base (30/09):
   imagem->kicker 4px, kicker->titulo 6px, titulo->intro 6px */
.abn-cat-grid .el-title { margin-top: 6px !important; }
.abn-cat-grid .el-content {
    margin-top: 16px;
    font-size: .95rem;
    line-height: 1.45;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* ── Blindagem total do card (30/09, Felipe: "texto azulado e hover no title
   no bloco novo"): cor EXPLICITA e fundo transparente em TODOS os estados
   dinamicos — hover, focus, focus-visible, active, visited — e nos dois modos.
   Nenhuma origem (tema, UIkit, user-agent) consegue pintar por cima. ── */
.abn-cat-grid .el-title a,
.abn-cat-grid .el-title a:hover,
.abn-cat-grid .el-title a:focus,
.abn-cat-grid .el-title a:focus-visible,
.abn-cat-grid .el-title a:active,
.abn-cat-grid .el-title a:visited,
.abn-cat-grid article,
.abn-cat-grid article:hover,
.abn-cat-grid article:focus,
.abn-cat-grid article:focus-within,
.abn-cat-grid article:active {
    background: transparent !important;
    box-shadow: none !important;
    outline: none !important;
}
.abn-cat-grid .el-title a,
.abn-cat-grid .el-title a:hover,
.abn-cat-grid .el-title a:focus,
.abn-cat-grid .el-title a:focus-visible,
.abn-cat-grid .el-title a:active,
.abn-cat-grid .el-title a:visited { color: inherit !important; text-decoration: none !important; }
html.abn-dark .abn-cat-grid .el-title a,
html.abn-dark .abn-cat-grid .el-title a:hover,
html.abn-dark .abn-cat-grid .el-title a:focus,
html.abn-dark .abn-cat-grid .el-title a:focus-visible,
html.abn-dark .abn-cat-grid .el-title a:active,
html.abn-dark .abn-cat-grid .el-title a:visited { color: #e2e8f0 !important; }
