/**
 * Comece Imperfeito — archive.css
 *
 * Listagens: categorias, tags, autor e resultados de busca. Carregado
 * apenas nessas páginas e consome somente tokens de tokens.css.
 *
 * Índice
 *  1. Estrutura
 *  2. Cabeçalho
 *  3. Subtemas
 *  4. Busca
 *  5. Estado vazio
 *  6. Outros temas
 */

/* 1. Estrutura ----------------------------------------------------------- */

/* Substitui as larguras em degraus e o padding de 10px do theme.css do Hello. */
body:is(.archive, .search) .site-main.ci-archive {
	width: 100%;
	max-width: none;
	padding-inline: 0;
	padding-block: var(--ci-space-8) var(--ci-space-section);
}

/* 2. Cabeçalho ----------------------------------------------------------- */

.ci-archive__header {
	margin-block-end: var(--ci-space-7);
	padding-block-end: var(--ci-space-4);
	border-block-end: var(--ci-border-width) solid var(--ci-color-border);
}

.ci-archive__eyebrow {
	margin-block: 0 var(--ci-space-3);
	color: var(--ci-color-text-secondary);
	font-size: var(--ci-text-sm);
	font-weight: var(--ci-weight-medium);
	line-height: var(--ci-leading-snug);
}

.ci-archive__eyebrow a {
	color: inherit;
}

.ci-archive__eyebrow a:hover {
	color: var(--ci-color-text);
	text-decoration-line: underline;
}

.ci-archive__title {
	margin-block: 0 var(--ci-space-4);
}

.ci-archive__lead {
	max-width: 40rem;
	margin-block: 0 var(--ci-space-4);
	color: var(--ci-color-text-secondary);
	font-size: var(--ci-text-lg);
	line-height: var(--ci-leading-normal);
}

.ci-archive__meta {
	margin-block: 0 var(--ci-space-2);
	color: var(--ci-color-text-tertiary);
	font-size: var(--ci-text-xs);
	line-height: var(--ci-leading-normal);
}

/* 3. Subtemas ------------------------------------------------------------ */

.ci-subnav {
	margin-block-start: var(--ci-space-5);
}

.ci-subnav__list {
	display: flex;
	flex-wrap: wrap;
	gap: 0 var(--ci-space-5);
	margin: 0;
	padding: 0;
	list-style: none;
}

.ci-subnav__list a {
	display: inline-block;
	padding-block: var(--ci-space-2);
	color: var(--ci-color-text-secondary);
	font-size: var(--ci-text-sm);
	font-weight: var(--ci-weight-medium);
	line-height: var(--ci-leading-snug);
	text-underline-offset: 0.5em;
}

.ci-subnav__list a:hover {
	color: var(--ci-color-text);
	text-decoration-line: underline;
}

/* Subtema atual: indicado pelo sublinhado espesso, não só pela cor. */
.ci-subnav__list a[aria-current="page"] {
	color: var(--ci-color-text);
	text-decoration-line: underline;
	text-decoration-color: currentColor;
	text-decoration-thickness: calc(var(--ci-border-width) * 2);
}

/* 4. Busca (o componente .ci-search fica em base.css) --------------------- */

/* 5. Estado vazio -------------------------------------------------------- */

.ci-archive__empty {
	max-width: 40rem;
	color: var(--ci-color-text-secondary);
	font-size: var(--ci-text-lg);
}

/* 6. Outros temas -------------------------------------------------------- */

.ci-archive__topics {
	margin-block-start: var(--ci-space-section);
}

.ci-archive__topics-title {
	margin-block: 0 var(--ci-space-5);
	font-size: var(--ci-text-xl);
}

/* Os links de temas (.ci-topic-links) ficam em base.css. */