/*
 * tokens-v3.css — ANZ v3 Design Token Layer
 *
 * SINGLE SOURCE OF TRUTH for all colour hex values.
 * No hex values appear outside this file — all colour usage in v3-shell.css
 * and component files must reference var(--anz-*) custom properties.
 *
 * Source authority: ANZ mini brand guidelines v1.2 / March 2025
 * Contact: brand@anz.com
 *
 * Scope: applied on body.anz-v3 so tokens inherit through the entire
 * ANZ tenant subtree without affecting other tenants (AGL, AMEX, etc.).
 */

body.anz-v3 {

    /* ---------------------------------------------------------------
     * § BRAND PALETTE — authoritative from brand PDF page 4
     * --------------------------------------------------------------- */

    /* Core — use a lot */
    --anz-pacific-blue:          #0572E6;
    --anz-cloud-white:           #FFFFFF;

    /* Secondary — use a little in support */
    --anz-coral-reef:            #FF746A;
    --anz-deep-sea:              #1D164C;
    --anz-clear-skies:           #8ADAF9;
    --anz-clear-skies-ultrasoft: #E2F6FD;
    --anz-sand:                  #D7CCC3;

    /* Neutral greys */
    --anz-grey-1: #F4F3F4;
    --anz-grey-2: #E4E4E4;
    --anz-grey-3: #D2D2D2;
    --anz-grey-4: #B3B3B3;
    --anz-grey-5: #6F6F6F;
    --anz-grey-6: #424242;

    /* Digital text only — never use as background or block colour.
     * Substitutes Pacific Blue for text on Grey-1 / Clear Skies Ultrasoft
     * to achieve AA contrast per brand PDF page 4 approved pairs. */
    --anz-ui-blue: #006BDE;


    /* ---------------------------------------------------------------
     * § SEMANTIC COLOUR ALIASES
     * Components reference these aliases, not the raw brand tokens,
     * so variant overlays can reskin via token-value swap (Principle 2).
     * --------------------------------------------------------------- */

    /* Surfaces */
    --surface:          var(--anz-cloud-white);
    --surface-inverse:  var(--anz-pacific-blue);
    --surface-soft:     var(--anz-clear-skies-ultrasoft);
    --surface-warm:     var(--anz-sand);
    --surface-strong:   var(--anz-deep-sea);

    /* Text */
    --text:             var(--anz-pacific-blue);
    --text-secondary:   var(--anz-grey-6);
    --text-muted:       var(--anz-grey-5);
    --text-on-primary:  var(--anz-cloud-white);
    --text-on-inverse:  var(--anz-cloud-white);

    /* Links — UI Blue per approved text-on-background pair rules */
    --link:             var(--anz-ui-blue);
    --link-hover:       var(--anz-pacific-blue);

    /* Accent — Coral Reef is "request moments" only (CTAs) */
    --accent:           var(--anz-coral-reef);
    --accent-text:      var(--anz-cloud-white);

    /* Borders */
    --border:           var(--anz-grey-2);
    --border-strong:    var(--anz-grey-4);

    /* Background aliases (body + section washes) */
    --bg:               var(--anz-cloud-white);
    --bg-soft:          var(--anz-grey-1);
    --bg-wash:          var(--anz-clear-skies-ultrasoft);
    --bg-warm:          var(--anz-sand);

    /* Header / nav specific */
    --header-bg:        var(--anz-pacific-blue);
    --header-text:      var(--anz-cloud-white);
    --footer-bg:        var(--anz-pacific-blue);
    --footer-text:      var(--anz-cloud-white);


    /* ---------------------------------------------------------------
     * § TYPE SCALE — derived from brand PDF + IA spec §2.2
     * Role: size / line-height — font-weight via --font-weight-* tokens
     * --------------------------------------------------------------- */

    /* Display — Aeonik Medium */
    --type-display-xl-size:  56px;
    --type-display-xl-lh:    60px;

    --type-display-l-size:   40px;
    --type-display-l-lh:     48px;

    /* Headings — Aeonik Medium */
    --type-h1-size:  32px;
    --type-h1-lh:    40px;

    --type-h2-size:  24px;
    --type-h2-lh:    32px;

    --type-h3-size:  20px;
    --type-h3-lh:    28px;

    /* Body copy — Aeonik Regular */
    --type-body-l-size:  18px;
    --type-body-l-lh:    28px;

    --type-body-m-size:  16px;
    --type-body-m-lh:    24px;

    --type-body-s-size:  14px;
    --type-body-s-lh:    20px;

    /* Caption / legal */
    --type-caption-size: 12px;
    --type-caption-lh:   16px;

    /* Font weights */
    --font-weight-regular: 400;
    --font-weight-medium:  500;
    --font-weight-bold:    700;

    /* Font stack */
    --font-family: "Aeonik", Arial, sans-serif;


    /* ---------------------------------------------------------------
     * § SPACING — 4px base grid (IA spec §6.2)
     * Scale: 4, 8, 12, 16, 24, 32, 48, 64, 96, 128
     * --------------------------------------------------------------- */

    --space-1:   4px;
    --space-2:   8px;
    --space-3:   12px;
    --space-4:   16px;
    --space-6:   24px;
    --space-8:   32px;
    --space-12:  48px;
    --space-16:  64px;
    --space-24:  96px;
    --space-32:  128px;

    /* Layout margins per IA spec §6.2 */
    --layout-margin-desktop: 80px;
    --layout-margin-tablet:  32px;
    --layout-margin-mobile:  20px;

    /* Gutter */
    --layout-gutter-desktop: 24px;
    --layout-gutter-mobile:  16px;

    /* Container max-width */
    --container-max: 1280px;


    /* ---------------------------------------------------------------
     * § BORDER RADIUS — conservative per IA spec §6.2
     * --------------------------------------------------------------- */

    --radius-sm:   4px;
    --radius-md:   8px;
    --radius-lg:   12px;
    --radius-pill: 999px;


    /* ---------------------------------------------------------------
     * § SHADOWS — subtle elevation per IA spec §6.2
     * --------------------------------------------------------------- */

    --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.08);
    --shadow-md: 0 2px 8px rgba(0, 0, 0, 0.10);
    --shadow-lg: 0 4px 16px rgba(0, 0, 0, 0.12);


    /* ---------------------------------------------------------------
     * § FOCUS RING — WCAG 2.1 AA compliant
     * 2px solid outline at 3px offset, Pacific Blue colour
     * --------------------------------------------------------------- */

    --focus-ring-color:  var(--anz-pacific-blue);
    --focus-ring-width:  2px;
    --focus-ring-offset: 3px;


    /* ---------------------------------------------------------------
     * § MOTION — interim defaults (DAM motion spec not yet retrieved)
     * Per IA spec §6.3: standard easing, conservative durations.
     * All transitions respect prefers-reduced-motion.
     * --------------------------------------------------------------- */

    --motion-fast:     150ms;
    --motion-standard: 250ms;
    --motion-modal:    400ms;
    --motion-easing:   cubic-bezier(0.4, 0, 0.2, 1);
    --motion-exit:     ease-out;
}