/* ==========================================================================
   JAN-PRO Cleaning & Disinfecting — Color Tokens
   Source: 2024 Brand Guidelines (Aug 2024).
   The Cleaning & Disinfecting (consumer / unit-franchisee) palette is primary.
   The Franchise Development palette is included as a sister-brand theme.
   ========================================================================== */
:root {
  /* --- Brand primaries (Cleaning & Disinfecting) --- */
  --royal-blue: #003DA5;   /* PMS 293  — primary accent, headlines, blue bar */
  --green:      #78BE21;   /* PMS 368  — secondary accent */
  --ink:        #27251F;   /* PMS Process Black — warm near-black, body text */
  --white:      #FFFFFF;   /* PMS Bright White — dominant negative space */

  /* --- Secondary accents (use ONE at a time, as strokes/frames only) --- */
  --yellow-green: #D2E178; /* PMS 373 */
  --teal:         #25B99B; /* PMS 2401 */
  --lavender:     #B3A4D0; /* PMS 2635 */
  --marigold:     #FFDB5B; /* PMS 120 */

  /* --- Sister brand: Franchise Development (regional developer) --- */
  --navy-blue:  #001E60;   /* PMS 2757 */
  --ocean-blue: #0D9DDB;   /* PMS 2925 */
  --sky-blue:   #BCC7E2;   /* PMS 2708 */
  --slate:      #7A9292;   /* PMS 430 */
  --citrus:     #DCD14A;   /* PMS 603 */
  --lilac:      #BF7FB0;   /* PMS 514 */

  /* --- Neutrals (derived from ink/white for UI surfaces) --- */
  --gray-900: #27251F;
  --gray-700: #4A4843;
  --gray-500: #7A7872;
  --gray-400: #A5A39E;
  --gray-300: #D6D4CF;
  --gray-200: #E8E7E3;
  --gray-100: #F4F3F0;
  --gray-50:  #FAFAF8;

  /* --- Functional tints (Royal Blue / Green washes for fills & hovers) --- */
  --royal-blue-700: #002F80;  /* darker — press/hover on blue */
  --royal-blue-100: #E5EDF8;  /* pale blue surface */
  --green-700:      #5E981A;  /* darker — press/hover on green */
  --green-100:      #EEF6E0;  /* pale green surface */

  /* --- Semantic aliases --- */
  --color-bg:            var(--white);
  --color-surface:       var(--white);
  --color-surface-muted: var(--gray-50);
  --color-surface-sunken: var(--gray-100);

  --text-primary:   var(--ink);
  --text-secondary: var(--gray-700);
  --text-muted:     var(--gray-500);
  --text-on-brand:  var(--white);
  --text-link:      var(--royal-blue);

  --color-accent:        var(--royal-blue);
  --color-accent-hover:  var(--royal-blue-700);
  --color-accent-soft:   var(--royal-blue-100);
  --color-accent-2:      var(--green);
  --color-accent-2-hover: var(--green-700);
  --color-accent-2-soft: var(--green-100);

  --color-border:        var(--gray-300);
  --color-border-strong: var(--gray-400);
  --color-focus-ring:    var(--ocean-blue);

  /* Status — derived from palette (guidelines define no status colors) */
  --color-success: var(--green);
  --color-info:    var(--royal-blue);
  --color-warning: var(--marigold);
  --color-danger:  #C0392B;
}