/* Global Primitive Tokens */
:root {
  /* Color */
  --red-500: #e31721;
  --neutrals-white-100: #ffffff;
  --gray-700: #495057;
  --gray-900: #212529;
  --gray-50: #f6f6f6;
  --gray-100: #ecedee;
  --gray-500-alpha: rgba(33, 37, 41, 0.50);
  --red-300-alpha: rgba(227, 23, 33, 0.25);
  --status-blue-500: #177ee3;
  --status-blue-300-alpha: rgba(23, 126, 227, 0.25);
  --red-100-alpha: rgba(227, 31, 33, 0.10);
  --status-yellow-500: #f0be0a;
  --status-yellow-300-alpha: rgba(240, 190, 10, 0.25);
  --status-green-500: #4eb149;
  --status-green-300-alpha: rgba(78, 177, 73, 0.25);
  --red-700: #be131c;
  --gray-200-alpha: rgba(73, 80, 87, 0.25);
  --red-300: #f8c7c7;
  --red-100: #fce9e9;
  --status-green-300: #d3ebd1;
  --status-green-100: #edf7ed;
  --status-green-100-alpha: rgba(78, 177, 73, 0.10);
  --status-yellow-300: #fbefc2;
  --status-yellow-100-alpha: rgba(240, 190, 10, 0.10);
  --status-yellow-100: #fdf8e6;
  --status-blue-300: #c5dff8;
  --status-blue-100: #e8f2fc;
  --status-blue-100-alpha: rgba(23, 126, 227, 0.10);
  --gray-500: #909294;
  --gray-200: #d1d3d5;
  --gray-400-alpha: rgba(73, 80, 87, 0.50);
  --gray-300-alpha: rgba(33, 37, 41, 0.25);
  --gray-400: #a4a7ab;
  --gray-300: #c7c8c9;
  --red-400: #f18f90;
  --red-400-alpha: rgba(227, 23, 33, 0.50);
  --gray-1000: #000000;
  --status-red-500: #d92d20;
  --status-red-300: #f5cac7;
  --status-red-100: #fbeae9;
  --status-red-300-alpha: rgba(217, 45, 32, 0.25);
  --status-red-100-alpha: rgba(217, 45, 32, 0.10);
  --white-100: #ffffff;
  --white-50: rgba(255, 255, 255, 0.50);
  --white-0: rgba(255, 255, 255, 0.00);
  --neutrals-white-0: rgba(255, 255, 255, 0.00);
  --gray-25: #fcfcfc;

  /* Layout */
  --space-4: 4px;
  --space-8: 8px;
  --space-16: 16px;
  --space-32: 32px;
  --space-12: 12px;
  --space-24: 24px;
  --space-0: 0px;
  --space-2: 2px;
  --space--16: -16px;
  --space-40: 40px;
  --space-80: 80px;

  /* Shape */
  --radius-0: 0px;
  --radius-8: 8px;
  --radius-4: 4px;
  --radius-16: 16px;
  --border-width-0: 0px;
  --border-width-1: 1px;
  --border-width-2: 2px;
  --border-width-3: 3px;
  --border-width-15: 1.5px;
  --radius-1: 1px;
  --radius-12: 12px;
  --border-width-6: 6px;

  /* Typography */
  --font-weight-bold: "Bold";
  --line-height-24: 24px;
  --font-weight-regular: "Regular";
  --font-size-12: 12px;
  --font-weight-semibold: "SemiBold";
  --font-size-32: 32px;
  --font-size-16: 16px;
  --font-size-24: 24px;
  --font-size-48: 48px;
  --font-family-secondary: "Open Sans";
  --font-family-primary: "Roboto Condensed";
  --font-size-13: 13px;
  --line-height-28: 28px;
  --line-height-16: 16px;
  --line-height-40: 40px;
  --line-height-56: 56px;
  --line-height-32: 32px;
  --line-height-20: 20px;
  --font-size-8: 8px;
  --letter-spacing-05: 0.5%;
  --letter-spacing-025: 0.25%;
  --font-weight-400: "400";
  --font-weight-600: "600";
  --font-weight-800: "800";
}

