/*
 * eIFU design tokens — sourced from the Figma file ("07 — Screens v4").
 * Exposed as CSS custom properties so components stay on-design.
 */

:root {
	/* Brand (Medtron magenta) */
	--eifu-brand-100: #fee6f0; /* tint: badges, icon backgrounds */
	--eifu-brand-600: #f2278f; /* accent: links, eyebrows, tabs, eIFU label */
	--eifu-brand-700: #e4007b; /* buttons (primary fill) */
	--eifu-brand-800: #a8005c; /* primary hover, REF number */

	/* Neutrals (slate scale) */
	--eifu-neutral-0:   #ffffff;
	--eifu-neutral-50:  #f8fafc;
	--eifu-neutral-100: #f1f5f9;
	--eifu-neutral-200: #e2e8f0;
	--eifu-neutral-300: #cbd5e1;
	--eifu-neutral-400: #94a3b8;
	--eifu-neutral-500: #64748b;
	--eifu-neutral-600: #475569;
	--eifu-neutral-700: #334155;
	--eifu-footer:      #707070;

	/* Semantic aliases */
	--eifu-color-text:        var(--eifu-neutral-600);
	--eifu-color-text-muted:  var(--eifu-neutral-500);
	--eifu-color-heading:     var(--eifu-footer);
	--eifu-color-bg:          var(--eifu-neutral-50);
	--eifu-color-surface:     var(--eifu-neutral-0);
	--eifu-color-border:       var(--eifu-neutral-200);
	--eifu-color-border-input: var(--eifu-neutral-300);
	--eifu-color-primary:     var(--eifu-brand-600);
	--eifu-color-primary-700: var(--eifu-brand-700);
	--eifu-color-btn:         var(--eifu-brand-700);
	--eifu-color-btn-hover:   var(--eifu-brand-800);
	--eifu-color-on-primary:  #ffffff;
	--eifu-color-info-bg:     #eef2ff;
	--eifu-color-info-text:   var(--eifu-neutral-700);

	/* Typography */
	--eifu-font-sans: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
	--eifu-fs-xs:   0.75rem;   /* 12 */
	--eifu-fs-sm:   0.875rem;  /* 14 */
	--eifu-fs-base: 1rem;      /* 16 */
	--eifu-fs-lg:   1.125rem;  /* 18 */
	--eifu-fs-xl:   1.5rem;    /* 24 */
	--eifu-fs-2xl:  2rem;      /* 32 */
	--eifu-fs-3xl:  2.5rem;    /* 40 */
	--eifu-fs-hero: clamp(2rem, 5.2vw, 3.5rem); /* 32 → 56 (responsive) */
	--eifu-lh-tight: 1.2;
	--eifu-lh-base:  1.6;
	--eifu-fw-normal:   400;
	--eifu-fw-medium:   500;
	--eifu-fw-semibold: 600;
	--eifu-fw-bold:     700;

	/* Spacing scale (4px base) */
	--eifu-space-1: 0.25rem;
	--eifu-space-2: 0.5rem;
	--eifu-space-3: 0.75rem;
	--eifu-space-4: 1rem;
	--eifu-space-5: 1.5rem;
	--eifu-space-6: 2rem;
	--eifu-space-7: 3rem;
	--eifu-space-8: 4rem;

	/* Radii */
	--eifu-radius-sm: 4px;
	--eifu-radius-md: 6px;
	--eifu-radius:    8px;
	--eifu-radius-pill: 999px;

	/* Layout */
	--eifu-container: 1280px;
	--eifu-container-pad: var(--eifu-space-5);

	/* Elevation */
	--eifu-shadow-sm: 0 1px 2px rgba(15, 23, 42, 0.06);
	--eifu-shadow:    0 4px 16px rgba(15, 23, 42, 0.08);

	/* Focus ring */
	--eifu-focus: 0 0 0 3px rgba(242, 39, 143, 0.35);
}

/* Breakpoints are documented here for reference; used as @media literals.
   Mobile 375 (base) · Tablet 768 · Desktop 1280. */