/*
 * BestCarBuyer theme.
 *
 * Loaded at runtime via a <link> in nuxt.config.ts, keyed off the
 * NUXT_PUBLIC_THEME env var (default "bestcarbuyer"). Lives in public/ — NOT
 * bundled — so a different tenant can ship its own public/themes/<name>/
 * directory (fonts + tokens + assets) and be selected per deployment without
 * a rebuild of the app code.
 *
 * It overrides the `--t-*` design tokens that app/assets/css/main.css feeds
 * into Tailwind's @theme (each Tailwind token is `var(--t-x, <fallback>)`, so
 * load order doesn't matter and a missing theme file just falls back to these
 * same BestCarBuyer values). Fonts are self-hosted woff2 in ./fonts.
 */

@font-face {
  font-family: "Mona Sans";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("./fonts/mona-sans-400.woff2") format("woff2");
}
@font-face {
  font-family: "Mona Sans";
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("./fonts/mona-sans-700.woff2") format("woff2");
}
@font-face {
  font-family: "Nunito Sans";
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url("./fonts/nunito-sans-800.woff2") format("woff2");
}
@font-face {
  font-family: "Inter";
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("./fonts/inter-700.woff2") format("woff2");
}

:root {
  /* Colours */
  --t-bg-primary: #f5f5f5;
  --t-bg-secondary: #ffffff;
  --t-border: #d5d9e1;
  --t-text-primary: #000000;
  --t-text-secondary: #555555;
  --t-text-disabled: #adbcbe;

  --t-brand-primary: #00a0df;
  --t-brand-secondary: #9594ff;
  --t-accent-pink: #cb5699;
  --t-amber: #ffd860;
  --t-green-light: #49b475;
  --t-green-dark: #7fe3a9;

  /* Support button gradient (header) */
  --t-support-from: #428df5;
  --t-support-to: #9e6efb;

  /* Typography */
  --t-font-display: "Nunito Sans", system-ui, sans-serif;
  --t-font-body: "Mona Sans", system-ui, sans-serif;
  --t-font-button: "Inter", system-ui, sans-serif;
}

/*
 * The inner-page watermark image is `page-bg.png` in this directory, loaded by
 * <PageBackdrop> via useTheme() (not a CSS var — see that component for why).
 */