/*
 * SRH Tokens — PwC Core Library Figma (file ShhKt7RaIpHnRrIcTEfJmc)
 * :root declarations only. Loaded first in app_include_css and
 * web_include_css so all downstream CSS can var() through these tokens.
 *
 * WCAG AA verified on the bg/text pairings declared in srh_status.css.
 */
:root {
	/* Brand — Orange */
	--srh-brand-50:   #FFF5ED;
	--srh-brand-100:  #FFE8D4;
	--srh-brand-200:  #FFCDA8;
	--srh-brand-300:  #FFAA72; /* primary CTA bg — paired with grey-1000 text (10.10:1, AAA) */
	--srh-brand-400:  #FE7C39; /* primary CTA hover bg */
	--srh-brand-500:  #FD5109; /* PwC exact brand orange (confirmed by Nihaan 2026-05-11); used for hover state and brand emphasis, not primary CTA bg */
	--srh-brand-600:  #EE3D08;
	--srh-brand-700:  #C52B09; /* accent text on light surface */
	--srh-brand-800:  #9C2310;
	--srh-brand-900:  #691203;
	--srh-brand-950:  #440C06;
	--srh-brand-1000: #1F0606;

	/* Neutrals — Grey */
	--srh-grey-50:    #F5F7F8;
	--srh-grey-100:   #EEEFF1;
	--srh-grey-200:   #DFE3E6;
	--srh-grey-300:   #CBD1D6;
	--srh-grey-400:   #B5BCC4;
	--srh-grey-500:   #A1A8B3;
	--srh-grey-600:   #8E95A2;
	--srh-grey-700:   #787E8A;
	--srh-grey-800:   #626771;
	--srh-grey-900:   #4C5056;
	--srh-grey-950:   #303236;
	--srh-grey-1000:  #111113; /* primary text — 18.86:1 on white, AAA */

	/* Status */
	--srh-info-50:     #EFF6FF;
	--srh-info-500:    #2563EB;
	--srh-success-50:  #ECFDF5;
	--srh-success-500: #059669;
	--srh-success-700: #077C59; /* body text variant — 5.20:1 AA on white */
	--srh-warning-50:  #FCFAEA;
	--srh-warning-300: #E9B01F;
	--srh-error-50:    #FEF2F2;
	--srh-error-600:   #D12121;

	/* Typography */
	--srh-font-sans:  'Helvetica Neue', Helvetica, Arial, system-ui, sans-serif;
	--srh-font-serif: 'ITC Charter Com', Georgia, serif;
	--srh-text-caption: 12px;
	--srh-text-body:    14px;
	--srh-text-body-lg: 18px;
	--srh-text-heading: 24px;
	--srh-text-title:   32px;
	--srh-text-display: 48px;

	/* Shape — sharper than Frappe defaults per PwC Core Library spec.
	 * radius-xs (2px) is the new default for buttons, inputs, checkboxes.
	 * radius-sm (4px) for cards and dialog surfaces. Anything rounder than
	 * 4px is reserved for status pills and avatars. */
	--srh-radius-none: 0;
	--srh-radius-xs:   2px;
	--srh-radius-sm:   4px;
	--srh-radius-md:   8px;
	--srh-radius-lg:   12px;
}