/* =============================================================================
   THEME TOKENS — GENERATED FILE, DO NOT EDIT BY HAND
   =============================================================================

   Generated by Blerc.SharedUI.Theming.ThemeCssBuilder from the registered
   ThemeDefinition records. Editing this file directly will be reverted the
   next time it is regenerated, and ThemeStylesheetTests will fail in the
   meantime. To change a colour, change the theme record.

   4 themes x 2 modes x 50 tokens.

   HOW IT WORKS
   ------------
   <html> carries two attributes:

     data-theme="<id>"            which palette   (always present)
     data-mode="light|dark|system" the visitor's choice (absent = none made)

   Each theme block below declares its raw values as --l-<token> and
   --d-<token>. The MODE SWITCH section then maps one of those layers onto
   the plain --<token> names that components and SharedUI.css consume.
   Nothing outside this file should ever reference --l-* or --d-*.

   Precedence, in one place:
     1. data-mode="dark"             -> dark, whatever the device says
     2. data-mode="light"            -> light, whatever the device says
     3. data-mode="system" + device dark -> dark  (the visitor chose Auto)
     4. no data-mode                 -> light  (nobody has chosen: D91)
   ============================================================================= */

/* =============================================================================
   TYPOGRAPHY — theme-independent
   ============================================================================= */
:root {
    --font-ui: 'Archivo', 'Helvetica Neue', Helvetica, sans-serif;
    --font-display: 'Archivo', 'Helvetica Neue', Helvetica, sans-serif;
    --font-mono: ui-monospace, 'Cascadia Code', Consolas, monospace;
}

/* =============================================================================
   STORE BRANDS — theme-independent
   =============================================================================
   The one exception to "every colour is a theme token" (hard rule 8). A store's
   colour is its identity: it must not change when someone picks Halloween.
   Projected from the StoreColor attribute on Enums.Store, which is the same
   source C# reads — see ThemeCssBuilder.AppendStoreBrandTokens.
   ============================================================================= */
:root {
    --store-woolworths: #007A33;
    --store-coles: #E41E26;
    --store-aldi: #1B3774;
    --store-iga: #EC1C24;
    --store-costco: #005DAA;

    /* Brand colour at 8%, for the tinted pill behind a store name. Emitted
       rather than color-mix()'d for the same reason as the other alphas. */
    --brandsoft-woolworths: rgba(0,122,51,0.08);
    --brandsoft-coles: rgba(228,30,38,0.08);
    --brandsoft-aldi: rgba(27,55,116,0.08);
    --brandsoft-iga: rgba(236,28,36,0.08);
    --brandsoft-costco: rgba(0,93,170,0.08);
}


/* =============================================================================
   MODE SWITCH — shared by every theme
   ============================================================================= */

/* Light is the base. Design rule 1: dark text on a light background reads
   measurably better for most people, so it is what an unconfigured visit gets. */
