/*
Theme Name: Futebol Portenho
Theme URI: https://futebolportenho.com.br/
Description: Tema-filho do Twenty Twenty-Five para o acervo do Futebol Portenho, blog sobre futebol argentino publicado desde 2009.
Author: Futebol Portenho
Author URI: https://futebolportenho.com.br/
Template: twentytwentyfive
Version: 0.1.0
Requires at least: 6.7
Requires PHP: 7.2
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: futebolportenho
Tags: blog, full-site-editing, block-patterns, translation-ready
*/

/* Quadrado âmbar da marca, depois de PORTENHO, alinhado pela base.
   O âmbar fica fora da paleta do editor, por contraste. */
.fp-quadrado {
	flex: 0 0 auto;
	width: clamp(14px, 0.9vw + 10px, 22px);
	height: clamp(14px, 0.9vw + 10px, 22px);
	margin-bottom: 0.14em;
	background-color: var(--wp--custom--cor--ambar);
}

/* Assinatura da marca, empilhada em duas linhas. */
.fp-marca {
	margin: 0;
	text-transform: uppercase;
}

.fp-marca a {
	color: inherit;
	text-decoration: none;
}

/* Bloco da direita: selo e menu, ambos alinhados à direita. */
.fp-cabecalho-direita {
	text-align: right;
}

.fp-selo {
	margin: 0;
}

/* A busca dentro do menu se comporta como mais um item, sem destoar. */
.wp-block-navigation .wp-block-search,
.wp-block-navigation .wp-block-search__inside-wrapper {
	margin: 0;
	padding: 0;
	border: 0;
	background: transparent;
}

/* O botao herda o corpo do proprio bloco de busca, que por padrao e 20px.
   Fixar aqui e o que faz a palavra BUSCAR ter o mesmo tamanho dos outros itens. */
.wp-block-navigation .wp-block-search {
	font-size: 13px;
	line-height: inherit;
}

.wp-block-navigation .wp-block-search__button {
	margin: 0;
	padding: 0;
	border: 0;
	border-radius: 0;
	background: transparent;
	color: inherit;
	font-family: inherit;
	font-size: inherit;
	font-weight: inherit;
	line-height: inherit;
	letter-spacing: inherit;
	text-transform: inherit;
	cursor: pointer;
}

.wp-block-navigation .wp-block-search__button:hover {
	color: var( --wp--preset--color--azul );
}

.wp-block-navigation .wp-block-search__input {
	font-family: var( --wp--preset--font-family--texto );
	font-size: 13px;
	letter-spacing: 0.02em;
}

/* Menu do cabeçalho em uma linha só no computador. */
.fp-menu {
	flex: 0 1 auto;
	min-width: 0;
}

@media ( max-width: 1099px ) {
	.fp-menu .wp-block-navigation__container {
		flex-wrap: wrap;
	}
}

/* Rótulos em caixa alta. */
.fp-rotulo {
	margin: 0;
	text-transform: uppercase;
	letter-spacing: var(--wp--custom--letra--rotulo);
}

/* Rótulo de seção, com o filete âmbar. Único uso do âmbar até aqui. */
.fp-secao {
	padding-bottom: 0.5rem;
	border-bottom: 2px solid var(--wp--custom--cor--ambar);
}

/* Lista numerada das mais lidas. O post-template renderiza ul e li de verdade. */
.fp-numerada .wp-block-post-template {
	list-style: none;
	counter-reset: fp-lidas;
	padding-left: 0;
}

.fp-numerada .wp-block-post {
	display: flex;
	gap: 0.9rem;
	align-items: flex-start;
	counter-increment: fp-lidas;
}

/* Numeral grande em Archivo Black, topo alinhado com a primeira linha do título.
   O line-height 1 aproxima a caixa do glifo, e o recuo acerta a altura de maiúscula. */
.fp-numerada .wp-block-post::before {
	content: counter(fp-lidas);
	flex: 0 0 auto;
	min-width: 1.1em;
	margin-top: -0.06em;
	font-family: var( --wp--preset--font-family--titulo );
	font-size: clamp( 1.75rem, 1.1rem + 1.6vw, 2.25rem );
	font-weight: 400;
	line-height: 1;
	letter-spacing: -0.03em;
	color: var( --wp--preset--color--azul );
}

/* O numeral e a primeira linha do título começam na mesma altura. */
.fp-numerada .wp-block-post-title {
	margin-top: 0;
	margin-bottom: 0;
}

/* As duas listas do fim da home se distribuem na altura da coluna, para fecharem juntas.
   A coluna vira flex para que a lista cresça sem transbordar. */
.fp-col-lidas,
.fp-col-aleatorias {
	display: flex;
	flex-direction: column;
}

.fp-col-lidas .fp-numerada,
.fp-col-aleatorias .fp-horizontal {
	display: flex;
	flex: 1;
	flex-direction: column;
	min-height: 0;
}

.fp-col-lidas .wp-block-post-template,
.fp-col-aleatorias .wp-block-post-template {
	display: flex;
	flex: 1;
	flex-direction: column;
	justify-content: space-between;
	gap: 1.5rem;
	list-style: none;
	padding-left: 0;
	margin: 0;
}

.fp-horizontal .fp-miniatura img {
	width: 72px;
	height: 72px;
	object-fit: cover;
}