/* ============================================================================
   AGI shared design tokens — the canonical AxisGeo theme for portal-hosted apps.

   Include this ONCE, before your own app stylesheet:
       <link rel="stylesheet" href="_content/AGIControls.Blazor/agi-theme.css" />
       <link rel="stylesheet" href="app.css" />

   Everything here is a CSS custom property on :root, so your own sheet can
   override any single token without forking the file. These are the exact names
   the AGIControls.Blazor components read (see STYLING.md) — an app that does not
   define them gets each component's built-in fallback, which is deliberately
   NOT the AGI palette, so a missing include is obvious on sight.

   Values are the Axis Geosystems brand set (BUS Cards sheet). Keep instance apps
   and the portal on the same numbers so they read as one product.
   ============================================================================ */

:root {
    /* — Accent: Axis Geosystems brand teal ————————————————————————————— */
    --accent: #1F7E72;
    --accent-hover: #186154;
    --accent-soft: #E7F1EF;          /* tinted active/hover surface (nav, pills) */
    --accent-on-soft: #14584C;       /* text/icon sitting on the soft surface */

    /* — Brand companions (crosshair-mark ink + slate secondary) ——————————— */
    --brand-ink: #0E2329;
    --brand-slate: #4A5D5F;

    /* — Neutrals: light, near-neutral with a whisper of cool, so the cool teal
         accent sits harmoniously. White panels float on the canvas. ————————— */
    --bg-app: #f5f6f8;               /* page canvas */
    --bg-surface: #ffffff;           /* cards, header, sidebar, panels */
    --bg-subtle: #f1f3f6;            /* zebra/hover rows, table headers, insets */
    --border: #e6e8ec;               /* hairline borders — the DEFAULT border */
    --border-strong: #d6dae1;        /* emphasis borders, input outlines */
    --text: #1a1d24;                 /* near-black, primary copy */
    --text-muted: #616774;           /* secondary copy, labels */
    --text-faint: #97a0ac;           /* disabled, placeholder, timestamps */

    /* — Status. Each has a `-soft` tinted background for badges/alerts. ————— */
    --success: #15803d;
    --success-soft: #e7f3ea;
    --danger: #b4342a;
    --danger-soft: #fbeae7;
    --warning: #b45309;
    --warning-soft: #fdf3e4;

    /* — Shape + depth ————————————————————————————————————————————————— */
    --radius: 10px;
    --radius-sm: 7px;
    --radius-pill: 999px;
    --shadow-sm: 0 1px 2px rgba(19, 24, 33, 0.06);
    --shadow-md: 0 6px 20px -6px rgba(19, 24, 33, 0.14);

    /* One standard height for every interactive form control (inputs, selects,
       buttons, date pickers) so a row of mixed controls lines up. */
    --control-h: 34px;

    /* — Type: sans for UI chrome, serif for display titles/values, mono for
         code and ids. The webfonts are NOT bundled — link them in your host page
         or these gracefully degrade to the system stacks (see STYLING.md). ——— */
    --font-sans: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
    --font-serif: "Source Serif 4", Georgia, "Palatino Linotype", "Iowan Old Style", "Times New Roman", serif;
    --font-mono: "JetBrains Mono", Consolas, Menlo, monospace;
}