/*
Theme Name:  LISA Theme
Theme URI:   https://github.com/JoaoViniciusSanchi/portal_lisa
Description: Tema-filho do Portal LISA (AGIR/UFF). Toda a apresentação vive aqui; nenhuma regra de negócio (essa é responsabilidade do plugin lisa-core). Identidade visual UFF (Azul-UFF #004f9f como cor de ação) + marca LISA (navy e acentos da logo oficial). Bilíngue PT/EN, WCAG 2.1 AA.
Author:      AGIR/UFF — Portal LISA
Template:    twentytwentyfour
Version:     0.24.0
Requires at least: 6.4
Requires PHP: 8.1
License:     GPL-2.0-or-later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: lisa-theme
Domain Path: /languages
*/

/*
 * Fonte de display da marca (Plus Jakarta Sans variável, self-hosted,
 * licença SIL OFL em assets/fonts/OFL.txt). Sem CDN externo — regra do
 * design system. Um único woff2 (latin) cobre todo o português.
 */
@font-face {
	font-family: "Plus Jakarta Sans";
	font-style: normal;
	font-weight: 200 800;
	font-display: swap;
	src: url("assets/fonts/plus-jakarta-sans-var.woff2") format("woff2");
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+20AC, U+2122, U+2212, U+FEFF, U+FFFD;
}

/*
 * Tokens do design system LISA/UFF (ver docs/design-system.md).
 * Duas camadas de identidade:
 *  - Azul-UFF (#004f9f): cor institucional de AÇÃO (botões, links, foco);
 *  - Marca LISA (navy + 5 acentos, extraídos da logo oficial): superfícies
 *    de destaque (hero/footer), decoração e categorização.
 * Regras: nunca depender só de cor para status — sempre ícone + texto;
 * acentos vibrantes são decorativos, texto colorido usa a variante "-ink"
 * (contraste ≥ 4,5:1 sobre branco); amarelo nunca é texto sobre fundo claro.
 */
:root {
	--lisa-primary: #004f9f;
	--lisa-primary-dark: #003a75;
	--lisa-primary-darker: #002850;
	--lisa-primary-light: #2e75c3;
	--lisa-primary-tint: #e6f0fa;
	--lisa-gray-uff: #eaeaea;
	--lisa-white: #ffffff;
	--lisa-gray-100: #f5f6f8;
	--lisa-gray-300: #d3d7dc;
	--lisa-gray-600: #5b6470;
	--lisa-gray-900: #1f2733;
	--lisa-success: #1e7d43;
	--lisa-warning: #b7791f;
	--lisa-danger: #b3261e;
	--lisa-star: #e6a817;

	/* Marca LISA (cores da logo oficial docs/logo_lisa.png) */
	--lisa-navy: #0d1b33;
	--lisa-navy-800: #16294d;
	--lisa-navy-tint: #eef1f6;
	--lisa-accent-teal: #02b9a5;
	--lisa-accent-teal-ink: #017065;
	--lisa-accent-teal-tint: #e0f7f4;
	--lisa-accent-coral: #f96a6c;
	--lisa-accent-coral-ink: #ba3a3c;
	--lisa-accent-coral-tint: #fee9e9;
	--lisa-accent-yellow: #f5cd2f;
	--lisa-accent-yellow-ink: #8a6d00;
	--lisa-accent-yellow-tint: #fdf5d7;
	--lisa-accent-blue: #235aff;
	--lisa-accent-blue-ink: #1e4ed8;
	--lisa-accent-blue-tint: #e8edff;
	--lisa-accent-purple: #8b41ff;
	--lisa-accent-purple-ink: #6f2fd8;
	--lisa-accent-purple-tint: #f2eaff;

	/* Tipografia — decisão do design v2 (confirmada): Plus Jakarta Sans em
	   TODO o texto, corpo incluído ("display + body"), não só em títulos.
	   A pilha base já parte da fonte da marca; --lisa-font-display permanece
	   como alias semântico para componentes de display. */
	--lisa-font: "Plus Jakarta Sans", -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
	--lisa-font-display: "Plus Jakarta Sans", -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
	--lisa-text-sm: 0.875rem;
	--lisa-text-base: 1rem;
	--lisa-text-lg: 1.125rem;
	--lisa-text-xl: 1.375rem;
	--lisa-text-2xl: 1.75rem;
	--lisa-text-3xl: 2.25rem;
	--lisa-display: clamp(2.25rem, 5vw + 1rem, 3.5rem);
	--lisa-leading-tight: 1.15;
	--lisa-leading-normal: 1.5;

	/* Espaçamento (escala de 4px).
	   --lisa-space-5 e --lisa-space-10 faltavam aqui, embora o protótipo
	   aprovado (docs/prototipos/adm-dash.html) os declare e três folhas do
	   tema já os usassem. Uma var indefinida invalida a DECLARAÇÃO INTEIRA,
	   não só o valor faltante: `margin: var(--lisa-space-6) auto
	   var(--lisa-space-10)` virava margin 0 e o painel /adm_dash perdia a
	   centralização; `padding: var(--lisa-space-4) var(--lisa-space-5)`
	   virava padding 0 e os cards de KPI ficavam com o texto colado na
	   borda. (O mesmo defeito já tinha sido diagnosticado — e contornado com
	   literais — em lisa-feedback.css; a correção certa era esta.) */
	--lisa-space-1: 0.25rem;
	--lisa-space-2: 0.5rem;
	--lisa-space-3: 0.75rem;
	--lisa-space-4: 1rem;
	--lisa-space-5: 1.25rem;
	--lisa-space-6: 1.5rem;
	--lisa-space-8: 2rem;
	--lisa-space-10: 2.5rem;
	--lisa-space-12: 3rem;
	--lisa-space-16: 4rem;
	--lisa-space-20: 5rem;

	/* Forma */
	--lisa-radius: 12px;
	--lisa-radius-btn: 8px;
	--lisa-radius-lg: 20px;
	--lisa-radius-full: 999px;
	--lisa-focus: 0 0 0 3px #2e75c3;

	/* Sombras em camadas (--lisa-shadow mantido como alias legado) */
	--lisa-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);
	--lisa-shadow-sm: 0 1px 2px rgba(13, 27, 51, 0.06), 0 1px 3px rgba(13, 27, 51, 0.08);
	--lisa-shadow-md: 0 4px 8px rgba(13, 27, 51, 0.08), 0 2px 4px rgba(13, 27, 51, 0.06);
	--lisa-shadow-lg: 0 12px 24px rgba(13, 27, 51, 0.12), 0 4px 8px rgba(13, 27, 51, 0.06);
	--lisa-shadow-hero: 0 20px 40px rgba(13, 27, 51, 0.25);

	/* Motion (animações apenas em transform/opacity) */
	--lisa-dur-fast: 150ms;
	--lisa-dur-base: 250ms;
	--lisa-dur-slow: 450ms;
	--lisa-ease-out: cubic-bezier(0.22, 1, 0.36, 1);
	--lisa-ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1);
}

