/* ==========================================================================
   Console theme: colour tokens
   --------------------------------------------------------------------------
   This file is loaded as-is by partials/base.html.twig. It is NOT compiled by
   Tailwind, so any edit here shows up on the next page reload. There is no
   build step and no need to run `bin/plugin tailwind4 compile`.
   (Clear the Grav cache only if you also changed templates.)

   Tailwind utilities such as bg-primary, text-primary, ring-ring and
   bg-primary/10 read these variables at runtime through the @theme mapping in
   css/site.css.

   Base palette: shadcn zinc, as used by Grav Admin2.
   ========================================================================== */

:root {
	/* ---- Accent: change these two numbers to re-colour the whole site ----
	   Hue 0-360 (234 = indigo, 271 = Grav purple, 221 = blue, 160 = emerald).
	   Saturation 0-100%. Lightness is set per mode below so the accent keeps
	   enough contrast on both the light and the dark background. */
	--accent-hue: 234;
	--accent-saturation: 91%;

	--primary-lightness: 40%;   /* light mode button/link colour */
	--ring-lightness: 50%;      /* light mode focus ring */
}

.dark {
	--primary-lightness: 65%;   /* dark mode button/link colour */
	--ring-lightness: 60%;      /* dark mode focus ring */
}

/* ---- Light mode (default) ---- */
:root {
	color-scheme: light;

	--primary: hsl(var(--accent-hue) var(--accent-saturation) var(--primary-lightness));
	--primary-foreground: hsl(0 0% 100%);
	--ring: hsl(var(--accent-hue) var(--accent-saturation) var(--ring-lightness));

	--background: hsl(0 0% 100%);
	--foreground: hsl(240 10% 3.9%);
	--card: hsl(0 0% 100%);
	--card-foreground: hsl(240 10% 3.9%);
	--popover: hsl(0 0% 100%);
	--popover-foreground: hsl(240 10% 3.9%);
	--secondary: hsl(240 4.8% 95.9%);
	--secondary-foreground: hsl(240 5.9% 10%);
	--muted: hsl(240 4.8% 95.9%);
	--muted-foreground: hsl(240 3.8% 46.1%);
	--accent: hsl(240 4.8% 95.9%);
	--accent-foreground: hsl(240 5.9% 10%);
	--destructive: hsl(0 84.2% 60.2%);
	--destructive-foreground: hsl(0 0% 98%);
	--success: hsl(142 71% 40%);
	--success-foreground: hsl(0 0% 100%);
	--warning: hsl(38 92% 48%);
	--warning-foreground: hsl(38 92% 12%);
	--border: hsl(240 5.9% 90%);
	--input: hsl(240 5.9% 90%);
	--radius: 0.5rem;
	--sidebar: hsl(0 0% 98%);
	--sidebar-foreground: hsl(240 5.3% 26.1%);
	--sidebar-border: hsl(220 13% 91%);
	--sidebar-accent: hsl(240 4.8% 95.9%);
	--sidebar-accent-foreground: hsl(240 5.9% 10%);
}

/* ---- Dark mode (the .dark class on <html>, set by the toggle) ---- */
.dark {
	color-scheme: dark;

	--primary-foreground: hsl(0 0% 100%);

	--background: hsl(240 6% 10.6%);
	--foreground: hsl(0 0% 98%);
	--card: hsl(240 4.5% 13%);
	--card-foreground: hsl(0 0% 98%);
	--popover: hsl(240 4.5% 14.5%);
	--popover-foreground: hsl(0 0% 98%);
	--secondary: hsl(240 3.7% 15.9%);
	--secondary-foreground: hsl(0 0% 98%);
	--muted: hsl(240 3.7% 15.9%);
	--muted-foreground: hsl(240 5% 64.9%);
	--accent: hsl(240 3.7% 15.9%);
	--accent-foreground: hsl(0 0% 98%);
	--destructive: hsl(0 62.8% 30.6%);
	--destructive-foreground: hsl(0 0% 98%);
	--success: hsl(142 60% 45%);
	--success-foreground: hsl(0 0% 100%);
	--warning: hsl(38 90% 55%);
	--warning-foreground: hsl(38 92% 10%);
	--border: hsl(240 4% 20%);
	--input: hsl(240 4% 22%);
	--sidebar: hsl(240 5.9% 10%);
	--sidebar-foreground: hsl(240 4.8% 95.9%);
	--sidebar-border: hsl(240 3.7% 15.9%);
	--sidebar-accent: hsl(240 3.7% 15.9%);
	--sidebar-accent-foreground: hsl(0 0% 98%);
}

/* --primary and --ring are declared once on :root and read --primary-lightness /
   --ring-lightness, which .dark overrides. Because custom properties resolve on
   the element where they are used, .dark must redeclare them for the new
   lightness to take effect inside it. */
.dark {
	--primary: hsl(var(--accent-hue) var(--accent-saturation) var(--primary-lightness));
	--ring: hsl(var(--accent-hue) var(--accent-saturation) var(--ring-lightness));
}