:root {
    color-scheme: light;
    --bg: var(--l-bg);
    --surface: var(--l-surface);
    --border: var(--l-border);
    --field: var(--l-field);
    --fieldBorder: var(--l-fieldBorder);
    --text: var(--l-text);
    --textMut: var(--l-textMut);
    --primary: var(--l-primary);
    --primaryHover: var(--l-primaryHover);
    --onPrimary: var(--l-onPrimary);
    --primaryBtn: var(--l-primaryBtn);
    --onPrimaryBtn: var(--l-onPrimaryBtn);
    --accent: var(--l-accent);
    --onAccent: var(--l-onAccent);
    --accentSoft: var(--l-accentSoft);
    --accentText: var(--l-accentText);
    --savings: var(--l-savings);
    --heroA: var(--l-heroA);
    --heroB: var(--l-heroB);
    --rowBg: var(--l-rowBg);
    --bestBg: var(--l-bestBg);
    --hoverWash: var(--l-hoverWash);
    --cardShadow: var(--l-cardShadow);
    --glow: var(--l-glow);
    --glowSoft: var(--l-glowSoft);
    --searchGlow1: var(--l-searchGlow1);
    --searchGlow2: var(--l-searchGlow2);
    --okSoft: var(--l-okSoft);
    --okText: var(--l-okText);
    --rowBg2: var(--l-rowBg2);
    --shine: var(--l-shine);
    --surfaceAlpha: var(--l-surfaceAlpha);
    --glass: var(--l-glass);
    --logoFilter: var(--l-logoFilter);
    --accentSoftBorder: var(--l-accentSoftBorder);
    --warnSoft: var(--l-warnSoft);
    --warnText: var(--l-warnText);
    --warnStrong: var(--l-warnStrong);
    --infoSoft: var(--l-infoSoft);
    --infoText: var(--l-infoText);
    --errSoft: var(--l-errSoft);
    --errText: var(--l-errText);
    --errStrong: var(--l-errStrong);
    --logBg: var(--l-logBg);
    --logText: var(--l-logText);
    --logMut: var(--l-logMut);
    --logOk: var(--l-logOk);
    --logWarn: var(--l-logWarn);
    --logErr: var(--l-logErr);
    --logInfo: var(--l-logInfo);
    --brandtext-woolworths: var(--l-brandtext-woolworths);
    --brandtext-coles: var(--l-brandtext-coles);
    --brandtext-aldi: var(--l-brandtext-aldi);
    --brandtext-iga: var(--l-brandtext-iga);
    --brandtext-costco: var(--l-brandtext-costco);
}

/* The visitor asked to follow their device, and the device wants dark.
   Scoped to data-mode="system" rather than "anything that isn't light":
   an absent data-mode means nobody has chosen yet, and that resolves to
   light above. Following the device is a choice, not the fallback (D91). */
@media (prefers-color-scheme: dark) {
    :root[data-mode="system"] {
        color-scheme: dark;
        --bg: var(--d-bg);
        --surface: var(--d-surface);
        --border: var(--d-border);
        --field: var(--d-field);
        --fieldBorder: var(--d-fieldBorder);
        --text: var(--d-text);
        --textMut: var(--d-textMut);
        --primary: var(--d-primary);
        --primaryHover: var(--d-primaryHover);
        --onPrimary: var(--d-onPrimary);
        --primaryBtn: var(--d-primaryBtn);
        --onPrimaryBtn: var(--d-onPrimaryBtn);
        --accent: var(--d-accent);
        --onAccent: var(--d-onAccent);
        --accentSoft: var(--d-accentSoft);
        --accentText: var(--d-accentText);
        --savings: var(--d-savings);
        --heroA: var(--d-heroA);
        --heroB: var(--d-heroB);
        --rowBg: var(--d-rowBg);
        --bestBg: var(--d-bestBg);
        --hoverWash: var(--d-hoverWash);
        --cardShadow: var(--d-cardShadow);
        --glow: var(--d-glow);
        --glowSoft: var(--d-glowSoft);
        --searchGlow1: var(--d-searchGlow1);
        --searchGlow2: var(--d-searchGlow2);
        --okSoft: var(--d-okSoft);
        --okText: var(--d-okText);
        --rowBg2: var(--d-rowBg2);
        --shine: var(--d-shine);
        --surfaceAlpha: var(--d-surfaceAlpha);
        --glass: var(--d-glass);
        --logoFilter: var(--d-logoFilter);
        --accentSoftBorder: var(--d-accentSoftBorder);
        --warnSoft: var(--d-warnSoft);
        --warnText: var(--d-warnText);
        --warnStrong: var(--d-warnStrong);
        --infoSoft: var(--d-infoSoft);
        --infoText: var(--d-infoText);
        --errSoft: var(--d-errSoft);
        --errText: var(--d-errText);
        --errStrong: var(--d-errStrong);
        --logBg: var(--d-logBg);
        --logText: var(--d-logText);
        --logMut: var(--d-logMut);
        --logOk: var(--d-logOk);
        --logWarn: var(--d-logWarn);
        --logErr: var(--d-logErr);
        --logInfo: var(--d-logInfo);
        --brandtext-woolworths: var(--d-brandtext-woolworths);
        --brandtext-coles: var(--d-brandtext-coles);
        --brandtext-aldi: var(--d-brandtext-aldi);
        --brandtext-iga: var(--d-brandtext-iga);
        --brandtext-costco: var(--d-brandtext-costco);
    }
}

