/* Legacy --app-* tokens — wrapped in @layer legacy so newer layers win. */
@layer legacy {
    :root {
        --app-brand-color: green; /*#0D54B1;*/
        --app-brand-icon-color: green; /*#0D54B1;*/
        --app-primary-bg-color: var(--app-brand-color, green);
        --app-primary-text-color: white;
    }
}

/* ============================================================
   Accountable Africa AI brand — matches the Africa Documents
   design system so the shared marketing components (c-hero,
   c-pillars, c-band, c-trust-strip, c-doc-mock, …) render with
   the same warm-paper / forest-green / sage palette.
   Primitives + semantic rebindings. Components read only the
   semantic tokens; changing a primitive here propagates
   everywhere the semantic is consumed.
   ============================================================ */
@layer brand {
    :root {
        /* Primitive palette (matches Africa Documents) */
        --ad-ink-950: #0f1411; /* primary text / strong ink */
        --ad-ink-800: #2c342e;
        --ad-ink-500: #6b746d;
        --ad-paper-50: #faf9f5; /* warm off-white page */
        --ad-paper-100: #f1f0ea; /* warm alt surface */
        --ad-line-200: #e1ddd0; /* hairline borders */
        --ad-forest-500: #2E5E33;
        --ad-forest-700: #1a3a1a; /* deep forest green accent */
        --ad-forest-900: #0d2b0d; /* darker forest for press states */
        --ad-sage-400: #7d9471; /* sage green — soft accent */
        /* Rebind RCL semantic tokens to the brand primitives.
           Functional default: white surface so Syncfusion inputs/grids
           (pure-white chrome) don't clash against a warm paper canvas.
           Marketing scope ([data-shell="marketing"]) opts in to warm paper
           below. */
        --color-ink: var(--ad-ink-950);
        --color-ink-soft: var(--ad-ink-800);
        --color-ink-mute: var(--ad-ink-500);
        --color-surface: #ffffff;
        --color-surface-alt: var(--ad-paper-50);
        --color-line: var(--ad-line-200);
        --color-accent: var(--ad-forest-500);
        --color-accent-deep: var(--ad-forest-900);
        --color-accent-soft: var(--ad-sage-400);
        --color-on-dark: var(--ad-paper-50);
        --color-on-dark-mute: rgb(250 249 245 / .65);
        /* Stable inverse-surface tokens — bind directly to brand primitives
           so they stay fixed inside [data-surface="dark"] scopes. */
        --color-surface-inverse: var(--ad-ink-950);
        --color-on-surface-inverse: var(--ad-paper-50);
    }

    [data-shell="marketing"] {
        --color-surface:     var(--ad-paper-50);
        --color-surface-alt: var(--ad-paper-100);
    }
}