/* enrooted colour palette — chapter 3.1 of "enrooted · Grafisk identitet v3.0". Values are canonical; do not re-derive. */ :root{ /* --- Base palette --- */ --navy:#0D1835; /* Enrooted Navy — primary ground */ --turquoise:#00C2CB; /* Enrooted Turkos — leading accent */ --green:#22C55E; /* Enrooted Grön — positive accent */ --orange:#FF7A00; /* Enrooted Orange — energy accent */ --turquoise-dark:#00A0A8; /* Turkos mörk — text & icons on light */ --white:#FFFFFF; --grey-light:#F4F6FA; /* Ljusgrå — sections, cards */ --navy-20:#CFD3DD; /* Navy 20 % — rules, table lines */ --navy-80:#3D4560; /* Navy 80 % — secondary text */ /* Derived navy steps (for elevation on dark surfaces only — never as new brand colours) */ --navy-raised:#141F3E; --navy-line:#26304C; /* Accent alphas — decor and focus rings only */ --turquoise-08:rgba(0,194,203,.08); --turquoise-16:rgba(0,194,203,.16); --turquoise-32:rgba(0,194,203,.32); --white-06:rgba(255,255,255,.06); --white-12:rgba(255,255,255,.12); /* --- Semantic aliases: light surfaces (documents, long-form content) --- */ --surface-page:var(--white); --surface-sunken:var(--grey-light); --surface-card:var(--white); --surface-card-alt:var(--grey-light); --border-subtle:var(--navy-20); --border-strong:var(--navy-80); --text-heading:var(--navy); --text-body:var(--navy-80); --text-strong:var(--navy); --text-muted:var(--navy-80); --text-link:var(--turquoise-dark); --text-on-accent:var(--navy); /* never white on accent — fails contrast */ --accent:var(--turquoise); --accent-quiet:var(--turquoise-dark); --accent-line:var(--turquoise); --positive:var(--green); --energy:var(--orange); --focus-ring:var(--turquoise-dark); /* --- Semantic aliases: dark surfaces (web default theme, product UI, title slides) --- */ --surface-page-dark:var(--navy); --surface-card-dark:var(--navy-raised); --border-subtle-dark:var(--navy-line); --text-heading-dark:var(--white); --text-body-dark:var(--navy-20); --text-muted-dark:rgba(207,211,221,.72); --text-link-dark:var(--turquoise); --focus-ring-dark:var(--turquoise); } /* Dark ground. Put on or any section that sits on navy. Web default per chapter 6.3. */ [data-theme="dark"]{ --surface-page:var(--navy); --surface-sunken:#0A1229; --surface-card:var(--navy-raised); --surface-card-alt:#0A1229; --border-subtle:var(--navy-line); --border-strong:var(--navy-20); --text-heading:var(--white); --text-body:var(--navy-20); --text-strong:var(--white); --text-muted:rgba(207,211,221,.72); --text-link:var(--turquoise); --accent-quiet:var(--turquoise); --focus-ring:var(--turquoise); }