/* Explicit dark. Last in source order, so it beats the media query above
   on an equal-specificity tie and dark wins on a light device. */
:root[data-mode="dark"] {
    color-scheme: dark;
    --bg: var(--d-bg);
    --surface: var(--d-surface);
    --border: var(--d-border);
    --field: var(--d-field);
    --fieldBorder: var(--d-fieldBorder);
    --text: var(--d-text);
    --textMut: var(--d-textMut);
    --primary: var(--d-primary);
    --primaryHover: var(--d-primaryHover);
    --onPrimary: var(--d-onPrimary);
    --primaryBtn: var(--d-primaryBtn);
    --onPrimaryBtn: var(--d-onPrimaryBtn);
    --accent: var(--d-accent);
    --onAccent: var(--d-onAccent);
    --accentSoft: var(--d-accentSoft);
    --accentText: var(--d-accentText);
    --savings: var(--d-savings);
    --heroA: var(--d-heroA);
    --heroB: var(--d-heroB);
    --rowBg: var(--d-rowBg);
    --bestBg: var(--d-bestBg);
    --hoverWash: var(--d-hoverWash);
    --cardShadow: var(--d-cardShadow);
    --glow: var(--d-glow);
    --glowSoft: var(--d-glowSoft);
    --searchGlow1: var(--d-searchGlow1);
    --searchGlow2: var(--d-searchGlow2);
    --okSoft: var(--d-okSoft);
    --okText: var(--d-okText);
    --rowBg2: var(--d-rowBg2);
    --shine: var(--d-shine);
    --surfaceAlpha: var(--d-surfaceAlpha);
    --glass: var(--d-glass);
    --logoFilter: var(--d-logoFilter);
    --accentSoftBorder: var(--d-accentSoftBorder);
    --warnSoft: var(--d-warnSoft);
    --warnText: var(--d-warnText);
    --warnStrong: var(--d-warnStrong);
    --infoSoft: var(--d-infoSoft);
    --infoText: var(--d-infoText);
    --errSoft: var(--d-errSoft);
    --errText: var(--d-errText);
    --errStrong: var(--d-errStrong);
    --logBg: var(--d-logBg);
    --logText: var(--d-logText);
    --logMut: var(--d-logMut);
    --logOk: var(--d-logOk);
    --logWarn: var(--d-logWarn);
    --logErr: var(--d-logErr);
    --logInfo: var(--d-logInfo);
    --brandtext-woolworths: var(--d-brandtext-woolworths);
    --brandtext-coles: var(--d-brandtext-coles);
    --brandtext-aldi: var(--d-brandtext-aldi);
    --brandtext-iga: var(--d-brandtext-iga);
    --brandtext-costco: var(--d-brandtext-costco);
}

/* =============================================================================
   Blerc (blerc)
   Navy, Blerc blue and a sunny yellow. The everyday look.
   ============================================================================= */
