/*
 * Theme tokens: the single place to change brand colours, fonts and shape.
 * Component styles in site.css reference these variables only.
 * (The enquiry email template repeats a few of these values inline because
 * email clients do not support CSS variables.)
 */

:root {
  /* Brand colours (sampled from the TBSA logo) */
  --color-primary: #c21f4a;          /* Rose: buttons, links, active states (AA contrast on white) */
  --color-primary-rgb: 194, 31, 74;
  --color-primary-dark: #9e1739;     /* Hover/pressed state of primary */
  --color-primary-bright: #e3325a;   /* Logo crimson: decorative accents only, not body text */
  --color-secondary: #8e3f78;        /* Plum: headings accents, secondary actions */
  --color-secondary-rgb: 142, 63, 120;
  --color-secondary-dark: #6f2f5d;

  /* Neutrals and surfaces */
  --color-body-bg: #fffafc;
  --color-surface: #ffffff;
  --color-blush: #fdf2f6;            /* Soft section background */
  --color-blush-strong: #f9e1eb;     /* Icon tiles, chips */
  --color-border: #f0dbe4;
  --color-text: #2a2230;
  --color-text-muted: #6b6070;
  --color-heading: #2a1b2e;
  --color-dark: #1f1724;             /* Footer and dark bands */
  --color-dark-rgb: 31, 23, 36;
  --color-dark-text: #e9dfe7;
  --color-dark-muted: #b9a9b5;
  --color-white: #ffffff;

  /* Feedback states */
  --color-success: #1f7a4d;
  --color-success-bg: #e8f6ee;
  --color-error: #b42318;
  --color-error-bg: #fdecea;
  --color-warning: #8a5a00;
  --color-warning-bg: #fff4dc;
  --color-focus-ring: rgba(194, 31, 74, 0.35);

  /* Gradients */
  --gradient-brand: linear-gradient(135deg, var(--color-primary) 0%, var(--color-secondary) 100%);
  --gradient-soft: linear-gradient(180deg, var(--color-blush) 0%, var(--color-body-bg) 100%);

  /* Typography */
  --font-heading: "Playfair Display", Georgia, "Times New Roman", serif;
  --font-body: "Poppins", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;

  /* Shape and depth */
  --radius-sm: 8px;
  --radius: 14px;
  --radius-lg: 24px;
  --radius-pill: 999px;
  --shadow-sm: 0 2px 10px rgba(42, 27, 46, 0.06);
  --shadow: 0 12px 32px rgba(42, 27, 46, 0.10);
  --shadow-lg: 0 24px 60px rgba(142, 63, 120, 0.18);

  /* Motion */
  --ease-out: cubic-bezier(0.22, 1, 0.36, 1);
  --duration: 0.7s;

  /* Bootstrap mapping */
  --bs-primary: var(--color-primary);
  --bs-primary-rgb: var(--color-primary-rgb);
  --bs-secondary: var(--color-secondary);
  --bs-secondary-rgb: var(--color-secondary-rgb);
  --bs-body-bg: var(--color-body-bg);
  --bs-body-color: var(--color-text);
  --bs-body-font-family: var(--font-body);
  --bs-heading-color: var(--color-heading);
  --bs-link-color: var(--color-primary);
  --bs-link-color-rgb: var(--color-primary-rgb);
  --bs-link-hover-color: var(--color-primary-dark);
  --bs-border-color: var(--color-border);
  --bs-border-radius: var(--radius-sm);
  --bs-border-radius-lg: var(--radius);
  --bs-secondary-color: var(--color-text-muted);
  --bs-focus-ring-color: var(--color-focus-ring);
}