﻿/* =========================================================================
   PsychSupport & Educational Services â€” international 5-star palette
   - Tokens align with NHS / APA / IAPT clinical brand guidance:
     calming clinical teal-blue + sage green + warm gold accent.
   - All primary text colors meet WCAG 2.1 AA on white (>= 4.5:1).
   - Drives the Calmind theme via --primary-color / --secondary-color and
     extends with status, accent, shadow, focus, and surface tokens used
     by custom-psychology.css and frontend-5star.css.
   ========================================================================= */
:root {
  /* Brand */
  --primary-color: #1F6F8B;          /* clinical teal-blue */
  --primary-color-rgb: 31, 111, 139;
  --primary-color-dark: #14516A;
  --primary-color-light: #E6F0F4;

  --secondary-color: #6A9C89;        /* sage green */
  --secondary-color-rgb: 106, 156, 137;
  --secondary-color-dark: #4F7D6C;
  --secondary-color-light: #ECF3F0;

  --accent-color: #C8A961;           /* warm gold */
  --accent-color-rgb: 200, 169, 97;
  --accent-color-dark: #A88945;
  --accent-color-light: #F6EFDD;

  /* Neutrals */
  --ink-900: #0F2A3D;
  --ink-800: #14283A;
  --ink-700: #2E3B4D;
  --ink-500: #5B6B7C;
  --ink-300: #94A3B0;
  --ink-200: #DCE5EA;
  --surface-50: #FAFBFC;
  --surface-100: #F4F7F9;
  --surface-200: #E9EFF2;

  /* Status (WCAG AA on white) */
  --color-success: #2E8B57;
  --color-success-rgb: 46, 139, 87;
  --color-warning: #B8740A;
  --color-warning-rgb: 184, 116, 10;
  --color-danger: #B23A48;
  --color-danger-rgb: 178, 58, 72;
  --color-info: var(--primary-color);

  /* Elevation */
  --shadow-xs: 0 1px 2px rgba(20, 40, 58, .04);
  --shadow-sm: 0 1px 2px rgba(20, 40, 58, .04), 0 1px 3px rgba(20, 40, 58, .06);
  --shadow-md: 0 4px 12px rgba(20, 40, 58, .08), 0 2px 4px rgba(20, 40, 58, .04);
  --shadow-lg: 0 12px 32px rgba(20, 40, 58, .10), 0 4px 8px rgba(20, 40, 58, .06);
  --shadow-xl: 0 24px 60px rgba(20, 40, 58, .14), 0 8px 16px rgba(20, 40, 58, .08);
  --shadow-focus: 0 0 0 3px rgba(var(--primary-color-rgb), .35);

  /* Radii */
  --r-sm: 6px;
  --r-md: 12px;
  --r-lg: 20px;
  --r-xl: 28px;
  --r-pill: 999px;
}