/* ============================================================
   The Meetings Space — Colour tokens
   Source: TMS Brand Guidelines (Section 03 — Colours)
   Three primary + three secondary brand colours. The website
   preferred combination is Yellow + Orange.
   ============================================================ */

:root {
  /* --- Brand palette (raw) ----------------------------------- */
  --tms-sky:        #97C3D8; /* Primary  RGB 151 195 216 */
  --tms-teal:       #4E8285; /* Primary  RGB  78 130 133 */
  --tms-yellow:     #FFBE3F; /* Primary  RGB 255 190  63 */
  --tms-pale-blue:  #D2E2EA; /* Secondary RGB 210 226 234 */
  --tms-navy:       #154064; /* Secondary RGB  21  64 100 */
  --tms-orange:     #FE965C; /* Secondary RGB 254 150  92 */

  --tms-black:      #14181B; /* Logo / ink black (soft) */
  --tms-white:      #FFFFFF;

  /* --- Tints & shades (derived, harmonious) ------------------ */
  --tms-navy-900:   #0C2740;
  --tms-navy-700:   #103352;
  --tms-navy-600:   #154064;
  --tms-navy-500:   #2A5C82;
  --tms-navy-300:   #6E94B2;

  --tms-teal-900:   #284749;
  --tms-teal-800:   #325456;
  --tms-teal-700:   #3B6669;
  --tms-teal-600:   #44757A;
  --tms-teal-500:   #4E8285;
  --tms-teal-300:   #82AAAC;
  --tms-teal-100:   #DCE9E9;

  --tms-sky-300:    #BBD8E6;
  --tms-sky-100:    #E4F0F6;

  --tms-pale-100:   #EDF4F7; /* page tint, from pale-blue */
  --tms-pale-50:    #F5F9FB;

  --tms-yellow-600: #F2AC23;
  --tms-yellow-400: #FFCB63;
  --tms-orange-600: #F37E3C;
  --tms-orange-400: #FFAE7E;

  /* Neutrals (cool-leaning to match the blue family) */
  --tms-grey-900:   #1B2730;
  --tms-grey-700:   #3D4D59;
  --tms-grey-500:   #6B7C88;
  --tms-grey-300:   #AEBEC8;
  --tms-grey-200:   #CDD9E1;
  --tms-grey-100:   #E7EEF2;
  --tms-grey-50:    #F4F8FA;

  /* --- Semantic aliases -------------------------------------- */
  --color-ink:            var(--tms-navy);     /* primary text */
  --color-text:           var(--tms-navy-700);
  --color-text-secondary: var(--tms-teal);
  --color-text-muted:     var(--tms-grey-500);
  --color-text-inverse:   var(--tms-white);
  --color-text-on-accent: var(--tms-navy-900);

  --color-brand:          var(--tms-teal);     /* anchor brand colour — used most often */
  --color-brand-deep:     var(--tms-navy);     /* deep accent / high-contrast moments */
  --color-brand-soft:     var(--tms-teal-300);
  --color-accent:         var(--tms-yellow);   /* primary highlight */
  --color-accent-warm:    var(--tms-orange);   /* paired CTA colour  */

  --surface-page:    var(--tms-white);
  --surface-subtle:  var(--tms-grey-50);
  --surface-tint:    var(--tms-pale-100);
  --surface-card:    var(--tms-white);
  --surface-inverse: var(--tms-teal-700);
  --surface-accent:  var(--tms-pale-blue);

  --border-subtle:  var(--tms-grey-200);
  --border-default: var(--tms-grey-300);
  --border-strong:  var(--tms-navy-300);

  --focus-ring:     var(--tms-sky);

  /* Gradients — teal brand depth + signature Yellow → Orange CTA wash */
  --gradient-cta:    linear-gradient(100deg, var(--tms-yellow) 0%, var(--tms-orange) 100%);
  --gradient-sky:    linear-gradient(160deg, var(--tms-sky-100) 0%, var(--tms-pale-blue) 100%);
  --gradient-teal:   linear-gradient(155deg, var(--tms-teal-600) 0%, var(--tms-teal-900) 100%);
  --gradient-navy:   linear-gradient(155deg, var(--tms-navy-700) 0%, var(--tms-navy-900) 100%);

  /* Status (kept on-brand, used sparingly) */
  --color-success: #3F8F6B;
  --color-warning: var(--tms-yellow-600);
  --color-danger:  #C8485B;
  --color-info:    var(--tms-teal);
}