:host,
.ahi-theme-dark,
.ahi-invert {
  color-scheme: dark;

  --ahi-color-gray-50: #0b1015;
  --ahi-color-gray-100: #12181d;
  --ahi-color-gray-200: #1b2127;
  --ahi-color-gray-300: #272d34;
  --ahi-color-gray-400: #383f47;
  --ahi-color-gray-500: #51575f;
  --ahi-color-gray-600: #70777e;
  --ahi-color-gray-700: #949ba1;
  --ahi-color-gray-800: #bbc0c6;
  --ahi-color-gray-900: #e2e7eb;

  --ahi-background: var(--ahi-color-gray-50);
  --ahi-background-hovered: var(--ahi-color-gray-100);
  --ahi-background-depressed: var(--ahi-color-gray-200);
  --ahi-background-selected: var(--ahi-color-gray-200);
  --ahi-surface: var(--ahi-color-gray-200);
  --ahi-surface-neutral: var(--ahi-color-gray-300);
  --ahi-surface-neutral-hovered: var(--ahi-color-gray-400);
  --ahi-surface-neutral-depressed: var(--ahi-color-gray-500);
  --ahi-surface-neutral-disabled: var(--ahi-color-gray-200);
  --ahi-surface-neutral-subdued: var(--ahi-color-gray-200);
  --ahi-surface-subdued: var(--ahi-color-gray-100);
  --ahi-surface-disabled: var(--ahi-color-gray-100);
  --ahi-surface-hovered: var(--ahi-color-gray-300);
  --ahi-surface-depressed: var(--ahi-color-gray-400);
  --ahi-surface-search-field: var(--ahi-color-gray-100);
  --ahi-backdrop: #00000080;
  --ahi-overlay: color-mix(in srgb, var(--ahi-color-gray-100), transparent 50%);
  --ahi-border: var(--ahi-color-gray-600);
  --ahi-border-neutral-subdued: var(--ahi-color-gray-500);
  --ahi-border-hovered: var(--ahi-color-gray-700);
  --ahi-border-disabled: var(--ahi-color-gray-400);
  --ahi-border-subdued: var(--ahi-color-gray-500);
  --ahi-border-depressed: var(--ahi-color-gray-700);
  --ahi-border-shadow: var(--ahi-color-gray-500);
  --ahi-border-shadow-subdued: var(--ahi-color-gray-400);
  --ahi-divider: var(--ahi-color-gray-300);
  --ahi-icon: var(--ahi-color-gray-700);
  --ahi-icon-hovered: var(--ahi-color-gray-900);
  --ahi-icon-depressed: var(--ahi-color-gray-900);
  --ahi-icon-disabled: var(--ahi-color-gray-500);
  --ahi-icon-subdued: var(--ahi-color-gray-600);
  --ahi-text: var(--ahi-color-gray-900);
  --ahi-text-disabled: var(--ahi-color-gray-600);
  --ahi-text-subdued: var(--ahi-color-gray-700);

  --ahi-interactive: var(--ahi-color-blue-400);
  --ahi-interactive-disabled: var(--ahi-color-gray-500);
  --ahi-interactive-hovered: var(--ahi-color-blue-300);
  --ahi-interactive-depressed: var(--ahi-color-blue-200);
  --ahi-focused: var(--ahi-color-blue-400);
  --ahi-surface-selected: color-mix(
    in oklab,
    var(--ahi-color-blue-500) 15%,
    var(--ahi-surface)
  );
  --ahi-surface-selected-hovered: color-mix(
    in oklab,
    var(--ahi-color-blue-500) 20%,
    var(--ahi-surface)
  );
  --ahi-surface-selected-depressed: color-mix(
    in oklab,
    var(--ahi-color-blue-500) 27%,
    var(--ahi-surface)
  );
  --ahi-icon-on-interactive: #fff;
  --ahi-text-on-interactive: #fff;

  --ahi-action-secondary: var(--ahi-color-gray-300);
  --ahi-action-secondary-disabled: var(--ahi-color-gray-200);
  --ahi-action-secondary-hovered: var(--ahi-color-gray-400);
  --ahi-action-secondary-depressed: var(--ahi-color-gray-500);

  --ahi-action-primary: var(--ahi-color-blue-600);
  --ahi-action-primary-disabled: var(--ahi-color-gray-300);
  --ahi-action-primary-hovered: var(--ahi-color-blue-700);
  --ahi-action-primary-depressed: var(--ahi-color-blue-800);
  --ahi-icon-on-primary: #fff;
  --ahi-text-on-primary: #fff;
  --ahi-text-primary: var(--ahi-color-blue-400);
  --ahi-text-primary-hovered: var(--ahi-color-blue-300);
  --ahi-text-primary-depressed: var(--ahi-color-blue-200);
  --ahi-surface-primary-selected: color-mix(
    in oklab,
    var(--ahi-color-blue-500) 15%,
    var(--ahi-surface)
  );
  --ahi-surface-primary-selected-hovered: color-mix(
    in oklab,
    var(--ahi-color-blue-500) 20%,
    var(--ahi-surface)
  );
  --ahi-surface-primary-selected-depressed: color-mix(
    in oklab,
    var(--ahi-color-blue-500) 27%,
    var(--ahi-surface)
  );

  --ahi-border-critical: var(--ahi-color-red-500);
  --ahi-border-critical-subdued: var(--ahi-color-red-700);
  --ahi-border-critical-disabled: var(--ahi-color-red-800);
  --ahi-icon-critical: var(--ahi-color-red-400);
  --ahi-surface-critical: color-mix(
    in oklab,
    var(--ahi-color-red-500) 32%,
    var(--ahi-surface)
  );
  --ahi-surface-critical-subdued: color-mix(
    in oklab,
    var(--ahi-color-red-500) 15%,
    var(--ahi-surface)
  );
  --ahi-surface-critical-subdued-hovered: color-mix(
    in oklab,
    var(--ahi-color-red-500) 20%,
    var(--ahi-surface)
  );
  --ahi-surface-critical-subdued-depressed: color-mix(
    in oklab,
    var(--ahi-color-red-500) 27%,
    var(--ahi-surface)
  );
  --ahi-text-critical: var(--ahi-color-red-300);
  --ahi-action-critical: var(--ahi-color-red-700);
  --ahi-action-critical-disabled: var(--ahi-color-gray-300);
  --ahi-action-critical-hovered: var(--ahi-color-red-800);
  --ahi-action-critical-depressed: var(--ahi-color-red-900);
  --ahi-icon-on-critical: #fff;
  --ahi-text-on-critical: #fff;
  --ahi-interactive-critical: var(--ahi-color-red-400);
  --ahi-interactive-critical-disabled: var(--ahi-color-red-700);
  --ahi-interactive-critical-hovered: var(--ahi-color-red-300);
  --ahi-interactive-critical-depressed: var(--ahi-color-red-200);

  --ahi-border-warning: var(--ahi-color-yellow-500);
  --ahi-border-warning-subdued: var(--ahi-color-yellow-700);
  --ahi-icon-warning: var(--ahi-color-yellow-400);
  --ahi-surface-warning: color-mix(
    in oklab,
    var(--ahi-color-yellow-500) 32%,
    var(--ahi-surface)
  );
  --ahi-surface-warning-subdued: color-mix(
    in oklab,
    var(--ahi-color-yellow-500) 15%,
    var(--ahi-surface)
  );
  --ahi-surface-warning-subdued-hovered: color-mix(
    in oklab,
    var(--ahi-color-yellow-500) 20%,
    var(--ahi-surface)
  );
  --ahi-surface-warning-subdued-depressed: color-mix(
    in oklab,
    var(--ahi-color-yellow-500) 27%,
    var(--ahi-surface)
  );
  --ahi-text-warning: var(--ahi-color-yellow-300);

  --ahi-border-highlight: var(--ahi-color-blue-500);
  --ahi-border-highlight-subdued: var(--ahi-color-blue-700);
  --ahi-icon-highlight: var(--ahi-color-blue-400);
  --ahi-surface-highlight: color-mix(
    in oklab,
    var(--ahi-color-blue-500) 32%,
    var(--ahi-surface)
  );
  --ahi-surface-highlight-subdued: color-mix(
    in oklab,
    var(--ahi-color-blue-500) 15%,
    var(--ahi-surface)
  );
  --ahi-surface-highlight-subdued-hovered: color-mix(
    in oklab,
    var(--ahi-color-blue-500) 20%,
    var(--ahi-surface)
  );
  --ahi-surface-highlight-subdued-depressed: color-mix(
    in oklab,
    var(--ahi-color-blue-500) 27%,
    var(--ahi-surface)
  );
  --ahi-text-highlight: var(--ahi-color-blue-300);

  --ahi-border-success: var(--ahi-color-green-500);
  --ahi-border-success-subdued: var(--ahi-color-green-700);
  --ahi-icon-success: var(--ahi-color-green-400);
  --ahi-surface-success: color-mix(
    in oklab,
    var(--ahi-color-green-500) 32%,
    var(--ahi-surface)
  );
  --ahi-surface-success-subdued: color-mix(
    in oklab,
    var(--ahi-color-green-500) 15%,
    var(--ahi-surface)
  );
  --ahi-surface-success-subdued-hovered: color-mix(
    in oklab,
    var(--ahi-color-green-500) 20%,
    var(--ahi-surface)
  );
  --ahi-surface-success-subdued-depressed: color-mix(
    in oklab,
    var(--ahi-color-green-500) 27%,
    var(--ahi-surface)
  );
  --ahi-text-success: var(--ahi-color-green-300);

  --ahi-icon-attention: var(--ahi-color-yellow-400);
  --ahi-surface-attention: color-mix(
    in oklab,
    var(--ahi-color-yellow-500) 36%,
    var(--ahi-surface)
  );
  --ahi-text-attention: var(--ahi-color-yellow-200);

  --ahi-color-text-on-accent-secondary: #fff;
  --ahi-color-navigation-text: var(--ahi-text);
  --ahi-color-navigation-heading-text: var(--ahi-text-subdued);
  --ahi-color-navigation-hover: var(--ahi-color-gray-300);
  --ahi-color-navigation-hover-text: var(--ahi-text);
  --ahi-color-navigation-depressed: var(--ahi-color-gray-400);
  --ahi-color-badge-notification: var(--ahi-action-critical);
  --ahi-color-text-on-badge-notification: #fff;

  --ahi-tooltip-color: var(--ahi-color-gray-100);
  --ahi-tooltip-background-color: var(--ahi-color-gray-900);

  --ahi-color-green-50: #f2fbf4;
  --ahi-color-green-100: #ddefdf;
  --ahi-color-green-200: #bbe1c2;
  --ahi-color-green-300: #9acea3;
  --ahi-color-green-400: #76b884;
  --ahi-color-green-500: #52a165;
  --ahi-color-green-600: #31884a;
  --ahi-color-green-700: #007231;
  --ahi-color-green-800: #005924;
  --ahi-color-green-900: #003a15;

  --ahi-color-teal-50: #e8f4f6;
  --ahi-color-teal-100: #cee9ed;
  --ahi-color-teal-200: #a3dbe3;
  --ahi-color-teal-300: #76c8d3;
  --ahi-color-teal-400: #41b2c0;
  --ahi-color-teal-500: #0099a8;
  --ahi-color-teal-600: #007d8a;
  --ahi-color-teal-700: #006570;
  --ahi-color-teal-800: #004e56;
  --ahi-color-teal-900: #003136;

  --ahi-color-blue-50: #e5ecf4;
  --ahi-color-blue-100: #cfdfef;
  --ahi-color-blue-200: #adcdef;
  --ahi-color-blue-300: #8bb7e5;
  --ahi-color-blue-400: #679fd7;
  --ahi-color-blue-500: #4286c7;
  --ahi-color-blue-600: #216caf;
  --ahi-color-blue-700: #005696;
  --ahi-color-blue-800: #004073;
  --ahi-color-blue-900: #00264a;

  --ahi-color-purple-50: #f5eff8;
  --ahi-color-purple-100: #eadef0;
  --ahi-color-purple-200: #dec5eb;
  --ahi-color-purple-300: #cca9dd;
  --ahi-color-purple-400: #b88dcc;
  --ahi-color-purple-500: #a270b9;
  --ahi-color-purple-600: #8a55a1;
  --ahi-color-purple-700: #733f8a;
  --ahi-color-purple-800: #592f6b;
  --ahi-color-purple-900: #391b46;

  --ahi-color-red-50: #fff8f7;
  --ahi-color-red-100: #fff2ef;
  --ahi-color-red-200: #ffd6cf;
  --ahi-color-red-300: #ffb5a9;
  --ahi-color-red-400: #ff8b79;
  --ahi-color-red-500: #f26552;
  --ahi-color-red-600: #d74433;
  --ahi-color-red-700: #c41002;
  --ahi-color-red-800: #9d0600;
  --ahi-color-red-900: #6f0000;

  --ahi-color-orange-50: #fff9f5;
  --ahi-color-orange-100: #fff8f4;
  --ahi-color-orange-200: #feebde;
  --ahi-color-orange-300: #fccdad;
  --ahi-color-orange-400: #fba86e;
  --ahi-color-orange-500: #ee8630;
  --ahi-color-orange-600: #d16c00;
  --ahi-color-orange-700: #b15a00;
  --ahi-color-orange-800: #904800;
  --ahi-color-orange-900: #683200;

  --ahi-color-yellow-50: #fffaf1;
  --ahi-color-yellow-100: #fff9ef;
  --ahi-color-yellow-200: #fff5e4;
  --ahi-color-yellow-300: #feda9e;
  --ahi-color-yellow-400: #eabd71;
  --ahi-color-yellow-500: #d7a240;
  --ahi-color-yellow-600: #bd8706;
  --ahi-color-yellow-700: #a07200;
  --ahi-color-yellow-800: #845d00;
  --ahi-color-yellow-900: #604300;

  --ahi-brand-blue: var(--ahi-color-blue-600);
  --ahi-brand-green: var(--ahi-color-green-600);
  --ahi-brand-red: var(--ahi-color-red-600);

  --ahi-color-data-1: var(--ahi-color-blue-600);
  --ahi-color-data-2: var(--ahi-color-orange-600);
  --ahi-color-data-3: var(--ahi-color-green-600);
  --ahi-color-data-4: var(--ahi-color-purple-600);
  --ahi-color-data-5: var(--ahi-color-red-600);
  --ahi-color-data-6: var(--ahi-color-teal-600);
  --ahi-color-data-7: var(--ahi-color-yellow-600);

  --ahi-border-radius-sharp: 0.125rem;
  --ahi-border-radius-small: 0.25rem;
  --ahi-border-radius-medium: 0.5rem;
  --ahi-border-radius-pill: 9999px;
  --ahi-border-radius-circle: 50%;

  --ahi-font-family-mono:
    ui-monospace, SFMono-Regular, "SF Mono", Consolas, "Liberation Mono", Menlo,
    monospace;
  --ahi-font-family-sans:
    -apple-system, BlinkMacSystemFont, "San Francisco", "Segoe UI", Roboto,
    "Helvetica Neue", sans-serif;

  --ahi-font-weight-regular: 450;
  --ahi-font-weight-medium: 550;
  --ahi-font-weight-semibold: 650;
  --ahi-font-weight-bold: 700;

  --ahi-line-height-300: 12px;
  --ahi-line-height-400: 16px;
  --ahi-line-height-500: 20px;
  --ahi-line-height-600: 24px;
  --ahi-line-height-700: 28px;
  --ahi-line-height-800: 32px;
  --ahi-line-height-1000: 40px;
  --ahi-line-height-1200: 48px;

  --ahi-letter-spacing-densest: -0.54px;
  --ahi-letter-spacing-denser: -0.3px;
  --ahi-letter-spacing-dense: -0.2px;
  --ahi-letter-spacing-normal: 0px;

  --ahi-font-size-275: 11px;
  --ahi-font-size-300: 12px;
  --ahi-font-size-325: 13px;
  --ahi-font-size-350: 14px;
  --ahi-font-size-400: 16px;
  --ahi-font-size-450: 18px;
  --ahi-font-size-500: 20px;
  --ahi-font-size-550: 22px;
  --ahi-font-size-600: 24px;
  --ahi-font-size-750: 30px;
  --ahi-font-size-800: 32px;
  --ahi-font-size-900: 36px;
  --ahi-font-size-1000: 40px;

  --ahi-focus-ring-color: var(--ahi-focused);
  --ahi-focus-ring-style: solid;
  --ahi-focus-ring-width: 3px;
  --ahi-focus-ring: var(--ahi-focus-ring-style) var(--ahi-focus-ring-width)
    var(--ahi-focus-ring-color);
  --ahi-focus-ring-offset: 1px;

  --ahi-space-0: 0;
  --ahi-space-025: 0.0625rem;
  --ahi-space-05: 0.125rem;
  --ahi-space-1: 0.25rem;
  --ahi-space-2: 0.5rem;
  --ahi-space-3: 0.75rem;
  --ahi-space-4: 1rem;
  --ahi-space-5: 1.25rem;
  --ahi-space-6: 1.5rem;
  --ahi-space-8: 2rem;
  --ahi-space-10: 2.5rem;
  --ahi-space-12: 3rem;
  --ahi-space-16: 4rem;
  --ahi-space-20: 5rem;
  --ahi-space-24: 6rem;
  --ahi-space-28: 7rem;
  --ahi-space-32: 8rem;
  --ahi-border-width-1: 0.0625rem;
  --ahi-border-width-2: 0.125rem;
  --ahi-border-width-3: 0.1875rem;
  --ahi-border-divider: var(--ahi-border-width-1) solid var(--ahi-divider);
  --ahi-transition-x-slow: 1000ms;
  --ahi-transition-slow: 500ms;
  --ahi-transition-medium: 250ms;
  --ahi-transition-fast: 150ms;
  --ahi-transition-x-fast: 50ms;
  --ahi-ease: cubic-bezier(0.25, 0.1, 0.25, 1);
  --ahi-ease-in: cubic-bezier(0.42, 0, 1, 1);
  --ahi-ease-in-out: cubic-bezier(0.42, 0, 0.58, 1);
  --ahi-shadow-transparent: 0 0 0 0 transparent;
  --ahi-shadow-faint: 0 0.0625rem 0 0 rgba(22, 29, 37, 0.05);
  --ahi-shadow-base:
    0 0 0 0.0625rem rgba(63, 63, 68, 0.05),
    0 0.0625rem 0.1875rem 0 rgba(63, 63, 68, 0.15);
  --ahi-shadow-deep:
    0 0 0 0.0625rem rgba(6, 44, 82, 0.1), 0 0.125rem 1rem rgba(33, 43, 54, 0.08);
  --ahi-shadow-button: 0 0.0625rem 0 rgba(0, 0, 0, 0.05);
  --ahi-shadow-top-bar: 0 0.125rem 0.125rem -0.0625rem rgba(0, 0, 0, 0.15);
  --ahi-shadow-card:
    0 0 0.3125rem rgba(23, 24, 24, 0.05),
    0 0.0625rem 0.125rem rgba(0, 0, 0, 0.15);
  --ahi-shadow-popover:
    0 0.1875rem 0.375rem -0.1875rem rgba(23, 24, 24, 0.08),
    0 0.5rem 1.25rem -0.25rem rgba(23, 24, 24, 0.12);
  --ahi-shadow-layer:
    0 1.9375rem 2.5625rem 0 rgba(32, 42, 53, 0.2),
    0 0.125rem 1rem 0 rgba(32, 42, 54, 0.08);
  --ahi-shadow-modal:
    0 1.625rem 5rem rgba(0, 0, 0, 0.2), 0 0 0.0625rem rgba(0, 0, 0, 0.2);
  --ahi-z-index-sticky: 300;
  --ahi-z-index-nav: 400;
  --ahi-z-index-top-bar: 500;
  --ahi-z-index-overlay: 600;
  --ahi-z-index-dialog: 800;
  --ahi-z-index-dropdown: 900;
  --ahi-z-index-alert: 950;
  --ahi-z-index-tooltip: 1000;

  --ahi-form-control-required-content: "*";
  --ahi-form-control-required-content-offset: -2px;
  --ahi-form-control-required-content-color: var(--ahi-text-critical);
  --ahi-form-control-label-font-size: 0.9375rem;
  --ahi-form-control-label-spacing: var(--ahi-space-4);
  --ahi-form-control-help-text-color: var(--ahi-text-subdued);
  --ahi-form-control-error-color: var(--ahi-text-critical);
  --ahi-tooltip-arrow-size: 6px;
  --ahi-tooltip-padding: var(--ahi-space-1) var(--ahi-space-2);
  --ahi-tooltip-line-height: var(--ahi-line-height-600);
  --ahi-tooltip-font-weight: var(--ahi-font-weight-regular);
  --ahi-tooltip-font-size: var(--ahi-font-size-350);
  --ahi-tooltip-font-family: var(--ahi-font-family-sans);
  --ahi-tooltip-border-radius: var(--ahi-border-radius-small);
  --ahi-icon-size-minor: 16px;
  --ahi-icon-size-major: 20px;
  --ahi-icon-size-spot: 60px;
}

@supports (scrollbar-gutter: stable) {
  .ahi-scroll-lock {
    scrollbar-gutter: var(--ahi-scroll-lock-gutter) !important;
  }

  .ahi-scroll-lock body {
    overflow: hidden !important;
  }
}

@supports not (scrollbar-gutter: stable) {
  .ahi-scroll-lock body {
    padding-right: var(--ahi-scroll-lock-size) !important;
    overflow: hidden !important;
  }
}

.ahi-toast-stack {
  inset: auto;
  margin: 0;
  border: none;
  padding: 0;
  background: transparent;
  color: inherit;

  position: fixed;
  top: 0;
  inset-inline-end: 0;
  z-index: var(--ahi-z-index-alert);
  width: 28rem;
  max-width: 100%;
  max-height: 100%;
  overflow: auto;
}

.ahi-toast-stack ahi-banner {
  margin: var(--ahi-space-4);
}

.ahi-toast-stack ahi-banner::part(base) {
  box-shadow: var(--ahi-shadow-popover);
}
