/*
 * Tokens do layout novo do Admin (ui-v2).
 * Carregado só quando o <html> tem a classe `ui-v2` (ver includes/layout-v2.php e includes/head.php).
 * Claro = direção "Vidro"; escuro = direção "Noturno", acionada pelo mesmo `body.dark-theme` do clássico.
 * Os tokens ficam no <body> para que o tema escuro, que é uma classe do body, possa redefini-los.
 */
html.ui-v2 body {
	/* Tipografia */
	--ui-font: "Geist", ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;
	--ui-font-mono: "Geist Mono", ui-monospace, SFMono-Regular, Menlo, monospace;
	--ui-text-xs: 11.5px;
	--ui-text-sm: 12.5px;
	--ui-text-md: 13.5px;
	--ui-text-lg: 15px;
	--ui-title-sm: 18px;
	--ui-title-md: 24px;

	/* Movimento: curto e discreto; zerado com prefers-reduced-motion (feedback.css) */
	--ui-ease: cubic-bezier(0.2, 0.8, 0.2, 1);
	--ui-ease-sai: cubic-bezier(0.4, 0, 1, 1);
	--ui-dur-1: 120ms;
	--ui-dur-2: 180ms;
	--ui-dur-3: 260ms;

	/* Formas */
	--ui-radius-lg: 18px;
	--ui-radius-md: 11px;
	--ui-radius-sm: 7px;
	--ui-radius-pill: 999px;

	/* Superfícies e texto */
	--ui-bg: #edf2f1;
	--ui-bg-image:
		radial-gradient(1100px 620px at 0% 0%, #c4ebe6 0%, transparent 58%),
		radial-gradient(900px 520px at 100% 0%, #fde2cd 0%, transparent 52%),
		radial-gradient(900px 700px at 65% 100%, #d6e5f4 0%, transparent 58%);
	--ui-text: #10201f;
	--ui-text-muted: #566a68;
	--ui-text-faint: #8a9d9b;
	--ui-line: rgba(20, 60, 58, 0.09);
	--ui-surface: rgba(255, 255, 255, 0.82);
	--ui-surface-solid: #ffffff;
	--ui-surface-hover: rgba(23, 143, 137, 0.07);
	--ui-input: rgba(255, 255, 255, 0.72);
	--ui-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.95), 0 10px 30px -8px rgba(30, 70, 68, 0.14);

	/* Vidro: só para a moldura (menu, barra superior, barras flutuantes, navegação inferior) */
	--ui-glass: rgba(255, 255, 255, 0.5);
	--ui-glass-edge: rgba(255, 255, 255, 0.8);
	--ui-glass-blur: blur(28px) saturate(175%);

	/* Marca e estados.
	 * --ui-brand é o teal da identidade Agile (#40b2ae): preenchimentos, botões primários, destaques e foco.
	 * --ui-accent é o mesmo teal escurecido, só para texto e links sobre fundo claro (#40b2ae não atinge
	 * contraste AA como texto). Nenhuma tela deve introduzir outro tom de primária. */
	--ui-brand: #40b2ae;
	--ui-brand-ink: #ffffff;
	--ui-brand-soft: rgba(64, 178, 174, 0.14);
	--ui-accent: #178f89;
	--ui-accent-ink: #ffffff;
	--ui-accent-soft: rgba(64, 178, 174, 0.12);
	--ui-ok: #12805c;
	--ui-ok-soft: rgba(18, 128, 92, 0.11);
	--ui-warn: #9a5b00;
	--ui-warn-soft: rgba(214, 140, 20, 0.15);
	--ui-bad: #c2412d;
	--ui-bad-soft: rgba(194, 65, 45, 0.11);
	--ui-info: #2f6fb3;
	--ui-info-soft: rgba(47, 111, 179, 0.11);
	--ui-focus: 0 0 0 3px rgba(64, 178, 174, 0.3);
}

html.ui-v2 body.dark-theme {
	--ui-bg: #0a0e0f;
	--ui-bg-image:
		radial-gradient(900px 520px at 12% -10%, rgba(64, 178, 174, 0.24), transparent 62%),
		radial-gradient(760px 520px at 100% 100%, rgba(90, 130, 210, 0.13), transparent 62%);
	--ui-text: #e6eeed;
	--ui-text-muted: #95a5a4;
	--ui-text-faint: #647372;
	--ui-line: rgba(255, 255, 255, 0.075);
	--ui-surface: rgba(255, 255, 255, 0.045);
	--ui-surface-solid: #121a1a;
	--ui-surface-hover: rgba(255, 255, 255, 0.05);
	--ui-input: rgba(255, 255, 255, 0.05);
	--ui-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.07);
	--ui-glass: rgba(255, 255, 255, 0.04);
	--ui-glass-edge: rgba(255, 255, 255, 0.1);
	--ui-glass-blur: blur(24px) saturate(140%);
	--ui-brand: #40b2ae;
	--ui-brand-ink: #052422;
	--ui-brand-soft: rgba(64, 178, 174, 0.16);
	--ui-accent: #5ec8c3;
	--ui-accent-ink: #052422;
	--ui-accent-soft: rgba(64, 178, 174, 0.16);
	--ui-ok: #4ade9a;
	--ui-ok-soft: rgba(74, 222, 154, 0.13);
	--ui-warn: #f5b544;
	--ui-warn-soft: rgba(245, 181, 68, 0.14);
	--ui-bad: #ff7d6a;
	--ui-bad-soft: rgba(255, 125, 106, 0.13);
	--ui-info: #82b4ff;
	--ui-info-soft: rgba(130, 180, 255, 0.13);
	--ui-focus: 0 0 0 3px rgba(79, 209, 201, 0.25);
}

/* Sem suporte a desfoque ou com transparência reduzida pelo sistema: moldura sólida. */
@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
	html.ui-v2 body {
		--ui-glass: var(--ui-surface-solid);
		--ui-glass-blur: none;
	}
}

@media (prefers-reduced-transparency: reduce) {
	html.ui-v2 body {
		--ui-glass: var(--ui-surface-solid);
		--ui-glass-blur: none;
	}
}