/*
 * Acento rotativo por componente: cada elemento com data-accent resolve
 * --acc / --acc-ink / --acc-tint para uma das 5 cores da logo. O valor é
 * derivado de forma estável (hash da área do conhecimento) no PHP.
 */
[data-accent="teal"] {
	--acc: var(--lisa-accent-teal);
	--acc-ink: var(--lisa-accent-teal-ink);
	--acc-tint: var(--lisa-accent-teal-tint);
}

[data-accent="coral"] {
	--acc: var(--lisa-accent-coral);
	--acc-ink: var(--lisa-accent-coral-ink);
	--acc-tint: var(--lisa-accent-coral-tint);
}

[data-accent="yellow"] {
	--acc: var(--lisa-accent-yellow);
	--acc-ink: var(--lisa-accent-yellow-ink);
	--acc-tint: var(--lisa-accent-yellow-tint);
}

[data-accent="blue"] {
	--acc: var(--lisa-accent-blue);
	--acc-ink: var(--lisa-accent-blue-ink);
	--acc-tint: var(--lisa-accent-blue-tint);
}

[data-accent="purple"] {
	--acc: var(--lisa-accent-purple);
	--acc-ink: var(--lisa-accent-purple-ink);
	--acc-tint: var(--lisa-accent-purple-tint);
}

/*
 * Rolagem suave em âncoras (ex.: CTA final → busca do hero). O bloco de
 * prefers-reduced-motion abaixo reverte para `auto` quando o usuário pede.
 */
html {
	scroll-behavior: smooth;
}

/*
 * Acessibilidade: desliga toda animação/transição quando o usuário pede
 * movimento reduzido (WCAG 2.1 — 2.3.3). Vale para o site inteiro.
 */
@media (prefers-reduced-motion: reduce) {
	*,
	*::before,
	*::after {
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.01ms !important;
		scroll-behavior: auto !important;
	}
}

/*
 * Badge de mensagens não lidas [P-34] — usado no cabeçalho ("Meu painel"),
 * na lista /demandas/ e no /painel/. Nunca comunica só por cor: o número é
 * visível e o texto completo vai em .screen-reader-text (WCAG 1.4.1).
 */
.lisa-unread-badge {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 1.25rem;
	height: 1.25rem;
	padding: 0 0.375rem;
	margin-left: 0.375rem;
	font-size: 0.75rem;
	font-weight: 700;
	line-height: 1;
	color: var(--lisa-white);
	background: var(--lisa-danger);
	border-radius: 999px;
	vertical-align: middle;
}