/*
Theme Name: NE 2027
Theme URI: https://networkencyclopedia.com/
Description: Child theme do Twenty Twenty-Three para a Network Encyclopedia. Nova identidade visual (Home, artigos, arquivos, A–Z) feita só com blocos nativos, sem plugins adicionais.
Author: Ciberforma, Lda.
Author URI: https://ciberforma.pt/
Template: twentytwentythree
Version: 1.1.0
Requires at least: 6.6
Tested up to: 7.1
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/old-licenses/gpl-2.0.html
Text Domain: ne-2027
*/

/* =========================================================================
   Estilos que o theme.json não cobre (hover, grelhas, sticky, A–Z).
   Mantido pequeno de propósito: ~6 KB, carregado numa única folha.
   ========================================================================= */

/* --- Acessibilidade: foco visível em todo o site --- */
:where(a, button, input, summary):focus-visible {
	outline: 2px solid var(--wp--preset--color--ice);
	outline-offset: 2px;
	border-radius: 4px;
}

/* --- Header ------------------------------------------------------------ */
.ne-header { border-bottom: 1px solid #17384F; }
.ne-header .ne-logo img { display: block; height: 40px; width: auto; }
.ne-header .wp-block-navigation a { color: #D6E3EC; padding: 0.75rem 0.5rem; }
.ne-header .wp-block-navigation a:hover { color: #FFFFFF; text-decoration: underline; }
.ne-header .wp-block-navigation__responsive-container.is-menu-open { background: var(--wp--preset--color--night); }
.ne-header .wp-block-navigation__responsive-container-open,
.ne-header .wp-block-navigation__responsive-container-close { color: #FFFFFF; }
.ne-header .ne-search-link a {
	display: inline-flex; align-items: center; gap: 0.5rem;
	color: #FFFFFF; text-decoration: none;
	border: 1px solid #2A5170; border-radius: 8px; padding: 0.55rem 0.9rem;
}
.ne-header .ne-search-link a:hover { border-color: var(--wp--preset--color--ice); }

/* --- Fundo em grelha (hero e placeholders) ----------------------------- */
.ne-grid-bg {
	background-image:
		linear-gradient(#17384F 1px, transparent 1px),
		linear-gradient(90deg, #17384F 1px, transparent 1px);
	background-size: 24px 24px;
}

/* --- Hero --------------------------------------------------------------- */
.ne-hero .ne-eyebrow { font-family: var(--wp--preset--font-family--plex-mono); letter-spacing: 0.12em; }
.ne-hero .wp-block-search__input {
	height: 56px; border: 0; border-radius: 10px; padding: 0 1.25rem;
	font-size: 1.0625rem; color: var(--wp--preset--color--contrast);
}
.ne-hero .wp-block-search__inside-wrapper { gap: 0.5rem; border: 0; padding: 0; }
.ne-hero .wp-block-search__button {
	height: 56px; margin: 0; border-radius: 10px; padding: 0 1.75rem;
	background: var(--wp--preset--color--ice); color: var(--wp--preset--color--night);
}
.ne-hero .wp-block-search__button:hover { background: #FFFFFF; }
.ne-hero .wp-block-search__input::placeholder { color: #62778A; }
.ne-chips a {
	display: inline-block; margin: 0 0.35rem 0.5rem 0;
	font-family: var(--wp--preset--font-family--plex-mono); font-size: 0.8125rem;
	color: #D6E3EC; text-decoration: none;
	border: 1px solid #2A5170; border-radius: 999px; padding: 0.45rem 0.85rem;
}
.ne-chips a:hover { border-color: var(--wp--preset--color--ice); color: #FFFFFF; }
.ne-hero-art img { width: 100%; max-width: 420px; height: auto; }

/* --- Faixa A–Z ---------------------------------------------------------- */
.ne-az { display: flex; flex-wrap: wrap; gap: 6px; margin: 0; padding: 0; list-style: none; }
.ne-az a {
	display: flex; align-items: center; justify-content: center;
	width: 44px; height: 44px;
	font-family: var(--wp--preset--font-family--plex-mono); font-size: 0.9375rem; font-weight: 600;
	color: var(--wp--preset--color--contrast); text-decoration: none;
	background: #FFFFFF; border: 1px solid #D9E3EB; border-radius: 8px;
}
.ne-az a:hover, .ne-az a:focus-visible { background: var(--wp--preset--color--primary); border-color: var(--wp--preset--color--primary); color: #FFFFFF; }

/* --- Cartões de artigo -------------------------------------------------- */
.ne-card {
	height: 100%; overflow: hidden; background: #FFFFFF;
	border: 1px solid var(--wp--preset--color--line); border-radius: 12px;
	transition: border-color .15s ease;
}
.ne-card:hover { border-color: #93B7CF; }
.ne-card .wp-block-post-featured-image { margin: 0; }
.ne-card .wp-block-post-featured-image img { aspect-ratio: 16 / 9; object-fit: cover; width: 100%; height: auto; display: block; }
.ne-card .wp-block-post-title { margin: 0; }
.ne-cards > li { margin: 0; }
/* artigo sem imagem: fica um bloco em grelha subtil no lugar */
.ne-card .ne-noimg { aspect-ratio: 16 / 9; background-color: #E7EFF5; background-image: linear-gradient(#D3E0EA 1px, transparent 1px), linear-gradient(90deg, #D3E0EA 1px, transparent 1px); background-size: 24px 24px; }

/* lista lateral compacta (Latest) */
.ne-side-list > li { border-bottom: 1px solid var(--wp--preset--color--line); padding: 1rem 0; margin: 0; }
.ne-side-list > li:first-child { padding-top: 0; }
.ne-side-list .wp-block-post-featured-image { flex: 0 0 104px; margin: 0; }
.ne-side-list .wp-block-post-featured-image img { width: 104px; height: 76px; object-fit: cover; border-radius: 8px; }

/* --- Tópicos e percursos ------------------------------------------------ */
.ne-topics { display: grid; grid-template-columns: repeat(auto-fill, minmax(16.5rem, 1fr)); gap: 1.25rem; }
.ne-topic { display: flex; flex-direction: column; gap: 0.9rem; padding: 1.5rem; background: #FFFFFF; border: 1px solid var(--wp--preset--color--line); border-radius: 12px; }
.ne-topic:hover { border-color: #93B7CF; }
.ne-topic__top { display: flex; justify-content: space-between; align-items: center; }
.ne-topic__code { font-family: var(--wp--preset--font-family--plex-mono); font-size: 0.8125rem; font-weight: 600; color: var(--wp--preset--color--night); background: var(--wp--preset--color--ice-soft); border-radius: 6px; padding: 0.3rem 0.6rem; }
.ne-topic__count { font-family: var(--wp--preset--font-family--plex-mono); font-size: 0.8125rem; color: var(--wp--preset--color--muted); }
.ne-topic h3 { margin: 0; font-size: 1.3125rem; }
.ne-topic h3 a { color: var(--wp--preset--color--night); text-decoration: none; }
.ne-topic h3 a:hover { text-decoration: underline; }
.ne-topic ul { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 0.35rem; }
.ne-topic li a { font-size: 0.9375rem; text-decoration: none; }
.ne-topic li a:hover { text-decoration: underline; }

.ne-path ol { list-style: none; margin: 0; padding: 0; counter-reset: ne-step; }
.ne-path li { counter-increment: ne-step; display: flex; align-items: center; gap: 0.85rem; padding: 0.65rem 0; border-top: 1px solid #D9E3EB; }
.ne-path li::before {
	content: counter(ne-step); flex: 0 0 28px; height: 28px; display: flex; align-items: center; justify-content: center;
	font-family: var(--wp--preset--font-family--plex-mono); font-size: 0.8125rem; font-weight: 600;
	color: #FFFFFF; background: var(--wp--preset--color--night); border-radius: 50%;
}
.ne-path li a { color: var(--wp--preset--color--contrast); font-weight: 500; text-decoration: none; }
.ne-path li a:hover { text-decoration: underline; }

/* --- Etiqueta monoespaçada --------------------------------------------- */
.ne-label { font-family: var(--wp--preset--font-family--plex-mono); text-transform: uppercase; letter-spacing: 0.1em; }

/* --- Artigo ------------------------------------------------------------- */
.ne-breadcrumbs { font-size: 0.875rem; color: var(--wp--preset--color--muted); }
.ne-breadcrumbs a { text-decoration: none; }
.ne-breadcrumbs a:hover { text-decoration: underline; }
.ne-meta { font-size: 0.9375rem; color: #44586A; }
.ne-meta .ne-mono { font-family: var(--wp--preset--font-family--plex-mono); font-size: 0.8125rem; }
.ne-meta-sep { color: #B8C7D3; }

.ne-toc { position: sticky; top: 1.5rem; padding: 1.25rem; border: 1px solid var(--wp--preset--color--line); border-radius: 12px; }
.ne-toc__title { margin: 0 0 0.5rem; font-family: var(--wp--preset--font-family--plex-mono); font-size: 0.75rem; font-weight: 600; letter-spacing: 0.1em; color: var(--wp--preset--color--muted); }
.ne-toc ol { list-style: none; margin: 0; padding: 0; }
.ne-toc li a { display: block; padding: 0.35rem 0; font-size: 0.9375rem; line-height: 1.4; color: #3A4F60; text-decoration: none; }
.ne-toc li a:hover { color: var(--wp--preset--color--primary); text-decoration: underline; }
@media (max-width: 781px) { .ne-toc { position: static; } }

/* colunas do artigo: o índice vem depois do conteúdo no HTML (para ser gerado a
   partir dele) mas aparece à esquerda; sem índice, a coluna desaparece */
.ne-article-cols > .ne-col-toc { order: -1; }
.ne-article-cols:not(:has(.ne-toc)) > .ne-col-toc { display: none; }
.ne-article-cols > .ne-col-content { min-width: 0; }
.ne-col-content > * { max-width: 800px; }
.ne-article-image img { background: var(--wp--preset--color--tertiary); border-radius: 12px; }
.ne-title-area h1 { max-width: 920px; }
.ne-az-band { border-bottom: 1px solid var(--wp--preset--color--line); }
.ne-path { background: var(--wp--preset--color--tertiary); border-radius: 14px; padding: 1.75rem; }
.ne-path h3 { margin-top: 0.25rem; margin-bottom: 1rem; }
.ne-footer-bottom { border-top: 1px solid #17384F; padding-top: 1.25rem; margin-top: 2.5rem; font-size: 0.875rem; color: #A9C0D0; }

/* corpo do artigo: letra um pouco maior e ritmo confortável */
.ne-prose { font-size: var(--wp--preset--font-size--article); line-height: 1.7; }
.ne-prose > h2 { margin-top: 2.5rem; scroll-margin-top: 1.5rem; }
.ne-prose > h3 { margin-top: 2rem; }
.ne-prose :where(p, li) code { font-family: var(--wp--preset--font-family--plex-mono); font-size: 0.9em; background: #EDF3F7; padding: 0.1em 0.35em; border-radius: 4px; }
.ne-prose img { border-radius: 10px; }
.ne-prose .wp-block-table { overflow-x: auto; }
.ne-prose .wp-block-table table { border-collapse: collapse; width: 100%; border: 1px solid var(--wp--preset--color--line); }
.ne-prose .wp-block-table :where(th, td) { border: 0; border-bottom: 1px solid var(--wp--preset--color--line); padding: 0.75rem 1rem; text-align: left; vertical-align: top; }
.ne-prose .wp-block-table thead th, .ne-prose .wp-block-table tr:first-child th { background: var(--wp--preset--color--tertiary); font-weight: 600; }
.ne-prose .wp-block-table thead { border-bottom: 0; }
/* entradas antigas usam "* * *" como separador: fica uma linha discreta */
.ne-prose hr, .ne-prose .wp-block-separator { border: 0; border-top: 1px solid var(--wp--preset--color--line); margin: 2rem 0; }

/* Estilo de bloco "Key idea" (Grupo) */
.is-style-ne-key-idea { background: var(--wp--preset--color--ice-soft); border-radius: 12px; padding: 1.5rem 1.75rem; }
.is-style-ne-key-idea::before {
	content: "KEY IDEA"; display: block; margin-bottom: 0.4rem;
	font-family: var(--wp--preset--font-family--plex-mono); font-size: 0.75rem; font-weight: 600; letter-spacing: 0.1em; color: var(--wp--preset--color--primary);
}
.is-style-ne-key-idea > * { margin-top: 0; }

.ne-author-box { border: 1px solid var(--wp--preset--color--line); border-radius: 14px; }
.ne-author-box img { width: 56px; height: 56px; }

/* --- Paginação ---------------------------------------------------------- */
.wp-block-query-pagination a, .wp-block-query-pagination .current { padding: 0.4rem 0.7rem; border-radius: 6px; text-decoration: none; }
.wp-block-query-pagination .current { background: var(--wp--preset--color--night); color: #FFFFFF; }

/* --- Página A–Z completa ----------------------------------------------- */
.ne-az-section { scroll-margin-top: 1.5rem; padding-top: 1rem; border-top: 1px solid var(--wp--preset--color--line); }
.ne-az-section h2 { font-family: var(--wp--preset--font-family--plex-mono); font-size: 1.75rem; margin: 0 0 0.75rem; }
.ne-az-list { columns: 3 16rem; column-gap: 2rem; list-style: none; margin: 0 0 2.5rem; padding: 0; }
.ne-az-list li { break-inside: avoid; padding: 0.2rem 0; font-size: 0.9375rem; }
.ne-az-list a { text-decoration: none; }
.ne-az-list a:hover { text-decoration: underline; }
.ne-az-count { color: var(--wp--preset--color--muted); font-family: var(--wp--preset--font-family--plex-mono); font-size: 0.8125rem; }

/* --- Rodapé ------------------------------------------------------------- */
.ne-footer a { color: #E2EBF1; text-decoration: none; }
.ne-footer a:hover { color: #FFFFFF; text-decoration: underline; }
.ne-footer .ne-logo img { display: block; height: 48px; width: auto; }
.ne-footer .ne-footer-title { font-family: var(--wp--preset--font-family--plex-mono); font-size: 0.75rem; letter-spacing: 0.1em; color: #A9C0D0; margin: 0 0 0.25rem; }
.ne-footer ul { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 0.6rem; font-size: 0.9375rem; }
.ne-footer .ne-social a { display: inline-block; border: 1px solid #2A5170; border-radius: 8px; padding: 0.55rem 0.9rem; font-size: 0.875rem; margin-right: 0.5rem; }

/* --- Movimento reduzido ------------------------------------------------- */
@media (prefers-reduced-motion: reduce) { * { transition: none !important; scroll-behavior: auto !important; } }
html { scroll-behavior: smooth; }

/* --- Pesquisa fora do hero (página de resultados, 404) ------------------ */
.ne-search-page { max-width: 640px; width: 100%; }
.ne-search-page .wp-block-search__inside-wrapper { gap: 0.5rem; border: 0; padding: 0; }
.ne-search-page .wp-block-search__input { height: 52px; border: 1px solid #D9E3EB; border-radius: 10px; padding: 0 1rem; background: #FFFFFF; }
.ne-search-page .wp-block-search__button { height: 52px; margin: 0; border-radius: 10px; padding: 0 1.5rem; }

/* --- Ajustes para ecrãs pequenos --------------------------------------- */
@media (max-width: 781px) {
	.ne-hero-art { display: none; }
}
@media (max-width: 599px) {
	/* no telemóvel o botão de pesquisa fica só com o ícone, ao lado do menu */
	.ne-header .ne-search-link a { font-size: 0; gap: 0; padding: 0.6rem 0.7rem; }
	.ne-header .ne-search-link a svg { width: 18px; height: 18px; }
	.ne-header .ne-logo img { height: 34px; }
}

/* --- Página A–Z: barra de letras fixa ao fazer scroll ------------------ */
.ne-az-index > .ne-az { position: sticky; top: 0; z-index: 2; background: #FFFFFF; padding: 0.75rem 0; margin-bottom: 1.5rem; }
.ne-az-section { scroll-margin-top: 8.5rem; }

/* --- Data nos cartões dos arquivos -------------------------------------- */
.ne-card-date { margin: 0; font-size: 0.875rem; color: var(--wp--preset--color--muted); }

/* --- Header fixo no telemóvel e tablet ---------------------------------
   Nos artigos longos, o menu e a pesquisa ficam sempre à mão. */
@media (max-width: 781px) {
	header.wp-block-template-part { position: sticky; top: 0; z-index: 100; }
	/* títulos e secções não ficam escondidos por baixo do header ao saltar para uma âncora */
	.ne-prose > h2, .ne-prose > h3 { scroll-margin-top: 5rem; }
	/* na página A–Z as letras ficam numa só linha que desliza na horizontal */
	.ne-az-index > .ne-az { top: 64px; flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; margin-inline: calc(var(--wp--style--root--padding-left) * -1); padding-inline: var(--wp--style--root--padding-left); }
	.ne-az-index > .ne-az::-webkit-scrollbar { display: none; }
	.ne-az-index > .ne-az li { flex: 0 0 auto; }
	.ne-az-section { scroll-margin-top: 9rem; }
}
/* entre 601 e 781 px a barra de administração (só para quem tem sessão iniciada) também é fixa */
@media (min-width: 601px) and (max-width: 781px) {
	body.admin-bar header.wp-block-template-part { top: 46px; }
}
