@import url("https://fonts.googleapis.com/css2?family=Inter:wght@100..900&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Public+Sans:ital,wght@0,100..900;1,100..900&display=swap");
@import url("https://fonts.googleapis.com/css2?family=DM+Mono:ital,wght@0,300;0,400;0,500;1,300;1,400;1,500&display=swap");

:root,
:host,
.terra-theme-horizon {
  color-scheme: normal light;

  --terra-color-carbon-black: hsla(0, 0%, 0%, 1);
  --terra-color-spacesuit-white: hsla(0, 100%, 100%, 1);
  --terra-color-nasa-red: hsla(3, 91%, 59%, 1);
  --terra-color-nasa-blue: hsla(217, 78%, 50%, 1);

  --terra-color-nasa-red-tint: hsla(3, 100%, 66%, 1);
  --terra-color-nasa-red-shade: hsla(357, 99%, 36%, 1);
  --terra-color-nasa-blue-tint: hsla(212, 100%, 58%, 1);
  --terra-color-nasa-blue-shade: hsla(218, 86%, 31%, 1);
  --terra-color-nasa-blue-dark: hsla(214, 52%, 24.5%, 1);

  --terra-color-international-orange: hsla(23, 83%, 53%, 1);
  --terra-color-international-orange-tint: hsl(23, 82%, 61%);
  --terra-color-international-orange-shade: hsla(24, 90%, 32%, 1);
  --terra-color-active-green: hsla(145, 67%, 57%, 1);
  --terra-color-active-green-tint: hsl(145, 52%, 64%, 1);
  --terra-color-active-green-shade: hsla(144, 75%, 38%, 1);

  --terra-color-carbon-90: hsla(240, 8%, 10%, 1);
  --terra-color-carbon-80: hsla(240, 4%, 19%, 1);
  --terra-color-carbon-70: hsla(240, 2%, 27%, 1);
  --terra-color-carbon-60: hsla(240, 2%, 35%, 1);
  --terra-color-carbon-50: hsla(240, 1%, 47%, 1);
  --terra-color-carbon-40: hsla(240, 2%, 59%, 1);
  --terra-color-carbon-30: hsla(240, 1%, 73%, 1);
  --terra-color-carbon-20: hsla(0, 0%, 82%, 1);
  --terra-color-carbon-10: hsla(0, 0%, 89%, 1);
  --terra-color-carbon-5: hsl(0, 0%, 96%, 1);

  --terra-color-success-green: hsl(145, 67%, 40%);
  --terra-color-success-green-hover: hsl(145, 67%, 30%);
  --terra-color-success-green-focus: hsl(145, 52%, 54%);

  --terra-color-default-gray: hsla(240, 13%, 66%, 1);
  --terra-color-default-gray-tint: hsla(240, 2%, 59%, 1);
  --terra-color-default-gray-shade: hsl(240, 9%, 40%, 1);

  --terra-button-border-width: 1px;

  --terra-button-font-size-small: var(--terra-font-size-x-small);
  --terra-button-font-size-medium: var(--terra-font-size-small);
  --terra-button-font-size-large: var(--terra-font-size-medium);

  --terra-button-height-small: 1.875rem;
  --terra-button-height-medium: 2.25rem;
  --terra-button-height-large: 3rem;

  --terra-button-outline-text-color: var(--terra-color-carbon-black);
  --terra-button-text-text-color: var(--terra-color-nasa-blue);
  --terra-button-text-text-color-hover: var(--terra-color-nasa-blue-shade);
  --terra-button-page-link-text-color: var(--terra-color-carbon-black);

  --terra-border-radius-small: 0.125rem;
  --terra-border-radius-medium: 0.25rem;
  --terra-border-radius-large: 0.5rem;
  --terra-border-radius-x-large: 1rem;

  --terra-icon-small: 1.2rem;
  --terra-icon-medium: 1.75rem;
  --terra-icon-large: 2.2rem;
  --terra-icon-x-large: 3rem;

  --terra-border-radius-circle: 50%;

  --terra-shadow-x-small: 0 1px 2px hsl(240 3.8% 46.1% / 6%);
  --terra-shadow-small: 0 1px 2px hsl(240 3.8% 46.1% / 12%);
  --terra-shadow-medium: 0 2px 4px hsl(240 3.8% 46.1% / 12%);
  --terra-shadow-large: 0 2px 8px hsl(240 3.8% 46.1% / 12%);
  --terra-shadow-x-large: 0 4px 16px hsl(240 3.8% 46.1% / 12%);

  --terra-spacing-3x-small: 0.125rem;
  --terra-spacing-2x-small: 0.25rem;
  --terra-spacing-x-small: 0.5rem;
  --terra-spacing-small: 0.75rem;
  --terra-spacing-medium: 1rem;
  --terra-spacing-large: 1.25rem;
  --terra-spacing-x-large: 1.75rem;
  --terra-spacing-2x-large: 2.25rem;
  --terra-spacing-3x-large: 3rem;
  --terra-spacing-4x-large: 4.5rem;

  --terra-transition-x-slow: 1000ms;
  --terra-transition-slow: 500ms;
  --terra-transition-medium: 250ms;
  --terra-transition-fast: 150ms;
  --terra-transition-x-fast: 50ms;

  --terra-font-family--inter: "Inter", sans-serif;
  --terra-font-family--public-sans: "Public Sans", sans-serif;
  --terra-font-family--dm-mono: "DM Mono", monospace;

  --terra-font-size-2x-small: 0.625rem;
  --terra-font-size-x-small: 0.75rem;
  --terra-font-size-small: 0.875rem;
  --terra-font-size-medium: 1rem;
  --terra-font-size-large: 1.25rem;
  --terra-font-size-x-large: 1.5rem;
  --terra-font-size-2x-large: 2.25rem;
  --terra-font-size-3x-large: 3rem;
  --terra-font-size-4x-large: 4.5rem;

  --terra-font-weight-light: 300;
  --terra-font-weight-normal: 400;
  --terra-font-weight-semibold: 600;
  --terra-font-weight-bold: 700;

  --terra-letter-spacing-denser: -0.03em;
  --terra-letter-spacing-dense: -0.015em;
  --terra-letter-spacing-normal: normal;
  --terra-letter-spacing-loose: 0.075em;
  --terra-letter-spacing-looser: 0.15em;

  --terra-line-height-denser: 1;
  --terra-line-height-dense: 1.4;
  --terra-line-height-normal: 1.8;
  --terra-line-height-loose: 2.2;
  --terra-line-height-looser: 2.6;

  --terra-focus-ring-color: var(--terra-color-primary-600);
  --terra-focus-ring-style: solid;
  --terra-focus-ring-width: 3px;
  --terra-focus-ring: var(--terra-focus-ring-style)
    var(--terra-focus-ring-width) var(--terra-focus-ring-color);
  --terra-focus-ring-offset: 1px;

  --terra-input-height-small: 1.875rem;
  --terra-input-height-medium: 2.5rem;
  --terra-input-height-large: 3.125rem;

  --terra-input-font-family: var(--terra-font-family--public-sans);
  --terra-input-font-size: var(--terra-font-size-small);
  --terra-input-color: hsla(240, 4%, 19%, 1);
  --terra-input-font-weight: var(--terra-font-weight-normal);
  --terra-input-line-height: var(--terra-line-height-loose);
  --terra-input-border-color: var(--terra-color-carbon-20);
  --terra-input-background-color: var(--terra-color-spacesuit-white);
  --terra-input-border-width: 2px;
  --terra-input-border-radius: var(--terra-border-radius-medium);

  --terra-input-background-color-hover: var(--terra-input-background-color);
  --terra-input-background-color-focus: var(--terra-input-background-color);
  --terra-input-background-color-disabled: var(--terra-color-carbon-10);
  --terra-input-border-color-hover: var(--terra-color-carbon-40);
  --terra-input-border-color-focus: var(--terra-color-primary-50);
  --terra-input-border-color-disabled: var(--terra-color-carbon-30);

  --terra-input-required-content: "*";
  --terra-input-required-content-offset: -2px;
  --terra-input-required-content-color: var(--terra-input-label-color);

  --terra-input-border-radius-small: var(--terra-border-radius-medium);
  --terra-input-border-radius-medium: var(--terra-border-radius-medium);
  --terra-input-border-radius-large: var(--terra-border-radius-medium);

  --terra-input-font-weight: var(--terra-font-weight-normal);
  --terra-input-font-size-small: var(--terra-font-size-small);
  --terra-input-font-size-medium: var(--terra-font-size-medium);
  --terra-input-font-size-large: var(--terra-font-size-large);
  --terra-input-letter-spacing: var(--terra-letter-spacing-normal);

  --terra-input-color-hover: var(--terra-color-carbon-70);
  --terra-input-color-focus: var(--terra-color-carbon-70);
  --terra-input-color-disabled: var(--terra-color-carbon-90);
  --terra-input-icon-color: var(--terra-color-carbon-50);
  --terra-input-icon-color-hover: var(--terra-color-carbon-60);
  --terra-input-icon-color-focus: var(--terra-color-carbon-60);
  --terra-input-placeholder-color: var(--terra-color-carbon-50);
  --terra-input-placeholder-color-disabled: var(--terra-color-carbon-60);
  --terra-input-spacing-small: var(--terra-spacing-small);
  --terra-input-spacing-medium: var(--terra-spacing-medium);
  --terra-input-spacing-large: var(--terra-spacing-large);

  --terra-input-focus-ring-color: hsl(198.6 88.7% 48.4% / 40%);
  --terra-input-focus-ring-offset: 0;

  --terra-input-filled-background-color: var(--terra-color-carbon-10);
  --terra-input-filled-background-color-hover: var(--terra-color-carbon-10);
  --terra-input-filled-background-color-focus: var(--terra-color-carbon-10);
  --terra-input-filled-background-color-disabled: var(--terra-color-carbon-10);
  --terra-input-filled-color: var(--terra-color-carbon-80);
  --terra-input-filled-color-hover: var(--terra-color-carbon-80);
  --terra-input-filled-color-focus: var(--terra-color-carbon-70);
  --terra-input-filled-color-disabled: var(--terra-color-carbon-80);

  --terra-input-label-font-family: var(--terra-font-family--inter);
  --terra-input-label-font-size: var(--terra-font-size-small);
  --terra-input-label-color: var(--terra-color-carbon-80);
  --terra-input-label-line-weight: var(var(--terra-font-weight-semibold));
  --terra-input-label-line-height: var(--terra-line-height-looser);

  --terra-map-background-color: var(--terra-color-carbon-5);
  --terra-map-border-color: var(--terra-color-carbon-20);

  --terra-input-help-text-font-size-small: var(--terra-font-size-x-small);
  --terra-input-help-text-font-size-medium: var(--terra-font-size-small);
  --terra-input-help-text-font-size-large: var(--terra-font-size-medium);
  --terra-input-help-text-color: var(--terra-color-carbon-50);

  --terra-toggle-size-small: 0.875rem;
  --terra-toggle-size-medium: 1.125rem;
  --terra-toggle-size-large: 1.375rem;

  --terra-overlay-background-color: hsl(240 3.8% 46.1% / 33%);

  --terra-panel-background-color: var(--terra-color-spacesuit-white);
  --terra-panel-border-color: var(--terra-color-carbon-20);
  --terra-panel-border-width: 1px;

  --terra-tooltip-border-radius: var(--terra-border-radius-medium);
  --terra-tooltip-background-color: var(--terra-color-carbon-80);
  --terra-tooltip-color: var(--terra-color-spacesuit-white);
  --terra-tooltip-font-family: var(--terra-font-family--public-sans);
  --terra-tooltip-font-weight: var(--terra-font-weight-normal);
  --terra-tooltip-font-size: var(--terra-font-size-small);
  --terra-tooltip-line-height: var(--terra-line-height-looser);
  --terra-tooltip-padding: var(--terra-spacing-2x-small)
    var(--terra-spacing-x-small);
  --terra-tooltip-arrow-size: 6px;

  --terra-z-index-drawer: 700;
  --terra-z-index-dialog: 800;
  --terra-z-index-dropdown: 900;
  --terra-z-index-toast: 950;
  --terra-z-index-tooltip: 1000;
}
