/* Auto-generated from foundations.css — do not edit */
/* Auto-generated by generateThemePlugin in vite.config.ts — do not edit manually */

:root, [data-theme="dark"] {
  --color-bg-canvas: #050505;
  --color-bg-surface: #141414;
  --color-bg-element-surface: #1F1F1F;
  --color-bg-element-surface-raised: color-mix(in srgb, #999999 10%, transparent);
  --color-bg-element: #292929;
  --color-bg-element-hover: color-mix(in srgb, #FAFAFA 10%, transparent);
  --color-bg-element-danger: #520A0A;
  --color-bg-element-success: #42A642;
  --color-bg-element-warning: #FF6B33;
  --color-bg-element-brand: #D9BC82;
  --color-bg-element-brand-hover: color-mix(in srgb, #FAFAFA 25%, transparent);
  --color-bg-element-inverse: #FAFAFA;
  --color-bg-overlay: color-mix(in srgb, #050505 70%, transparent);
  --color-qr-module: #050505;
  --color-text-primary: #FAFAFA;
  --color-text-primary-inverse: #050505;
  --color-text-primary-on-danger: #FAFAFA;
  --color-text-secondary: #999999;
  --color-text-success: #42A642;
  --color-text-warning: #FF6B33;
  --color-text-danger: #E62E2E;
  --color-text-brand: #D9BC82;
  --color-gradient-brand: linear-gradient(126deg, #D9BC82 28.4%, #FCFBE7 79.18%, #D9BC82 104.42%, #BFA673 151.65%);
  --color-gradient-neutral: linear-gradient(275deg, #00000033 0%, #66666633 33.7%, #00000033 96.3%), #292929;
  --color-text-on-brand: #050505;
  --color-icon-primary: #FAFAFA;
  --color-icon-secondary: #999999;
  --color-icon-on-danger: #FAFAFA;
  --color-icon-primary-inverse: #050505;
  --color-icon-brand: #D9BC82;
  --color-icon-success: #42A642;
  --color-icon-warning: #FF6B33;
  --color-icon-danger: #E62E2E;
  --color-border-primary: #FAFAFA;
  --color-border-secondary: #999999;
  --color-border-canvas: #050505;
  --color-border-element: #292929;
  --color-border-brand: #D9BC82;
  --color-border-danger: #E62E2E;
  --color-border-success: #42A642;
  --color-border-warning: #FF6B33;
  --color-border-on-surface: #141414;
  --color-border-on-canvas: #1F1F1F;
  --color-border-on-raised-surface: #1F1F1F;
  --color-focus-ring-default: #1F1F1F;
  --color-focus-ring-brand: #D9BC82;
  --color-focus-ring-danger: #520A0A;
  --color-mascot-fur: #8A6444;
  --color-mascot-fur-dark: #71503A;
  --color-mascot-fur-light: #C9A87C;
  --color-mascot-ink: #2B1F14;
  --color-mascot-hat: #D9BC82;
  --color-mascot-hat-dark: #BFA673;
  --color-mascot-hat-shine: #FCFBE7;
  --color-mascot-steel: #9AA0A6;
}

[data-theme="light"] {
  --color-bg-canvas: #F7F7F7;
  --color-bg-surface: #F7F7F7;
  --color-bg-element-surface: #F7F7F7;
  --color-bg-element-surface-raised: #F7F7F7;
  --color-bg-element: #DEDFDE;
  --color-bg-element-inverse: #666666;
  --color-text-primary: #050505;
  --color-text-primary-inverse: #F7F7F7;
  --color-text-primary-on-danger: #F7F7F7;
  --color-text-secondary: #666666;
  --color-text-brand: #050505;
  --color-icon-primary: #050505;
  --color-icon-secondary: #666666;
  --color-icon-on-danger: #F7F7F7;
  --color-icon-primary-inverse: #F7F7F7;
  --color-border-primary: #F7F7F7;
  --color-border-secondary: #FBFCFC;
  --color-border-canvas: #F7F7F7;
  --color-border-element: #666666;
  --color-border-on-surface: #DBDBDB;
  --color-border-on-canvas: #DEDFDE;
  --color-border-on-raised-surface: #DEDFDE;
  --color-focus-ring-default: #DBDBDB;
}

/*
 * foundations.css — Shared design foundations for all LiveView pages.
 *
 * This file bridges the React app's design system into LiveView. Any LiveView
 * layout that loads the built output gets access to:
 *
 *   - Semantic theme colors (--color-bg-canvas, --color-text-primary, etc.) from theme.css
 *   - RiverGothic font-face declarations (Regular, Medium, Bold)
 *
 * These are the same values the React logged-in app uses. The goal is a single
 * source of truth for the brand's visual foundations across both React and
 * LiveView — no duplication, no drift.
 *
 * Built as a separate Vite entry so it produces its own CSS file with zero
 * impact on the React app bundle. Any LiveView layout can load it via:
 *
 *   <link rel="stylesheet" href={Routes.static_path(@conn, "/frontend/assets/foundations.css")} />
 */

/* RiverGothic font-face declarations
 * Uses absolute paths so they are NOT hashed by Vite, keeping URLs stable
 * and allowing <link rel="preload"> in the layout to match exactly. */
@font-face {
  font-family: "RiverGothic-Regular";
  src: url("/frontend/assets/fonts/RiverGothic-Regular-9c7447b6a97f7a8d8c3c1f9ff8e133b1.woff2?vsn=d") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "RiverGothic-Medium";
  src: url("/frontend/assets/fonts/RiverGothic-Medium-94b8fc0d9f525e4a90ddfc4195c0cdc3.woff2?vsn=d") format("woff2");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "RiverGothic-Bold";
  src: url("/frontend/assets/fonts/RiverGothic-Bold-7173595208e9e6e0fc0dec296aae4dd6.woff2?vsn=d") format("woff2");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

/* Metric-adjusted fallbacks, listed before sans-serif in every RiverGothic
 * stack so pre-swap text occupies the real font's space (no pop-in / CLS).
*/
@font-face {
  font-family: "RiverGothic-Regular Fallback";
  src: local("Arial"), local("Helvetica"), local("Roboto");
  font-weight: 400;
  font-style: normal;
  size-adjust: 100.72%;
  ascent-override: 97.9%;
  descent-override: 32.47%;
  line-gap-override: 0%;
}

@font-face {
  font-family: "RiverGothic-Medium Fallback";
  src: local("Arial"), local("Helvetica"), local("Roboto");
  font-weight: 500;
  font-style: normal;
  size-adjust: 101.84%;
  ascent-override: 96.82%;
  descent-override: 32.11%;
  line-gap-override: 0%;
}

@font-face {
  font-family: "RiverGothic-Bold Fallback";
  src: local("Arial"), local("Helvetica"), local("Roboto");
  font-weight: 700;
  font-style: normal;
  size-adjust: 102.74%;
  ascent-override: 95.97%;
  descent-override: 31.83%;
  line-gap-override: 0%;
}