/**
 * assets/css/theme.css
 * ---------------------------------------------------------------------
 * Shared design tokens for the whole site (capture forms, admin
 * dashboard, login screen). Link it from <head>:
 *
 *   <link rel="stylesheet" href="assets/css/theme.css">
 *   (use "../assets/css/theme.css" etc. if the page lives in a subfolder)
 *
 * A page can still override individual variables afterwards in its own
 * <style> block if it genuinely needs a different value — e.g. the
 * admin dashboard uses a slightly tighter --radius. CSS custom
 * properties cascade normally, so a later :root rule wins.
 * ---------------------------------------------------------------------
 */
:root {
  --green-dark: #1a3a2a;
  --green-mid: #2d6b4a;
  --green-light: #4a9e72;
  --green-pale: #e8f5ee;

  --amber: #e8a020;
  --amber-light: #fff4e0;

  --red: #c0392b;
  --red-light: #fdecea;

  --blue: #1a3a7a;
  --blue-mid: #2d4a9e;
  --blue-light: #e8f0fe;

  --text: #1a1a1a;
  --text-muted: #5a6a62;
  --border: #ccddd4;
  --surface: #ffffff;
  --bg: #f4f8f5;

  --radius: 12px;
  --radius-sm: 8px;
}
