/* =====================================================================================================================
   CARRY-FORWARD CONCESSIONAL CONTRIBUTIONS OPTIMISER  —  THE PALETTE

   CUSTOM PROPERTIES ONLY. shared/css/shell.css holds every rule, every layout and every component; this file
   changes what colour the shell comes out, never how it is built.

   A hundred calculators each free to restyle their own buttons is a hundred stylesheets to maintain and a hundred
   chances to ship something broken on mobile. A hundred calculators that are the same well tested layout in
   different colours is one stylesheet and a palette per tool. Adding a rule here is how that stops being true.

   TWO RULES, BOTH LEARNED THE HARD WAY

     1. ONLY the accent family. Backgrounds, text, borders and shadows belong to shell.css and are already themed
        for both light and dark. Naming one of them here pins it to whichever theme it was written for, because
        this file loads after shell.css and therefore beats its dark block.

     2. Whatever appears in :root MUST also appear in [data-theme="dark"], line for line.

   THE COLOUR. A deep teal-blue. Not a green and not a red: the shell reserves green for money gained and red for
   money lost, on the figures, and an accent in either family puts brand-coloured chrome beside verdict-coloured
   results. Not a purple either — the shell's own ramp is blue to cyan and a purple tool inside it looks like a
   mistake. The rotation and the orb tokens are left on the shell's defaults, which are the domain's sapphire into
   cyan: this accent sits inside that ramp rather than beside it, so the rhythm still reads as one ramp.

   Coded By Darko G.
   ===================================================================================================================== */

:root {
    --gold: #1C6E8C;
    --gold-bright: #2E92B5;
    --gold-light: #86C8DE;
    --gold-text: #145A74;
    --gold-tint: rgba(28, 110, 140, 0.13);
    --gold-tint-line: rgba(28, 110, 140, 0.32);
    --champagne: #E2F0F6;

    --primary: #1C6E8C;
    --accent: #1C6E8C;
    --accent-cyan: #2E92B5;
    --accent-glow: rgba(28, 110, 140, 0.32);

    /* A sweep across two hues, not one colour lightened and darkened. Every stop stays above 4.5:1 against
       --on-accent — ten components put text or an icon directly on this. */
    --gradient-primary: linear-gradient(115deg, #0E4A63 0%, #1C6E8C 46%, #0F7C93 100%);
    --gradient-vivid: linear-gradient(115deg, #0F7C93 0%, #1C6E8C 46%, #0E4A63 100%);

    --border-hover: rgba(28, 110, 140, 0.52);
    --input-focus-glow: rgba(28, 110, 140, 0.18);

    /* Chart 1 only, so the report's primary series matches the brand. Charts 2-7 are held in common across every
       calculator on purpose: they are chosen to stay distinguishable from one another and in greyscale, and
       re-picking them per tool would quietly break that. */
    --chart-1: #17667f;
}

[data-theme="dark"] {
    --gold: #67C0DC;
    --gold-bright: #93D6EC;
    --gold-light: #BFE7F4;
    --gold-text: #93D6EC;
    --gold-tint: rgba(103, 192, 220, 0.16);
    --gold-tint-line: rgba(103, 192, 220, 0.36);
    --champagne: #DFF1F8;

    --primary: #67C0DC;
    --accent: #67C0DC;
    --accent-cyan: #93D6EC;
    --accent-glow: rgba(103, 192, 220, 0.34);

    --gradient-primary: linear-gradient(115deg, #3FA3C6 0%, #67C0DC 46%, #38BDF8 100%);
    --gradient-vivid: linear-gradient(115deg, #38BDF8 0%, #67C0DC 46%, #3FA3C6 100%);

    --border-hover: rgba(103, 192, 220, 0.52);
    --input-focus-glow: rgba(103, 192, 220, 0.20);

    --chart-1: #6fb4cf;
}