/* AWS Cloudscape-inspired design tokens (light mode, dark global nav) */
:root {
  /* text */
  --t-body: #16191f;
  --t-secondary: #5f6b7a;
  --t-muted: #8d9aa7;
  --t-link: #0972d3;
  --t-link-hover: #033160;
  --t-on-dark: #f2f3f3;
  --t-on-dark-dim: #c3cbd5;
  --t-inverted: #ffffff;

  /* surfaces */
  --bg-layout: #f2f3f3;
  --bg-container: #ffffff;
  --bg-container-sub: #fafafa;
  --bg-input: #ffffff;
  --bg-hover: #f4f4f4;
  --bg-selected: #f1faff;
  --bg-stripe: #fafafa;
  --bg-disabled: #f4f4f4;

  /* borders */
  --b-divider: #eaeded;
  --b-item: #e9ebed;
  --b-input: #414d5c;
  --b-input-hover: #16191f;
  --b-focus: #0972d3;

  /* brand */
  --nav-bg: #232f3e;
  --nav-bg-hover: rgba(255, 255, 255, 0.12);
  --nav-bg-active: #37475a;
  --nav-panel: #232f3e;
  --aws-orange: #ec7211;
  --aws-orange-hover: #dd6b10;
  --aws-orange-active: #ec7211;

  /* buttons */
  --btn-primary-bg: #ec7211;
  --btn-primary-hover: #dd6b10;
  --btn-primary-active: #ec7211;
  --btn-primary-text: #ffffff;
  --btn-normal-bg: #ffffff;
  --btn-normal-border: #a9b1ba;
  --btn-normal-text: #16191f;
  --btn-normal-hover: #f4f4f4;
  --btn-flash-bg: #0f4b74;
  --btn-flash-text: #ffffff;

  /* status */
  --s-ok: #037f0c;
  --s-ok-bg: #e9f7ec;
  --s-warning: #8d6605;
  --s-warning-bg: #fdf3d7;
  --s-error: #d91515;
  --s-error-bg: #fdeaea;
  --s-info: #0972d3;
  --s-info-bg: #f0f6ff;
  --s-pending: #5f6b7a;
  --s-pending-bg: #f0f2f4;
  --s-alarm-red: #d91515;

  /* chart palette */
  --c-blue: #0972d3;
  --c-orange: #ec7211;
  --c-green: #1d8102;
  --c-red: #d91515;
  --c-purple: #6c4bb6;
  --c-teal: #0d7d8c;

  /* metrics */
  --radius-btn: 20px;
  --radius-card: 8px;
  --radius-input: 8px;
  --shadow-dropdown: 0 1px 4px rgba(0, 0, 0, 0.2), 0 4px 14px rgba(0, 0, 0, 0.14);
  --shadow-modal: 0 4px 20px rgba(0, 0, 0, 0.25);
  --shadow-card: 0 1px 1px rgba(0, 0, 0, 0.03), 0 2px 4px rgba(0, 0, 0, 0.04);
  --shadow-sticky: 0 3px 6px rgba(0, 0, 0, 0.1);

  /* layout */
  --nav-h: 42px;
  --sidenav-w: 260px;
  --sidenav-w-collapsed: 0px;
  --content-max: 1600px;

  font-family: "Amazon Ember", "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 14px;
  color: var(--t-body);
}