/*
 * Colour roles module (documents/design/_colour.md).
 *
 * The only production stylesheet allowed to hold palette values. Components
 * never name a colour: they read a public role token (--tmt-colour-*) or use
 * a Tailwind utility from the palette in documents/design/colors.md.
 * tests/test_colour_tokens.py fails on any other colour literal.
 *
 * Layers:
 *   1. Private scale (--tmt-palette-*): the raw values. Only this file reads them.
 *   2. Public roles (--tmt-colour-*): what a colour is for. Everything else reads these.
 *   3. Brand surfaces: the trail ground and the fading accent rule.
 *
 * Loaded on every page through css_loader.py::GLOBAL_STYLESHEETS, immediately
 * before typography.css. Shells with include_global=False (the Report Studio
 * report) restate the values they need. Chart categorical palettes, bank and
 * aggregator colours stay outside the module (plan D-6).
 */

:root {
    /* 1. Private scale --------------------------------------------------- */

    /* Emerald: the brand */
    --tmt-palette-emerald-50: #ecfdf5;
    --tmt-palette-emerald-100: #d1fae5;
    --tmt-palette-emerald-200: #a7f3d0;
    --tmt-palette-emerald-600: #059669;
    --tmt-palette-emerald-700: #047857;
    --tmt-palette-emerald-800: #065f46;
    --tmt-palette-emerald-900: #064e3b;

    /* Slate: Trail thread neutrals */
    --tmt-palette-slate-50: #f8fafc;
    --tmt-palette-slate-100: #f1f5f9;
    --tmt-palette-slate-200: #e2e8f0;
    --tmt-palette-slate-300: #cbd5e1;
    --tmt-palette-slate-400: #94a3b8;
    --tmt-palette-slate-500: #64748b;
    --tmt-palette-slate-700: #334155;
    --tmt-palette-slate-900: #0f172a;

    /* Gray: Tailwind gray, still used by form controls and older cards */
    --tmt-palette-gray-200: #e5e7eb;
    --tmt-palette-gray-300: #d1d5db;
    --tmt-palette-gray-500: #6b7280;
    --tmt-palette-gray-600: #4b5563;
    --tmt-palette-gray-800: #1f2937;
    --tmt-palette-gray-900: #111827;

    /* Amber: attention, changed data, Beta and Concierge */
    --tmt-palette-amber-50: #fffbeb;
    --tmt-palette-amber-200: #fde68a;
    --tmt-palette-amber-500: #f59e0b;
    --tmt-palette-amber-700: #b45309;
    --tmt-palette-amber-800: #92400e;

    /* Rose: errors and destructive actions */
    --tmt-palette-rose-50: #fff1f2;
    --tmt-palette-rose-600: #e11d48;
    --tmt-palette-rose-700: #be123c;

    /* Green: success and positive figures */
    --tmt-palette-green-50: #f0fdf4;
    --tmt-palette-green-600: #16a34a;
    --tmt-palette-green-700: #15803d;

    /* Teal: chart secondary series */
    --tmt-palette-teal-600: #0d9488;

    /* Sky: the information toast (approved in the Toast Styles gallery, plan D-14) */
    --tmt-palette-sky-700: #0369a1;

    /* 2. Public roles ----------------------------------------------------- */

    /* Brand: primary buttons, accents, current-page markers */
    --tmt-colour-brand: var(--tmt-palette-emerald-700);
    --tmt-colour-brand-rgb: 4 120 87;
    --tmt-colour-brand-hover: var(--tmt-palette-emerald-800);
    --tmt-colour-brand-deep: var(--tmt-palette-emerald-900);
    /* Tonal buttons, selected rows, tinted washes */
    --tmt-colour-brand-soft: var(--tmt-palette-emerald-50);
    /* Icon chips and modal identity tiles */
    --tmt-colour-brand-chip: var(--tmt-palette-emerald-100);
    /* Emerald borders and outlines */
    --tmt-colour-brand-line: var(--tmt-palette-emerald-200);

    /* Neutral ink and surfaces (slate) */
    --tmt-colour-ink: var(--tmt-palette-slate-900);
    --tmt-colour-ink-rgb: 15 23 42;
    --tmt-colour-body: var(--tmt-palette-slate-700);
    --tmt-colour-muted: var(--tmt-palette-slate-500);
    /* De-emphasised icons and placeholder text */
    --tmt-colour-subtle: var(--tmt-palette-slate-400);
    --tmt-colour-line-strong: var(--tmt-palette-slate-300);
    --tmt-colour-hairline: var(--tmt-palette-slate-200);
    --tmt-colour-canvas-strong: var(--tmt-palette-slate-100);
    --tmt-colour-canvas: var(--tmt-palette-slate-50);
    --tmt-colour-surface: #ffffff;

    /* Neutral controls (gray) */
    --tmt-colour-control-border: var(--tmt-palette-gray-300);
    --tmt-colour-control-text: var(--tmt-palette-gray-800);
    --tmt-colour-control-icon: var(--tmt-palette-gray-600);
    --tmt-colour-divider: var(--tmt-palette-gray-200);
    --tmt-colour-text: var(--tmt-palette-gray-900);
    --tmt-colour-text-muted: var(--tmt-palette-gray-500);

    /* Attention (amber) */
    --tmt-colour-attention-ink: var(--tmt-palette-amber-800);
    --tmt-colour-attention: var(--tmt-palette-amber-700);
    --tmt-colour-attention-edge: var(--tmt-palette-amber-500);
    --tmt-colour-attention-soft: var(--tmt-palette-amber-50);
    --tmt-colour-attention-line: var(--tmt-palette-amber-200);

    /* Error and destructive (rose) */
    --tmt-colour-error-ink: var(--tmt-palette-rose-700);
    --tmt-colour-error-soft: var(--tmt-palette-rose-50);
    --tmt-colour-destructive: var(--tmt-palette-rose-600);

    /* Success and positive (green) */
    --tmt-colour-success-ink: var(--tmt-palette-green-700);
    --tmt-colour-success: var(--tmt-palette-green-600);
    --tmt-colour-success-soft: var(--tmt-palette-green-50);

    /* Information (the toast info tone only, plan D-14) */
    --tmt-colour-info: var(--tmt-palette-sky-700);

    /* Keyboard focus. Placeholder equal to today's emerald-700 until the
       Focus and Forms verdict (shared design language plan WS-2). */
    --tmt-colour-focus: var(--tmt-palette-emerald-700);

    /* Chart chrome (static/js/colour.js exposes these to charts) */
    --tmt-colour-chart-ink: var(--tmt-colour-ink);
    --tmt-colour-chart-primary: var(--tmt-colour-brand);
    --tmt-colour-chart-secondary: var(--tmt-palette-teal-600);
    --tmt-colour-chart-tertiary: var(--tmt-colour-muted);
    --tmt-colour-chart-alert: var(--tmt-colour-destructive);

    /* Pre-emerald brand, kept at its old values so nothing moves. Only the
       global body link, legacy buttons and tables still read them; WS-2
       (Focus and Forms) retires them. */
    --tmt-colour-legacy-green-primary: #14914a;
    --tmt-colour-legacy-green-light: #25e078;
    --tmt-colour-legacy-green-transparent: #0cf28f33;
    --tmt-colour-legacy-red: #960532;

    /* 3. Brand surfaces --------------------------------------------------- */

    /* The fading emerald-into-teal rule the auth title lockup begins. */
    --tmt-colour-accent-rule: linear-gradient(90deg, rgb(16 185 129 / 0.55), rgb(20 184 166 / 0.12), transparent);
}

/* Brand "trail ground": the deep emerald canvas from the sign-in page
   (sign_in_layout.css::.sign-in-split), shared by the auth-flow rail and the
   emerald promo banners so every emerald surface is the same ground. The
   grain sits on ::before; direct children are lifted above it so links and
   buttons stay clickable. */
.tmt-trail-ground {
    position: relative;
    isolation: isolate;
    background:
        radial-gradient(60% 55% at 88% 8%, rgb(45 212 191 / 0.34) 0%, transparent 60%),
        radial-gradient(55% 60% at 5% 95%, rgb(16 185 129 / 0.42) 0%, transparent 62%),
        linear-gradient(150deg, var(--tmt-palette-emerald-900) 0%, var(--tmt-palette-emerald-800) 38%, var(--tmt-palette-emerald-700) 72%, #0f766e 100%);
}

.tmt-trail-ground::before {
    content: '';
    position: absolute;
    inset: 0;
    z-index: 0;
    opacity: 0.55;
    border-radius: inherit;
    background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noise)' opacity='0.05'/%3E%3C/svg%3E");
    pointer-events: none;
}

.tmt-trail-ground > * {
    position: relative;
    z-index: 1;
}
