/*
 * CSS do cabeçalho da página de arquivo por autor (author.php). O grid de
 * posts abaixo do cabeçalho reaproveita as mesmas classes de
 * assets/category.css (.post-card, .hero-grid, .pagination-wrapper etc.)
 * — os dois arquivos são enfileirados juntos (is_author()) via
 * functions.php (temanovo_scripts), pra essa página ter a mesma cara do
 * resto do site em vez de reinventar o grid. A classe .category-header
 * no cabeçalho também vem de lá (título com brilho em degradê, contador
 * em pill) — aqui só o necessário pra encaixar avatar + bio do autor.
 */

.author-header-top {
    display: flex;
    align-items: center;
    gap: 24px;
    margin-bottom: 8px;
}

/* Mesmo anel em degradê usado na caixa de autor no fim do post
   (template-parts/content-single.php) — consistência visual entre as
   duas telas onde o autor aparece em destaque. */
.author-header-avatar {
    flex-shrink: 0;
    display: flex;
    border-radius: 50%;
    padding: 4px;
    background: linear-gradient(135deg, var(--tn-color-primary), var(--tn-color-secondary));
}

.author-header-avatar img {
    display: block;
    width: 88px;
    height: 88px;
    border-radius: 50%;
    border: 4px solid #fff;
}

.author-header-info {
    min-width: 0;
}

.author-header-eyebrow {
    display: block;
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--tn-color-muted);
    opacity: 0.75;
    margin-bottom: 4px;
}

/* font-size/weight/cor/sublinhado em degradê do h1 já vêm de
   .category-header h1 (assets/category.css) — só precisa virar flex pra
   caber o selo "verificado" do lado do nome. */
.author-header h1 {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 12px;
}

.author-header-bio {
    font-size: 15px;
    line-height: 1.6;
    color: var(--tn-color-muted);
    max-width: 640px;
    margin: 10px 0 0;
    text-align: left;
}

/* Mesmo selo usado na caixa de autor do post (content-single.css) —
   redeclarado aqui porque essa página não carrega aquele arquivo. */
.author-verified {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    font-size: 0.7rem;
    font-weight: 600;
    color: #00a86b;
    background: rgba(0, 168, 107, 0.1);
    padding: 3px 12px;
    border-radius: 30px;
}

.author-verified i {
    font-size: 11px;
}

@media (max-width: 560px) {
    .author-header-top {
        flex-direction: column;
        align-items: flex-start;
        gap: 16px;
    }
}
