/**
 * Certifyi colour system — the product's own --ent-* tokens, extended for the website (2026-09-18).
 * Source: app/globals.css in the client portal. Consume as hsl(var(--ent-accent-600)) so opacity
 * modifiers keep working: hsl(var(--ent-accent-600) / 0.12).
 *
 * Rules: 600 for anything clickable or readable (5.08:1 on white); 500 for the logo, icons and chart
 * marks only (4.04:1, below AA for body text); 300 on dark grounds only (2.02:1 on white); 900 for hero
 * and footer grounds; severity colours mean risk level and always carry a word or an icon.
 */
:root {
	/* Brand */
	--ent-accent-50: 133.3 27.3% 93.5%;        /* #EAF3EC */
	--ent-accent-100: 134 30% 87%;             /* #D4E8D9 */
	--ent-accent-200: 134 32% 78%;             /* #B5D9BD */
	--ent-accent-300: 135 34% 65%;             /* #87C497 */
	--ent-accent-400: 135 38% 52%;             /* #56B36D */
	--ent-accent-500: 135.5 45.2% 38.6%;       /* #368F4D */
	--ent-accent-600: 135.4 45.3% 33.7%;       /* #2F7D43 */
	--ent-accent-700: 135 46.6% 28.6%;         /* #276B38 */
	--ent-accent-800: 137 49.2% 23.9%;         /* #1F5B30 */
	--ent-accent-900: 138 50% 17%;             /* #164123 */

	/* Neutral */
	--ent-canvas: 150 12.5% 96.9%;             /* #F6F8F7 */
	--ent-surface: 0 0% 100%;                  /* #FFFFFF */
	--ent-surface-sunken: 135 16.7% 95.3%;     /* #F1F5F2 */
	--ent-surface-hover: 140 12% 93.3%;        /* #ECF0ED */
	--ent-border: 145.7 11.1% 87.6%;           /* #DCE3DF */
	--ent-border-strong: 144 10% 80.4%;        /* #C8D2CC */
	--ent-border-emphasis: 144 10% 70%;        /* #ABBAB1 */

	/* Text */
	--ent-text: 154.3 28% 9.8%;                /* #12201A */
	--ent-text-secondary: 150 11.9% 23.1%;     /* #34423B */
	--ent-text-muted: 150 5.9% 39.6%;          /* #5F6B65 */
	--ent-text-absent: 150 7% 54%;             /* #81928A */

	/* Semantic */
	--ent-critical: 4.2 76.5% 40%;             /* #B42318 */
	--ent-high: 16 70% 36%;                    /* #9C3E1C */
	--ent-medium: 38.3 100% 31%;               /* #9E6500 */
	--ent-low: 195 55% 34%;                    /* #276F86 */
	--ent-info: 195 70.9% 31%;                 /* #176B87 */
	--ent-pass: 142 50.6% 31.8%;               /* #287A46 */
	/* Semantic fills and borders (hex, from the palette reference) */
	--ent-critical-subtle: #FDECEA; --ent-critical-border: #EBB1AD;
	--ent-high-subtle: #FCEFEB;     --ent-high-border: #E9BBAA;
	--ent-medium-subtle: #FEF9EE;   --ent-medium-border: #ECC679;
	--ent-low-subtle: #EBF6F9;      --ent-low-border: #AED4E0;
	--ent-info-subtle: #E9F5F9;     --ent-info-border: #A4D0DF;
	--ent-pass-subtle: #EAF6EE;     --ent-pass-border: #ACD8BC;
	--ent-focus-ring: #0C5D97;

	/* Website aliases used by certifyi-ui.css and the raw-HTML (.cfy-page) pages */
	--cfy-green: hsl(var(--ent-accent-600));        /* links, buttons, eyebrows, focus text */
	--cfy-brand: hsl(var(--ent-accent-500));        /* logo, icons, chart marks only */
	--cfy-green-dark: hsl(var(--ent-accent-700));   /* hover and pressed */
	--cfy-green-light: hsl(var(--ent-accent-50));   /* tinted panels, alternating sections */
	--cfy-green-mid: hsl(var(--ent-accent-200));    /* borders on tinted panels */
	--cfy-dark: hsl(var(--ent-accent-900));         /* hero and footer grounds */
	--cfy-dark-2: hsl(var(--ent-accent-800));
	--cfy-mint: hsl(var(--ent-accent-300));         /* on-dark eyebrows and links only */
	--cfy-glow: hsl(var(--ent-accent-500) / 0.45);
	--cfy-canvas: hsl(var(--ent-canvas));
	--cfy-sunken: hsl(var(--ent-surface-sunken));
	--cfy-ink: hsl(var(--ent-text));
	--cfy-text: hsl(var(--ent-text));
	--cfy-text-2: hsl(var(--ent-text-secondary));
	--cfy-muted: hsl(var(--ent-text-muted));
	--cfy-border: hsl(var(--ent-border));
	--cfy-border-strong: hsl(var(--ent-border-strong));
	--cfy-bg: hsl(var(--ent-surface));
}

/* Semantic chips: every status colour carries its word. Foreground on a subtle fill of the same hue. */
.cfy-chip { display: inline-flex; align-items: center; gap: 6px; padding: 2px 8px; font-size: 12px; font-weight: 600; line-height: 1.4; border: 1px solid transparent; }
.cfy-chip-critical { color: hsl(var(--ent-critical)); background: var(--ent-critical-subtle); border-color: var(--ent-critical-border); }
.cfy-chip-high     { color: hsl(var(--ent-high));     background: var(--ent-high-subtle);     border-color: var(--ent-high-border); }
.cfy-chip-medium   { color: hsl(var(--ent-medium));   background: var(--ent-medium-subtle);   border-color: var(--ent-medium-border); }
.cfy-chip-low      { color: hsl(var(--ent-low));      background: var(--ent-low-subtle);      border-color: var(--ent-low-border); }
.cfy-chip-info     { color: hsl(var(--ent-info));     background: var(--ent-info-subtle);     border-color: var(--ent-info-border); }
.cfy-chip-pass     { color: hsl(var(--ent-pass));     background: var(--ent-pass-subtle);     border-color: var(--ent-pass-border); }
:focus-visible { outline: 2px solid var(--ent-focus-ring); outline-offset: 2px; }