/* ==========================================================================
   Galri — Colors
   Brand pack: 4 colors + noir. Apple green is the primary.
   APPLE  #95c11f  · primary / action / brand
   SKY    #62aade  · secondary / links / focus
   CLOUD  #8ccab2  · soft / mint accent
   LIGHT  #ffdd00  · highlight / energy (use sparingly)
   NOIR   #1d1d1b  · ink / dark surfaces
   ========================================================================== */
:root {
  /* ---- Brand scales -------------------------------------------------- */
  /* Apple (green) — primary */
  --apple-50:  #f4f9e6;
  --apple-100: #e7f3c6;
  --apple-200: #d3e996;
  --apple-300: #bcdc63;
  --apple-400: #a8cf3c;
  --apple-500: #95c11f;  /* brand */
  --apple-600: #7da417;
  --apple-700: #627f14;
  --apple-800: #4c6213;
  --apple-900: #3e4f15;

  /* Sky (blue) — secondary */
  --sky-50:  #eef6fc;
  --sky-100: #d6eaf8;
  --sky-200: #b2d7f1;
  --sky-300: #8cc1e8;
  --sky-400: #62aade;  /* brand */
  --sky-500: #4794ce;
  --sky-600: #3a7cb3;
  --sky-700: #336690;
  --sky-800: #2e5575;
  --sky-900: #294861;

  /* Cloud (mint) */
  --cloud-50:  #eff8f3;
  --cloud-100: #d8efe2;
  --cloud-200: #b4e0c9;
  --cloud-300: #8ccab2;  /* brand */
  --cloud-400: #6bb89a;
  --cloud-500: #4fa080;
  --cloud-600: #3d8268;

  /* Light (yellow) */
  --yellow-300: #ffe85c;
  --yellow-400: #ffe02e;
  --yellow-500: #ffdd00;  /* brand */
  --yellow-600: #e6c000;

  /* ---- Neutral scale (Apple-like cool greys, noir-anchored) ---------- */
  --noir:       #1d1d1b;  /* brand black */
  --neutral-0:   #ffffff;
  --neutral-50:  #fbfbfa;
  --neutral-100: #f5f5f3;
  --neutral-150: #ededeb;
  --neutral-200: #e3e3e0;
  --neutral-300: #cfcfca;
  --neutral-400: #adada7;
  --neutral-500: #86867f;
  --neutral-600: #62625c;
  --neutral-700: #46463f;
  --neutral-800: #2c2c28;
  --neutral-900: #1d1d1b;

  /* ---- Signature gradient (logo / hero) ------------------------------ */
  /* yellow → cloud → sky → apple, mirrors the brand mark */
  --gradient-brand: linear-gradient(120deg, #ffdd00 0%, #8ccab2 38%, #62aade 64%, #95c11f 100%); /* @kind color */
  --gradient-brand-soft: linear-gradient(120deg, #fff6c2 0%, #d8efe2 40%, #d6eaf8 66%, #e7f3c6 100%); /* @kind color */
  --gradient-cool: linear-gradient(135deg, #62aade 0%, #8ccab2 100%); /* @kind color */

  /* =====================================================================
     Semantic aliases — reference these in components, not the raw scales.
     ===================================================================== */
  /* Surfaces */
  --bg:            var(--neutral-50);
  --surface:       var(--neutral-0);
  --surface-sunken:var(--neutral-100);
  --surface-dark:  var(--noir);
  --overlay-scrim: rgba(29, 29, 27, 0.55);

  /* Text */
  --text:          var(--noir);
  --text-secondary:var(--neutral-600);
  --text-muted:    var(--neutral-500);
  --text-on-dark:  var(--neutral-0);
  --text-on-dark-muted: rgba(255, 255, 255, 0.66);
  --text-on-accent:var(--noir);   /* apple/yellow are light → dark ink */

  /* Brand / actions */
  --primary:        var(--apple-500);
  --primary-hover:  var(--apple-600);
  --primary-active: var(--apple-700);
  --primary-soft:   var(--apple-50);
  --secondary:      var(--sky-400);
  --secondary-hover:var(--sky-500);
  --accent-mint:    var(--cloud-300);
  --accent-yellow:  var(--yellow-500);

  /* Lines & focus */
  --border:        var(--neutral-200);
  --border-strong: var(--neutral-300);
  --ring:          var(--sky-400);

  /* Status (kept tonal & calm, in brand family where possible) */
  --success:       var(--apple-600);
  --success-soft:  var(--apple-50);
  --info:          var(--sky-400);
  --info-soft:     var(--sky-50);
  --warning:       #e8a000;
  --warning-soft:  #fdf4d8;
  --danger:        #d9483b;
  --danger-soft:   #fcebe9;

  /* Link */
  --link:          var(--sky-600);
  --link-hover:    var(--sky-700);
}