:root[data-theme="blerc"] {
    --theme-dot: #1D5FD6;
    --theme-dot-on: #FDFDFC;
    /* light */
    --l-bg: #F2F4F8;
    --l-surface: #FFFFFF;
    --l-border: #DAE0EA;
    --l-field: #FFFFFF;
    --l-fieldBorder: #858C97;
    --l-text: #121A2B;
    --l-textMut: #4D5869;
    --l-primary: #1D5FD6;
    --l-primaryHover: #164AA8;
    --l-onPrimary: #FFFFFF;
    --l-primaryBtn: #1D5FD6;
    --l-onPrimaryBtn: #FFFFFF;
    --l-accent: #FFC53D;
    --l-onAccent: #121A2B;
    --l-accentSoft: #FFF2CC;
    --l-accentText: #7A5200;
    --l-savings: #0B6B3A;
    --l-heroA: #0F1A33;
    --l-heroB: #F2F4F8;
    --l-rowBg: #E8ECF3;
    --l-bestBg: #E2F3E9;
    --l-hoverWash: rgba(29, 95, 214, .08);
    --l-cardShadow: 0 1px 2px rgba(18, 26, 43, .06), 0 10px 28px rgba(18, 26, 43, .08);
    --l-glow: rgba(29,95,214,0.13);
    --l-glowSoft: rgba(29,95,214,0.12);
    --l-searchGlow1: rgba(29,95,214,0.1);
    --l-searchGlow2: rgba(29,95,214,0.13);
    --l-okSoft: #E2EDE7;
    --l-okText: #0B6B3A;
    --l-rowBg2: #F2F4F8;
    --l-shine: rgba(255,255,255,.55);
    --l-surfaceAlpha: rgba(255,255,255,0.9);
    --l-glass: rgba(255,255,255,0.75);
    --l-logoFilter: none;
    --l-accentSoftBorder: #E2CF9F;
    --l-warnSoft: #FBF1D6;
    --l-warnText: #8A6203;
    --l-warnStrong: #C28A05;
    --l-infoSoft: #E2EEF8;
    --l-infoText: #2A5E8F;
    --l-errSoft: #FDE7E7;
    --l-errText: #A3231F;
    --l-errStrong: #C62828;
    --l-logBg: #0C111C;
    --l-logText: #C1C5C5;
    --l-logMut: #939F9A;
    --l-logOk: #4ADE80;
    --l-logWarn: #FBBF24;
    --l-logErr: #F87171;
    --l-logInfo: #7DB8F0;
    --l-brandtext-woolworths: #007A33;
    --l-brandtext-coles: #E41E26;
    --l-brandtext-aldi: #1B3774;
    --l-brandtext-iga: #E71B23;
    --l-brandtext-costco: #005DAA;

    /* dark */
    --d-bg: #0B1120;
    --d-surface: #131B2E;
    --d-border: #26314A;
    --d-field: #0F1728;
    --d-fieldBorder: #646E85;
    --d-text: #E9EDF5;
    --d-textMut: #A3AEC2;
    --d-primary: #8DB0FF;
    --d-primaryHover: #2E5CC8;
    --d-onPrimary: #0B1120;
    --d-primaryBtn: #3A6FE6;
    --d-onPrimaryBtn: #FFFFFF;
    --d-accent: #FFC53D;
    --d-onAccent: #121A2B;
    --d-accentSoft: #3A2E0A;
    --d-accentText: #FFD772;
    --d-savings: #6FD39B;
    --d-heroA: #060B17;
    --d-heroB: #0B1120;
    --d-rowBg: #1A2338;
    --d-bestBg: #0F2A1D;
    --d-hoverWash: rgba(141, 176, 255, .10);
    --d-cardShadow: 0 1px 2px rgba(0, 0, 0, .4), 0 10px 28px rgba(0, 0, 0, .35);
    --d-glow: rgba(0,0,0,.5);
    --d-glowSoft: rgba(141,176,255,0.14);
    --d-searchGlow1: rgba(141,176,255,0.09);
    --d-searchGlow2: rgba(0,0,0,.55);
    --d-okSoft: #254044;
    --d-okText: #6FD39B;
    --d-rowBg2: #0F1627;
    --d-shine: rgba(255,255,255,.08);
    --d-surfaceAlpha: rgba(19,27,46,0.9);
    --d-glass: rgba(19,27,46,0.75);
    --d-logoFilter: invert(1) hue-rotate(180deg);
    --d-accentSoftBorder: #655321;
    --d-warnSoft: #33290F;
    --d-warnText: #F0CB74;
    --d-warnStrong: #C89A2B;
    --d-infoSoft: #16293A;
    --d-infoText: #8FC4EE;
    --d-errSoft: #3A1B1A;
    --d-errText: #F5A9A6;
    --d-errStrong: #EF6A62;
    --d-logBg: #0E1526;
    --d-logText: #C3C6CD;
    --d-logMut: #969FAD;
    --d-logOk: #4ADE80;
    --d-logWarn: #FBBF24;
    --d-logErr: #F87171;
    --d-logInfo: #7DB8F0;
    --d-brandtext-woolworths: #33955C;
    --d-brandtext-coles: #E94B51;
    --d-brandtext-aldi: #7283A9;
    --d-brandtext-iga: #EF454B;
    --d-brandtext-costco: #478AC2;
}


