/*
 * Design tokens sampled from the reference screenshots (1920px-wide captures).
 * See PLAN.md §3.4. Change values here, not in component CSS.
 */
:root {
  /* Teams palette used by the real app */
  --topbar-bg: #464775;
  --sidebar-bg: #33344A;
  --sidebar-hover: #3E3F57;
  --accent: #6264A7;
  --accent-hover: #585A96;
  --accent-pressed: #464775;
  --accent-light: #E2E2F6;
  --accent-text: #6264A7;
  --page-bg: #F3F2F1;
  --card-bg: #FFFFFF;
  --band-bg: #FAF9F8;        /* grid toolbar + header row */
  --tabstrip-bg: #F7F7F7;
  --border: #E1DFDD;
  --border-strong: #C8C6C4;
  --grid-line: #DDDDDD;
  --row-line: #EDEBE9;
  --row-hover: #F5F5F5;

  --text: #252423;
  --text-secondary: #605E5C;
  --text-muted: #A19F9D;
  --text-disabled: #C8C6C4;
  --text-on-accent: #FFFFFF;

  --live-red: #C4314B;
  --danger: #C4314B;
  --success: #237B4B;
  --tree-check: #10B981;      /* permission tree checkbox (screenshots_3) */
  --note-bg: #F7F6DA;
  --note-border: #E1DABD;

  /* Agent status colors (cc-demo-notes §7) */
  --status-available: rgba(146, 195, 83, 1);
  --status-break: rgba(253, 185, 19, 1);
  --status-off: rgba(212, 212, 212, 1);

  /* Teams presence */
  --presence-available: #92C353;
  --presence-busy: #C4314B;
  --presence-away: #FDB913;
  --presence-offline: #8A8886;

  /* Layout */
  --topbar-h: 53px;
  --sidebar-w: 281px;
  --page-pad-x: 38px;
  --page-header-h: 57px;
  --nav-row-h: 48px;
  --nav-child-h: 44px;
  --field-h: 40px;
  --form-w: 912px;
  --editor-w: 780px;          /* full-width controls on edit pages (006, 007, 013, 202610 captures) */
  --btn-h: 35px;

  --font: "Segoe UI", "Segoe UI Web (West European)", "LCC Selawik", -apple-system, BlinkMacSystemFont, Roboto, "Helvetica Neue", sans-serif;
  --fs-base: 15px;
  --fs-small: 13px;
  --fs-title: 20px;

  --shadow-popup: 0 2px 8px rgba(0, 0, 0, 0.18);
  --shadow-modal: 0 6px 24px rgba(0, 0, 0, 0.2);
  --radius: 3px;
}