/* Semantic Tokens */
:root {
  /* Text */
  --text-heading: #e31721;
  --text-strong: #212529;
  --text-body: #495057;
  --text-link-default: #e31721;
  --text-inverse-1: #ffffff;
  --text-on-brand: #ffffff;
  --text-link-hover: #be131c;
  --text-link-pressed: #be131c;
  --text-menuitem-default: #495057;
  --text-menuitem-hover: #be131c;
  --text-menuitem-pressed: #be131c;
  --text-menuitem-active: #000000;
  --text-inverse-muted: #212529;
  --text-disabled: #909294;
  --text-link-default-inverse: #e31721;
  --text-menuitem-disabled: #909294;
  --text-button-inverse-default: #ffffff;
  --text-button-inverse-hover: #ffffff;
  --text-button-inverse-pressed: #ffffff;
  --text-button-pressed: #212529;
  --text-button-default: #495057;
  --text-button-hover: #212529;
  --text-inverse-2: #ffffff;

  /* Surface */
  --surface-background: #ffffff;
  --surface-subtle: #f6f6f6;
  --surface-brand-1: #e31721;
  --surface-action-primary-default: #e31721;
  --surface-action-primary-hover: #be131c;
  --surface-action-primary-pressed: #be131c;
  --surface-brand-2: #e31721;
  --surface-feedback-success: #4eb149;
  --surface-feedback-warning: #f0be0a;
  --surface-feedback-error: #d92d20;
  --surface-feedback-success-subtle: #edf7ed;
  --surface-feedback-warning-subtle: #fdf8e6;
  --surface-feedback-error-subtle: #fbeae9;
  --surface-feedback-info: #177ee3;
  --surface-feedback-info-subtle: #e8f2fc;
  --surface-base: #ffffff;
  --surface-skrim: rgba(33, 37, 41, 0.50);
  --surface-action-secondary-subtle-default: #ffffff;
  --surface-action-secondary-subtle-hover: #ffffff;
  --surface-action-secondary-subtle-pressed: #212529;
  --surface-muted: #ecedee;
  --surface-action-secondary-inverse-default: rgba(255, 255, 255, 0.00);
  --surface-action-secondary-inverse-hover: rgba(255, 255, 255, 0.00);
  --surface-action-secondary-inverse-pressed: #be131c;
  --surface-action-secondary-muted-default: #f6f6f6;
  --surface-action-secondary-muted-hover: #ffffff;
  --surface-action-secondary-muted-pressed: #212529;
  --surface-inverse-1: #ffffff;
  --surface-section-muted: #f6f6f6;
  --surface-blush: #fcfcfc;
  --surface-overlay: #495057;
  --surface-inverse-2: #ffffff;
  --surface-action-primary-active: #e31721;
  --surface-inverse-3: #ffffff;
  --surface-action-secondary-muted-active: #ffffff;

  /* Icon */
  --icon-brand: #e31721;
  --icon-action-default: #495057;
  --icon-action-hover: #212529;
  --icon-inverse: #ffffff;
  --icon-action-disabled: #909294;
  --icon-action-active: #e31721;
  --icon-action-primary-inverse-default: #495057;
  --icon-action-primary-inverse-hover: #212529;
  --icon-action-primary-inverse-pressed: #ffffff;
  --icon-action-primary-inverse-disabled: #909294;
  --icon-action-primary-inverse-active: #212529;
  --icon-action-pressed: #e31721;
  --icon-action-secondary-inverse-default: #495057;
  --icon-action-secondary-inverse-hover: #212529;
  --icon-action-secondary-inverse-pressed: #ffffff;
  --icon-action-secondary-inverse-active: #212529;
  --icon-action-secondary-inverse-disabled: #909294;

  /* Border */
  --border-muted: #ecedee;
  --border-brand: #e31721;
  --border-action-primary-focus: rgba(227, 23, 33, 0.25);
  --border-a11y-focus: rgba(23, 126, 227, 0.25);
  --border-action-primary-default: #f5cac7;
  --border-action-primary-hover: #f5cac7;
  --border-action-primary-pressed: #f8c7c7;
  --border-action-secondary-default: rgba(33, 37, 41, 0.50);
  --border-action-secondary-hover: rgba(33, 37, 41, 0.50);
  --border-action-secondary-pressed: rgba(255, 255, 255, 0.00);
  --border-feedback-success-focus: rgba(78, 177, 73, 0.25);
  --border-feedback-warning-focus: rgba(240, 190, 10, 0.25);
  --border-feedback-error-focus: rgba(217, 45, 32, 0.25);
  --border-feedback-info-focus: rgba(23, 126, 227, 0.25);
  --border-action-secondary-inverse-default: rgba(255, 255, 255, 0.50);
  --border-action-secondary-inverse-hover: rgba(255, 255, 255, 0.50);
  --border-action-secondary-inverse-pressed: rgba(255, 255, 255, 0.00);
  --border-action-primary-active: #f8c7c7;
  --border-action-secondary-muted-default: rgba(73, 80, 87, 0.25);
  --border-action-secondary-muted-hover: rgba(73, 80, 87, 0.25);
  --border-action-secondary-muted-pressed: rgba(255, 255, 255, 0.00);

  /* Shape */
  --radius-button: 8px;
  --radius-card: 16px;
  --radius-input: 8px;
  --radius-container: 16px;
  --radius-badge: 8px;
  --radius-media: 16px;
  --radius-none: 0px;
  --radius-tab: 8px;
  --radius-tab-active: 12px;

  /* Typography */
  --font-family-primary: "Roboto Condensed";
  --font-family-secondary: "Open Sans";
}