/* =============================================================================
   Blerc Classic (classic)
   The cyan and black from the first Blerc site.
   ============================================================================= */
:root[data-theme="classic"] {
    --theme-dot: #00AEEF;
    --theme-dot-on: #10141A;
    /* light */
    --l-bg: #F5F6F7;
    --l-surface: #FFFFFF;
    --l-border: #DCDFE3;
    --l-field: #FFFFFF;
    --l-fieldBorder: #858C97;
    --l-text: #141414;
    --l-textMut: #555B62;
    --l-primary: #0A75BA;
    --l-primaryHover: #075A90;
    --l-onPrimary: #FFFFFF;
    --l-primaryBtn: #0A75BA;
    --l-onPrimaryBtn: #FFFFFF;
    --l-accent: #00AEEF;
    --l-onAccent: #141414;
    --l-accentSoft: #DDF4FD;
    --l-accentText: #075A90;
    --l-savings: #0B6B3A;
    --l-heroA: #050505;
    --l-heroB: #F5F6F7;
    --l-rowBg: #ECEEF0;
    --l-bestBg: #E2F3E9;
    --l-hoverWash: rgba(10, 117, 186, .08);
    --l-cardShadow: 0 1px 2px rgba(18, 26, 43, .06), 0 10px 28px rgba(18, 26, 43, .08);
    --l-glow: rgba(10,117,186,0.13);
    --l-glowSoft: rgba(10,117,186,0.12);
    --l-searchGlow1: rgba(10,117,186,0.1);
    --l-searchGlow2: rgba(10,117,186,0.13);
    --l-okSoft: #E2EDE7;
    --l-okText: #0B6B3A;
    --l-rowBg2: #F5F6F7;
    --l-shine: rgba(255,255,255,.55);
    --l-surfaceAlpha: rgba(255,255,255,0.9);
    --l-glass: rgba(255,255,255,0.75);
    --l-logoFilter: none;
    --l-accentSoftBorder: #AED2E5;
    --l-warnSoft: #FBF1D6;
    --l-warnText: #8A6203;
    --l-warnStrong: #C28A05;
    --l-infoSoft: #E2EEF8;
    --l-infoText: #2A5E8F;
    --l-errSoft: #FDE7E7;
    --l-errText: #A3231F;
    --l-errStrong: #C62828;
    --l-logBg: #0D0D0D;
    --l-logText: #C2C5C3;
    --l-logMut: #939F99;
    --l-logOk: #4ADE80;
    --l-logWarn: #FBBF24;
    --l-logErr: #F87171;
    --l-logInfo: #7DB8F0;
    --l-brandtext-woolworths: #007A33;
    --l-brandtext-coles: #E41E26;
    --l-brandtext-aldi: #1B3774;
    --l-brandtext-iga: #E71B23;
    --l-brandtext-costco: #005DAA;

    /* dark */
    --d-bg: #0C0D0E;
    --d-surface: #16181A;
    --d-border: #2B2F33;
    --d-field: #111315;
    --d-fieldBorder: #646E85;
    --d-text: #EDEFF1;
    --d-textMut: #A5ACB3;
    --d-primary: #5CC8F5;
    --d-primaryHover: #0A6AA8;
    --d-onPrimary: #0B1120;
    --d-primaryBtn: #0A75BA;
    --d-onPrimaryBtn: #FFFFFF;
    --d-accent: #00AEEF;
    --d-onAccent: #141414;
    --d-accentSoft: #0B2C3A;
    --d-accentText: #7FD8FA;
    --d-savings: #6FD39B;
    --d-heroA: #000000;
    --d-heroB: #0C0D0E;
    --d-rowBg: #1D2023;
    --d-bestBg: #0F2A1D;
    --d-hoverWash: rgba(92, 200, 245, .10);
    --d-cardShadow: 0 1px 2px rgba(0, 0, 0, .4), 0 10px 28px rgba(0, 0, 0, .35);
    --d-glow: rgba(0,0,0,.5);
    --d-glowSoft: rgba(92,200,245,0.14);
    --d-searchGlow1: rgba(92,200,245,0.09);
    --d-searchGlow2: rgba(0,0,0,.55);
    --d-okSoft: #283D34;
    --d-okText: #6FD39B;
    --d-rowBg2: #111214;
    --d-shine: rgba(255,255,255,.08);
    --d-surfaceAlpha: rgba(22,24,26,0.9);
    --d-glass: rgba(22,24,26,0.75);
    --d-logoFilter: invert(1) hue-rotate(180deg);
    --d-accentSoftBorder: #255264;
    --d-warnSoft: #33290F;
    --d-warnText: #F0CB74;
    --d-warnStrong: #C89A2B;
    --d-infoSoft: #16293A;
    --d-infoText: #8FC4EE;
    --d-errSoft: #3A1B1A;
    --d-errText: #F5A9A6;
    --d-errStrong: #EF6A62;
    --d-logBg: #101113;
    --d-logText: #C6C7C8;
    --d-logMut: #979CA1;
    --d-logOk: #4ADE80;
    --d-logWarn: #FBBF24;
    --d-logErr: #F87171;
    --d-logInfo: #7DB8F0;
    --d-brandtext-woolworths: #2E9258;
    --d-brandtext-coles: #E9464D;
    --d-brandtext-aldi: #7283A9;
    --d-brandtext-iga: #EF3C43;
    --d-brandtext-costco: #4287C0;
}


