/*
 * Eko Atlantic brand colours.
 *
 * The Dreams Core theme ships a green palette. This file re-points the custom properties that palette is built
 * from, so every existing class (badge-solid-primary, icon-chip is-accent, the sidebar, the charts) picks up the
 * logo's blue without a single new utility class and without editing the prebuilt bundle.
 *
 * The theme defines its variables inside `@layer theme`. Anything unlayered beats a layer whatever the source
 * order, so this file wins by being unlayered - it does not depend on being loaded second.
 *
 * Taken from the logo: the bright cyan-blue of the wordmark and the top of the oval (#29abe2, hue 198), and the
 * deeper blue in the oval's gradient (#1b75bb, hue 206). Primary sits between them at hue 202; accent is the
 * lighter, cyan-leaning half at hue 190, which is the same two-tone relationship the logo itself uses.
 *
 * Success, warning and danger are deliberately left alone. They carry meaning rather than brand - a green tick
 * and a red warning have to stay unmistakable, and tinting them towards the brand would cost more than it gained.
 * Info is shifted to indigo so it stays distinct now that the brand itself is blue.
 */

:root,
:host,
[data-theme="light"] {
    /* ---- Primary: the brand blue ---- */
    --color-primary-50: #f2f8fc;
    --color-primary-100: #e1eff6;
    --color-primary-200: #bedef1;
    --color-primary-300: #91caeb;
    --color-primary-400: #61b5e5;
    --color-primary-500: #259ee4;
    --color-primary-600: #1883c1;
    --color-primary-700: #166a9a;
    --color-primary-800: #16567c;
    --color-primary-900: #154865;
    --color-primary-950: #0e2d3f;
    --color-primary: var(--color-primary-600);
    --color-primary-hover: #0f6fa8;
    --color-primary-transparent: #eaf3f9;
    --shadow-glow-primary: 0 8px 24px -6px #1883c159;
    --background-image-primary-gradient: linear-gradient(90deg, #166a9a 0%, #1f9bdd 100%);

    /* ---- Accent: the lighter cyan from the logo's gradient ---- */
    --color-accent-50: #f0fafd;
    --color-accent-100: #dbf2f8;
    --color-accent-200: #b6e6f2;
    --color-accent-300: #86d6e9;
    --color-accent-400: #52c4de;
    --color-accent-500: #21aecd;
    --color-accent-600: #1690ac;
    --color-accent-700: #16748a;
    --color-accent-800: #175f71;
    --color-accent-900: #164f5e;
    --color-accent: var(--color-accent-500);
    --shadow-glow-accent: 0 8px 24px -6px #21aecd4d;

    /* ---- Info: moved to indigo, so it no longer reads as the brand ---- */
    --color-info-50: #eef2fb;
    --color-info-100: #dbe3f7;
    --color-info-200: #bac8ef;
    --color-info-300: #94a9e3;
    --color-info-400: #738ed6;
    --color-info-500: #5674c6;
    --color-info-600: #435ca5;
    --color-info-700: #374a84;
    --color-info-800: #2e3d6b;
    --color-info-900: #283459;
    --color-info: var(--color-info-600);
    --color-info-hover: #3a55b4;
    --color-info-transparent: #eef1fb;
    --shadow-glow-info: 0 8px 24px -6px #5674c659;
    --background-image-info-gradient: linear-gradient(90deg, #9fb0e8 0%, #7a90dc 100%);

    /* ---- Neutrals: the same greys, with the green cast swapped for the brand's cool one ---- */
    --color-neutral-50: #f7f8f9;
    --color-neutral-100: #eff1f3;
    --color-neutral-150: #e4e7ea;
    --color-neutral-200: #d5dbdf;
    --color-neutral-300: #bbc4cb;
    --color-neutral-400: #919ea9;
    --color-neutral-500: #6c7b87;
    --color-neutral-600: #546069;
    --color-neutral-700: #404950;
    --color-neutral-800: #2b3136;
    --color-neutral-900: #1b2024;

    /* ---- Muted text: much darker than the theme's neutral-600 / neutral-500 ---- */
    /* These greys carry the field labels, hints and table sub-text, and the theme's values read too faint.
       Secondary sits halfway between neutral-800 and neutral-900 so it still reads a touch softer than headings. */
    --text-secondary: #23292d;
    --text-tertiary: var(--color-neutral-800);

    /* ---- The sidebar, which is the largest block of colour on every page ---- */
    --sidebar-bg: #0e1e2a;
    --sidebar-bg-active: #16324a;
}

[data-theme="dark"] {
    /* The dark theme keeps the primary ramp above and only re-floors its lightest two stops. */
    --color-primary-50: #132430;
    --color-primary-100: #17303f;
    --color-primary-transparent: #1c2d38;

    --color-accent-50: #0f2730;
    --color-accent-100: #133440;

    --color-info-50: #161d33;
    --color-info-100: #1c2645;
    --color-info-200: #212c51;
    --color-info-300: #27345e;
    --color-info-400: #2c3b6b;
    --color-info-500: #324278;
    --color-info-600: #384a86;
    --color-info-700: #3f5295;
    --color-info-800: #465ba4;
    --color-info-900: #5069b8;
    --color-info-hover: #7e93e0;
    --color-info-transparent: #131a2c;

    /* Muted text goes back to the theme's own light greys - the darker pair above would vanish on a dark page. */
    --text-secondary: var(--color-neutral-300);
    --text-tertiary: var(--color-neutral-400);

    --sidebar-bg: #080f16;
    --sidebar-bg-active: #12222f;
}