/* Austral Dynamics: design tokens for the GTM dashboard (tenant "austral", GTM-11b).
   Destination: gtm/static/tenants/austral/tokens.css   (tenants/austral.toml: tokens = "austral")
   Spec: austral/design/DESIGN-SYSTEM.md. Evidence: austral/design/BRAND-EVIDENCE.md.

   Every name in the app's contract (gtm/static/tenants/default/tokens.css) is defined below with Austral values, in
   the same order. Additions follow in their own section; DESIGN-SYSTEM.md section 3.17 lists each with its role.
   Where Loan Lounge's tokens file already names the same role, its name is reused.

   Rules
   - Raw values (hex, px, ms, curves, font names) live here and nowhere else.
   - Colour roles are literal 6-digit hex: tenant.py CONTRAST_PAIRS reads literals only. Every hex in this file is
     one of the 18 palette entries in DESIGN-SYSTEM.md section 3.2.
   - Light theme only (DESIGN-SYSTEM.md section 3.16). tenant.py read_tokens keeps the LAST definition of each name
     in the file, so no colour role may be redefined after the light block.
   - Comments never contain a declaration pattern, because the loader would read it.
   - Reddit Sans (SIL Open Font License 1.1), self-hosted in fonts/ beside this file: the Google Fonts v6 variable
     woff2 files (weight axis 200 to 900), normal style, latin and latin-ext subsets, byte-identical. Source URLs are
     in DESIGN-SYSTEM.md section 3.7. The UI uses weights 400, 500 and 600 from the same files. */

