/* ===========================================================================
   Zero Deposit — Colour tokens
   Primary is black & white; pink (Deposit/corporate) and teal (Guarantor+)
   are the two accents. `--accent` defaults to pink and flips to teal inside
   `.theme-guarantor` / `[data-theme="guarantor"]`.
   Values from the ZD Brand Guidelines.
   =========================================================================== */

:root {
  /* ---- Brand core ------------------------------------------------------ */
  --zd-black: #232129;      /* Baltic Sea — primary ink */
  --zd-white: #ffffff;

  /* ---- Pink (Deposit / corporate accent) ------------------------------ */
  --zd-pink: #f45372;       /* French Rose */
  --zd-pink-100: #fcd9e0;   /* light tint  */
  --zd-pink-700: #d83a59;   /* dark / hover */

  /* ---- Teal (Guarantor+ accent) --------------------------------------- */
  --zd-teal: #00a9a5;
  --zd-teal-100: #d3edec;   /* light tint  */
  --zd-teal-700: #008a87;   /* dark / hover */

  /* ---- Neutrals -------------------------------------------------------- */
  --zd-grey-xlight: #f8f8f8;
  --zd-grey-light: #eeeeee;
  --zd-grey: #979797;
  --zd-grey-600: #6c6c70;

  /* ---- Semantic surfaces ---------------------------------------------- */
  --surface-page: #ffffff;
  --surface-subtle: #f8f8f8;   /* @kind color */
  --surface-card: #ffffff;     /* @kind color */

  /* ---- Semantic text --------------------------------------------------- */
  --text-strong: #232129;
  --text-body: #3a3842;
  --text-muted: #6c6c70;
  --text-on-dark: #ffffff;

  /* ---- Semantic borders ------------------------------------------------ */
  --border-subtle: #eeeeee;
  --border-strong: #c7c7c8;

  /* ---- Accent (theme-switchable) -------------------------------------- */
  --accent: var(--zd-pink);
  --accent-strong: var(--zd-pink-700);
  --accent-100: var(--zd-pink-100);
}

/* Guarantor+ theme — accent flips to teal */
.theme-guarantor,
[data-theme="guarantor"] {
  --accent: var(--zd-teal);
  --accent-strong: var(--zd-teal-700);
  --accent-100: var(--zd-teal-100);
}