/* ============================================================
   OASIS PEST CONTROL — COLOR TOKENS
   Signature hue: "Oasis Blue" — derived from the 2026 Ford
   Maverick Light Blue (robin's-egg) paint on the service trucks.
   Warm sand neutrals evoke the desert; palm green signals the
   eco-friendly, family-safe promise.
   ============================================================ */
:root {
  /* --- Brand: Oasis Blue (primary) --- */
  --oasis-50:  #EEF9FB;
  --oasis-100: #D7F1F5;
  --oasis-200: #B4E5EC;
  --oasis-300: #8AD6E1;
  --oasis-400: #5FC3D4; /* ← signature truck "Light Blue" */
  --oasis-500: #37A6BA;
  --oasis-600: #2487A0; /* primary action (AA on white) */
  --oasis-700: #1F6C82;
  --oasis-800: #1E5867;
  --oasis-900: #1C4856;

  /* --- Accent: Sun (warm gold, used sparingly) --- */
  --sun-200: #FFE9BD;
  --sun-300: #FFD98A;
  --sun-400: #FCC34F;
  --sun-500: #F5A623;
  --sun-600: #D9870C;

  /* --- Palm (eco / success) --- */
  --palm-100: #E0F3E9;
  --palm-300: #95D8B4;
  --palm-400: #5FBF8A;
  --palm-500: #2FA56B;
  --palm-600: #1E8454;

  /* --- Clay (warning / desert dust) --- */
  --clay-100: #FBE7D6;
  --clay-400: #ED9A5C;
  --clay-500: #D97A35;

  /* --- Coral (danger) --- */
  --coral-100: #FBE0DD;
  --coral-400: #EF7B72;
  --coral-500: #DB4F44;
  --coral-600: #B83A30;

  /* --- Neutral: cool slate (faint blue tint) --- */
  --slate-50:  #F6F8F9;
  --slate-100: #ECF1F3;
  --slate-200: #DCE4E7;
  --slate-300: #C3CFD4;
  --slate-400: #9AAAB1;
  --slate-500: #6E7F86;
  --slate-600: #4E5D63;
  --slate-700: #384449;
  --slate-800: #243036;
  --slate-900: #152229;

  /* --- Sand (warm surface neutrals) --- */
  --sand-50: #FBF8F3;
  --sand-100: #F5EFE4;
  --sand-200: #ECE3D2;

  --white: #FFFFFF;
  --black: #0B1518;

  /* ===========================================================
     SEMANTIC ALIASES — reference these in components, not the
     raw scale values above.
     =========================================================== */

  /* Surfaces & backgrounds */
  --color-bg:            var(--sand-50);
  --color-surface:       var(--white);
  --color-surface-sunken:var(--slate-50);
  --color-surface-warm:  var(--sand-100);
  --color-surface-brand: var(--oasis-50);
  --color-surface-ink:   var(--slate-900);

  /* Text */
  --text-strong:  var(--slate-900);
  --text-body:    var(--slate-700);
  --text-muted:   var(--slate-500);
  --text-inverse: var(--white);
  --text-brand:   var(--oasis-700);
  --text-on-brand:var(--white);

  /* Brand actions */
  --brand:          var(--oasis-600);
  --brand-hover:    var(--oasis-700);
  --brand-active:   var(--oasis-800);
  --brand-soft:     var(--oasis-100);
  --brand-soft-text:var(--oasis-800);
  --brand-signature:var(--oasis-400); /* the truck color, for fills & illustration */

  /* Accent */
  --accent:       var(--sun-500);
  --accent-hover: var(--sun-600);
  --accent-soft:  var(--sun-200);
  --accent-text:  #6A4A07;

  /* Eco */
  --eco:      var(--palm-500);
  --eco-soft: var(--palm-100);
  --eco-text: var(--palm-600);

  /* Status */
  --success:      var(--palm-500);
  --success-soft: var(--palm-100);
  --warning:      var(--clay-500);
  --warning-soft: var(--clay-100);
  --danger:       var(--coral-500);
  --danger-soft:  var(--coral-100);
  --info:         var(--oasis-600);
  --info-soft:    var(--oasis-100);

  /* Borders & lines */
  --border:        var(--slate-200);
  --border-strong: var(--slate-300);
  --border-brand:  var(--oasis-200);
  --divider:       var(--slate-100);

  /* Focus */
  --focus-ring: var(--oasis-400);
}