/* ---- fonts: OFL, self-hosted (CSP: same origin only) ---- */
@font-face {
  font-family: "Reddit Sans";
  font-style: normal;
  font-weight: 200 900;
  font-display: optional;
  src: url("fonts/reddit-sans-latin-ext.woff2") format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: "Reddit Sans";
  font-style: normal;
  font-weight: 200 900;
  font-display: optional;
  src: url("fonts/reddit-sans-latin.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

:root {
  color-scheme: light;

  /* ===== contract (same names and order as tenants/default/tokens.css) ===== */

  /* colour: surfaces and text */
  --color-bg: #FAF8EA;
  --color-surface: #FFFFFF;
  --color-text: #222222;
  --color-text-muted: #666666;
  --color-border: #DDDDDD;
  --color-border-control: #666666;
  --color-link: #18499F;
  --color-accent: #FCB315;
  --color-on-accent: #222222;
  --color-accent-soft: #FFF4DC;
  --color-focus: #18499F;
  --color-sidebar: #FFFFFF;
  --color-sidebar-text: #18499F;
  /* colour: states */
  --color-success: #1E6B45;
  --color-success-bg: #E3F2EA;
  --color-warning: #8D6102;
  --color-danger: #B3261E;
  /* colour: data (chart series 1 and axis) */
  --color-chart-bar: #18499F;
  --color-chart-axis: #666666;

  /* type: ratio 1.2 (minor third), base 14px; 13px is a declared half-step */
  --font-sans: "Reddit Sans", system-ui, "Segoe UI", Arial, sans-serif;
  --font-mono: ui-monospace, "SFMono-Regular", Menlo, Consolas, monospace;
  --text-figure-size: 29px;
  --text-title-size: 24px;
  --text-heading-size: 17px;
  --text-body-size: 14px;
  --text-secondary-size: 13px;
  --text-label-size: 12px;
  --lh-tight: 1.2;
  --lh-body: 1.5;
  --lh-badge: 20px;
  --weight-regular: 400;
  --weight-semibold: 600;
  --tracking-label: 0.04em;
  --tracking-mark: var(--tracking-label);

  /* space: base 4px */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-6: 24px;
  --space-8: 32px;

  /* shape */
  --radius-control: 5px;
  --radius-card: 10px;
  --radius-pill: 9999px;
  --border-width: 1px;
  --border-width-strong: 2px;
  --border-width-indicator: 4px;
  --focus-width: 2px;
  --focus-offset: 2px;
  --shadow-card: 0 2px 8px 0 rgba(0, 0, 0, 0.05);

  /* sizes */
  --control-h: 36px;
  --control-h-sm: 28px;
  --sidebar-w: 232px;
  --container-max: 1140px;
  --panel-signin: 416px;
  --kpi-min: 168px;
  --facts-label-min: 120px;
  --field-min: 160px;
  --table-min-w: 720px;
  --measure: 66ch;
  --brand-mark-size: 32px;
  --logo-h: 40px;
  --logo-max-w: 208px;
  --chart-h: 200px;

  /* ===== additions (DESIGN-SYSTEM.md section 3.17): roles the contract lacks ===== */

  /* colour: surfaces and lines (names shared with Loan Lounge) */
  --color-surface-sunken: #F1EFE1;
  --color-surface-hover: #FAF8EA;
  --color-border-strong: #18499F;
  --color-accent-pressed: #143E87;
  /* colour: state families completed (names shared with Loan Lounge) */
  --color-warning-bg: #FFF4DC;
  --color-danger-bg: #FBEAE9;
  --color-on-danger: #FFFFFF;
  --color-info-bg: #E8EEF8;
  --color-info-border: #18499F;
  /* colour: chart series 2 to 4 and gridlines (names shared with Loan Lounge) */
  --color-chart-2: #8D6102;
  --color-chart-3: #177EA9;
  --color-chart-4: #666666;
  --color-chart-grid: #DDDDDD;
  /* colour: Austral only (navy headings, navy selected fill, yellow on navy, inverse tooltip) */
  --color-heading: #18499F;
  --color-strong: #18499F;
  --color-on-strong: #FFFFFF;
  --color-accent-on-strong: #FCB315;
  --color-surface-inverse: #323232;
  --color-text-inverse: #FFFFFF;
  /* chart line patterns, series 2 to 4 (series 1 is solid) */
  --chart-dash-2: 6px 4px;
  --chart-dash-3: 2px 4px;
  --chart-dash-4: 12px 4px;

  /* type */
  --weight-medium: 500;
  --figure-numeric: tabular-nums lining-nums;

  /* shape */
  --focus-offset-inset: -2px;
  --shadow-overlay: 0 3px 10px 0 rgba(0, 0, 0, 0.1);

  /* motion (names shared with Loan Lounge) */
  --motion-fast: 200ms;
  --motion-slow: 350ms;
  --ease-standard: ease-in-out;

  /* z-layers (names shared with Loan Lounge) */
  --z-base: 0;
  --z-raised: 1;
  --z-sticky: 10;
  --z-dropdown: 20;
  --z-overlay: 30;
  --z-modal: 40;
  --z-toast: 50;
  --z-tooltip: 60;

  /* sizes */
  --control-h-touch: 44px;
  --icon-size: 20px;
  --rail-w: 64px;
  --toast-w: 360px;
  --card-min: 320px;
  --logo-signin-w: 282px;
}

/* ===== shared-stylesheet union (theming pass, 2026-10-27): names app.css reads for every tenant =====
   One app.css serves every tenant, so each name it reads is defined in every tokens file. The values below implement
   DESIGN-SYSTEM.md section 5 for Austral using only the palette in section 3.2 and the roles above. Light only. */
:root {
  /* buttons: secondary is white with a navy edge; the yellow primary fills navy on hover */
  --color-btn-bg: var(--color-surface);
  --color-primary-hover-bg: var(--color-strong);
  --color-primary-hover-text: var(--color-on-strong);
  --color-primary-hover-border: var(--color-strong);
  --color-ghost-hover-bg: transparent;
  --color-danger-hover-bg: var(--color-danger-bg);
  --color-danger-hover-text: var(--color-danger);
  --color-disabled-bg: var(--color-surface-sunken);
  --color-disabled-border: var(--color-border);
  --border-style-disabled: solid;
  /* forms: a boxed control with a grey edge, navy on hover */
  --color-field-label: var(--color-text);
  --color-input-hover-bg: var(--color-surface);
  --color-input-hover-border: var(--color-border-strong);
  /* cards and tables: hairlines; the table header sits on the sunken cream */
  --color-card-rule: var(--color-border);
  --color-th-text: var(--color-text-muted);
  --color-th-bg: var(--color-surface-sunken);
  --color-th-rule: var(--color-border);
  /* the headline KPI tile: the site's navy CTA panel with the figure in yellow */
  --color-kpi-headline-bg: var(--color-strong);
  --color-kpi-headline-edge: var(--color-strong);
  --color-kpi-headline-rule: var(--color-strong);
  --color-kpi-headline-text: var(--color-on-strong);
  --color-kpi-headline-figure: var(--color-accent-on-strong);
  --color-feed-hover-bg: var(--color-surface-hover);
  --color-empty-bg: var(--color-bg);
  --color-callout-text: var(--color-text);
  --color-info-title: var(--color-heading);
  /* badges: ICP fit reuses the yellow CTA pairing; confidence is solid, tint, then outline */
  --color-badge-bg: var(--color-surface);
  --color-icp-bg: var(--color-accent);
  --color-on-icp: var(--color-on-accent);
  --color-info-badge-edge: var(--color-info-bg);
  --color-conf-medium-bg: var(--color-info-bg);
  --color-conf-medium-edge: var(--color-info-border);
  --color-conf-low-edge: var(--color-border);
  --color-sample-bg: var(--color-warning-bg);
  /* lead temperature (Prospects heat badges, DESIGN-SYSTEM.md section 13): Hot is the navy fill with white text, so it
     never reads as the yellow ICP-fit badge; Warm is the cream tint with an ink edge, apart from the brown Sample data
     badge; Cold is a white pill with a grey edge. Palette values only. */
  --color-hot: #18499F;
  --color-on-hot: #FFFFFF;
  --color-hot-edge: #18499F;
  --color-warm: #FFF4DC;
  --color-on-warm: #222222;
  --color-warm-edge: #222222;
  --color-cold: #FFFFFF;
  --color-on-cold: #222222;
  --color-cold-edge: #666666;
  --color-on-temp: #222222;
  /* tabs: the site's tab pill, navy when selected */
  --color-tab-text: var(--color-link);
  --color-tab-hover-bg: var(--color-surface-sunken);
  --color-tab-current-bg: var(--color-strong);
  --color-tab-current-text: var(--color-on-strong);
  --color-tab-current-rule: var(--color-strong);
  /* charts: a fifth series in charcoal with its own dash, for the shared stylesheet (the design draws at most four) */
  --color-chart-5: #323232;
  --chart-dash-5: 8px 4px 2px 4px;
  --color-chart-bar-hover: var(--color-accent-pressed);
  /* navigation on the white sidebar: navy text, sunken hover, navy current item with a yellow bar */
  --color-sidebar-muted: var(--color-text-muted);
  --color-nav-hover-bg: var(--color-surface-sunken);
  --color-nav-hover-indicator: transparent;
  --color-nav-current-bg: var(--color-strong);
  --color-nav-current-text: var(--color-on-strong);
  --color-nav-current-indicator: var(--color-accent-on-strong);
  --color-nav-active-bg: var(--color-accent-soft);
  --color-nav-active-text: var(--color-sidebar-text);
  --color-menu-hover-bg: var(--color-strong);
  --color-menu-hover-text: var(--color-on-strong);
  --color-signout-border: transparent;

  /* type: Reddit Sans throughout, set light; Title Case comes from the copy, so no forced case on buttons */
  --font-display: var(--font-sans);
  --font-heading: var(--font-sans);
  --font-label: var(--font-sans);
  --weight-display: var(--weight-regular);
  --weight-nav: var(--weight-medium);
  --weight-state-title: var(--weight-semibold);
  --weight-mono: var(--weight-regular);
  --ui-text-transform: none;
  --ui-tracking: normal;
  /* Title Case (section 3.7) for page and card titles, buttons and tabs, set by CSS so the shared copy stays as typed */
  --heading-text-transform: capitalize;
  --control-text-transform: capitalize;
  --lh-label: var(--lh-tight);
  --lh-btn: var(--lh-tight);
  --text-btn-small-size: var(--text-secondary-size);
  --text-field-label-size: var(--text-secondary-size);
  --text-callout-title-size: var(--text-body-size);
  --text-signin-title-size: var(--text-title-size);
  --text-state-title-size: var(--text-body-size);
  --link-standalone-decoration: none;
  --ghost-decoration: none;
  --nav-hover-decoration: none;
  --menu-hover-decoration: none;
  --underline-thickness: auto;
  --underline-offset: auto;
  --underline-thickness-cta: auto;
  --underline-offset-cta: auto;
  --motion-standard: var(--motion-fast);

  /* controls: 44px below 768px, 36px from 768px; 1px edges */
  --control-h-base: var(--control-h-touch);
  --control-h-sm-base: var(--control-h-touch);
  --btn-border-width: var(--border-width);
  --btn-pad-x: var(--space-4);
  --input-border-width: var(--border-width);
  --input-underline-width: var(--border-width);
  --input-pad-x: var(--space-3);
  --nav-indicator-width: var(--border-width-indicator);
  /* WCAG 2.5.8: the smallest box of a link that sits beside another link (a page path and its "all fixes") */
  --target-min: var(--space-6);
  /* the narrowest a wrapping name (Overview top companies) gets beside its count, so it never shrinks to a few letters */
  --title-min-w: 10ch;
  /* narrow filter bar (section 5.8): the From and To dates share a row; Apply and Reset fill their own row */
  --field-pair-basis: 40%;
  --filter-btn-grow: 1;

  /* cards, page header, sections */
  --card-rule-width: var(--border-width);
  --card-pad-md: var(--space-4);
  --page-head-rule-width: 0;
  --page-head-rule-gap: 0;
  --section-gap: var(--space-6);
  --feed-item-pad-y: var(--space-2);
  --feed-item-pad-x: var(--space-3);
  --feed-indicator-width: var(--border-width-indicator);
  --empty-pad-y: var(--space-6);
  --empty-pad-x: var(--space-4);
  --tab-rule-width: var(--border-width);
  --th-rule-width: var(--border-width);
  --tab-bar-rule-width: 0;
  /* tables (section 5.5): the header is sticky (z-index as specified); tables keep scrolling inside their card at
     every width, so it sticks within that wrapper. No sticky first column and no "scroll sideways" line. */
  --z-th: var(--z-sticky);
  --first-col-left: auto;
  --first-col-rule-width: 0;
  --first-col-w-sm: auto;
  --first-col-wrap-sm: normal;
  --shadow-first-col-cover: none;
  --scroll-hint-display: none;

  /* shell: gutters 16 / 24 / 24 / 32px; a white top bar below 768px, then the 232px white sidebar */
  --main-pad-md: var(--space-6);
  --main-pad-lg: var(--space-6);
  --main-pad-xl: var(--space-8);
  --sidebar-pad-x: var(--space-3);
  --sidebar-rule-width: var(--border-width);
  --topbar-h: auto;
  --topbar-pad-y: var(--space-2);
  --topbar-position: static;
  --logo-h-compact: var(--logo-h);

  /* sign-in: a white card on the cream canvas */
  --signin-border-width: var(--border-width);
  --signin-pad-md-y: var(--space-8);
  --signin-pad-md-x: var(--space-8);
  --signin-rule-width: 0;
  --signin-rule-gap: 0;

  /* layout (read by the server, see app.css): sidebar from 768px, paired lists from 1024px, feed beside them at 1280px */
  --layout-sidebar-from: 768px;
  --layout-split-from: 1024px;
  --overview-columns-xl: minmax(0, 2fr) minmax(0, 1fr);
  --overview-areas-xl: "companies feed" "pages feed";
}

/* reduced motion: every duration becomes instant */
@media (prefers-reduced-motion: reduce) {
  :root {
    --motion-fast: 0ms;
    --motion-slow: 0ms;
  }
}