/*
 * 121Corp Hub design tokens.
 * Colors measured directly from the canonical reference (hub121.png,
 * 1536x1024): --hub-navy-900, --hub-navy-800, --hub-bg, --hub-primary,
 * --hub-success-bg, --hub-info-bg. Every text/background pairing below has
 * been contrast-checked (WCAG AA, 4.5:1) rather than assumed - see the
 * Milestone 2 report for the computed ratios.
 */

:root {
	/* Surfaces */
	--hub-navy-900: #0A1830;
	--hub-navy-800: #0E1B2E;
	--hub-bg: #F5F8FB;
	--hub-surface: #FFFFFF;

	/* Action */
	--hub-primary: #024DE1;
	--hub-primary-hover: #0140BD;

	/* Text */
	--hub-text-primary: #101828;
	--hub-text-secondary: #344054;
	--hub-text-muted: #5E6C82;
	--hub-text-on-navy: #E7ECF5;
	--hub-text-muted-on-navy: #93A2BD;

	/* Borders */
	--hub-border: #E4E9F0;
	--hub-border-on-navy: rgba(255, 255, 255, 0.12);

	/* Status/semantic */
	--hub-success-bg: #D5F3E1;
	--hub-success-text: #0F6B3F;
	--hub-info-bg: #D8E9FD;
	--hub-info-text: #0B3E9A;
	--hub-neutral-bg: #E7EAF0;
	--hub-neutral-text: #475467;
	--hub-danger-bg: #FDECEC;
	--hub-danger-text: #B42318;
	--hub-warning-bg: #FDF2D8;
	--hub-warning-text: #8A5A00;

	/* Radii */
	--hub-radius-sm: 8px;
	--hub-radius-md: 12px;
	--hub-radius-lg: 16px;
	--hub-radius-pill: 999px;

	/* Shadows */
	--hub-shadow-card: 0 1px 2px rgba(16, 24, 40, 0.06), 0 1px 3px rgba(16, 24, 40, 0.08);
	--hub-shadow-lg: 0 12px 32px rgba(10, 24, 48, 0.18);

	/* Spacing scale (8px base) */
	--hub-space-1: 4px;
	--hub-space-2: 8px;
	--hub-space-3: 12px;
	--hub-space-4: 16px;
	--hub-space-5: 24px;
	--hub-space-6: 32px;
	--hub-space-7: 48px;
	--hub-space-8: 64px;

	/* Layout - proportions measured at the 1536x1024 reference:
	   sidebar 256/1536 = 16.67%, hero 250/1024 = 24.4%. Implemented as a
	   fixed-width sidebar + fluid content (the correct pattern for an app
	   shell), not literal percentages of an arbitrary viewport. */
	--hub-sidebar-width: 272px;
	--hub-hero-min-height: 240px;
	--hub-content-max: 1280px;
	--hub-content-gutter: 32px;

	/* Typography */
	--hub-font: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
	--hub-text-hero: clamp(28px, 3vw, 40px);
	--hub-text-h2: 22px;
	--hub-text-h3: 17px;
	--hub-text-body: 14px;
	--hub-text-small: 13px;
	--hub-text-micro: 11px;

	/* Focus */
	--hub-focus-ring: 0 0 0 2px var(--hub-surface), 0 0 0 4px var(--hub-primary);
}
