/* Caderno Zero Suite — design tokens (P3 §4). A single source of truth for
   color/typography/spacing/radius/shadow custom properties. Components read
   these with a literal fallback matching the pre-P3 hardcoded value, so a
   site that never loads this file (or an admin who changes nothing) sees an
   identical result. Admin-configured overrides (Aparência screen) are printed
   as a small separate inline <style> — see Templates\Tokens — layered after
   this file, never edited here. */
:root {
	--czs-color-primary: #2563eb;
	--czs-color-primary-dark: #1d4ed8;
	--czs-color-secondary: #0f172a;
	--czs-color-accent: #f59e0b;
	--czs-color-success: #16794c;
	--czs-color-warning: #a15c00;
	--czs-color-danger: #b32020;
	--czs-color-text: #1f2937;
	--czs-color-muted: #6b7280;
	--czs-color-border: rgba(0, 0, 0, .1);
	--czs-color-surface: #ffffff;
	--czs-color-background: #f4f7fb;
	--czs-color-arena: #f97316;

	--czs-font-heading: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
	--czs-font-body: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;

	--czs-container-width: 1200px;
	--czs-reading-width: 720px;

	--czs-radius-small: 8px;
	--czs-radius-medium: 16px;
	--czs-radius-large: 24px;
	--czs-shadow-small: 0 2px 8px rgba(0, 0, 0, .08);
	--czs-shadow-medium: 0 8px 24px rgba(0, 0, 0, .12);

	--czs-space-1: .25rem;
	--czs-space-2: .5rem;
	--czs-space-3: .75rem;
	--czs-space-4: 1rem;
	--czs-space-5: 1.5rem;
	--czs-space-6: 2.5rem;
	--czs-space-8: 4rem;
	--czs-space-10: 6rem;

	/* 1.7.0 design-system aliases (spec §8) — same values as the tokens
	   above under the exact names the redesign spec calls for, so both
	   naming schemes keep working. Never redefine the originals above;
	   add new aliases here instead. */
	--czs-color-primary-hover: var(--czs-color-primary-dark);
	--czs-color-primary-soft: #e8effd;
	--czs-radius-sm: var(--czs-radius-small);
	--czs-radius-md: var(--czs-radius-medium);
	--czs-radius-lg: var(--czs-radius-large);
	--czs-shadow-sm: var(--czs-shadow-small);
	--czs-shadow-md: var(--czs-shadow-medium);
	--czs-content-width: var(--czs-reading-width);
	--czs-sidebar-width: 280px;
}

@media (prefers-reduced-motion: reduce) {
	:root { --czs-motion-safe: 0; }
}

.czs-container {
	max-width: var(--czs-container-width, 1200px);
	margin-left: auto;
	margin-right: auto;
	padding-left: var(--czs-space-4);
	padding-right: var(--czs-space-4);
}

.czs-reading {
	max-width: var(--czs-reading-width, 720px);
	margin-left: auto;
	margin-right: auto;
}
.czs-reading table { display: block; overflow-x: auto; }
.czs-reading img, .czs-reading table, .czs-reading iframe { max-width: 100%; }

/* Institutional/legal page typography (spec 1.7.0 §36) — layered on top of
   .czs-reading, only applied where the theme hasn't already styled these
   elements more specifically (low-specificity selectors on purpose). */
.czs-reading h2 { margin: 2em 0 .6em; font-size: 1.4rem; }
.czs-reading h3 { margin: 1.6em 0 .5em; font-size: 1.15rem; }
.czs-reading p { line-height: 1.7; margin-bottom: 1.1em; }
.czs-reading ul, .czs-reading ol { padding-left: 1.4em; margin-bottom: 1.1em; }
.czs-reading li + li { margin-top: .35em; }
.czs-reading table { border-collapse: collapse; width: 100%; margin-bottom: 1.5em; }
.czs-reading table th, .czs-reading table td { border: 1px solid var(--czs-color-border, rgba(0,0,0,.12)); padding: .5em .75em; text-align: left; }
.czs-reading table th { background: var(--czs-color-background, #f4f7fb); }

/* Button style variants (Aparência > estilo dos botões), toggled via a body
   class rather than a token — see Templates\Tokens::body_class(). */
body.czs-buttons-outline .czs-btn--primary {
	background: transparent;
	color: var(--czs-color-primary, #2563eb);
	border-color: var(--czs-color-primary, #2563eb);
}
body.czs-buttons-pill .czs-btn { border-radius: 999px; }