/* ==========================================================================
   GovAssess design tokens — shared/tokens.css
   Load FIRST on every page, immediately followed by shared/styles.css.

   The brand is defined by the six --ga-primary-* / --ga-clay-* values in
   the "Brand" block. To move to another palette later, edit that block only;
   no page may contain a raw hex after the UI-consistency migration
   (docs/ui-consistency-log.md). Contrast pairs verified WCAG 2.1 AA on
   2026-08-29 (4.5:1 text, 3:1 UI) — see log §0.10 / §1.
   ========================================================================== */

@font-face {
    font-family: "Public Sans";
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url("/shared/fonts/PublicSans-Regular.woff2") format("woff2");
}
@font-face {
    font-family: "Public Sans";
    font-style: normal;
    font-weight: 500;
    font-display: swap;
    src: url("/shared/fonts/PublicSans-Medium.woff2") format("woff2");
}
@font-face {
    font-family: "Public Sans";
    font-style: normal;
    font-weight: 600;
    font-display: swap;
    src: url("/shared/fonts/PublicSans-SemiBold.woff2") format("woff2");
}
@font-face {
    font-family: "Public Sans";
    font-style: normal;
    font-weight: 700;
    font-display: swap;
    src: url("/shared/fonts/PublicSans-Bold.woff2") format("woff2");
}

:root {
    /* ---- Brand — palette "C: deep teal + clay" (chosen 2026-08-29) ---- */
    --ga-primary-900: #0c2f3a;   /* app header, darkest text on light */
    --ga-primary-700: #155e75;   /* primary buttons, active nav, table header text */
    --ga-primary-500: #0e7490;   /* links, focus ring, interactive states (5.4:1 on white) */
    --ga-primary-050: #e3f1f5;   /* selected rows, subtle highlights */
    --ga-clay-600:    #c2410c;   /* platform accent: header bar, active-nav underline, primary CTA hover */
    --ga-accent:      var(--ga-clay-600); /* overridden per org at runtime from Organizations.PrimaryColor */

    /* ---- Neutrals (cool, tinted toward the teal) ---- */
    --ga-gray-900: #10201f;
    --ga-gray-700: #334147;
    --ga-gray-500: #64717a;      /* 5.0:1 on white — smallest text colour allowed */
    --ga-gray-400: #7d8b93;      /* input borders — 3.5:1 on white (WCAG 1.4.11) */
    --ga-gray-300: #cbd5d9;      /* decorative borders / dividers only */
    --ga-gray-200: #dde5e8;
    --ga-gray-100: #e6ecee;
    --ga-gray-050: #f6f9f9;
    --ga-white:    #ffffff;

    /* ---- Semantic — distinct from the brand accent; clay is never a status ---- */
    --ga-success:    #166534;  --ga-success-bg: #e7f5ec;
    --ga-warning:    #854d0e;  --ga-warning-bg: #fdf3d7;
    --ga-danger:     #b91c1c;  --ga-danger-bg:  #fdeaea;
    --ga-info:       #155e75;  --ga-info-bg:    #e3f1f5;

    /* ---- Type ---- */
    --ga-font-sans: "Public Sans", "Segoe UI", system-ui, Arial, sans-serif;
    --ga-font-mono: ui-monospace, "Cascadia Mono", Consolas, monospace;
    --ga-text-xs: 0.75rem;
    --ga-text-sm: 0.875rem;
    --ga-text-md: 1rem;
    --ga-text-lg: 1.125rem;
    --ga-text-xl: 1.375rem;
    --ga-text-2xl: 1.75rem;
    --ga-leading: 1.5;

    /* ---- Layout ---- */
    --ga-space-1: 4px;
    --ga-space-2: 8px;
    --ga-space-3: 12px;
    --ga-space-4: 16px;
    --ga-space-6: 24px;
    --ga-space-8: 32px;
    --ga-space-12: 48px;
    --ga-radius-sm: 4px;
    --ga-radius-md: 6px;
    --ga-radius-lg: 10px;
    --ga-shadow-sm: 0 1px 2px rgba(12, 47, 58, 0.06);
    --ga-shadow-md: 0 2px 8px rgba(12, 47, 58, 0.10);
    --ga-container: 1200px;
    --ga-header-h: 56px;
    --ga-focus: 0 0 0 3px rgba(14, 116, 144, 0.45);

    /* ---- Legacy aliases — kept so un-migrated inline styles resolve to the
            new palette. Remove when the last page drops them. ---- */
    --primary-color: var(--ga-primary-900);
    --secondary-color: var(--ga-primary-700);
    --fdic-gold: var(--ga-accent);
    --text-color: var(--ga-gray-900);
    --light-gray: var(--ga-gray-050);
    --org-primary: var(--ga-primary-900);
    --org-primary-light: var(--ga-primary-700);
}