/* =============================================================================
   Haunted House (haunted)
   Purple and ghostly green for Halloween and the game launch.
   ============================================================================= */
:root[data-theme="haunted"] {
    --theme-dot: #6534D1;
    --theme-dot-on: #FDFDFC;
    /* light */
    --l-bg: #F4F2FA;
    --l-surface: #FFFFFF;
    --l-border: #DDD6EE;
    --l-field: #FFFFFF;
    --l-fieldBorder: #858C97;
    --l-text: #1B1430;
    --l-textMut: #574E6E;
    --l-primary: #6534D1;
    --l-primaryHover: #4E25A8;
    --l-onPrimary: #FFFFFF;
    --l-primaryBtn: #6534D1;
    --l-onPrimaryBtn: #FFFFFF;
    --l-accent: #9BE15D;
    --l-onAccent: #1B1430;
    --l-accentSoft: #E9F8DA;
    --l-accentText: #335D10;
    --l-savings: #0B6B3A;
    --l-heroA: #1A1033;
    --l-heroB: #F4F2FA;
    --l-rowBg: #EAE6F5;
    --l-bestBg: #E2F3E9;
    --l-hoverWash: rgba(101, 52, 209, .08);
    --l-cardShadow: 0 1px 2px rgba(18, 26, 43, .06), 0 10px 28px rgba(18, 26, 43, .08);
    --l-glow: rgba(101,52,209,0.13);
    --l-glowSoft: rgba(101,52,209,0.12);
    --l-searchGlow1: rgba(101,52,209,0.1);
    --l-searchGlow2: rgba(101,52,209,0.13);
    --l-okSoft: #E2EDE7;
    --l-okText: #0B6B3A;
    --l-rowBg2: #F4F2FA;
    --l-shine: rgba(255,255,255,.55);
    --l-surfaceAlpha: rgba(255,255,255,0.9);
    --l-glass: rgba(255,255,255,0.75);
    --l-logoFilter: none;
    --l-accentSoftBorder: #C1D6AE;
    --l-warnSoft: #FBF1D6;
    --l-warnText: #8A6203;
    --l-warnStrong: #C28A05;
    --l-infoSoft: #E2EEF8;
    --l-infoText: #2A5E8F;
    --l-errSoft: #FDE7E7;
    --l-errText: #A3231F;
    --l-errStrong: #C62828;
    --l-logBg: #120D1F;
    --l-logText: #C2C5C5;
    --l-logMut: #949F9A;
    --l-logOk: #4ADE80;
    --l-logWarn: #FBBF24;
    --l-logErr: #F87171;
    --l-logInfo: #7DB8F0;
    --l-brandtext-woolworths: #007A33;
    --l-brandtext-coles: #E41E26;
    --l-brandtext-aldi: #1B3774;
    --l-brandtext-iga: #E71B23;
    --l-brandtext-costco: #005DAA;

    /* dark */
    --d-bg: #100A1E;
    --d-surface: #1A1230;
    --d-border: #33275A;
    --d-field: #140D26;
    --d-fieldBorder: #646E85;
    --d-text: #EEE9FA;
    --d-textMut: #B1A6CC;
    --d-primary: #C4A8FF;
    --d-primaryHover: #5A2EC0;
    --d-onPrimary: #0B1120;
    --d-primaryBtn: #7347E0;
    --d-onPrimaryBtn: #FFFFFF;
    --d-accent: #9BE15D;
    --d-onAccent: #1B1430;
    --d-accentSoft: #1D3010;
    --d-accentText: #B9EE8A;
    --d-savings: #6FD39B;
    --d-heroA: #08040F;
    --d-heroB: #100A1E;
    --d-rowBg: #22183D;
    --d-bestBg: #0F2A1D;
    --d-hoverWash: rgba(196, 168, 255, .10);
    --d-cardShadow: 0 1px 2px rgba(0, 0, 0, .4), 0 10px 28px rgba(0, 0, 0, .35);
    --d-glow: rgba(0,0,0,.5);
    --d-glowSoft: rgba(196,168,255,0.14);
    --d-searchGlow1: rgba(196,168,255,0.09);
    --d-searchGlow2: rgba(0,0,0,.55);
    --d-okSoft: #2B3945;
    --d-okText: #6FD39B;
    --d-rowBg2: #150E27;
    --d-shine: rgba(255,255,255,.08);
    --d-surfaceAlpha: rgba(26,18,48,0.9);
    --d-glass: rgba(26,18,48,0.75);
    --d-logoFilter: invert(1) hue-rotate(180deg);
    --d-accentSoftBorder: #3F5A2B;
    --d-warnSoft: #33290F;
    --d-warnText: #F0CB74;
    --d-warnStrong: #C89A2B;
    --d-infoSoft: #16293A;
    --d-infoText: #8FC4EE;
    --d-errSoft: #3A1B1A;
    --d-errText: #F5A9A6;
    --d-errStrong: #EF6A62;
    --d-logBg: #140D25;
    --d-logText: #C6C2CF;
    --d-logMut: #A098B3;
    --d-logOk: #4ADE80;
    --d-logWarn: #FBBF24;
    --d-logErr: #F87171;
    --d-logInfo: #7DB8F0;
    --d-brandtext-woolworths: #2E9258;
    --d-brandtext-coles: #E84249;
    --d-brandtext-aldi: #7283A9;
    --d-brandtext-iga: #EF3C43;
    --d-brandtext-costco: #4287C0;
}


