/* ============================================================================
   BRAND THEME — single source of truth for the whole product's look.
   Consumed at runtime by BOTH the Vue SPA (linked in index.html, proxied in
   dev) and the server-rendered Identity pages (linked in _Layout.cshtml).

   To rebrand a deployment, edit ONLY this file (tokens + @font-face) and the
   font files in /fonts. Build-time leftovers that don't follow this file:
   PWA manifest colors (frontend vite.config.ts) and app icons
   (scripts/generate-pwa-icons.mjs + frontend/public).

   Current brand: The Barbell Loft (barbell-loft.ch) — sage green + teal,
   Poppins body, Abril Fatface display. Fonts self-hosted (revDSG: no font
   CDN); woff2 files taken from @fontsource/poppins and
   @fontsource/abril-fatface (latin subsets).
   ============================================================================ */

@font-face { font-family: 'Poppins'; font-style: normal; font-weight: 400; font-display: swap; src: url(/fonts/poppins-latin-400-normal.woff2) format('woff2'); }
@font-face { font-family: 'Poppins'; font-style: normal; font-weight: 500; font-display: swap; src: url(/fonts/poppins-latin-500-normal.woff2) format('woff2'); }
@font-face { font-family: 'Poppins'; font-style: normal; font-weight: 600; font-display: swap; src: url(/fonts/poppins-latin-600-normal.woff2) format('woff2'); }
@font-face { font-family: 'Poppins'; font-style: normal; font-weight: 700; font-display: swap; src: url(/fonts/poppins-latin-700-normal.woff2) format('woff2'); }
@font-face { font-family: 'Abril Fatface'; font-style: normal; font-weight: 400; font-display: swap; src: url(/fonts/abril-fatface-latin-400-normal.woff2) format('woff2'); }

:root {
    /* Primary scale (sage green). The 500 step is the brand color; the SPA's
       PrimeVue preset maps this scale 1:1, so keep all steps plausible. */
    --bb-primary-50: #f3f7f5;
    --bb-primary-100: #e3ece7;
    --bb-primary-200: #c8d9d0;
    --bb-primary-300: #a9c4b7;
    --bb-primary-400: #89ab9c;
    --bb-primary-500: #689682;
    --bb-primary-600: #57806e;
    --bb-primary-700: #47685a;
    --bb-primary-800: #3a5449;
    --bb-primary-900: #2f443c;
    --bb-primary-950: #1d2b26;

    /* Semantic aliases used throughout both apps. */
    --bb-primary: var(--bb-primary-500);
    --bb-primary-dark: var(--bb-primary-600);
    --bb-primary-soft: #eaf1ed;
    --bb-link: #127475;

    /* Neutrals. */
    --bb-bg: #ffffff;
    --bb-surface: #ffffff;
    --bb-surface-soft: #f6f8f7;
    --bb-page-bg: #f6f8f7;
    --bb-border: #e4e8e6;
    --bb-heading: #1c1b21;
    --bb-text: #3c3a47;
    --bb-muted: #8b8894;
    --bb-dark: #26242d;
    --bb-danger: #b23b2e;

    /* Typography. */
    --bb-font-body: 'Poppins', 'Helvetica Neue', Helvetica, Arial, sans-serif;
    --bb-font-display: 'Abril Fatface', Georgia, serif;

    /* Shape. */
    --bb-radius-pill: 999px;
    --bb-radius-card: 16px;
    --bb-radius-input: 10px;
}