/*
Theme Name:   AWI Child
Theme URI:    https://welding.org.au/
Description:  Australian Welding Institute child theme for GeneratePress. Carries the AWI design tokens and nothing that GeneratePress already does. Built for PHP 8.4.
Author:       Australian Welding Institute
Author URI:   https://welding.org.au/
Template:     generatepress
Version:      1.0.18
Requires at least: 6.6
Requires PHP: 8.2
License:      GNU General Public License v2 or later
License URI:  https://www.gnu.org/licenses/gpl-2.0.html
Text Domain:  awi-child
Tags:         accessibility-ready
*/

/* ==========================================================================
   This file holds the design tokens and nothing else.

   It is a byte for byte copy of _build/assets/tokens.css. If a token changes
   in the prototype, change it here and nowhere else. Components live in
   assets/site.css. Fonts live in assets/fonts.css.

   Verify the copy has not drifted:
     diff <(tail -n +28 style.css) ../../../_build/assets/tokens.css
   ========================================================================== */

/* ==========================================================================
   Australian Welding Institute: design tokens
   Single source of truth. Every colour, size and spacing value in site.css
   resolves to something declared here.

   Contrast rules from the brand contrast audit. These are not suggestions.
   1. Straw gold is a FILL only. Never straw gold text on white.
   2. Text sitting on straw gold must be deep steel.
   3. Arc blue is the lightest blue permitted for body-size text on white.
   4. Pale temper is for dark backgrounds only.
   ========================================================================== */

:root {
  /* ---- brand palette, exact values, do not adjust ---- */
  --awi-ink: #0B1522;
  --awi-deep-steel: #12233D;
  --awi-temper-blue: #1E4272;
  --awi-arc-blue: #2E6FB8;
  --awi-pale-temper: #7FB2DC;
  --awi-temper-purple: #5B3A6E;
  --awi-bronze: #8A5A2B;
  --awi-straw: #D4A537;
  --awi-steel-grey: #6B7280;
  --awi-off-white: #F7F8FA;

  /* ---- semantic roles, so components never guess ---- */
  --awi-page-bg: #FFFFFF;
  --awi-surface: var(--awi-off-white);
  --awi-surface-dark: var(--awi-deep-steel);
  --awi-surface-darkest: var(--awi-ink);

  --awi-text: var(--awi-ink);              /* 17.4:1 on white */
  --awi-text-muted: var(--awi-steel-grey); /* 4.83:1 on white, AA body */
  --awi-text-on-dark: #FFFFFF;
  --awi-text-muted-on-dark: var(--awi-pale-temper);
  --awi-text-on-straw: var(--awi-deep-steel);

  --awi-link: var(--awi-temper-blue);      /* 8.6:1 on white */
  --awi-link-hover: var(--awi-arc-blue);   /* 4.6:1 on white, the floor */
  --awi-link-on-dark: var(--awi-pale-temper);

  /* Decorative rules. Not permitted as the boundary of an interactive control:
     both sit below 3:1 on white, so they fail WCAG 1.4.11 for UI components.
     Use --awi-border-interactive for anything a user can operate. */
  --awi-rule: #DDE2E9;          /* 1.2:1 on white, grouping only */
  --awi-rule-strong: #B9C2CE;   /* 1.8:1 on white, grouping only */
  --awi-rule-on-dark: rgba(127, 178, 220, 0.32);

  /* Boundary colour for inputs, buttons and any clickable row.
     4.83:1 on white, 4.55:1 on off-white, so it clears the 3:1 requirement
     for non-text contrast with margin. */
  --awi-border-interactive: var(--awi-steel-grey);

  --awi-focus: var(--awi-arc-blue);
  --awi-focus-on-dark: var(--awi-straw);

  --awi-accent-fill: var(--awi-straw);     /* fill only */
  --awi-status-valid: #1B6B3A;             /* 5.1:1 on white */
  --awi-status-valid-bg: #E8F3EC;
  --awi-status-warn-bg: #FBF1DA;
  --awi-status-alert: #8A2B2B;             /* 7.4:1 on white */
  --awi-status-alert-bg: #F7EAEA;

  /* ---- type ---- */
  --awi-font-heading: Archivo, "Archivo Fallback", "Helvetica Neue", Helvetica, Arial, sans-serif;
  --awi-font-body: Inter, "Inter Fallback", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  --awi-font-mono: "JetBrains Mono", ui-monospace, "SF Mono", Menlo, Consolas, monospace;

  /* fluid scale, 320px to 1440px, no clamping surprises at either end */
  --awi-step--1: clamp(0.833rem, 0.82rem + 0.06vw, 0.875rem);
  --awi-step-0:  clamp(1rem, 0.97rem + 0.15vw, 1.0625rem);
  --awi-step-1:  clamp(1.2rem, 1.14rem + 0.3vw, 1.375rem);
  --awi-step-2:  clamp(1.44rem, 1.33rem + 0.55vw, 1.75rem);
  --awi-step-3:  clamp(1.728rem, 1.53rem + 0.99vw, 2.25rem);
  --awi-step-4:  clamp(2.074rem, 1.73rem + 1.72vw, 3rem);

  --awi-leading-tight: 1.15;
  --awi-leading-snug: 1.3;
  --awi-leading-body: 1.65;

  /* ---- space, 4px base ---- */
  --awi-space-1: 0.25rem;
  --awi-space-2: 0.5rem;
  --awi-space-3: 0.75rem;
  --awi-space-4: 1rem;
  --awi-space-5: 1.5rem;
  --awi-space-6: 2rem;
  --awi-space-7: 3rem;
  --awi-space-8: 4rem;
  --awi-space-9: 6rem;

  /* ---- layout ---- */
  /* Readable line length for body copy. Stated in rem, not ch, on purpose. A
     ch cap resolves against each element's own font size, so a lede at
     --awi-step-1 in the same column as body copy at --awi-step-0 got a line
     104px longer and the two paragraphs ended on different right edges. This
     is 68ch of Inter at the body size, to within half a pixel of the 68ch it
     replaces, and every element that shares the column now shares the width. */
  --awi-measure: 46rem;         /* 736px */
  --awi-container: 75rem;       /* 1200px */
  --awi-container-wide: 82.5rem;
  --awi-gutter: var(--awi-space-4);

  /* ---- other ---- */
  --awi-radius: 2px;            /* engineering, not consumer app */
  --awi-radius-lg: 4px;
  --awi-border: 1px solid var(--awi-rule);
  --awi-shadow: 0 1px 2px rgba(11, 21, 34, 0.06), 0 2px 8px rgba(11, 21, 34, 0.05);
  --awi-tap: 44px;              /* minimum touch target, WCAG 2.5.5 */
}

@media (min-width: 48em) {
  :root { --awi-gutter: var(--awi-space-6); }
}
@media (min-width: 64em) {
  :root { --awi-gutter: var(--awi-space-7); }
}