/* =============================================================================
   Summer (summer)
   Ocean blue and a warm orange for the holidays.
   ============================================================================= */
:root[data-theme="summer"] {
    --theme-dot: #0F6E8C;
    --theme-dot-on: #FDFDFC;
    /* light */
    --l-bg: #FBF7F0;
    --l-surface: #FFFFFF;
    --l-border: #E5DCCB;
    --l-field: #FFFFFF;
    --l-fieldBorder: #858C97;
    --l-text: #1E2A2F;
    --l-textMut: #52626A;
    --l-primary: #0F6E8C;
    --l-primaryHover: #0B556C;
    --l-onPrimary: #FFFFFF;
    --l-primaryBtn: #0F6E8C;
    --l-onPrimaryBtn: #FFFFFF;
    --l-accent: #FF8A3D;
    --l-onAccent: #1E2A2F;
    --l-accentSoft: #FFE8D6;
    --l-accentText: #8A3F0C;
    --l-savings: #0B6B3A;
    --l-heroA: #0E3B4A;
    --l-heroB: #FBF7F0;
    --l-rowBg: #F3EDE2;
    --l-bestBg: #E2F3E9;
    --l-hoverWash: rgba(15, 110, 140, .08);
    --l-cardShadow: 0 1px 2px rgba(18, 26, 43, .06), 0 10px 28px rgba(18, 26, 43, .08);
    --l-glow: rgba(15,110,140,0.13);
    --l-glowSoft: rgba(15,110,140,0.12);
    --l-searchGlow1: rgba(15,110,140,0.1);
    --l-searchGlow2: rgba(15,110,140,0.13);
    --l-okSoft: #E2EDE7;
    --l-okText: #0B6B3A;
    --l-rowBg2: #FBF7F0;
    --l-shine: rgba(255,255,255,.55);
    --l-surfaceAlpha: rgba(255,255,255,0.9);
    --l-glass: rgba(255,255,255,0.75);
    --l-logoFilter: none;
    --l-accentSoftBorder: #E5C3AA;
    --l-warnSoft: #FBF1D6;
    --l-warnText: #8A6203;
    --l-warnStrong: #C28A05;
    --l-infoSoft: #E2EEF8;
    --l-infoText: #2A5E8F;
    --l-errSoft: #FDE7E7;
    --l-errText: #A3231F;
    --l-errStrong: #C62828;
    --l-logBg: #141B1F;
    --l-logText: #C3C7C5;
    --l-logMut: #94A09B;
    --l-logOk: #4ADE80;
    --l-logWarn: #FBBF24;
    --l-logErr: #F87171;
    --l-logInfo: #7DB8F0;
    --l-brandtext-woolworths: #007A33;
    --l-brandtext-coles: #E41E26;
    --l-brandtext-aldi: #1B3774;
    --l-brandtext-iga: #E71B23;
    --l-brandtext-costco: #005DAA;

    /* dark */
    --d-bg: #0A1A20;
    --d-surface: #11262E;
    --d-border: #24434E;
    --d-field: #0D2028;
    --d-fieldBorder: #646E85;
    --d-text: #EAF2F4;
    --d-textMut: #A3B8BE;
    --d-primary: #7FD3EE;
    --d-primaryHover: #0D6A88;
    --d-onPrimary: #0B1120;
    --d-primaryBtn: #107FA3;
    --d-onPrimaryBtn: #FFFFFF;
    --d-accent: #FF8A3D;
    --d-onAccent: #1E2A2F;
    --d-accentSoft: #3A200C;
    --d-accentText: #FFB98A;
    --d-savings: #6FD39B;
    --d-heroA: #05141A;
    --d-heroB: #0A1A20;
    --d-rowBg: #17313A;
    --d-bestBg: #0F2A1D;
    --d-hoverWash: rgba(127, 211, 238, .10);
    --d-cardShadow: 0 1px 2px rgba(0, 0, 0, .4), 0 10px 28px rgba(0, 0, 0, .35);
    --d-glow: rgba(0,0,0,.5);
    --d-glowSoft: rgba(127,211,238,0.14);
    --d-searchGlow1: rgba(127,211,238,0.09);
    --d-searchGlow2: rgba(0,0,0,.55);
    --d-okSoft: #244944;
    --d-okText: #6FD39B;
    --d-rowBg2: #0E2027;
    --d-shine: rgba(255,255,255,.08);
    --d-surfaceAlpha: rgba(17,38,46,0.9);
    --d-glass: rgba(17,38,46,0.75);
    --d-logoFilter: invert(1) hue-rotate(180deg);
    --d-accentSoftBorder: #654228;
    --d-warnSoft: #33290F;
    --d-warnText: #F0CB74;
    --d-warnStrong: #C89A2B;
    --d-infoSoft: #16293A;
    --d-infoText: #8FC4EE;
    --d-errSoft: #3A1B1A;
    --d-errText: #F5A9A6;
    --d-errStrong: #EF6A62;
    --d-logBg: #0D1F26;
    --d-logText: #C4CBCE;
    --d-logMut: #98A8AC;
    --d-logOk: #4ADE80;
    --d-logWarn: #FBBF24;
    --d-logErr: #F87171;
    --d-logInfo: #7DB8F0;
    --d-brandtext-woolworths: #429D68;
    --d-brandtext-coles: #EB585E;
    --d-brandtext-aldi: #7B8BAE;
    --d-brandtext-iga: #F15259;
    --d-brandtext-costco: #5291C5;
}