/* TXM Physician Scheduling stylesheet, split by area. App.razor links these files in order
   (tokens, base, controls, calendar, desk, auth, requests, charts, adapt); the design canvas
   keeps the same rules in the same order in one file, project/txm-app.css. Brand values come
   from the TXM Expanded Brand Guidelines (colours p.17, type p.18); derived tints and the darker
   "ink" shades exist only to keep text at 4.5:1. */

:root {
  /* Brand palette */
  --txm-blue: #4D7DBF;
  --txm-dark-green: #1F2E28;
  --txm-dark-gray: #34454B;
  --txm-medium-gray: #526470;
  --txm-green: #76B2A0;
  --txm-light-gray: #D3DAE3;

  /* Blue: ink shade for text and filled buttons (5.4:1 on white), tints for surfaces */
  --blue-ink: #3D6BAA;
  --blue-deep: #2F5A94;
  --blue-75: #7A9ECF;
  --blue-50: #A6BEDF;
  --blue-25: #D3DFEF;
  --blue-15: #E4ECF5;
  --blue-8: #F1F5FA;

  /* Green: brand green fills carry dark-green text; the ink shade is for text on white */
  --green-ink: #3F7A68;
  --green-deep: #2E5E50;
  --green-50: #BBD9D0;
  --green-25: #DDEBE7;
  --green-12: #EFF6F4;

  /* Neutrals */
  --ground: #F4F6F9;
  --surface: #FFFFFF;
  --sunken: #EEF1F5;
  --line: #E1E7EE;
  --line-strong: #C9D2DD;
  --ink: var(--txm-dark-green);
  --ink-2: var(--txm-medium-gray);
  --ink-3: #66747F;

  /* Function colours, outside the brand palette, used only for state */
  --attn: #E3A33B;
  --attn-ink: #8A5A00;
  --attn-bg: #FCEFD6;
  --crit: #D2553F;
  --crit-ink: #A63A2B;
  --crit-bg: #FBE8E4;

  --font: "Noto Sans Display", "Arial Narrow", sans-serif;
  --radius-s: 8px;
  --radius: 12px;
  --radius-l: 16px;
  --radius-xl: 22px;
  --shadow-1: 0 1px 2px rgba(31, 46, 40, .06), 0 1px 1px rgba(31, 46, 40, .03);
  --shadow-2: 0 2px 6px rgba(31, 46, 40, .06), 0 16px 36px -14px rgba(31, 46, 40, .22);
  --rail-w: 256px;
  --ease: cubic-bezier(.2, .8, .2, 1);
}
