@charset "UTF-8";
/**
 * Copyright (c) HashiCorp, Inc.
 * SPDX-License-Identifier: MPL-2.0
 */
/**
 * Do not edit directly, this file was auto-generated.
 */
.hds-border-primary {
  border: 1px solid var(--token-color-border-primary);
}

.hds-border-faint {
  border: 1px solid var(--token-color-border-faint);
}

.hds-border-strong {
  border: 1px solid var(--token-color-border-strong);
}

.hds-border-action {
  border: 1px solid var(--token-color-border-action);
}

.hds-border-highlight {
  border: 1px solid var(--token-color-border-highlight);
}

.hds-border-success {
  border: 1px solid var(--token-color-border-success);
}

.hds-border-warning {
  border: 1px solid var(--token-color-border-warning);
}

.hds-border-critical {
  border: 1px solid var(--token-color-border-critical);
}

.hds-foreground-strong {
  color: var(--token-color-foreground-strong);
}

.hds-foreground-primary {
  color: var(--token-color-foreground-primary);
}

.hds-foreground-faint {
  color: var(--token-color-foreground-faint);
}

.hds-foreground-high-contrast {
  color: var(--token-color-foreground-high-contrast);
}

.hds-foreground-disabled {
  color: var(--token-color-foreground-disabled);
}

.hds-foreground-action {
  color: var(--token-color-foreground-action);
}

.hds-foreground-action-hover {
  color: var(--token-color-foreground-action-hover);
}

.hds-foreground-action-active {
  color: var(--token-color-foreground-action-active);
}

.hds-foreground-highlight {
  color: var(--token-color-foreground-highlight);
}

.hds-foreground-highlight-on-surface {
  color: var(--token-color-foreground-highlight-on-surface);
}

.hds-foreground-highlight-high-contrast {
  color: var(--token-color-foreground-highlight-high-contrast);
}

.hds-foreground-success {
  color: var(--token-color-foreground-success);
}

.hds-foreground-success-on-surface {
  color: var(--token-color-foreground-success-on-surface);
}

.hds-foreground-success-high-contrast {
  color: var(--token-color-foreground-success-high-contrast);
}

.hds-foreground-warning {
  color: var(--token-color-foreground-warning);
}

.hds-foreground-warning-on-surface {
  color: var(--token-color-foreground-warning-on-surface);
}

.hds-foreground-warning-high-contrast {
  color: var(--token-color-foreground-warning-high-contrast);
}

.hds-foreground-critical {
  color: var(--token-color-foreground-critical);
}

.hds-foreground-critical-on-surface {
  color: var(--token-color-foreground-critical-on-surface);
}

.hds-foreground-critical-high-contrast {
  color: var(--token-color-foreground-critical-high-contrast);
}

.hds-page-primary {
  background-color: var(--token-color-page-primary);
}

.hds-page-faint {
  background-color: var(--token-color-page-faint);
}

.hds-surface-primary {
  background-color: var(--token-color-surface-primary);
}

.hds-surface-faint {
  background-color: var(--token-color-surface-faint);
}

.hds-surface-strong {
  background-color: var(--token-color-surface-strong);
}

.hds-surface-interactive {
  background-color: var(--token-color-surface-interactive);
}

.hds-surface-interactive-hover {
  background-color: var(--token-color-surface-interactive-hover);
}

.hds-surface-interactive-active {
  background-color: var(--token-color-surface-interactive-active);
}

.hds-surface-interactive-disabled {
  background-color: var(--token-color-surface-interactive-disabled);
}

.hds-surface-action {
  background-color: var(--token-color-surface-action);
}

.hds-surface-highlight {
  background-color: var(--token-color-surface-highlight);
}

.hds-surface-success {
  background-color: var(--token-color-surface-success);
}

.hds-surface-warning {
  background-color: var(--token-color-surface-warning);
}

.hds-surface-critical {
  background-color: var(--token-color-surface-critical);
}

/**
 * Do not edit directly, this file was auto-generated.
 */
.hds-elevation-inset {
  box-shadow: var(--token-elevation-inset-box-shadow);
}

.hds-elevation-low {
  box-shadow: var(--token-elevation-low-box-shadow);
}

.hds-elevation-mid {
  box-shadow: var(--token-elevation-mid-box-shadow);
}

.hds-elevation-high {
  box-shadow: var(--token-elevation-high-box-shadow);
}

.hds-elevation-higher {
  box-shadow: var(--token-elevation-higher-box-shadow);
}

.hds-elevation-overlay {
  box-shadow: var(--token-elevation-overlay-box-shadow);
}

.hds-surface-inset {
  box-shadow: var(--token-surface-inset-box-shadow);
}

.hds-surface-base {
  box-shadow: var(--token-surface-base-box-shadow);
}

.hds-surface-low {
  box-shadow: var(--token-surface-low-box-shadow);
}

.hds-surface-mid {
  box-shadow: var(--token-surface-mid-box-shadow);
}

.hds-surface-high {
  box-shadow: var(--token-surface-high-box-shadow);
}

.hds-surface-higher {
  box-shadow: var(--token-surface-higher-box-shadow);
}

.hds-surface-overlay {
  box-shadow: var(--token-surface-overlay-box-shadow);
}

/**
 * Do not edit directly, this file was auto-generated.
 */
.hds-focus-ring-action-box-shadow {
  box-shadow: var(--token-focus-ring-action-box-shadow);
}

.hds-focus-ring-critical-box-shadow {
  box-shadow: var(--token-focus-ring-critical-box-shadow);
}

/**
 * Do not edit directly, this file was auto-generated.
 */
.hds-font-family-sans-display {
  font-family: var(--token-typography-font-stack-display);
}

.hds-font-family-sans-text {
  font-family: var(--token-typography-font-stack-text);
}

.hds-font-family-mono-code {
  font-family: var(--token-typography-font-stack-code);
}

.hds-font-weight-regular {
  font-weight: 400;
}

.hds-font-weight-medium {
  font-weight: 500;
}

.hds-font-weight-semibold {
  font-weight: 600;
}

.hds-font-weight-bold {
  font-weight: 700;
}

.hds-typography-display-500 {
  font-family: var(--token-typography-display-500-font-family);
  font-size: var(--token-typography-display-500-font-size);
  line-height: var(--token-typography-display-500-line-height);
  margin: 0;
  padding: 0;
}

.hds-typography-display-400 {
  font-family: var(--token-typography-display-400-font-family);
  font-size: var(--token-typography-display-400-font-size);
  line-height: var(--token-typography-display-400-line-height);
  margin: 0;
  padding: 0;
}

.hds-typography-display-300 {
  font-family: var(--token-typography-display-300-font-family);
  font-size: var(--token-typography-display-300-font-size);
  line-height: var(--token-typography-display-300-line-height);
  margin: 0;
  padding: 0;
}

.hds-typography-display-200 {
  font-family: var(--token-typography-display-200-font-family);
  font-size: var(--token-typography-display-200-font-size);
  line-height: var(--token-typography-display-200-line-height);
  margin: 0;
  padding: 0;
}

.hds-typography-display-100 {
  font-family: var(--token-typography-display-100-font-family);
  font-size: var(--token-typography-display-100-font-size);
  line-height: var(--token-typography-display-100-line-height);
  margin: 0;
  padding: 0;
}

.hds-typography-body-300 {
  font-family: var(--token-typography-body-300-font-family);
  font-size: var(--token-typography-body-300-font-size);
  line-height: var(--token-typography-body-300-line-height);
  margin: 0;
  padding: 0;
}

.hds-typography-body-200 {
  font-family: var(--token-typography-body-200-font-family);
  font-size: var(--token-typography-body-200-font-size);
  line-height: var(--token-typography-body-200-line-height);
  margin: 0;
  padding: 0;
}

.hds-typography-body-100 {
  font-family: var(--token-typography-body-100-font-family);
  font-size: var(--token-typography-body-100-font-size);
  line-height: var(--token-typography-body-100-line-height);
  margin: 0;
  padding: 0;
}

.hds-typography-code-100 {
  font-family: var(--token-typography-code-100-font-family);
  font-size: var(--token-typography-code-100-font-size);
  line-height: var(--token-typography-code-100-line-height);
  margin: 0;
  padding: 0;
}

.hds-typography-code-200 {
  font-family: var(--token-typography-code-200-font-family);
  font-size: var(--token-typography-code-200-font-size);
  line-height: var(--token-typography-code-200-line-height);
  margin: 0;
  padding: 0;
}

.hds-typography-code-300 {
  font-family: var(--token-typography-code-300-font-family);
  font-size: var(--token-typography-code-300-font-size);
  line-height: var(--token-typography-code-300-line-height);
  margin: 0;
  padding: 0;
}

/**
 * Copyright (c) HashiCorp, Inc.
 * SPDX-License-Identifier: MPL-2.0
 */
/**
 * Copyright (c) HashiCorp, Inc.
 * SPDX-License-Identifier: MPL-2.0
 */
/**
 * Copyright (c) HashiCorp, Inc.
 * SPDX-License-Identifier: MPL-2.0
 */
/**
 * Copyright (c) HashiCorp, Inc.
 * SPDX-License-Identifier: MPL-2.0
 */
.hds-accordion {
  display: flex;
  flex-direction: column;
}

.hds-accordion--type-card.hds-accordion--size-small {
  gap: 4px;
}
.hds-accordion--type-card.hds-accordion--size-medium {
  gap: 8px;
}
.hds-accordion--type-card.hds-accordion--size-large {
  gap: 12px;
}

.hds-accordion-item--size-small {
  --hds-accordion-item-toggle-padding: 8px;
  --hds-accordion-item-toggle-padding-left: 8px;
  --hds-accordion-item-content-padding-top: 4px;
  --hds-accordion-item-content-padding-right: 8px;
  --hds-accordion-item-content-padding-bottom: 8px;
  --hds-accordion-item-content-padding-left: 12px;
  --hds-accordion-item-gap: 8px;
  --hds-accordion-item-icon-size: 16px;
}

.hds-accordion-item--size-medium {
  --hds-accordion-item-toggle-padding: 12px;
  --hds-accordion-item-toggle-padding-left: 8px;
  --hds-accordion-item-content-padding-top: 4px;
  --hds-accordion-item-content-padding-right: 12px;
  --hds-accordion-item-content-padding-bottom: 12px;
  --hds-accordion-item-content-padding-left: 12px;
  --hds-accordion-item-gap: 12px;
  --hds-accordion-item-icon-size: 20px;
}

.hds-accordion-item--size-large {
  --hds-accordion-item-toggle-padding: 16px;
  --hds-accordion-item-toggle-padding-left: 12px;
  --hds-accordion-item-content-padding-top: 4px;
  --hds-accordion-item-content-padding-right: 16px;
  --hds-accordion-item-content-padding-bottom: 16px;
  --hds-accordion-item-content-padding-left: 16px;
  --hds-accordion-item-gap: 12px;
  --hds-accordion-item-icon-size: 24px;
}

.hds-accordion-item--type-card {
  --hds-accordion-item-focus-ring-offset: 0;
  background: var(--token-color-surface-primary);
  border-radius: var(--token-border-radius-medium);
}
.hds-accordion-item--type-card.hds-accordion-item--does-not-contain-interactive:not(.hds-accordion-item--is-static) {
  box-shadow: var(--token-surface-mid-box-shadow);
}
.hds-accordion-item--type-card.hds-accordion-item--does-not-contain-interactive:not(.hds-accordion-item--is-static):hover, .hds-accordion-item--type-card.hds-accordion-item--does-not-contain-interactive:not(.hds-accordion-item--is-static).mock-hover {
  box-shadow: var(--token-surface-high-box-shadow);
}
.hds-accordion-item--type-card.hds-accordion-item--contains-interactive, .hds-accordion-item--type-card.hds-accordion-item--is-static {
  box-shadow: var(--token-surface-base-box-shadow);
}

.hds-accordion-item--type-flush {
  --hds-accordion-item-focus-ring-offset: 3px;
  border-bottom: 1px solid var(--token-color-border-primary);
}
.hds-accordion-item--type-flush.hds-accordion-item--does-not-contain-interactive:not(.hds-accordion-item--is-static) > .hds-disclosure-primitive__toggle:hover .hds-accordion-item__toggle, .hds-accordion-item--type-flush.hds-accordion-item--does-not-contain-interactive:not(.hds-accordion-item--is-static) > .hds-disclosure-primitive__toggle.mock-hover .hds-accordion-item__toggle {
  background: var(--token-color-surface-interactive-hover);
}
.hds-accordion-item--type-flush.hds-accordion-item--does-not-contain-interactive:not(.hds-accordion-item--is-static) > .hds-disclosure-primitive__toggle:active .hds-accordion-item__toggle, .hds-accordion-item--type-flush.hds-accordion-item--does-not-contain-interactive:not(.hds-accordion-item--is-static) > .hds-disclosure-primitive__toggle.mock-active .hds-accordion-item__toggle {
  background: var(--token-color-surface-interactive-active);
}

.hds-accordion-item__toggle {
  position: relative;
  display: flex;
  gap: var(--hds-accordion-item-gap);
  align-items: center;
  padding: var(--hds-accordion-item-toggle-padding) var(--hds-accordion-item-toggle-padding) var(--hds-accordion-item-toggle-padding) var(--hds-accordion-item-toggle-padding-left);
}

.hds-accordion-item__button {
  padding: 0;
}
.hds-accordion-item__button:hover {
  cursor: pointer;
}
@media (prefers-reduced-motion: no-preference) {
  .hds-accordion-item__button .hds-icon {
    transition: transform 0.3s;
  }
}
.hds-accordion-item--is-static.hds-accordion-item .hds-accordion-item__button {
  visibility: hidden;
}

.hds-accordion-item__button--parent-does-not-contain-interactive {
  position: relative;
  outline-style: solid;
  outline-color: transparent;
  isolation: isolate;
  position: static;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: -1px 0;
  color: var(--token-color-foreground-primary);
  background: transparent;
  border: 0;
}
.hds-accordion-item__button--parent-does-not-contain-interactive::before {
  position: absolute;
  top: var(--hds-accordion-item-focus-ring-offset);
  right: var(--hds-accordion-item-focus-ring-offset);
  bottom: var(--hds-accordion-item-focus-ring-offset);
  left: var(--hds-accordion-item-focus-ring-offset);
  z-index: -1;
  border-radius: 5px;
  content: "";
}
.hds-accordion-item__button--parent-does-not-contain-interactive:focus::before, .hds-accordion-item__button--parent-does-not-contain-interactive.mock-focus::before {
  box-shadow: var(--token-focus-ring-action-box-shadow);
}
.hds-accordion-item__button--parent-does-not-contain-interactive:focus:not(:focus-visible)::before {
  box-shadow: none;
}
.hds-accordion-item__button--parent-does-not-contain-interactive:focus-visible::before {
  box-shadow: var(--token-focus-ring-action-box-shadow);
}
.hds-accordion-item__button--parent-does-not-contain-interactive:focus:active::before, .hds-accordion-item__button--parent-does-not-contain-interactive.mock-focus.mock-active::before {
  box-shadow: none;
}

.hds-accordion-item__button--parent-contains-interactive {
  position: relative;
  display: flex;
  gap: 0.375rem;
  align-items: center;
  justify-content: center;
  width: auto;
  font-weight: var(--token-typography-font-weight-regular);
  font-family: var(--token-typography-font-stack-text);
  text-decoration: none;
  border: 1px solid transparent;
  border-radius: var(--token-border-radius-small);
  outline-style: solid;
  outline-color: transparent;
  isolation: isolate;
  color: var(--token-color-foreground-primary);
  background-color: var(--token-color-surface-faint);
  border-color: var(--token-color-border-strong);
  box-shadow: var(--token-elevation-low-box-shadow);
}
.hds-accordion-item__button--parent-contains-interactive:focus, .hds-accordion-item__button--parent-contains-interactive.mock-focus {
  box-shadow: none;
}
.hds-accordion-item__button--parent-contains-interactive:focus::before, .hds-accordion-item__button--parent-contains-interactive.mock-focus::before {
  position: absolute;
  top: -4px;
  right: -4px;
  bottom: -4px;
  left: -4px;
  z-index: -1;
  border: 3px solid transparent;
  border-radius: calc(var(--token-border-radius-small) + 3px);
  content: "";
}
.hds-accordion-item__button--parent-contains-interactive:hover, .hds-accordion-item__button--parent-contains-interactive.mock-hover {
  color: var(--token-color-foreground-primary);
  background-color: var(--token-color-surface-primary);
  border-color: var(--token-color-border-strong);
  cursor: pointer;
}
.hds-accordion-item__button--parent-contains-interactive:focus, .hds-accordion-item__button--parent-contains-interactive.mock-focus {
  color: var(--token-color-foreground-primary);
  background-color: var(--token-color-surface-faint);
  border-color: var(--token-color-focus-action-internal);
}
.hds-accordion-item__button--parent-contains-interactive:focus::before, .hds-accordion-item__button--parent-contains-interactive.mock-focus::before {
  border-color: var(--token-color-focus-action-external);
}
.hds-accordion-item__button--parent-contains-interactive:active, .hds-accordion-item__button--parent-contains-interactive.mock-active {
  color: var(--token-color-foreground-primary);
  background-color: var(--token-color-surface-interactive-active);
  border-color: var(--token-color-border-strong);
  box-shadow: none;
}
.hds-accordion-item__button--parent-contains-interactive:active::before, .hds-accordion-item__button--parent-contains-interactive.mock-active::before {
  border-color: transparent;
}

.hds-accordion-item__button {
  width: var(--hds-accordion-item-icon-size);
  height: var(--hds-accordion-item-icon-size);
}

.hds-accordion-item__button--is-open .hds-icon-chevron-down {
  transform: rotate(-180deg);
}

.hds-accordion-item__toggle-content {
  flex: 1;
}

.hds-accordion-item .hds-accordion-item__content {
  padding: var(--hds-accordion-item-content-padding-top) var(--hds-accordion-item-content-padding-right) var(--hds-accordion-item-content-padding-bottom) var(--hds-accordion-item-content-padding-left);
}

.hds-accordion-item--type-flush .hds-accordion-item__content:has(> .hds-accordion--type-flush) {
  padding: 0 var(--hds-accordion-item-content-padding-right) 0 var(--hds-accordion-item-content-padding-left);
  border-top: 1px solid var(--token-color-border-primary);
}
.hds-accordion-item--type-flush .hds-accordion-item__content:has(> .hds-accordion--type-flush) .hds-accordion-item--type-flush:last-child {
  border-bottom: none;
}

/**
 * Copyright (c) HashiCorp, Inc.
 * SPDX-License-Identifier: MPL-2.0
 */
/**
 * Copyright (c) HashiCorp, Inc.
 * SPDX-License-Identifier: MPL-2.0
 */
.hds-advanced-table__container {
  position: relative;
  display: grid;
  align-items: start;
  width: 100%;
  height: 100%;
  overflow: hidden;
  border-radius: var(--token-border-radius-medium);
}
.hds-advanced-table__container.hds-advanced-table__container--header-is-pinned {
  border-top-left-radius: 0;
  border-top-right-radius: 0;
}

.hds-advanced-table {
  display: grid;
  align-items: center;
  max-width: 100%;
  max-height: 100%;
  overflow: auto;
  border-radius: inherit;
  border-spacing: 0;
  isolation: isolate;
}

.hds-advanced-table__th,
.hds-advanced-table__td {
  border: calc(1px / 2) solid var(--token-color-border-primary);
}

.hds-advanced-table__thead,
.hds-advanced-table__tbody {
  border: calc(1px / 2) solid var(--token-color-border-primary);
}

.hds-advanced-table__thead {
  border-bottom: none;
  border-top-left-radius: inherit;
  border-top-right-radius: inherit;
}

.hds-advanced-table__tbody {
  border-top: none;
  border-bottom-right-radius: inherit;
  border-bottom-left-radius: inherit;
}

.hds-advanced-table__thead {
  display: grid;
  grid-column: 1/-1;
  grid-template-columns: subgrid;
}
.hds-advanced-table__thead .hds-advanced-table__tr {
  display: contents;
}
.hds-advanced-table__thead .hds-advanced-table__tr .hds-advanced-table__th {
  position: relative;
  align-content: center;
  height: 100%;
  padding: 14px 16px 13px 16px;
  color: var(--token-color-foreground-strong);
  text-align: left;
  background-color: var(--token-color-surface-strong);
}
.hds-advanced-table__thead .hds-advanced-table__tr .hds-advanced-table__th:focus, .hds-advanced-table__thead .hds-advanced-table__tr .hds-advanced-table__th.mock-focus {
  position: sticky;
  outline-style: solid;
  outline-color: transparent;
  isolation: isolate;
  z-index: 1;
  isolation: isolate;
}
.hds-advanced-table__thead .hds-advanced-table__tr .hds-advanced-table__th:focus::before, .hds-advanced-table__thead .hds-advanced-table__tr .hds-advanced-table__th.mock-focus::before {
  position: absolute;
  top: 3px;
  right: 3px;
  bottom: 3px;
  left: 3px;
  z-index: -1;
  border-radius: inherit;
  content: "";
}
.hds-advanced-table__thead .hds-advanced-table__tr .hds-advanced-table__th:focus:focus::before, .hds-advanced-table__thead .hds-advanced-table__tr .hds-advanced-table__th:focus.mock-focus::before, .hds-advanced-table__thead .hds-advanced-table__tr .hds-advanced-table__th.mock-focus:focus::before, .hds-advanced-table__thead .hds-advanced-table__tr .hds-advanced-table__th.mock-focus.mock-focus::before {
  box-shadow: var(--token-focus-ring-action-box-shadow);
}
.hds-advanced-table__thead .hds-advanced-table__tr .hds-advanced-table__th:focus:focus:not(:focus-visible)::before, .hds-advanced-table__thead .hds-advanced-table__tr .hds-advanced-table__th.mock-focus:focus:not(:focus-visible)::before {
  box-shadow: none;
}
.hds-advanced-table__thead .hds-advanced-table__tr .hds-advanced-table__th:focus:focus-visible::before, .hds-advanced-table__thead .hds-advanced-table__tr .hds-advanced-table__th.mock-focus:focus-visible::before {
  box-shadow: var(--token-focus-ring-action-box-shadow);
}
.hds-advanced-table__thead .hds-advanced-table__tr .hds-advanced-table__th:focus:focus:active::before, .hds-advanced-table__thead .hds-advanced-table__tr .hds-advanced-table__th:focus.mock-focus.mock-active::before, .hds-advanced-table__thead .hds-advanced-table__tr .hds-advanced-table__th.mock-focus:focus:active::before, .hds-advanced-table__thead .hds-advanced-table__tr .hds-advanced-table__th.mock-focus.mock-focus.mock-active::before {
  box-shadow: none;
}
.hds-advanced-table__thead .hds-advanced-table__tr .hds-advanced-table__th:hover .hds-advanced-table__th-reorder-handle, .hds-advanced-table__thead .hds-advanced-table__tr .hds-advanced-table__th.mock-hover .hds-advanced-table__th-reorder-handle, .hds-advanced-table__thead .hds-advanced-table__tr .hds-advanced-table__th:focus-within .hds-advanced-table__th-reorder-handle {
  visibility: visible;
  opacity: 1;
}
.hds-advanced-table__thead .hds-advanced-table__tr .hds-advanced-table__th.hds-advanced-table__th--is-being-dragged .hds-advanced-table__th-reorder-handle {
  opacity: 0;
}
.hds-advanced-table__thead .hds-advanced-table__tr .hds-advanced-table__th-reorder-drop-target {
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  z-index: 1;
}
.hds-advanced-table__thead .hds-advanced-table__tr .hds-advanced-table__th-reorder-drop-target--is-being-dragged {
  background-color: var(--token-color-surface-primary);
  opacity: 0.5;
}
.hds-advanced-table__thead .hds-advanced-table__tr .hds-advanced-table__th-reorder-drop-target--is-dragging-over {
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  z-index: 1;
}
.hds-advanced-table__thead .hds-advanced-table__tr .hds-advanced-table__th-reorder-drop-target--is-dragging-over::after {
  position: absolute;
  top: 0;
  bottom: 0;
  width: 4px;
  background-color: var(--token-color-palette-blue-300);
  content: "";
  pointer-events: none;
}
.hds-advanced-table__thead .hds-advanced-table__tr .hds-advanced-table__th-reorder-drop-target--is-dragging-over--left::after {
  left: 0;
  transform: translateX(-3px);
}
.hds-advanced-table__thead .hds-advanced-table__tr .hds-advanced-table__th-reorder-drop-target--is-dragging-over--left.hds-advanced-table__th-reorder-drop-target--is-first::after {
  border-radius: calc(var(--token-border-radius-medium) - 1px) 0 0 calc(var(--token-border-radius-medium) - 1px);
  transform: translateX(0);
}
.hds-advanced-table__thead .hds-advanced-table__tr .hds-advanced-table__th-reorder-drop-target--is-dragging-over--right::after {
  right: 0;
  transform: translateX(3px);
}
.hds-advanced-table__thead .hds-advanced-table__tr .hds-advanced-table__th-reorder-drop-target--is-dragging-over--right.hds-advanced-table__th-reorder-drop-target--is-last::after {
  border-radius: 0 calc(var(--token-border-radius-medium) - 1px) calc(var(--token-border-radius-medium) - 1px) 0;
  transform: translateX(0);
}
.hds-advanced-table__thead .hds-advanced-table__tr .hds-advanced-table__th-resize-handle {
  position: absolute;
  outline-style: solid;
  outline-color: transparent;
  isolation: isolate;
  top: 0;
  right: 0;
  bottom: 0;
  z-index: 2;
  width: 24px;
  scroll-margin-right: 24px;
  scroll-margin-left: 24px;
  transform: translateX(12.5px);
  cursor: col-resize;
}
.hds-advanced-table__thead .hds-advanced-table__tr .hds-advanced-table__th-resize-handle::before {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: -1;
  border-radius: 5px;
  content: "";
}
.hds-advanced-table__thead .hds-advanced-table__tr .hds-advanced-table__th-resize-handle:focus::before, .hds-advanced-table__thead .hds-advanced-table__tr .hds-advanced-table__th-resize-handle.mock-focus::before {
  box-shadow: var(--token-focus-ring-action-box-shadow);
}
.hds-advanced-table__thead .hds-advanced-table__tr .hds-advanced-table__th-resize-handle:focus:not(:focus-visible)::before {
  box-shadow: none;
}
.hds-advanced-table__thead .hds-advanced-table__tr .hds-advanced-table__th-resize-handle:focus-visible::before {
  box-shadow: var(--token-focus-ring-action-box-shadow);
}
.hds-advanced-table__thead .hds-advanced-table__tr .hds-advanced-table__th-resize-handle:focus:active::before, .hds-advanced-table__thead .hds-advanced-table__tr .hds-advanced-table__th-resize-handle.mock-focus.mock-active::before {
  box-shadow: none;
}
.hds-advanced-table__thead .hds-advanced-table__tr .hds-advanced-table__th-resize-handle::after {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  z-index: 2;
  content: "";
}
.hds-advanced-table__thead .hds-advanced-table__tr .hds-advanced-table__th-resize-handle:focus::after, .hds-advanced-table__thead .hds-advanced-table__tr .hds-advanced-table__th-resize-handle.mock-focus::after, .hds-advanced-table__thead .hds-advanced-table__tr .hds-advanced-table__th-resize-handle:hover::after, .hds-advanced-table__thead .hds-advanced-table__tr .hds-advanced-table__th-resize-handle.mock-hover::after, .hds-advanced-table__thead .hds-advanced-table__tr .hds-advanced-table__th-resize-handle.hds-advanced-table__th-resize-handle--resizing::after, .hds-advanced-table__thead .hds-advanced-table__tr .hds-advanced-table__th-resize-handle.mock-active::after {
  width: 3px;
  transform: translateX(-10.5px);
}
.hds-advanced-table__thead .hds-advanced-table__tr .hds-advanced-table__th-resize-handle:hover::after, .hds-advanced-table__thead .hds-advanced-table__tr .hds-advanced-table__th-resize-handle.mock-hover::after {
  background-color: #b1b1b5;
}
.hds-advanced-table__thead .hds-advanced-table__tr .hds-advanced-table__th-resize-handle:focus::after, .hds-advanced-table__thead .hds-advanced-table__tr .hds-advanced-table__th-resize-handle.mock-focus::after, .hds-advanced-table__thead .hds-advanced-table__tr .hds-advanced-table__th-resize-handle.hds-advanced-table__th-resize-handle--resizing::after, .hds-advanced-table__thead .hds-advanced-table__tr .hds-advanced-table__th-resize-handle.mock-active::after {
  background-color: var(--token-color-palette-blue-300);
}
.hds-advanced-table__thead .hds-advanced-table__tr .hds-advanced-table__th--align-center,
.hds-advanced-table__thead .hds-advanced-table__tr .hds-advanced-table__td--align-center {
  text-align: center;
}
.hds-advanced-table__thead .hds-advanced-table__tr .hds-advanced-table__th--align-center .hds-advanced-table__th-content,
.hds-advanced-table__thead .hds-advanced-table__tr .hds-advanced-table__td--align-center .hds-advanced-table__th-content {
  justify-content: center;
}
.hds-advanced-table__thead .hds-advanced-table__tr .hds-advanced-table__th--align-right,
.hds-advanced-table__thead .hds-advanced-table__tr .hds-advanced-table__td--align-right {
  text-align: right;
}
.hds-advanced-table__thead .hds-advanced-table__tr .hds-advanced-table__th--align-right .hds-advanced-table__th-content,
.hds-advanced-table__thead .hds-advanced-table__tr .hds-advanced-table__td--align-right .hds-advanced-table__th-content {
  justify-content: flex-end;
}
.hds-advanced-table__thead .hds-advanced-table__tr .hds-advanced-table__th--is-sticky-column {
  position: sticky;
  z-index: 7;
}
.hds-advanced-table__thead .hds-advanced-table__tr .hds-advanced-table__th--is-sticky-column-pinned:first-of-type {
  left: -1px;
  border-left: calc(1px + 1px) solid var(--token-color-border-primary);
}
.hds-advanced-table__thead .hds-advanced-table__tr .hds-advanced-table__th--is-sticky-column:not(:has(+ .hds-advanced-table__th--is-sticky-column)) {
  border-right: 3px solid var(--token-color-border-primary);
}
.hds-advanced-table__thead .hds-advanced-table__tr .hds-advanced-table__th--is-sticky-column.hds-advanced-table__th--is-selectable + .hds-advanced-table__th--is-sticky-column.hds-advanced-table__th--is-sticky-column-pinned {
  left: var(--hds-advanced-table-sticky-column-offset, 0);
  border-left-width: 1px;
}
.hds-advanced-table__thead .hds-advanced-table__tr:first-of-type .hds-advanced-table__th:first-child {
  border-top-left-radius: calc(var(--token-border-radius-medium) - 1px);
}
.hds-advanced-table__thead .hds-advanced-table__tr:first-of-type .hds-advanced-table__th:last-child {
  border-top-right-radius: calc(var(--token-border-radius-medium) - 1px);
}
.hds-advanced-table__thead .hds-advanced-table__scroll-indicator-top {
  top: 0;
  width: 100%;
  height: 8px;
  background: linear-gradient(to top, rgba(59, 61, 69, 0) 0%, rgba(59, 61, 69, 0.08) 100%);
}
.hds-advanced-table__thead.hds-advanced-table__thead--has-resizable-columns .hds-advanced-table__th .hds-advanced-table__th-content-text {
  display: block;
  min-width: 30px;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.hds-advanced-table__thead.hds-advanced-table__thead--sticky {
  position: sticky;
  top: -1px;
  z-index: 5;
  background-color: var(--token-color-surface-strong);
  border-bottom: calc(3px - 1px / 2) solid var(--token-color-border-primary);
}
.hds-advanced-table__thead.hds-advanced-table__thead--sticky .hds-advanced-table__scroll-indicator-top {
  top: unset;
  bottom: -11px;
}
.hds-advanced-table__thead.hds-advanced-table__thead--is-pinned {
  background-color: var(--token-color-surface-strong);
  border-top: calc(1px / 2 + 1px) solid var(--token-color-border-primary);
  border-bottom: 3px solid var(--token-color-border-primary);
}
.hds-advanced-table__thead.hds-advanced-table__thead--is-pinned .hds-advanced-table__tr:first-of-type .hds-advanced-table__th:first-child {
  border-top-left-radius: 0;
}
.hds-advanced-table__thead.hds-advanced-table__thead--is-pinned .hds-advanced-table__tr:first-of-type .hds-advanced-table__th:last-child {
  border-top-right-radius: 0;
}

.hds-advanced-table__th-content {
  display: flex;
  flex-grow: 1;
  flex-shrink: 1;
  gap: 8px;
  align-items: center;
  justify-content: flex-start;
  min-width: 0;
}

.hds-advanced-table__th-reorder-handle {
  position: absolute;
  bottom: 0;
  left: 50%;
  z-index: 2;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 24px;
  transform: translateX(-50%) translateY(50%);
  visibility: hidden;
  opacity: 0;
}
.hds-advanced-table__th-reorder-handle .hds-advanced-table__th-reorder-handle__inner {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 16px;
  color: var(--token-color-foreground-faint);
  background-color: var(--token-color-surface-interactive);
  border: 1px solid var(--token-color-border-primary);
  border-radius: var(--token-border-radius-small);
  box-shadow: var(--token-elevation-low-box-shadow);
}
.hds-advanced-table__th-reorder-handle .hds-icon {
  width: 12px;
  height: 12px;
}
.hds-advanced-table__th-reorder-handle:hover, .hds-advanced-table__th-reorder-handle.mock-hover {
  cursor: grab;
}
.hds-advanced-table__th-reorder-handle:hover .hds-advanced-table__th-reorder-handle__inner, .hds-advanced-table__th-reorder-handle.mock-hover .hds-advanced-table__th-reorder-handle__inner {
  background-color: var(--token-color-surface-interactive-hover);
}
.hds-advanced-table__th-reorder-handle:active, .hds-advanced-table__th-reorder-handle.mock-active {
  cursor: grabbing;
}
.hds-advanced-table__th-reorder-handle:active .hds-advanced-table__th-reorder-handle__inner, .hds-advanced-table__th-reorder-handle.mock-active .hds-advanced-table__th-reorder-handle__inner {
  background-color: var(--token-color-surface-interactive-hover);
}
.hds-advanced-table__th-reorder-handle:focus, .hds-advanced-table__th-reorder-handle.mock-focus {
  position: absolute;
  outline-style: solid;
  outline-color: transparent;
  isolation: isolate;
}
.hds-advanced-table__th-reorder-handle:focus::before, .hds-advanced-table__th-reorder-handle.mock-focus::before {
  position: absolute;
  top: 3px;
  right: 0;
  bottom: 3px;
  left: 0;
  z-index: -1;
  border-radius: 5px;
  content: "";
}
.hds-advanced-table__th-reorder-handle:focus:focus::before, .hds-advanced-table__th-reorder-handle:focus.mock-focus::before, .hds-advanced-table__th-reorder-handle.mock-focus:focus::before, .hds-advanced-table__th-reorder-handle.mock-focus.mock-focus::before {
  box-shadow: var(--token-focus-ring-action-box-shadow);
}
.hds-advanced-table__th-reorder-handle:focus:focus:active::before, .hds-advanced-table__th-reorder-handle:focus.mock-focus.mock-active::before, .hds-advanced-table__th-reorder-handle.mock-focus:focus:active::before, .hds-advanced-table__th-reorder-handle.mock-focus.mock-focus.mock-active::before {
  box-shadow: none;
}
.hds-advanced-table__th-reorder-handle:focus .hds-advanced-table__th-reorder-handle__inner, .hds-advanced-table__th-reorder-handle.mock-focus .hds-advanced-table__th-reorder-handle__inner {
  background-color: var(--token-color-surface-interactive);
}

.hds-advanced-table__th-context-menu .hds-dropdown-toggle-icon {
  width: 24px;
  height: 24px;
  margin: -2px 0;
  padding: 0;
  color: var(--token-color-foreground-faint);
  background-color: transparent;
  border: 1px solid transparent;
  border-radius: var(--token-border-radius-x-small);
}
.hds-advanced-table__th-context-menu .hds-dropdown-toggle-icon:hover, .hds-advanced-table__th-context-menu .hds-dropdown-toggle-icon.mock-hover {
  color: var(--token-color-foreground-primary);
  background-color: var(--token-color-surface-interactive);
  border-color: var(--token-color-border-strong);
  box-shadow: var(--token-elevation-low-box-shadow);
}
.hds-advanced-table__th-context-menu .hds-dropdown-toggle-icon:focus::before, .hds-advanced-table__th-context-menu .hds-dropdown-toggle-icon.mock-focus::before,
.hds-advanced-table__th-context-menu .hds-dropdown-toggle-icon .hds-dropdown-toggle-icon--is-open::before {
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  border: none;
  border-radius: var(--token-border-radius-x-small);
  box-shadow: var(--token-focus-ring-action-box-shadow);
}

.hds-advanced-table__th-button {
  display: flex;
  flex: none;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 24px;
  margin: -2px 0;
  padding: 0;
  color: var(--token-color-foreground-faint);
  background-color: transparent;
  border: 1px solid transparent;
  border-radius: 3px;
  position: relative;
  outline-style: solid;
  outline-color: transparent;
  isolation: isolate;
}
.hds-advanced-table__th-button:hover, .hds-advanced-table__th-button.mock-hover {
  color: var(--token-color-foreground-primary);
  background-color: var(--token-color-surface-interactive);
  border-color: var(--token-color-border-strong);
  box-shadow: var(--token-elevation-low-box-shadow);
  cursor: pointer;
}
.hds-advanced-table__th-button::before {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: -1;
  border-radius: inherit;
  content: "";
}
.hds-advanced-table__th-button:focus::before, .hds-advanced-table__th-button.mock-focus::before {
  box-shadow: var(--token-focus-ring-action-box-shadow);
}
.hds-advanced-table__th-button:focus:not(:focus-visible)::before {
  box-shadow: none;
}
.hds-advanced-table__th-button:focus-visible::before {
  box-shadow: var(--token-focus-ring-action-box-shadow);
}
.hds-advanced-table__th-button:focus:active::before, .hds-advanced-table__th-button.mock-focus.mock-active::before {
  box-shadow: none;
}
.hds-advanced-table__th-button:active, .hds-advanced-table__th-button.mock-active {
  color: var(--token-color-foreground-primary);
  background-color: var(--token-color-surface-interactive-active);
  border-color: var(--token-color-border-strong);
  box-shadow: none;
}

.hds-advanced-table__th-button--is-sorted {
  color: var(--token-color-foreground-action);
}
.hds-advanced-table__th-button--is-sorted:hover, .hds-advanced-table__th-button--is-sorted.mock-hover {
  color: var(--token-color-foreground-action-hover);
}
.hds-advanced-table__th-button--is-sorted:active, .hds-advanced-table__th-button--is-sorted.mock-active {
  color: var(--token-color-foreground-action-active);
}

.hds-advanced-table__th-button-aria-label-hidden-segment {
  display: none;
}

.hds-advanced-table__th-button--expand {
  align-self: flex-start;
}

.hds-advanced-table__tbody {
  display: grid;
  grid-column: 1/-1;
  grid-template-columns: subgrid;
  align-items: center;
}
.hds-advanced-table__tbody .hds-advanced-table__tr {
  display: contents;
  color: var(--token-color-foreground-primary);
}
.hds-advanced-table--striped .hds-advanced-table__tbody .hds-advanced-table__tr:nth-child(even) .hds-advanced-table__th,
.hds-advanced-table--striped .hds-advanced-table__tbody .hds-advanced-table__tr:nth-child(even) .hds-advanced-table__td {
  background-color: var(--token-color-surface-faint);
}
.hds-advanced-table__tbody .hds-advanced-table__tr--last-row .hds-advanced-table__th:first-child,
.hds-advanced-table__tbody .hds-advanced-table__tr--last-row .hds-advanced-table__td:first-child {
  border-bottom-left-radius: calc(var(--token-border-radius-medium) - 1px);
}
.hds-advanced-table__tbody .hds-advanced-table__tr--last-row .hds-advanced-table__td:last-child {
  border-bottom-right-radius: calc(var(--token-border-radius-medium) - 1px);
}
.hds-advanced-table__tbody .hds-advanced-table__td {
  display: flex;
  gap: 8px;
  align-content: center;
  align-items: flex-start;
  justify-content: flex-start;
}
.hds-advanced-table__tbody .hds-advanced-table__th,
.hds-advanced-table__tbody .hds-advanced-table__td {
  height: 100%;
  font-weight: var(--token-typography-font-weight-regular);
  font-size: var(--token-typography-body-200-font-size);
  font-family: var(--token-typography-body-200-font-family);
  line-height: var(--token-typography-body-200-line-height);
  text-align: left;
  background-color: var(--token-color-surface-primary);
}
.hds-advanced-table__tbody .hds-advanced-table__th:focus, .hds-advanced-table__tbody .hds-advanced-table__th.mock-focus,
.hds-advanced-table__tbody .hds-advanced-table__td:focus,
.hds-advanced-table__tbody .hds-advanced-table__td.mock-focus {
  position: sticky;
  outline-style: solid;
  outline-color: transparent;
  isolation: isolate;
  z-index: 1;
  isolation: isolate;
}
.hds-advanced-table__tbody .hds-advanced-table__th:focus::before, .hds-advanced-table__tbody .hds-advanced-table__th.mock-focus::before,
.hds-advanced-table__tbody .hds-advanced-table__td:focus::before,
.hds-advanced-table__tbody .hds-advanced-table__td.mock-focus::before {
  position: absolute;
  top: 3px;
  right: 3px;
  bottom: 3px;
  left: 3px;
  z-index: -1;
  border-radius: inherit;
  content: "";
}
.hds-advanced-table__tbody .hds-advanced-table__th:focus:focus::before, .hds-advanced-table__tbody .hds-advanced-table__th:focus.mock-focus::before, .hds-advanced-table__tbody .hds-advanced-table__th.mock-focus:focus::before, .hds-advanced-table__tbody .hds-advanced-table__th.mock-focus.mock-focus::before,
.hds-advanced-table__tbody .hds-advanced-table__td:focus:focus::before,
.hds-advanced-table__tbody .hds-advanced-table__td:focus.mock-focus::before,
.hds-advanced-table__tbody .hds-advanced-table__td.mock-focus:focus::before,
.hds-advanced-table__tbody .hds-advanced-table__td.mock-focus.mock-focus::before {
  box-shadow: var(--token-focus-ring-action-box-shadow);
}
.hds-advanced-table__tbody .hds-advanced-table__th:focus:focus:not(:focus-visible)::before, .hds-advanced-table__tbody .hds-advanced-table__th.mock-focus:focus:not(:focus-visible)::before,
.hds-advanced-table__tbody .hds-advanced-table__td:focus:focus:not(:focus-visible)::before,
.hds-advanced-table__tbody .hds-advanced-table__td.mock-focus:focus:not(:focus-visible)::before {
  box-shadow: none;
}
.hds-advanced-table__tbody .hds-advanced-table__th:focus:focus-visible::before, .hds-advanced-table__tbody .hds-advanced-table__th.mock-focus:focus-visible::before,
.hds-advanced-table__tbody .hds-advanced-table__td:focus:focus-visible::before,
.hds-advanced-table__tbody .hds-advanced-table__td.mock-focus:focus-visible::before {
  box-shadow: var(--token-focus-ring-action-box-shadow);
}
.hds-advanced-table__tbody .hds-advanced-table__th:focus:focus:active::before, .hds-advanced-table__tbody .hds-advanced-table__th:focus.mock-focus.mock-active::before, .hds-advanced-table__tbody .hds-advanced-table__th.mock-focus:focus:active::before, .hds-advanced-table__tbody .hds-advanced-table__th.mock-focus.mock-focus.mock-active::before,
.hds-advanced-table__tbody .hds-advanced-table__td:focus:focus:active::before,
.hds-advanced-table__tbody .hds-advanced-table__td:focus.mock-focus.mock-active::before,
.hds-advanced-table__tbody .hds-advanced-table__td.mock-focus:focus:active::before,
.hds-advanced-table__tbody .hds-advanced-table__td.mock-focus.mock-focus.mock-active::before {
  box-shadow: none;
}
.hds-advanced-table--density-short .hds-advanced-table__tbody .hds-advanced-table__th,
.hds-advanced-table--density-short .hds-advanced-table__tbody .hds-advanced-table__td {
  padding: 6px 16px 5px 16px;
}
.hds-advanced-table--density-medium .hds-advanced-table__tbody .hds-advanced-table__th,
.hds-advanced-table--density-medium .hds-advanced-table__tbody .hds-advanced-table__td {
  padding: 14px 16px 13px 16px;
}
.hds-advanced-table--density-tall .hds-advanced-table__tbody .hds-advanced-table__th,
.hds-advanced-table--density-tall .hds-advanced-table__tbody .hds-advanced-table__td {
  padding: 22px 16px 21px 16px;
}
.hds-advanced-table__tbody .hds-advanced-table__th--is-sticky-column {
  position: sticky;
  z-index: 3;
}
.hds-advanced-table__tbody .hds-advanced-table__th--is-sticky-column-pinned:first-of-type {
  left: -1px;
  border-left: calc(1px + 1px) solid var(--token-color-border-primary);
}
.hds-advanced-table__tbody .hds-advanced-table__th--is-sticky-column:not(:has(+ .hds-advanced-table__th--is-sticky-column)) {
  border-right: 3px solid var(--token-color-border-primary);
}
.hds-advanced-table__tbody .hds-advanced-table__th--is-sticky-column.hds-advanced-table__th--is-selectable + .hds-advanced-table__th--is-sticky-column.hds-advanced-table__th--is-sticky-column-pinned {
  left: var(--hds-advanced-table-sticky-column-offset, 0);
  border-left-width: 1px;
}
.hds-advanced-table__tbody .hds-advanced-table__td--align-center {
  justify-content: center;
  text-align: center;
}
.hds-advanced-table__tbody .hds-advanced-table__th--align-center {
  text-align: center;
}
.hds-advanced-table__tbody .hds-advanced-table__th--align-center .hds-advanced-table__th-content {
  justify-content: center;
}
.hds-advanced-table__tbody .hds-advanced-table__td--align-right {
  justify-content: flex-end;
  text-align: right;
}
.hds-advanced-table__tbody .hds-advanced-table__th--align-right {
  text-align: right;
}
.hds-advanced-table__tbody .hds-advanced-table__th--align-right .hds-advanced-table__th-content {
  justify-content: flex-end;
}
.hds-advanced-table--valign-top .hds-advanced-table__tbody .hds-advanced-table__th,
.hds-advanced-table--valign-top .hds-advanced-table__tbody .hds-advanced-table__td {
  align-items: flex-start;
}
.hds-advanced-table--valign-middle .hds-advanced-table__tbody .hds-advanced-table__th,
.hds-advanced-table--valign-middle .hds-advanced-table__tbody .hds-advanced-table__td {
  align-items: center;
}
.hds-advanced-table--valign-baseline .hds-advanced-table__tbody .hds-advanced-table__th,
.hds-advanced-table--valign-baseline .hds-advanced-table__tbody .hds-advanced-table__td {
  /**
    setting to center because in FlexBox, when you set align-items: baseline, it also aligns content to the top - unlike display: table-cell which aligns the content to the center

    we decided as a team to match the Table behavior instead of actually setting align-items to baseline to mitigate the difference.
  */
  align-items: center;
}
.hds-advanced-table__tbody .hds-advanced-table__tr--hidden {
  display: none;
}
.hds-advanced-table__tbody .hds-advanced-table__tr--parent-row .hds-advanced-table__th:not(:first-child),
.hds-advanced-table__tbody .hds-advanced-table__tr--parent-row .hds-advanced-table__td:not(:first-child) {
  border-left: 0;
}
.hds-advanced-table__tbody .hds-advanced-table__tr--parent-row .hds-advanced-table__th:not(:last-child),
.hds-advanced-table__tbody .hds-advanced-table__tr--parent-row .hds-advanced-table__td:not(:last-child) {
  border-right: 0;
}

.hds-advanced-table--nested .hds-advanced-table__tr .hds-advanced-table__th,
.hds-advanced-table--nested .hds-advanced-table__tr .hds-advanced-table__td {
  background-color: var(--token-color-surface-faint);
}
.hds-advanced-table--nested .hds-advanced-table__tr.hds-advanced-table__tr--parent-row .hds-advanced-table__th,
.hds-advanced-table--nested .hds-advanced-table__tr.hds-advanced-table__tr--parent-row .hds-advanced-table__td {
  background-color: var(--token-color-surface-primary);
}

.hds-advanced-table__checkbox {
  display: block;
  margin: 2px 0;
}

.hds-advanced-table__scroll-indicator {
  position: absolute;
}

.hds-advanced-table__scroll-indicator-left,
.hds-advanced-table__scroll-indicator-right {
  top: 0;
  width: 8px;
}

.hds-advanced-table__scroll-indicator-left {
  background: linear-gradient(to left, rgba(59, 61, 69, 0) 0%, rgba(59, 61, 69, 0.08) 100%);
}

.hds-advanced-table__scroll-indicator-right {
  background: linear-gradient(to right, rgba(59, 61, 69, 0) 0%, rgba(59, 61, 69, 0.08) 100%);
}

.hds-advanced-table__scroll-indicator-bottom {
  height: 8px;
  background: linear-gradient(to bottom, rgba(59, 61, 69, 0) 0%, rgba(59, 61, 69, 0.08) 100%);
}

.hds-advanced-table__th-reorder-drag-preview {
  position: absolute;
  top: -9999px;
  left: -9999px;
  background-color: rgba(204, 227, 254, 0.3);
  border: 5px solid var(--token-color-focus-action-external);
  border-radius: var(--token-border-radius-medium);
  box-shadow: var(--token-elevation-mid-box-shadow);
}

/**
 * Copyright (c) HashiCorp, Inc.
 * SPDX-License-Identifier: MPL-2.0
 */
.hds-alert {
  display: flex;
  align-items: flex-start;
}

.hds-alert__icon {
  flex: none;
  width: 20px;
  height: 20px;
  margin-right: 12px;
}
.hds-alert--type-compact .hds-alert__icon {
  width: 14px;
  height: 14px;
}

.hds-alert__content {
  flex: 1 1 auto;
}

.hds-alert__text {
  display: flex;
  flex-direction: column;
  gap: 4px;
  justify-content: center;
}

.hds-alert__description {
  word-break: break-word;
}
.hds-alert__description strong {
  font-weight: var(--token-typography-font-weight-semibold);
}
.hds-alert__description code,
.hds-alert__description pre {
  display: inline;
  padding: 1px 5px;
  font-size: 0.9em;
  font-family: var(--token-typography-code-100-font-family);
  line-height: 1em;
  background-color: var(--token-color-surface-primary);
  border: 1px solid var(--token-color-palette-neutral-200);
  border-radius: var(--token-border-radius-small);
}
.hds-alert__description a:not([class*=hds-]) {
  color: var(--token-color-foreground-strong);
}
.hds-alert__description a:not([class*=hds-]):focus, .hds-alert__description a:not([class*=hds-]):focus-visible {
  text-decoration: none;
  outline: 2px solid var(--token-color-focus-action-internal);
  outline-offset: 1px;
}
.hds-alert__description a:not([class*=hds-]):hover {
  color: var(--token-color-foreground-primary);
}
.hds-alert__description a:not([class*=hds-]):active {
  color: var(--token-color-foreground-faint);
}

.hds-alert__actions {
  display: flex;
  gap: 16px;
  align-items: center;
}
.hds-alert__actions > * {
  margin-top: 16px;
}

.hds-alert__dismiss {
  margin-top: 2px;
  margin-left: 16px;
}
.hds-alert--type-compact .hds-alert__dismiss {
  margin-top: 1px;
}

.hds-alert--type-page {
  padding: 16px 48px;
}

.hds-alert--type-inline {
  padding: 16px;
  border-style: solid;
  border-width: 1px;
  border-radius: var(--token-border-radius-medium);
}

.hds-alert--type-compact .hds-alert__icon {
  margin-top: 2px;
  margin-right: 8px;
}
.hds-alert--type-compact .hds-alert__title {
  display: none;
}
.hds-alert--type-compact .hds-alert__title + .hds-alert__description {
  margin-top: 0;
}

.hds-alert--color-neutral.hds-alert--type-page {
  background-color: var(--token-color-surface-faint);
  box-shadow: 0 1px 0 0 var(--token-color-palette-alpha-300);
}
.hds-alert--color-neutral.hds-alert--type-inline {
  background-color: var(--token-color-surface-faint);
  border-color: var(--token-color-border-strong);
}
.hds-alert--color-neutral .hds-alert__icon {
  color: var(--token-color-foreground-faint);
}
.hds-alert--color-neutral .hds-alert__title {
  color: var(--token-color-foreground-primary);
}

.hds-alert--color-highlight.hds-alert--type-page {
  background-color: var(--token-color-surface-highlight);
  box-shadow: 0 1px 0 0 var(--token-color-border-highlight);
}
.hds-alert--color-highlight.hds-alert--type-inline {
  background-color: var(--token-color-surface-highlight);
  border-color: var(--token-color-border-highlight);
}
.hds-alert--color-highlight .hds-alert__icon,
.hds-alert--color-highlight .hds-alert__title {
  color: var(--token-color-foreground-highlight-on-surface);
}

.hds-alert--color-success.hds-alert--type-page {
  background-color: var(--token-color-surface-success);
  box-shadow: 0 1px 0 0 var(--token-color-border-success);
}
.hds-alert--color-success.hds-alert--type-inline {
  background-color: var(--token-color-surface-success);
  border-color: var(--token-color-border-success);
}
.hds-alert--color-success .hds-alert__icon,
.hds-alert--color-success .hds-alert__title {
  color: var(--token-color-foreground-success-on-surface);
}

.hds-alert--color-warning.hds-alert--type-page {
  background-color: var(--token-color-surface-warning);
  box-shadow: 0 1px 0 0 var(--token-color-border-warning);
}
.hds-alert--color-warning.hds-alert--type-inline {
  background-color: var(--token-color-surface-warning);
  border-color: var(--token-color-border-warning);
}
.hds-alert--color-warning .hds-alert__icon,
.hds-alert--color-warning .hds-alert__title {
  color: var(--token-color-foreground-warning-on-surface);
}

.hds-alert--color-critical.hds-alert--type-page {
  background-color: var(--token-color-surface-critical);
  box-shadow: 0 1px 0 0 var(--token-color-border-critical);
}
.hds-alert--color-critical.hds-alert--type-inline {
  background-color: var(--token-color-surface-critical);
  border-color: var(--token-color-border-critical);
}
.hds-alert--color-critical .hds-alert__icon,
.hds-alert--color-critical .hds-alert__title {
  color: var(--token-color-foreground-critical-on-surface);
}

/**
 * Copyright (c) HashiCorp, Inc.
 * SPDX-License-Identifier: MPL-2.0
 */
.hds-app-footer {
  display: flex;
  flex-wrap: wrap;
  gap: 24px;
  justify-content: center;
  padding: 24px;
  color: var(--app-footer-foreground-color);
  border-top: 1px solid var(--app-footer-border-top-color);
}

.hds-app-footer__list:not(:has(li)) {
  display: none;
}

.hds-app-footer__list,
.hds-app-footer__legal-links {
  display: flex;
  flex-wrap: wrap;
  gap: 24px;
  align-items: center;
  justify-content: center;
  width: fit-content;
  min-width: 0;
  margin: 0;
  padding: 0;
  list-style-type: none;
}

.hds-app-footer__status-link.hds-link-inline--icon-leading > .hds-link-inline__icon {
  margin-right: 6px;
}
.hds-app-footer__status-link .hds-icon {
  fill: var(--hds-app-footer-status-icon-color, currentColor);
}

.hds-app-footer__status-link--operational .hds-icon {
  fill: var(--app-footer-status-link-icon-operational-color);
}

.hds-app-footer__status-link--degraded .hds-icon {
  fill: var(--app-footer-status-link-icon-degraded-color);
}

.hds-app-footer__status-link--maintenance .hds-icon {
  fill: var(--app-footer-status-link-icon-maintenance-color);
}

.hds-app-footer__status-link--outage .hds-icon {
  fill: var(--app-footer-status-link-icon-outage-color);
}

.hds-app-footer__link.hds-link-inline--color-secondary,
.hds-app-footer__status-link {
  color: var(--app-footer-link-default-color);
  text-align: right;
}
.hds-app-footer__link.hds-link-inline--color-secondary:hover, .hds-app-footer__link.hds-link-inline--color-secondary.mock-hover,
.hds-app-footer__status-link:hover,
.hds-app-footer__status-link.mock-hover {
  color: var(--app-footer-link-hover-color);
}
.hds-app-footer__link.hds-link-inline--color-secondary:active, .hds-app-footer__link.hds-link-inline--color-secondary.mock-active,
.hds-app-footer__status-link:active,
.hds-app-footer__status-link.mock-active {
  color: var(--app-footer-link-active-color);
}
.hds-app-footer__link.hds-link-inline--color-secondary:focus, .hds-app-footer__link.hds-link-inline--color-secondary.mock-focus, .hds-app-footer__link.hds-link-inline--color-secondary:focus-visible,
.hds-app-footer__status-link:focus,
.hds-app-footer__status-link.mock-focus,
.hds-app-footer__status-link:focus-visible {
  color: var(--app-footer-link-focus-color);
  outline-color: var(--app-footer-link-focus-outline-color);
}

.hds-app-footer__list-item {
  display: flex;
  align-items: center;
}

.hds-app-footer__copyright {
  display: flex;
  gap: 6px;
  align-items: center;
  color: var(--app-footer-copyright-text-color);
}
.hds-app-footer__copyright .hds-icon {
  fill: var(--app-footer-copyright-icon-color);
}

.hds-app-footer--theme-light {
  --app-footer-foreground-color: var(--token-color-foreground-primary);
  --app-footer-border-top-color: var(--token-color-border-primary);
  --app-footer-link-default-color: var(--token-color-foreground-faint);
  --app-footer-link-hover-color: var(--token-color-palette-neutral-600);
  --app-footer-link-active-color: var(--token-color-palette-neutral-700);
  --app-footer-link-focus-color: var(--token-color-foreground-faint);
  --app-footer-link-focus-outline-color: var(--token-color-focus-action-internal);
  --app-footer-copyright-text-color: var(--token-color-foreground-primary);
  --app-footer-copyright-icon-color: var(--token-color-hashicorp-brand);
  --app-footer-status-link-icon-operational-color: var(--token-color-foreground-success);
  --app-footer-status-link-icon-degraded-color: var(--token-color-foreground-warning);
  --app-footer-status-link-icon-maintenance-color: var(--token-color-foreground-warning);
  --app-footer-status-link-icon-outage-color: var(--token-color-foreground-critical);
}

.hds-app-footer--theme-dark {
  --app-footer-foreground-color: #b2b6bd;
  --app-footer-border-top-color: #b2b6bd66;
  --app-footer-link-default-color: #b2b6bd;
  --app-footer-link-hover-color: #d5d7db;
  --app-footer-link-active-color: #efeff1;
  --app-footer-link-focus-color: #b2b6bd;
  --app-footer-link-focus-outline-color: #389aff;
  --app-footer-copyright-text-color: #b2b6bd;
  --app-footer-copyright-icon-color: #fff;
  --app-footer-status-link-icon-operational-color: #009241;
  --app-footer-status-link-icon-degraded-color: #e88c03;
  --app-footer-status-link-icon-maintenance-color: #e88c03;
  --app-footer-status-link-icon-outage-color: #ef3016;
}

/**
 * Copyright (c) HashiCorp, Inc.
 * SPDX-License-Identifier: MPL-2.0
 */
.hds-app-frame {
  display: grid;
  grid-template-areas: "header header" "sidebar main" "sidebar footer";
  grid-template-rows: auto 1fr auto;
  grid-template-columns: auto 1fr;
  min-height: 100vh;
}

.hds-app-frame__header {
  z-index: 21;
  grid-area: header;
}
@media (min-height: 480px) {
  .hds-app-frame__header {
    position: sticky;
    top: 0;
    right: 0;
    left: 0;
  }
}

.hds-app-frame__sidebar {
  position: sticky;
  top: 0;
  z-index: 20;
  grid-area: sidebar;
  height: 100vh;
  min-height: 100vh;
}
@media (min-height: 480px) {
  .hds-app-frame--has-header-with-sidebar .hds-app-frame__sidebar {
    top: var(--token-app-header-height);
    height: calc(100vh - var(--token-app-header-height));
    min-height: calc(100vh - var(--token-app-header-height));
  }
}

.hds-app-frame__main {
  grid-area: main;
}
.hds-app-frame--has-header-with-sidebar .hds-app-frame__main {
  margin-top: calc(var(--token-app-header-height) * -1);
  padding-top: var(--token-app-header-height);
}

.hds-app-frame__footer {
  grid-area: footer;
}

.hds-app-frame__modals {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 100;
  width: 100vw;
  height: 100vh;
  pointer-events: none;
}
.hds-app-frame__modals:empty {
  display: none;
}

/**
 * Copyright (c) HashiCorp, Inc.
 * SPDX-License-Identifier: MPL-2.0
 */
/**
 * Copyright (c) HashiCorp, Inc.
 * SPDX-License-Identifier: MPL-2.0
 */
/**
 * Copyright (c) HashiCorp, Inc.
 * SPDX-License-Identifier: MPL-2.0
 */
.hds-app-header {
  position: relative;
  display: flex;
  gap: 12px;
  align-items: center;
  justify-content: space-between;
  min-height: var(--token-app-header-height);
  padding: 12px 16px 11px 16px;
  color: var(--token-color-foreground-high-contrast);
  background: var(--token-color-palette-neutral-700);
  border-bottom: 1px solid var(--token-color-palette-neutral-500);
}
.hds-app-header .ember-a11y-refocus-skip-link {
  top: 10px;
  left: 10px;
  z-index: 20;
  width: max-content;
  padding: 2px 10px 4px;
  color: var(--token-color-foreground-action);
  font-size: var(--token-typography-display-200-font-size);
  font-family: var(--token-typography-display-200-font-family);
  line-height: var(--token-typography-display-200-line-height);
  background-color: var(--token-color-surface-faint);
  border-radius: var(--token-border-radius-x-small);
  transform: translateY(-200%);
  transition: 0.6s ease-in-out;
}
.hds-app-header .ember-a11y-refocus-skip-link:focus {
  transform: translateY(0);
}
.hds-app-header.hds-app-header--is-desktop .hds-app-header__global-actions {
  margin-right: auto;
}
.hds-app-header.hds-app-header--is-mobile .hds-app-header__actions {
  position: absolute;
  top: calc(100% + 1px);
  right: 0;
  left: 0;
}
.hds-app-header.hds-app-header--is-mobile .hds-app-header__actions {
  flex-wrap: wrap;
  align-content: flex-start;
  padding: 16px;
  overflow: auto;
  background: var(--token-color-palette-neutral-700);
}
.hds-app-header.hds-app-header--is-mobile.hds-app-header--menu-is-closed .hds-app-header__actions {
  display: none;
}
.hds-app-header.hds-app-header--is-mobile.hds-app-header--menu-is-open .hds-app-header__actions {
  height: calc(100vh - var(--token-app-header-height));
}
.hds-app-header.hds-app-header--is-mobile .hds-app-header__global-actions,
.hds-app-header.hds-app-header--is-mobile .hds-app-header__global-actions .hds-dropdown,
.hds-app-header.hds-app-header--is-mobile .hds-app-header__global-actions .hds-dropdown-toggle-button {
  width: 100%;
}
.hds-app-header .hds-app-header__global-actions,
.hds-app-header .hds-app-header__utility-actions {
  display: flex;
  gap: inherit;
  align-items: center;
}
.hds-app-header .hds-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *),
.hds-app-header .hds-dropdown-toggle-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *),
.hds-app-header .hds-dropdown-toggle-icon:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *) {
  --token-focus-ring-action-box-shadow: inset 0 0 0 1px #bcc7fd, 0 0 0 3px #0d69f2;
  border: 1px solid transparent;
  cursor: pointer;
  border-color: var(--token-color-palette-neutral-500);
  color: var(--token-color-foreground-high-contrast);
  background-color: var(--token-color-palette-neutral-700);
  border-radius: var(--token-border-radius-small);
}
.hds-app-header .hds-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):hover, .hds-app-header .hds-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-hover,
.hds-app-header .hds-dropdown-toggle-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):hover,
.hds-app-header .hds-dropdown-toggle-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-hover,
.hds-app-header .hds-dropdown-toggle-icon:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):hover,
.hds-app-header .hds-dropdown-toggle-icon:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-hover {
  border-color: var(--token-color-palette-neutral-500);
  color: var(--token-color-foreground-high-contrast);
  background-color: var(--token-color-palette-neutral-600);
}
.hds-app-header .hds-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):focus, .hds-app-header .hds-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-focus,
.hds-app-header .hds-dropdown-toggle-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):focus,
.hds-app-header .hds-dropdown-toggle-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-focus,
.hds-app-header .hds-dropdown-toggle-icon:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):focus,
.hds-app-header .hds-dropdown-toggle-icon:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-focus {
  position: relative;
  outline-style: solid;
  outline-color: transparent;
  isolation: isolate;
  color: var(--token-color-foreground-high-contrast);
  background-color: var(--token-color-palette-neutral-700);
  border-color: #bcc7fd;
}
.hds-app-header .hds-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):focus::before, .hds-app-header .hds-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-focus::before,
.hds-app-header .hds-dropdown-toggle-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):focus::before,
.hds-app-header .hds-dropdown-toggle-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-focus::before,
.hds-app-header .hds-dropdown-toggle-icon:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):focus::before,
.hds-app-header .hds-dropdown-toggle-icon:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-focus::before {
  position: absolute;
  top: -1px;
  right: -1px;
  bottom: -1px;
  left: -1px;
  z-index: -1;
  border-radius: 5px;
  content: "";
}
.hds-app-header .hds-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):focus:focus::before, .hds-app-header .hds-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):focus.mock-focus::before, .hds-app-header .hds-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-focus:focus::before, .hds-app-header .hds-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-focus.mock-focus::before,
.hds-app-header .hds-dropdown-toggle-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):focus:focus::before,
.hds-app-header .hds-dropdown-toggle-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):focus.mock-focus::before,
.hds-app-header .hds-dropdown-toggle-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-focus:focus::before,
.hds-app-header .hds-dropdown-toggle-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-focus.mock-focus::before,
.hds-app-header .hds-dropdown-toggle-icon:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):focus:focus::before,
.hds-app-header .hds-dropdown-toggle-icon:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):focus.mock-focus::before,
.hds-app-header .hds-dropdown-toggle-icon:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-focus:focus::before,
.hds-app-header .hds-dropdown-toggle-icon:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-focus.mock-focus::before {
  box-shadow: var(--token-focus-ring-action-box-shadow);
}
.hds-app-header .hds-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):focus:focus:not(:focus-visible)::before, .hds-app-header .hds-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-focus:focus:not(:focus-visible)::before,
.hds-app-header .hds-dropdown-toggle-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):focus:focus:not(:focus-visible)::before,
.hds-app-header .hds-dropdown-toggle-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-focus:focus:not(:focus-visible)::before,
.hds-app-header .hds-dropdown-toggle-icon:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):focus:focus:not(:focus-visible)::before,
.hds-app-header .hds-dropdown-toggle-icon:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-focus:focus:not(:focus-visible)::before {
  box-shadow: none;
}
.hds-app-header .hds-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):focus:focus-visible::before, .hds-app-header .hds-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-focus:focus-visible::before,
.hds-app-header .hds-dropdown-toggle-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):focus:focus-visible::before,
.hds-app-header .hds-dropdown-toggle-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-focus:focus-visible::before,
.hds-app-header .hds-dropdown-toggle-icon:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):focus:focus-visible::before,
.hds-app-header .hds-dropdown-toggle-icon:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-focus:focus-visible::before {
  box-shadow: var(--token-focus-ring-action-box-shadow);
}
.hds-app-header .hds-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):focus:focus:active::before, .hds-app-header .hds-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):focus.mock-focus.mock-active::before, .hds-app-header .hds-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-focus:focus:active::before, .hds-app-header .hds-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-focus.mock-focus.mock-active::before,
.hds-app-header .hds-dropdown-toggle-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):focus:focus:active::before,
.hds-app-header .hds-dropdown-toggle-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):focus.mock-focus.mock-active::before,
.hds-app-header .hds-dropdown-toggle-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-focus:focus:active::before,
.hds-app-header .hds-dropdown-toggle-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-focus.mock-focus.mock-active::before,
.hds-app-header .hds-dropdown-toggle-icon:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):focus:focus:active::before,
.hds-app-header .hds-dropdown-toggle-icon:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):focus.mock-focus.mock-active::before,
.hds-app-header .hds-dropdown-toggle-icon:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-focus:focus:active::before,
.hds-app-header .hds-dropdown-toggle-icon:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-focus.mock-focus.mock-active::before {
  box-shadow: none;
}
.hds-app-header .hds-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):focus::before, .hds-app-header .hds-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-focus::before,
.hds-app-header .hds-dropdown-toggle-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):focus::before,
.hds-app-header .hds-dropdown-toggle-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-focus::before,
.hds-app-header .hds-dropdown-toggle-icon:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):focus::before,
.hds-app-header .hds-dropdown-toggle-icon:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-focus::before {
  color: var(--token-color-foreground-high-contrast);
  border: none;
}
.hds-app-header .hds-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):focus:focus:not(:focus-visible)::before,
.hds-app-header .hds-dropdown-toggle-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):focus:focus:not(:focus-visible)::before,
.hds-app-header .hds-dropdown-toggle-icon:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):focus:focus:not(:focus-visible)::before {
  box-shadow: inset 0 0 0 1px #bcc7fd, 0 0 0 3px #0d69f2;
}
.hds-app-header .hds-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):active, .hds-app-header .hds-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-active,
.hds-app-header .hds-dropdown-toggle-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):active,
.hds-app-header .hds-dropdown-toggle-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-active,
.hds-app-header .hds-dropdown-toggle-icon:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):active,
.hds-app-header .hds-dropdown-toggle-icon:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-active {
  color: var(--token-color-foreground-high-contrast);
  background-color: var(--token-color-palette-neutral-500);
  border-color: var(--token-color-palette-neutral-400);
}
.hds-app-header .hds-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):disabled, .hds-app-header .hds-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *)[disabled], .hds-app-header .hds-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-disabled, .hds-app-header .hds-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):disabled:focus, .hds-app-header .hds-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *)[disabled]:focus, .hds-app-header .hds-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-disabled:focus, .hds-app-header .hds-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):disabled:hover, .hds-app-header .hds-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *)[disabled]:hover, .hds-app-header .hds-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-disabled:hover,
.hds-app-header .hds-dropdown-toggle-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):disabled,
.hds-app-header .hds-dropdown-toggle-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *)[disabled],
.hds-app-header .hds-dropdown-toggle-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-disabled,
.hds-app-header .hds-dropdown-toggle-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):disabled:focus,
.hds-app-header .hds-dropdown-toggle-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *)[disabled]:focus,
.hds-app-header .hds-dropdown-toggle-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-disabled:focus,
.hds-app-header .hds-dropdown-toggle-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):disabled:hover,
.hds-app-header .hds-dropdown-toggle-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *)[disabled]:hover,
.hds-app-header .hds-dropdown-toggle-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-disabled:hover,
.hds-app-header .hds-dropdown-toggle-icon:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):disabled,
.hds-app-header .hds-dropdown-toggle-icon:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *)[disabled],
.hds-app-header .hds-dropdown-toggle-icon:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-disabled,
.hds-app-header .hds-dropdown-toggle-icon:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):disabled:focus,
.hds-app-header .hds-dropdown-toggle-icon:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *)[disabled]:focus,
.hds-app-header .hds-dropdown-toggle-icon:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-disabled:focus,
.hds-app-header .hds-dropdown-toggle-icon:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):disabled:hover,
.hds-app-header .hds-dropdown-toggle-icon:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *)[disabled]:hover,
.hds-app-header .hds-dropdown-toggle-icon:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-disabled:hover {
  color: var(--token-color-foreground-disabled);
  background-color: var(--token-color-palette-neutral-600);
  border-color: var(--token-color-palette-neutral-500);
}

.hds-app-frame:has(.hds-app-side-nav--is-mobile.hds-app-side-nav--is-not-minimized) .hds-button,
.hds-app-frame:has(.hds-app-side-nav--is-mobile.hds-app-side-nav--is-not-minimized) .hds-dropdown-toggle-button,
.hds-app-frame:has(.hds-app-side-nav--is-mobile.hds-app-side-nav--is-not-minimized) .hds-dropdown-toggle-icon,
.hds-app-frame:has(.hds-app-side-nav--is-mobile.hds-app-side-nav--is-not-minimized) .hds-app-header__home-link,
.hds-app-frame:has(.hds-side-nav--is-mobile.hds-side-nav--is-not-minimized) .hds-button,
.hds-app-frame:has(.hds-side-nav--is-mobile.hds-side-nav--is-not-minimized) .hds-dropdown-toggle-button,
.hds-app-frame:has(.hds-side-nav--is-mobile.hds-side-nav--is-not-minimized) .hds-dropdown-toggle-icon,
.hds-app-frame:has(.hds-side-nav--is-mobile.hds-side-nav--is-not-minimized) .hds-app-header__home-link {
  color: var(--token-color-foreground-disabled);
  background-color: var(--token-color-palette-neutral-600);
  border-color: var(--token-color-palette-neutral-500);
  pointer-events: none;
}

.hds-app-header__home-link {
  --token-focus-ring-action-box-shadow: inset 0 0 0 1px #bcc7fd, 0 0 0 3px #0d69f2;
  border: 1px solid transparent;
  cursor: pointer;
  color: var(--token-color-foreground-high-contrast);
  background-color: var(--token-color-palette-neutral-700);
  border-radius: var(--token-border-radius-small);
  display: flex;
  gap: 8px;
  align-items: center;
  justify-content: center;
  padding: 3px;
  text-decoration: none;
}
.hds-app-header__home-link:hover, .hds-app-header__home-link.mock-hover {
  color: var(--token-color-foreground-high-contrast);
  background-color: var(--token-color-palette-neutral-600);
}
.hds-app-header__home-link:focus, .hds-app-header__home-link.mock-focus {
  position: relative;
  outline-style: solid;
  outline-color: transparent;
  isolation: isolate;
  color: var(--token-color-foreground-high-contrast);
  background-color: var(--token-color-palette-neutral-700);
}
.hds-app-header__home-link:focus::before, .hds-app-header__home-link.mock-focus::before {
  position: absolute;
  top: -1px;
  right: -1px;
  bottom: -1px;
  left: -1px;
  z-index: -1;
  border-radius: 5px;
  content: "";
}
.hds-app-header__home-link:focus:focus::before, .hds-app-header__home-link:focus.mock-focus::before, .hds-app-header__home-link.mock-focus:focus::before, .hds-app-header__home-link.mock-focus.mock-focus::before {
  box-shadow: var(--token-focus-ring-action-box-shadow);
}
.hds-app-header__home-link:focus:focus:not(:focus-visible)::before, .hds-app-header__home-link.mock-focus:focus:not(:focus-visible)::before {
  box-shadow: none;
}
.hds-app-header__home-link:focus:focus-visible::before, .hds-app-header__home-link.mock-focus:focus-visible::before {
  box-shadow: var(--token-focus-ring-action-box-shadow);
}
.hds-app-header__home-link:focus:focus:active::before, .hds-app-header__home-link:focus.mock-focus.mock-active::before, .hds-app-header__home-link.mock-focus:focus:active::before, .hds-app-header__home-link.mock-focus.mock-focus.mock-active::before {
  box-shadow: none;
}
.hds-app-header__home-link:focus::before, .hds-app-header__home-link.mock-focus::before {
  color: var(--token-color-foreground-high-contrast);
  border: none;
}
.hds-app-header__home-link:focus:focus:not(:focus-visible)::before {
  box-shadow: inset 0 0 0 1px #bcc7fd, 0 0 0 3px #0d69f2;
}
.hds-app-header__home-link:active, .hds-app-header__home-link.mock-active {
  color: var(--token-color-foreground-high-contrast);
  background-color: var(--token-color-palette-neutral-500);
}
.hds-app-header__home-link:disabled, .hds-app-header__home-link[disabled], .hds-app-header__home-link.mock-disabled, .hds-app-header__home-link:disabled:focus, .hds-app-header__home-link[disabled]:focus, .hds-app-header__home-link.mock-disabled:focus, .hds-app-header__home-link:disabled:hover, .hds-app-header__home-link[disabled]:hover, .hds-app-header__home-link.mock-disabled:hover {
  color: var(--token-color-foreground-disabled);
  background-color: var(--token-color-palette-neutral-600);
  border-color: var(--token-color-palette-neutral-500);
}
.hds-app-header__home-link svg {
  width: var(--token-app-header-logo-size);
  height: var(--token-app-header-logo-size);
}

.hds-app-header__actions-content,
.hds-app-header__actions {
  display: flex;
  flex: 1;
  gap: inherit;
}

/**
 * Copyright (c) HashiCorp, Inc.
 * SPDX-License-Identifier: MPL-2.0
 */
/**
 * Copyright (c) HashiCorp, Inc.
 * SPDX-License-Identifier: MPL-2.0
 */
:root {
  --hds-app-side-nav-width-minimized: 16px;
  --hds-app-side-nav-width-expanded: 280px;
  --hds-app-side-nav-width-fixed: var(--hds-app-sidenav-width-expanded);
  --hds-app-side-nav-animation-duration: 200ms;
  --hds-app-side-nav-animation-delay: var(--hds-app-sidenav-animation-duration);
  --hds-app-side-nav-animation-easing: cubic-bezier(0.65, 0, 0.35, 1);
  --hds-app-side-nav-toggle-button-width: 24px;
}

@media (prefers-reduced-motion) {
  :root {
    --hds-app-side-nav-animation-duration: 0;
  }
}
/**
 * Copyright (c) HashiCorp, Inc.
 * SPDX-License-Identifier: MPL-2.0
 */
.hds-app-side-nav {
  position: relative;
  width: var(--hds-app-side-nav-width-fixed);
  height: 100%;
  min-height: 100%;
  isolation: isolate;
}
.hds-app-side-nav.hds-app-side-nav--is-responsive {
  transition: width var(--hds-app-side-nav-animation-duration) var(--hds-app-side-nav-animation-easing);
}
.hds-app-side-nav.hds-app-side-nav--is-mobile {
  width: var(--hds-app-side-nav-width-minimized);
}
.hds-app-side-nav.hds-app-side-nav--is-desktop.hds-app-side-nav--is-not-minimized {
  width: var(--hds-app-side-nav-width-expanded);
}
.hds-app-side-nav.hds-app-side-nav--is-desktop.hds-app-side-nav--is-minimized {
  width: var(--hds-app-side-nav-width-minimized);
}

.hds-app-side-nav__overlay {
  position: fixed;
  z-index: -1;
  inset: 0;
  background-color: var(--token-color-palette-neutral-700);
  opacity: 0.2;
  transition: opacity var(--hds-app-side-nav-animation-duration) var(--hds-app-side-nav-animation-easing) var(--hds-app-side-nav-animation-delay);
}
.hds-app-side-nav--is-minimized .hds-app-side-nav__overlay {
  opacity: 0;
  pointer-events: none;
}
.hds-app-side-nav--is-desktop .hds-app-side-nav__overlay {
  display: none;
}

.hds-app-side-nav__wrapper {
  display: flex;
  flex-direction: column;
  height: 100%;
  color: var(--token-app-side-nav-color-foreground-primary);
  background: var(--token-app-side-nav-color-surface-primary);
  border-right: var(--token-app-side-nav-wrapper-border-width) solid var(--token-app-side-nav-wrapper-border-color);
}
.hds-app-side-nav--is-responsive .hds-app-side-nav__wrapper {
  transition: width var(--hds-app-side-nav-animation-duration) var(--hds-app-side-nav-animation-easing);
}
.hds-app-side-nav--is-minimized .hds-app-side-nav__wrapper {
  width: var(--hds-app-side-nav-width-minimized);
}
.hds-app-side-nav--is-not-minimized .hds-app-side-nav__wrapper {
  width: var(--hds-app-side-nav-width-expanded);
}

.hds-app-side-nav__wrapper-body {
  flex: 1;
  padding: var(--token-app-side-nav-wrapper-padding-vertical) var(--token-app-side-nav-wrapper-padding-horizontal);
  overflow-x: hidden;
  overflow-y: auto;
}

.hds-app-side-nav--is-minimized .hds-app-side-nav__wrapper-body {
  visibility: hidden !important;
  opacity: 0;
  pointer-events: none;
}
.hds-app-side-nav--is-not-minimized .hds-app-side-nav__wrapper-body {
  visibility: visible;
  opacity: 1;
  transition: opacity var(--hds-app-side-nav-animation-duration) var(--hds-app-side-nav-animation-easing) var(--hds-app-side-nav-animation-delay);
}
.hds-app-side-nav--is-animating .hds-app-side-nav__wrapper-body {
  pointer-events: none;
}

/**
 * Copyright (c) HashiCorp, Inc.
 * SPDX-License-Identifier: MPL-2.0
 */
.hds-app-side-nav__content {
  margin: 0 calc(var(--token-app-side-nav-wrapper-padding-horizontal) * -1);
}
.hds-app-side-nav--is-minimized .hds-app-side-nav__content {
  height: 0;
  overflow: hidden;
}

.hds-app-side-nav__content-panels {
  display: grid;
  grid-template-columns: repeat(5, var(--hds-app-side-nav-width-expanded));
  width: 100%;
}

.hds-app-side-nav__content-panel {
  padding: 0 var(--token-app-side-nav-wrapper-padding-horizontal);
}
.hds-app-side-nav__content-panel[aria-hidden=true] {
  max-height: 0;
  overflow: hidden;
}

.hds-app-side-nav__list-title {
  min-height: var(--token-app-side-nav-body-list-item-height);
  margin-top: var(--token-app-side-nav-body-list-margin-vertical);
  padding: 9px var(--token-app-side-nav-body-list-item-padding-horizontal);
  color: var(--token-app-side-nav-color-foreground-faint);
  overflow-wrap: break-word;
}
.hds-app-side-nav__list-wrapper:first-child .hds-app-side-nav__list-item:first-child > .hds-app-side-nav__list-title {
  margin-top: 0;
}

.hds-app-side-nav__list-wrapper,
.hds-app-side-nav__list {
  margin: 0;
  padding: 0;
}

.hds-app-side-nav__list-item {
  list-style-type: none;
}
.hds-app-side-nav__list-item + .hds-app-side-nav__list-item {
  margin-top: var(--token-app-side-nav-body-list-item-spacing-vertical);
}

.hds-app-side-nav__list-item-link {
  display: flex;
  gap: var(--token-app-side-nav-body-list-item-content-spacing-horizontal);
  align-items: center;
  width: 100%;
  min-height: var(--token-app-side-nav-body-list-item-height);
  padding: var(--token-app-side-nav-body-list-item-padding-vertical) var(--token-app-side-nav-body-list-item-padding-horizontal);
  color: var(--token-app-side-nav-color-foreground-primary);
  text-decoration: none;
  background: transparent;
  border-color: transparent;
  border-width: 0;
  border-radius: var(--token-app-side-nav-body-list-item-border-radius);
}
.hds-app-side-nav__list-item-link:focus, .hds-app-side-nav__list-item-link.mock-focus {
  position: relative;
  outline-style: solid;
  outline-color: transparent;
  isolation: isolate;
  z-index: 1;
}
.hds-app-side-nav__list-item-link:focus::before, .hds-app-side-nav__list-item-link.mock-focus::before {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: -1;
  border-radius: 5px;
  content: "";
}
.hds-app-side-nav__list-item-link:focus:focus::before, .hds-app-side-nav__list-item-link:focus.mock-focus::before, .hds-app-side-nav__list-item-link.mock-focus:focus::before, .hds-app-side-nav__list-item-link.mock-focus.mock-focus::before {
  box-shadow: var(--token-focus-ring-action-box-shadow);
}
.hds-app-side-nav__list-item-link:focus:focus:not(:focus-visible)::before, .hds-app-side-nav__list-item-link.mock-focus:focus:not(:focus-visible)::before {
  box-shadow: none;
}
.hds-app-side-nav__list-item-link:focus:focus-visible::before, .hds-app-side-nav__list-item-link.mock-focus:focus-visible::before {
  box-shadow: var(--token-focus-ring-action-box-shadow);
}
.hds-app-side-nav__list-item-link:focus:focus:active::before, .hds-app-side-nav__list-item-link:focus.mock-focus.mock-active::before, .hds-app-side-nav__list-item-link.mock-focus:focus:active::before, .hds-app-side-nav__list-item-link.mock-focus.mock-focus.mock-active::before {
  box-shadow: none;
}
.hds-app-side-nav__list-item-link:hover, .hds-app-side-nav__list-item-link.mock-hover {
  background: var(--token-app-side-nav-color-surface-interactive-hover);
  border-color: transparent;
}
.hds-app-side-nav__list-item-link:hover .hds-app-side-nav__list-item-text,
.hds-app-side-nav__list-item-link:hover .hds-app-side-nav__list-item-icon-leading,
.hds-app-side-nav__list-item-link:hover .hds-app-side-nav__list-item-icon-trailing, .hds-app-side-nav__list-item-link.mock-hover .hds-app-side-nav__list-item-text,
.hds-app-side-nav__list-item-link.mock-hover .hds-app-side-nav__list-item-icon-leading,
.hds-app-side-nav__list-item-link.mock-hover .hds-app-side-nav__list-item-icon-trailing {
  color: var(--token-app-side-nav-color-foreground-strong);
}
.hds-app-side-nav__list-item-link:active, .hds-app-side-nav__list-item-link.mock-active {
  background: var(--token-color-surface-interactive-active);
}
.hds-app-side-nav__list-item-link.active, .hds-app-side-nav__list-item-link.active:hover:focus {
  position: relative;
  background: var(--token-color-surface-strong);
}
.hds-app-side-nav__list-item-link.active::after, .hds-app-side-nav__list-item-link.active:hover:focus::after {
  position: absolute;
  top: 0;
  bottom: 0;
  left: calc(var(--token-app-side-nav-wrapper-padding-horizontal) * -1);
  width: 4px;
  background: var(--token-color-foreground-action);
  border-radius: 0 2px 2px 0;
  content: "";
}
.hds-app-side-nav__list-item-link.active .hds-app-side-nav__list-item-text,
.hds-app-side-nav__list-item-link.active .hds-app-side-nav__list-item-icon-leading,
.hds-app-side-nav__list-item-link.active .hds-app-side-nav__list-item-icon-trailing, .hds-app-side-nav__list-item-link.active:hover:focus .hds-app-side-nav__list-item-text,
.hds-app-side-nav__list-item-link.active:hover:focus .hds-app-side-nav__list-item-icon-leading,
.hds-app-side-nav__list-item-link.active:hover:focus .hds-app-side-nav__list-item-icon-trailing {
  color: var(--token-color-foreground-action);
}

.hds-app-side-nav__list-item-link--back-link:active, .hds-app-side-nav__list-item-link--back-link.mock-active {
  background: var(--token-app-side-nav-color-surface-primary);
}
.hds-app-side-nav__list-item-link--back-link:active .hds-app-side-nav__list-item-text,
.hds-app-side-nav__list-item-link--back-link:active .hds-app-side-nav__list-item-icon-leading,
.hds-app-side-nav__list-item-link--back-link:active .hds-app-side-nav__list-item-icon-trailing, .hds-app-side-nav__list-item-link--back-link.mock-active .hds-app-side-nav__list-item-text,
.hds-app-side-nav__list-item-link--back-link.mock-active .hds-app-side-nav__list-item-icon-leading,
.hds-app-side-nav__list-item-link--back-link.mock-active .hds-app-side-nav__list-item-icon-trailing {
  color: var(--token-app-side-nav-color-foreground-primary);
}

.hds-app-side-nav__list-item-text {
  min-width: 0;
  max-width: 100%;
  color: var(--token-color-foreground-strong);
  text-align: left;
  overflow-wrap: break-word;
}

.hds-app-side-nav__list-item-icon-leading {
  flex: none;
}

.hds-app-side-nav__list-item-icon-trailing {
  flex: none;
  margin-left: auto;
}

/**
 * Copyright (c) HashiCorp, Inc.
 * SPDX-License-Identifier: MPL-2.0
 */
.hds-app-side-nav__toggle-button {
  position: absolute;
  top: var(--token-app-side-nav-wrapper-padding-vertical);
  left: calc(var(--token-app-side-nav-wrapper-border-width) * -1);
  z-index: 1;
  display: flex;
  flex-direction: row-reverse;
  align-items: center;
  width: var(--hds-app-side-nav-toggle-button-width);
  height: 36px;
  padding: 0 4px;
  color: var(--token-color-foreground-primary);
  background: none;
  background-color: var(--token-app-side-nav-color-surface-primary);
  border: var(--token-app-side-nav-wrapper-border-width) solid var(--token-app-side-nav-wrapper-border-color);
  border-left-color: transparent;
  border-top-right-radius: var(--token-app-side-nav-toggle-button-border-radius);
  border-bottom-right-radius: var(--token-app-side-nav-toggle-button-border-radius);
  transform: translateX(var(--hds-app-side-nav-width-expanded));
  cursor: pointer;
  transition: transform var(--hds-app-side-nav-animation-duration) var(--hds-app-side-nav-animation-easing), width var(--hds-app-side-nav-animation-duration) var(--hds-app-side-nav-animation-easing);
}
.hds-app-side-nav__toggle-button::before {
  position: absolute;
  top: calc(var(--token-app-side-nav-toggle-button-border-radius) * -2);
  left: calc(var(--token-app-side-nav-wrapper-border-width) * -1);
  box-sizing: border-box;
  width: calc(var(--token-app-side-nav-toggle-button-border-radius) * 2);
  height: calc(var(--token-app-side-nav-toggle-button-border-radius) * 2);
  border-bottom: var(--token-app-side-nav-wrapper-border-width) solid var(--token-app-side-nav-wrapper-border-color);
  border-left: var(--token-app-side-nav-wrapper-border-width) solid var(--token-app-side-nav-wrapper-border-color);
  border-bottom-left-radius: var(--token-app-side-nav-toggle-button-border-radius);
  box-shadow: 0 var(--token-app-side-nav-toggle-button-border-radius) 0 var(--token-app-side-nav-color-surface-primary);
  content: "";
}
.hds-app-side-nav__toggle-button::after {
  position: absolute;
  bottom: calc(var(--token-app-side-nav-toggle-button-border-radius) * -2);
  left: calc(var(--token-app-side-nav-wrapper-border-width) * -1);
  box-sizing: border-box;
  width: calc(var(--token-app-side-nav-toggle-button-border-radius) * 2);
  height: calc(var(--token-app-side-nav-toggle-button-border-radius) * 2);
  border-bottom: var(--token-app-side-nav-wrapper-border-width) solid var(--token-app-side-nav-wrapper-border-color);
  border-left: var(--token-app-side-nav-wrapper-border-width) solid var(--token-app-side-nav-wrapper-border-color);
  border-bottom-left-radius: var(--token-app-side-nav-toggle-button-border-radius);
  box-shadow: 0 var(--token-app-side-nav-toggle-button-border-radius) 0 var(--token-app-side-nav-color-surface-primary);
  transform: scaleY(-1);
  content: "";
}
.hds-app-side-nav__toggle-button:hover, .hds-app-side-nav__toggle-button.mock-hover {
  width: 30px;
  background-color: var(--token-app-side-nav-color-surface-interactive-hover);
}
.hds-app-side-nav__toggle-button:hover::before, .hds-app-side-nav__toggle-button:hover::after, .hds-app-side-nav__toggle-button.mock-hover::before, .hds-app-side-nav__toggle-button.mock-hover::after {
  box-shadow: 0 var(--token-app-side-nav-toggle-button-border-radius) 0 var(--token-app-side-nav-color-surface-interactive-hover);
}
.hds-app-side-nav__toggle-button:active, .hds-app-side-nav__toggle-button.mock-active {
  background-color: var(--token-app-side-nav-color-surface-interactive-active);
}
.hds-app-side-nav__toggle-button:active::before, .hds-app-side-nav__toggle-button:active::after, .hds-app-side-nav__toggle-button.mock-active::before, .hds-app-side-nav__toggle-button.mock-active::after {
  box-shadow: 0 var(--token-app-side-nav-toggle-button-border-radius) 0 var(--token-app-side-nav-color-surface-interactive-active);
}
.hds-app-side-nav__toggle-button:focus-visible, .hds-app-side-nav__toggle-button.mock-focus {
  border-color: var(--token-color-focus-action-internal);
  outline: 3px solid var(--token-color-focus-action-external);
}
.hds-app-side-nav__toggle-button:focus-visible::before, .hds-app-side-nav__toggle-button:focus-visible::after, .hds-app-side-nav__toggle-button.mock-focus::before, .hds-app-side-nav__toggle-button.mock-focus::after {
  display: none;
}
.hds-app-side-nav--is-minimized .hds-app-side-nav__toggle-button {
  transform: translateX(var(--hds-app-side-nav-width-minimized));
}

/**
 * Copyright (c) HashiCorp, Inc.
 * SPDX-License-Identifier: MPL-2.0
 */
.hds-application-state {
  display: flex;
  flex-direction: column;
  align-items: start;
  width: fit-content;
  margin: 0 auto;
}
.hds-application-state.hds-application-state--align-center {
  align-items: center;
  text-align: center;
}
.hds-application-state.hds-application-state--align-center .hds-application-state__header,
.hds-application-state.hds-application-state--align-center .hds-application-state__body,
.hds-application-state.hds-application-state--align-center .hds-application-state__footer {
  width: auto;
}

.hds-application-state__media {
  margin-bottom: 32px;
}
.hds-application-state__media > * {
  display: block;
  max-width: 100%;
}

.hds-application-state__header {
  display: grid;
  grid-template-areas: "error error" "icon title";
  grid-template-columns: min-content 1fr;
  align-items: center;
  width: 100%;
  max-width: 480px;
  color: var(--token-color-foreground-strong);
}

.hds-application-state__error-code {
  grid-area: error;
  margin-bottom: 4px;
  text-transform: uppercase;
}

.hds-application-state__icon {
  grid-area: icon;
  margin-right: 8px;
  padding-top: 4px;
}

.hds-application-state__title {
  grid-row: 2;
  font-weight: var(--token-typography-font-weight-semibold);
}
.hds-application-state__title:not(.hds-application-state__icon + .hds-application-state__title) {
  grid-column: icon/title;
}

.hds-application-state__body {
  width: 100%;
  max-width: 480px;
  margin: 12px 0 0;
  color: var(--token-color-foreground-primary);
}

.hds-application-state__footer {
  display: flex;
  gap: 16px;
  width: 100%;
  max-width: 480px;
  margin-top: 24px;
}
.hds-application-state__footer > :nth-child(3) {
  margin-left: auto;
}

/**
 * Copyright (c) HashiCorp, Inc.
 * SPDX-License-Identifier: MPL-2.0
 */
.hds-badge {
  --token-color-surface-success: var(--token-color-palette-green-100);
  --token-color-foreground-success-on-surface: var(--token-color-palette-green-400);
  --token-color-surface-warning: var(--token-color-palette-amber-100);
  --token-color-foreground-warning-on-surface: var(--token-color-palette-amber-400);
  --token-color-surface-critical: var(--token-color-palette-red-100);
  --token-color-foreground-critical-on-surface: var(--token-color-palette-red-400);
  --token-color-surface-highlight: var(--token-color-palette-purple-100);
  --token-color-foreground-highlight-on-surface: var(--token-color-palette-purple-400);
  display: inline-flex;
  align-items: center;
  max-width: 100%;
  vertical-align: middle;
  border: 1px solid transparent;
  border-radius: var(--token-border-radius-small);
}

.hds-badge__icon {
  display: block;
  flex: 0 0 auto;
}

.hds-badge__text {
  flex: 1 0 0;
  font-weight: var(--token-typography-font-weight-medium);
  font-family: var(--token-typography-font-stack-text);
}

.hds-badge--size-small {
  gap: 0.25rem;
  min-height: 1.25rem;
  padding: calc(0.125rem - 1px) calc(0.375rem - 1px);
}
.hds-badge--size-small .hds-badge__icon {
  width: 0.75rem;
  height: 0.75rem;
}
.hds-badge--size-small .hds-badge__text {
  font-size: 0.8125rem;
  line-height: 1.2308;
}

.hds-badge--size-medium {
  gap: 0.25rem;
  min-height: 1.5rem;
  padding: calc(0.25rem - 1px) calc(0.5rem - 1px);
}
.hds-badge--size-medium .hds-badge__icon {
  width: 1rem;
  height: 1rem;
}
.hds-badge--size-medium .hds-badge__text {
  font-size: 0.8125rem;
  line-height: 1.2308;
}

.hds-badge--size-large {
  gap: 0.375rem;
  min-height: 2rem;
  padding: calc(0.25rem - 1px) calc(0.5rem - 1px);
}
.hds-badge--size-large .hds-badge__icon {
  width: 1rem;
  height: 1rem;
}
.hds-badge--size-large .hds-badge__text {
  font-size: 1rem;
  line-height: 1.5;
}

.hds-badge--color-neutral.hds-badge--type-filled {
  color: var(--token-color-foreground-primary);
  background-color: var(--token-color-palette-neutral-200);
}
.hds-badge--color-neutral.hds-badge--type-inverted {
  color: var(--token-color-foreground-high-contrast);
  background-color: var(--token-color-palette-neutral-500);
}
.hds-badge--color-neutral.hds-badge--type-outlined {
  color: var(--token-color-foreground-primary);
  background-color: transparent;
  border-color: var(--token-color-palette-neutral-500);
}

.hds-badge--color-neutral-dark-mode.hds-badge--type-filled {
  color: var(--token-color-foreground-high-contrast);
  background-color: var(--token-color-palette-neutral-500);
}
.hds-badge--color-neutral-dark-mode.hds-badge--type-inverted {
  color: var(--token-color-foreground-primary);
  background-color: var(--token-color-surface-faint);
}
.hds-badge--color-neutral-dark-mode.hds-badge--type-outlined {
  color: var(--token-color-foreground-high-contrast);
  background-color: transparent;
  border-color: var(--token-color-palette-neutral-50);
}

.hds-badge--color-highlight.hds-badge--type-filled {
  color: var(--token-color-foreground-highlight-on-surface);
  background-color: var(--token-color-surface-highlight);
}
.hds-badge--color-highlight.hds-badge--type-inverted {
  color: var(--token-color-foreground-high-contrast);
  background-color: var(--token-color-palette-purple-200);
}
.hds-badge--color-highlight.hds-badge--type-outlined {
  color: var(--token-color-foreground-highlight);
  background-color: transparent;
  border-color: var(--token-color-palette-purple-200);
}

.hds-badge--color-success.hds-badge--type-filled {
  color: var(--token-color-foreground-success-on-surface);
  background-color: var(--token-color-surface-success);
}
.hds-badge--color-success.hds-badge--type-inverted {
  color: var(--token-color-foreground-high-contrast);
  background-color: var(--token-color-palette-green-200);
}
.hds-badge--color-success.hds-badge--type-outlined {
  color: var(--token-color-foreground-success);
  background-color: transparent;
  border-color: var(--token-color-palette-green-200);
}

.hds-badge--color-warning.hds-badge--type-filled {
  color: var(--token-color-foreground-warning-on-surface);
  background-color: var(--token-color-surface-warning);
}
.hds-badge--color-warning.hds-badge--type-inverted {
  color: var(--token-color-foreground-high-contrast);
  background-color: var(--token-color-palette-amber-200);
}
.hds-badge--color-warning.hds-badge--type-outlined {
  color: var(--token-color-foreground-warning);
  background-color: transparent;
  border-color: var(--token-color-palette-amber-200);
}

.hds-badge--color-critical.hds-badge--type-filled {
  color: var(--token-color-foreground-critical-on-surface);
  background-color: var(--token-color-surface-critical);
}
.hds-badge--color-critical.hds-badge--type-inverted {
  color: var(--token-color-foreground-high-contrast);
  background-color: var(--token-color-palette-red-200);
}
.hds-badge--color-critical.hds-badge--type-outlined {
  color: var(--token-color-foreground-critical);
  background-color: transparent;
  border-color: var(--token-color-palette-red-200);
}

/**
 * Copyright (c) HashiCorp, Inc.
 * SPDX-License-Identifier: MPL-2.0
 */
.hds-badge-count {
  display: inline-flex;
  align-items: center;
  max-width: 100%;
  font-weight: var(--token-typography-font-weight-medium);
  font-family: var(--token-typography-font-stack-text);
  border: 1px solid transparent;
}

.hds-badge-count--size-small {
  min-height: 1.25rem;
  padding: calc(0.125rem - 1px) calc(0.5rem - 1px);
  font-size: 0.8125rem;
  line-height: 1.2308;
  border-radius: 0.625rem;
}

.hds-badge-count--size-medium {
  min-height: 1.5rem;
  padding: calc(0.25rem - 1px) calc(0.75rem - 1px);
  font-size: 0.8125rem;
  line-height: 1.2308;
  border-radius: 0.75rem;
}

.hds-badge-count--size-large {
  min-height: 2rem;
  padding: calc(0.25rem - 1px) calc(0.875rem - 1px);
  font-size: 1rem;
  line-height: 1.5;
  border-radius: 1rem;
}

.hds-badge-count--color-neutral.hds-badge-count--type-filled {
  color: var(--token-color-foreground-primary);
  background-color: var(--token-color-palette-neutral-200);
}
.hds-badge-count--color-neutral.hds-badge-count--type-inverted {
  color: var(--token-color-foreground-high-contrast);
  background-color: var(--token-color-palette-neutral-500);
}
.hds-badge-count--color-neutral.hds-badge-count--type-outlined {
  color: var(--token-color-foreground-primary);
  background-color: transparent;
  border-color: var(--token-color-palette-neutral-500);
}

.hds-badge-count--color-neutral-dark-mode.hds-badge-count--type-filled {
  color: var(--token-color-foreground-high-contrast);
  background-color: var(--token-color-palette-neutral-500);
}
.hds-badge-count--color-neutral-dark-mode.hds-badge-count--type-inverted {
  color: var(--token-color-foreground-primary);
  background-color: var(--token-color-surface-faint);
}
.hds-badge-count--color-neutral-dark-mode.hds-badge-count--type-outlined {
  color: var(--token-color-foreground-high-contrast);
  background-color: transparent;
  border-color: var(--token-color-palette-neutral-50);
}

/**
 * Copyright (c) HashiCorp, Inc.
 * SPDX-License-Identifier: MPL-2.0
 */
.hds-breadcrumb {
  position: relative;
}

.hds-breadcrumb__list {
  display: flex;
  margin: 0;
  padding: 0;
  list-style: none;
}
.hds-breadcrumb--items-can-wrap .hds-breadcrumb__list {
  flex-wrap: wrap;
}

.hds-breadcrumb__sublist {
  margin: 0;
  padding: 0;
  list-style: none;
}

.hds-breadcrumb__item {
  position: relative;
  display: flex;
  flex-direction: row;
  align-items: center;
  min-width: 0;
}
.hds-breadcrumb__list > .hds-breadcrumb__item:not(:last-child)::after {
  padding: 0 8px;
  color: var(--token-color-palette-neutral-300);
  content: "/";
}
.hds-breadcrumb__sublist > .hds-breadcrumb__item + .hds-breadcrumb__item {
  margin-top: 4px;
}

.hds-breadcrumb__item--is-truncation {
  flex: none;
}

.hds-breadcrumb__link {
  display: flex;
  flex-direction: row;
  align-items: center;
  min-width: 0;
  margin: 0 -4px;
  padding: 0 4px;
  color: var(--token-color-foreground-faint);
  border-radius: var(--token-border-radius-small);
  text-decoration-color: transparent;
  outline-style: solid;
  outline-color: transparent;
}
.hds-breadcrumb__link:hover, .hds-breadcrumb__link.mock-hover {
  color: var(--token-color-palette-neutral-600);
}
.hds-breadcrumb__link:hover > .hds-breadcrumb__text, .hds-breadcrumb__link.mock-hover > .hds-breadcrumb__text {
  text-decoration-color: currentColor;
}
.hds-breadcrumb__link:focus, .hds-breadcrumb__link.mock-focus {
  box-shadow: var(--token-focus-ring-action-box-shadow);
}
.hds-breadcrumb__link:focus:not(:focus-visible) {
  box-shadow: none;
}
.hds-breadcrumb__link:focus-visible {
  box-shadow: var(--token-focus-ring-action-box-shadow);
}
.hds-breadcrumb__link:focus:active, .hds-breadcrumb__link.mock-focus.mock-active {
  box-shadow: none;
}
.hds-breadcrumb__link:active, .hds-breadcrumb__link.mock-active {
  color: var(--token-color-foreground-secondary);
}
.hds-breadcrumb__link:active > .hds-breadcrumb__text, .hds-breadcrumb__link.mock-active > .hds-breadcrumb__text {
  text-decoration-color: currentColor;
}

.hds-breadcrumb__current {
  display: flex;
  flex-direction: row;
  align-items: center;
  min-width: 0;
  margin: 0 -4px;
  padding: 0 4px;
  color: var(--token-color-foreground-strong);
}

.hds-breadcrumb__icon {
  flex: none;
  width: 13px;
  height: 13px;
  margin-right: 6px;
}

.hds-breadcrumb__text {
  padding: calc((28px - 1rem) / 2) 0;
  overflow: hidden;
  font-size: 0.8125rem;
  font-family: var(--token-typography-font-stack-text);
  line-height: 1rem;
  white-space: nowrap;
  text-decoration: underline;
  text-overflow: ellipsis;
  text-decoration-color: transparent;
}
.hds-breadcrumb__sublist .hds-breadcrumb__text {
  white-space: normal;
}

.hds-breadcrumb__truncation-toggle {
  display: flex;
  flex: none;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  margin: 0 -4px;
  padding: 0;
  color: var(--token-color-foreground-faint);
  background-color: transparent;
  border: 1px solid transparent;
  border-radius: var(--token-border-radius-small);
  outline: none;
  cursor: pointer;
  outline-style: solid;
  outline-color: transparent;
}
.hds-breadcrumb__truncation-toggle:hover, .hds-breadcrumb__truncation-toggle.mock-hover {
  color: var(--token-color-foreground-faint);
  background-color: var(--token-color-surface-interactive);
  border-color: var(--token-color-border-strong);
}
.hds-breadcrumb__truncation-toggle:focus, .hds-breadcrumb__truncation-toggle.mock-focus {
  box-shadow: var(--token-focus-ring-action-box-shadow);
}
.hds-breadcrumb__truncation-toggle:focus:not(:focus-visible) {
  box-shadow: none;
}
.hds-breadcrumb__truncation-toggle:focus-visible {
  box-shadow: var(--token-focus-ring-action-box-shadow);
}
.hds-breadcrumb__truncation-toggle:focus:active, .hds-breadcrumb__truncation-toggle.mock-focus.mock-active {
  box-shadow: none;
}
.hds-breadcrumb__truncation-toggle:focus, .hds-breadcrumb__truncation-toggle.mock-focus {
  background-color: transparent;
  border: none;
}
.hds-breadcrumb__truncation-toggle:active, .hds-breadcrumb__truncation-toggle.mock-active {
  color: var(--token-color-foreground-primary);
  background-color: var(--token-color-surface-interactive-active);
  border-color: var(--token-color-border-strong);
}

.hds-breadcrumb__truncation-content {
  position: relative;
  width: max-content;
  max-width: 200px;
  padding: 6px 12px;
  background-color: var(--token-color-surface-primary);
  border-radius: var(--token-border-radius-medium);
  box-shadow: var(--token-surface-high-box-shadow);
}
:where(.hds-breadcrumb__truncation-content[popover]) {
  width: fit-content;
  height: fit-content;
  margin: 0;
  padding: 0;
  overflow: visible;
  color: inherit;
  background: none;
  border: none;
  inset: 0;
}

/**
 * Copyright (c) HashiCorp, Inc.
 * SPDX-License-Identifier: MPL-2.0
 */
/**
 * Copyright (c) HashiCorp, Inc.
 * SPDX-License-Identifier: MPL-2.0
 */
.hds-button {
  position: relative;
  display: flex;
  gap: 0.375rem;
  align-items: center;
  justify-content: center;
  width: auto;
  font-weight: var(--token-typography-font-weight-regular);
  font-family: var(--token-typography-font-stack-text);
  text-decoration: none;
  border: 1px solid transparent;
  border-radius: var(--token-border-radius-small);
  outline-style: solid;
  outline-color: transparent;
  isolation: isolate;
}
a.hds-button {
  width: fit-content;
}
a.hds-button:hover, a.hds-button:focus, a.hds-button:active, a.hds-button.mock-hover, a.hds-button.mock-focus, a.hds-button.mock-active {
  text-decoration: underline;
}

.hds-button:disabled, .hds-button[disabled], .hds-button.mock-disabled, .hds-button:disabled:focus, .hds-button[disabled]:focus, .hds-button.mock-disabled:focus, .hds-button:disabled:hover, .hds-button[disabled]:hover, .hds-button.mock-disabled:hover {
  color: var(--token-color-foreground-disabled);
  background-color: var(--token-color-surface-faint);
  border-color: var(--token-color-border-primary);
  box-shadow: none;
  cursor: not-allowed;
}
.hds-button.hds-button--width-full {
  width: 100%;
  max-width: 100%;
}
.hds-button.hds-button--width-full .hds-button__text {
  flex: 0 0 auto;
}
.hds-button:focus, .hds-button.mock-focus {
  box-shadow: none;
}
.hds-button:focus::before, .hds-button.mock-focus::before {
  position: absolute;
  top: -4px;
  right: -4px;
  bottom: -4px;
  left: -4px;
  z-index: -1;
  border: 3px solid transparent;
  border-radius: calc(var(--token-border-radius-small) + 3px);
  content: "";
}

.hds-button__icon {
  display: block;
}

.hds-button__text {
  display: block;
  flex: 1 0 0;
  text-align: center;
}

.hds-button--color-primary {
  color: var(--token-color-foreground-high-contrast);
  background-color: var(--token-color-palette-blue-200);
  border-color: var(--token-color-palette-blue-300);
  box-shadow: var(--token-elevation-low-box-shadow);
}
.hds-button--color-primary:hover, .hds-button--color-primary.mock-hover {
  color: var(--token-color-foreground-high-contrast);
  background-color: var(--token-color-palette-blue-300);
  border-color: var(--token-color-palette-blue-400);
  cursor: pointer;
}
.hds-button--color-primary:focus, .hds-button--color-primary.mock-focus {
  color: var(--token-color-foreground-high-contrast);
  background-color: var(--token-color-palette-blue-200);
  border-color: var(--token-color-focus-action-internal);
}
.hds-button--color-primary:focus::before, .hds-button--color-primary.mock-focus::before {
  top: -6px;
  right: -6px;
  bottom: -6px;
  left: -6px;
  border-color: var(--token-color-focus-action-external);
  border-radius: calc(var(--token-border-radius-small) + 3px + 2px);
}
.hds-button--color-primary:active, .hds-button--color-primary.mock-active {
  color: var(--token-color-foreground-high-contrast);
  background-color: var(--token-color-palette-blue-400);
  border-color: var(--token-color-palette-blue-400);
  box-shadow: none;
}
.hds-button--color-primary:active::before, .hds-button--color-primary.mock-active::before {
  border-color: transparent;
}

.hds-button--color-secondary {
  color: var(--token-color-foreground-primary);
  background-color: var(--token-color-surface-faint);
  border-color: var(--token-color-border-strong);
  box-shadow: var(--token-elevation-low-box-shadow);
}
.hds-button--color-secondary:hover, .hds-button--color-secondary.mock-hover {
  color: var(--token-color-foreground-primary);
  background-color: var(--token-color-surface-primary);
  border-color: var(--token-color-border-strong);
  cursor: pointer;
}
.hds-button--color-secondary:focus, .hds-button--color-secondary.mock-focus {
  color: var(--token-color-foreground-primary);
  background-color: var(--token-color-surface-faint);
  border-color: var(--token-color-focus-action-internal);
}
.hds-button--color-secondary:focus::before, .hds-button--color-secondary.mock-focus::before {
  border-color: var(--token-color-focus-action-external);
}
.hds-button--color-secondary:active, .hds-button--color-secondary.mock-active {
  color: var(--token-color-foreground-primary);
  background-color: var(--token-color-surface-interactive-active);
  border-color: var(--token-color-border-strong);
  box-shadow: none;
}
.hds-button--color-secondary:active::before, .hds-button--color-secondary.mock-active::before {
  border-color: transparent;
}

.hds-button--color-tertiary {
  color: var(--token-color-foreground-action);
  background-color: transparent;
  border-color: transparent;
}
.hds-button--color-tertiary:hover, .hds-button--color-tertiary.mock-hover {
  color: var(--token-color-foreground-action-hover);
  background-color: var(--token-color-surface-primary);
  border-color: var(--token-color-border-strong);
  cursor: pointer;
}
.hds-button--color-tertiary:focus, .hds-button--color-tertiary.mock-focus {
  color: var(--token-color-foreground-action);
  border-color: var(--token-color-focus-action-internal);
}
.hds-button--color-tertiary:focus::before, .hds-button--color-tertiary.mock-focus::before {
  border-color: var(--token-color-focus-action-external);
}
.hds-button--color-tertiary:active, .hds-button--color-tertiary.mock-active {
  color: var(--token-color-foreground-action-active);
  background-color: var(--token-color-surface-interactive-active);
  border-color: var(--token-color-border-strong);
  box-shadow: none;
}
.hds-button--color-tertiary:active::before, .hds-button--color-tertiary.mock-active::before {
  border-color: transparent;
}
.hds-button--color-tertiary:disabled, .hds-button--color-tertiary[disabled], .hds-button--color-tertiary.mock-disabled, .hds-button--color-tertiary:disabled:focus, .hds-button--color-tertiary[disabled]:focus, .hds-button--color-tertiary.mock-disabled:focus, .hds-button--color-tertiary:disabled:hover, .hds-button--color-tertiary[disabled]:hover, .hds-button--color-tertiary.mock-disabled:hover {
  background-color: transparent;
  border-color: transparent;
}
.hds-button--color-tertiary:disabled::before, .hds-button--color-tertiary[disabled]::before, .hds-button--color-tertiary.mock-disabled::before, .hds-button--color-tertiary:disabled:focus::before, .hds-button--color-tertiary[disabled]:focus::before, .hds-button--color-tertiary.mock-disabled:focus::before, .hds-button--color-tertiary:disabled:hover::before, .hds-button--color-tertiary[disabled]:hover::before, .hds-button--color-tertiary.mock-disabled:hover::before {
  border-color: transparent;
}

.hds-button--color-critical {
  color: var(--token-color-foreground-critical-on-surface);
  background-color: var(--token-color-surface-critical);
  border-color: var(--token-color-foreground-critical-on-surface);
  box-shadow: var(--token-elevation-low-box-shadow);
}
.hds-button--color-critical:hover, .hds-button--color-critical.mock-hover {
  color: var(--token-color-foreground-high-contrast);
  background-color: var(--token-color-palette-red-300);
  border-color: var(--token-color-palette-red-400);
  cursor: pointer;
}
.hds-button--color-critical:focus, .hds-button--color-critical.mock-focus {
  color: var(--token-color-foreground-critical-on-surface);
  background-color: var(--token-color-surface-critical);
  border-color: var(--token-color-focus-critical-internal);
}
.hds-button--color-critical:focus::before, .hds-button--color-critical.mock-focus::before {
  border-color: var(--token-color-focus-critical-external);
}
.hds-button--color-critical:active, .hds-button--color-critical.mock-active {
  color: var(--token-color-foreground-high-contrast);
  background-color: var(--token-color-palette-red-400);
  border-color: var(--token-color-palette-red-400);
  box-shadow: none;
}
.hds-button--color-critical:active::before, .hds-button--color-critical.mock-active::before {
  border-color: transparent;
}

.hds-button--size-small {
  min-height: 1.75rem;
  padding: 0.375rem 0.6875rem;
}
.hds-button--size-small .hds-button__icon {
  width: 0.75rem;
  height: 0.75rem;
}
.hds-button--size-small .hds-button__text {
  font-size: 0.8125rem;
  line-height: 0.875rem;
}
.hds-button--size-small.hds-button--is-icon-only {
  min-width: 1.75rem;
  padding-right: 0.375rem;
  padding-left: 0.375rem;
}

.hds-button--size-medium {
  min-height: 2.25rem;
  padding: 0.5625rem 0.9375rem;
}
.hds-button--size-medium .hds-button__icon {
  width: 1rem;
  height: 1rem;
}
.hds-button--size-medium .hds-button__text {
  font-size: 0.875rem;
  line-height: 1rem;
}
.hds-button--size-medium.hds-button--is-icon-only {
  min-width: 2.25rem;
  padding-right: 0.5625rem;
  padding-left: 0.5625rem;
}

.hds-button--size-large {
  min-height: 3rem;
  padding: 0.6875rem 1.1875rem;
}
.hds-button--size-large .hds-button__icon {
  width: 1.5rem;
  height: 1.5rem;
}
.hds-button--size-large .hds-button__text {
  font-size: 1rem;
  line-height: 1.5rem;
}
.hds-button--size-large.hds-button--is-icon-only {
  min-width: 3rem;
  padding-right: 0.6875rem;
  padding-left: 0.6875rem;
}

.hds-button--is-inline {
  display: inline-flex;
}

button.hds-button[href] {
  color: white !important;
  background-color: red !important;
  border: none;
}
button.hds-button[href] .hds-button__text, button.hds-button[href]::before {
  display: none;
}
button.hds-button[href]::after {
  content: ' Attention: you’re passing a "href" attribute to the "Hds::Button" component, you should use an "@href" argument.';
}

/**
 * Copyright (c) HashiCorp, Inc.
 * SPDX-License-Identifier: MPL-2.0
 */
.hds-button-set {
  display: flex;
  gap: 16px;
}

/**
 * Copyright (c) HashiCorp, Inc.
 * SPDX-License-Identifier: MPL-2.0
 */
/**
 * Copyright (c) HashiCorp, Inc.
 * SPDX-License-Identifier: MPL-2.0
 */
.hds-card__container {
  position: relative;
  background-color: #fff;
  border-radius: var(--token-border-radius-medium);
}

.hds-card__container--level-surface-base {
  box-shadow: var(--token-surface-base-box-shadow);
}

.hds-card__container--level-surface-mid {
  box-shadow: var(--token-surface-mid-box-shadow);
}

.hds-card__container--level-surface-high {
  box-shadow: var(--token-surface-high-box-shadow);
}

.hds-card__container--hover-level-surface-base:hover,
.hds-card__container--hover-level-surface-base.mock-hover {
  box-shadow: var(--token-surface-base-box-shadow);
}

.hds-card__container--hover-level-surface-mid:hover,
.hds-card__container--hover-level-surface-mid.mock-hover {
  box-shadow: var(--token-surface-mid-box-shadow);
}

.hds-card__container--hover-level-surface-high:hover,
.hds-card__container--hover-level-surface-high.mock-hover {
  box-shadow: var(--token-surface-high-box-shadow);
}

.hds-card__container--active-level-surface-base:active,
.hds-card__container--active-level-surface-base.mock-active {
  box-shadow: var(--token-surface-base-box-shadow);
}

.hds-card__container--active-level-surface-mid:active,
.hds-card__container--active-level-surface-mid.mock-active {
  box-shadow: var(--token-surface-mid-box-shadow);
}

.hds-card__container--active-level-surface-high:active,
.hds-card__container--active-level-surface-high.mock-active {
  box-shadow: var(--token-surface-high-box-shadow);
}

.hds-card__container--level-elevation-base {
  box-shadow: var(--token-elevation-base-box-shadow);
}

.hds-card__container--level-elevation-mid {
  box-shadow: var(--token-elevation-mid-box-shadow);
}

.hds-card__container--level-elevation-high {
  box-shadow: var(--token-elevation-high-box-shadow);
}

.hds-card__container--hover-level-elevation-base:hover,
.hds-card__container--hover-level-elevation-base.mock-hover {
  box-shadow: var(--token-elevation-base-box-shadow);
}

.hds-card__container--hover-level-elevation-mid:hover,
.hds-card__container--hover-level-elevation-mid.mock-hover {
  box-shadow: var(--token-elevation-mid-box-shadow);
}

.hds-card__container--hover-level-elevation-high:hover,
.hds-card__container--hover-level-elevation-high.mock-hover {
  box-shadow: var(--token-elevation-high-box-shadow);
}

.hds-card__container--active-level-elevation-base:active,
.hds-card__container--active-level-elevation-base.mock-active {
  box-shadow: var(--token-elevation-base-box-shadow);
}

.hds-card__container--active-level-elevation-mid:active,
.hds-card__container--active-level-elevation-mid.mock-active {
  box-shadow: var(--token-elevation-mid-box-shadow);
}

.hds-card__container--active-level-elevation-high:active,
.hds-card__container--active-level-elevation-high.mock-active {
  box-shadow: var(--token-elevation-high-box-shadow);
}

.hds-card__container--background-neutral-primary {
  background-color: var(--token-color-surface-primary);
}

.hds-card__container--background-neutral-secondary {
  background-color: var(--token-color-surface-faint);
}

.hds-card__container--overflow-hidden {
  overflow: hidden;
}

.hds-card__container--overflow-visible {
  overflow: visible;
}

/**
 * Copyright (c) HashiCorp, Inc.
 * SPDX-License-Identifier: MPL-2.0
 */
/**
 * Copyright (c) HashiCorp, Inc.
 * SPDX-License-Identifier: MPL-2.0
 */
.hds-code-block--theme-dark {
  --hds-code-block-color-blue: #2d8eff;
  --hds-code-block-color-cyan: #32fff7;
  --hds-code-block-color-green: #86ff13;
  --hds-code-block-color-orange: #ffa800;
  --hds-code-block-color-purple: #c76cff;
  --hds-code-block-color-red: #ff3b20;
  --hds-code-block-color-foreground-primary: #d5d7db;
  --hds-code-block-color-foreground-faint: #b2b6bd;
  --hds-code-block-color-surface-primary: #0d0e12;
  --hds-code-block-color-surface-faint: #15181e;
  --hds-code-block-color-foreground-success: #009241;
  --hds-code-block-color-foreground-critical: #ef3016;
  --hds-code-block-color-foreground-interactive: #dedfe3;
  --hds-code-block-color-foreground-interactive-hover: #fff;
  --hds-code-block-color-foreground-interactive-active: #f1f2f3;
  --hds-code-block-color-surface-interactive-active: #2b303c;
  --hds-code-block-color-foreground-action: #2b89ff;
  --hds-code-block-color-foreground-action-hover: #389aff;
  --hds-code-block-color-foreground-action-active: #4ca1ff;
  --hds-code-block-color-border-strong: rgba(178, 182, 189, 40%);
  --hds-code-block-color-border-primary: rgba(178, 182, 189, 20%);
  --hds-code-block-color-foreground-selection: #0d0e12;
  --hds-code-block-color-surface-selection: #86ff13;
  --hds-code-block-color-line-highlight: rgba(0, 74, 222, 20%);
  --hds-code-block-color-line-highlight-border: #1555d4;
  --hds-code-block-color-focus-action-internal: #9bc7fd;
  --hds-code-block-color-focus-action-external: #0d69f2;
  --hds-code-block-color-token: var(--hds-code-block-color-foreground-primary);
  --hds-code-block-color-atrule: var(--hds-code-block-color-blue);
  --hds-code-block-color-code-block-attr-name: var(--hds-code-block-color-blue);
  --hds-code-block-color-attr-value: var(--hds-code-block-color-blue);
  --hds-code-block-color-boolean: var(--hds-code-block-color-purple);
  --hds-code-block-color-builtin: var(--hds-code-block-color-orange);
  --hds-code-block-color-char: var(--hds-code-block-color-orange);
  --hds-code-block-color-class-name: var(--hds-code-block-color-blue);
  --hds-code-block-color-comment: var(--hds-code-block-color-foreground-faint);
  --hds-code-block-color-control: var(--hds-code-block-color-cyan);
  --hds-code-block-color-constant: var(--hds-code-block-color-purple);
  --hds-code-block-color-deleted: var(--hds-code-block-color-red);
  --hds-code-block-color-entity: var(--hds-code-block-color-green);
  --hds-code-block-color-function: var(--hds-code-block-color-blue);
  --hds-code-block-color-important: var(--hds-code-block-color-red);
  --hds-code-block-color-keyword: var(--hds-code-block-color-green);
  --hds-code-block-color-namespace: var(--hds-code-block-color-red);
  --hds-code-block-color-number: var(--hds-code-block-color-purple);
  --hds-code-block-color-operator: var(--hds-code-block-color-cyan);
  --hds-code-block-color-prolog: var(--hds-code-block-color-foreground-primary);
  --hds-code-block-color-property: var(--hds-code-block-color-blue);
  --hds-code-block-color-punctuation: var(--hds-code-block-color-foreground-primary);
  --hds-code-block-color-regex: var(--hds-code-block-color-orange);
  --hds-code-block-color-script: var(--hds-code-block-color-foreground-primary);
  --hds-code-block-color-selector: var(--hds-code-block-color-green);
  --hds-code-block-color-string: var(--hds-code-block-color-orange);
  --hds-code-block-color-symbol: var(--hds-code-block-color-orange);
  --hds-code-block-color-tag: var(--hds-code-block-color-green);
  --hds-code-block-color-url: var(--hds-code-block-color-cyan);
  --hds-code-block-color-lang-css: var(--hds-code-block-color-purple);
  --hds-code-block-color-lang-css-token: var(--hds-code-block-color-green);
  --hds-code-block-color-lang-css-atrule: var(--hds-code-block-color-purple);
  --hds-code-block-color-lang-css-entity: var(--hds-code-block-color-blue);
  --hds-code-block-color-lang-css-function: var(--hds-code-block-color-cyan);
  --hds-code-block-color-lang-css-property: var(--hds-code-block-color-cyan);
  --hds-code-block-color-lang-css-punctuation: var(--hds-code-block-color-orange);
  --hds-code-block-color-lang-css-not-atrule: var(--hds-code-block-color-foreground-primary);
  --hds-code-block-color-lang-css-selector: var(--hds-code-block-color-blue);
  --hds-code-block-color-lang-css-url: var(--hds-code-block-color-orange);
  --hds-code-block-color-lang-js-constant: var(--hds-code-block-color-orange);
  --hds-code-block-color-lang-markup-attr-value: var(--hds-code-block-color-yellow);
  --hds-code-block-color-lang-markup-entity-named: var(--hds-code-block-color-purple);
  --hds-code-block-color-lang-markup-entity-not-named: var(--hds-code-block-color-green);
}

.hds-code-block .token {
  color: var(--hds-code-block-color-token);
}
.hds-code-block .token.atrule {
  color: var(--hds-code-block-color-atrule);
}
.hds-code-block .token.attr-name {
  color: var(--hds-code-block-color-attr-name);
}
.hds-code-block .token.attr-value {
  color: var(--hds-code-block-color-attr-value);
}
.hds-code-block .token.boolean {
  color: var(--hds-code-block-color-boolean);
}
.hds-code-block .token.builtin {
  color: var(--hds-code-block-color-builtin);
}
.hds-code-block .token.char {
  color: var(--hds-code-block-color-char);
}
.hds-code-block .token.class-name {
  color: var(--hds-code-block-color-class-name);
}
.hds-code-block .token.comment {
  color: var(--hds-code-block-color-comment);
}
.hds-code-block .token.constant {
  color: var(--hds-code-block-color-constant);
}
.hds-code-block .token.deleted {
  color: var(--hds-code-block-color-deleted);
}
.hds-code-block .token.entity {
  color: var(--hds-code-block-color-entity);
}
.hds-code-block .token.function {
  color: var(--hds-code-block-color-function);
}
.hds-code-block .token.important {
  color: var(--hds-code-block-color-important);
}
.hds-code-block .token.keyword {
  color: var(--hds-code-block-color-keyword);
}
.hds-code-block .token.namespace {
  color: var(--hds-code-block-color-namespace);
}
.hds-code-block .token.number {
  color: var(--hds-code-block-color-number);
}
.hds-code-block .token.operator {
  color: var(--hds-code-block-color-operator);
}
.hds-code-block .token.punctuation {
  color: var(--hds-code-block-color-punctuation);
}
.hds-code-block .token.prolog {
  color: var(--hds-code-block-color-prolog);
}
.hds-code-block .token.property {
  color: var(--hds-code-block-color-property);
}
.hds-code-block .token.regex {
  color: var(--hds-code-block-color-regex);
}
.hds-code-block .token.script {
  color: var(--hds-code-block-color-script);
}
.hds-code-block .token.selector {
  color: var(--hds-code-block-color-selector);
}
.hds-code-block .token.string {
  color: var(--hds-code-block-color-string);
}
.hds-code-block .token.symbol {
  color: var(--hds-code-block-color-symbol);
}
.hds-code-block .token.tag {
  color: var(--hds-code-block-color-tag);
}
.hds-code-block .token.url {
  color: var(--hds-code-block-color-url);
}
.hds-code-block .token.variable {
  color: var(--hds-code-block-color-comment);
}
.hds-code-block .language-css {
  color: var(--hds-code-block-color-lang-css);
}
.hds-code-block .language-css .token {
  color: var(--hds-code-block-color-lang-css-token);
}
.hds-code-block .language-css .token.atrule {
  color: var(--hds-code-block-color-lang-css-atrule);
}
.hds-code-block .language-css .token.rule:not(.atrule) {
  color: var(--hds-code-block-color-lang-css-not-atrule);
}
.hds-code-block .language-css .token.entity {
  color: var(--hds-code-block-color-lang-css-entity);
}
.hds-code-block .language-css .token.function {
  color: var(--hds-code-block-color-lang-css-function);
}
.hds-code-block .language-css .token.property {
  color: var(--hds-code-block-color-lang-css-property);
}
.hds-code-block .language-css .token.punctuation {
  color: var(--hds-code-block-color-lang-css-punctuatione);
}
.hds-code-block .language-css .token.selector {
  color: var(--hds-code-block-color-lang-css-selector);
}
.hds-code-block .language-css .token.url {
  color: var(--hds-code-block-color-lang-css-url);
}
.hds-code-block .language-javascript .token.constant {
  color: var(--hds-code-block-color-lang-js-constant);
}
.hds-code-block .language-markup .token.attr-value,
.hds-code-block .language-html .token.attr-value {
  color: var(--hds-code-block-color-lang-markup-attr-value);
}
.hds-code-block .language-markup .token.entity.named-entity,
.hds-code-block .language-html .token.entity.named-entity {
  color: var(--hds-code-block-color-lang-markup-entity-named);
}
.hds-code-block .language-markup .token.entity:not(.named-entity),
.hds-code-block .language-html .token.entity:not(.named-entity) {
  color: var(--hds-code-block-color-lang-markup-entity-not-named);
}

.hds-code-block {
  position: relative;
  color: var(--hds-code-block-color-foreground-primary);
  background-color: var(--hds-code-block-color-surface-primary);
  border: 1px solid var(--hds-code-block-color-border-strong);
}
.hds-code-block pre,
.hds-code-block code {
  line-height: 1.4286;
  white-space: pre;
  text-align: left;
  text-shadow: none;
  word-wrap: normal;
  word-break: normal;
  word-spacing: normal;
  tab-size: 4;
  hyphens: none;
}
@media print {
  .hds-code-block pre,
  .hds-code-block code {
    text-shadow: none;
  }
}

.hds-code-block--is-standalone {
  overflow: hidden;
  border-radius: var(--token-border-radius-medium);
}

.hds-code-block--has-line-wrapping .hds-code-block__code,
.hds-code-block--has-line-wrapping .hds-code-block__code code {
  display: block;
  white-space: pre-wrap;
  overflow-wrap: break-word;
}

.hds-code-block__title {
  color: var(--hds-code-block-color-foreground-primary);
}

.hds-code-block__description {
  color: var(--hds-code-block-color-foreground-faint);
}

.hds-code-block__header {
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding: 8px 16px;
  background-color: var(--hds-code-block-color-surface-faint);
  border-bottom: 1px solid var(--hds-code-block-color-border-primary);
  border-top-left-radius: inherit;
  border-top-right-radius: inherit;
}
.hds-code-block__header:empty {
  display: none;
}
.hds-code-block__header strong {
  font-weight: var(--token-typography-font-weight-semibold);
}
.hds-code-block__header code,
.hds-code-block__header pre {
  display: inline;
  font-size: 0.9em;
  font-family: var(--token-typography-code-100-font-family);
  line-height: 1em;
}
.hds-code-block__header a:not([class*=hds-]) {
  color: var(--hds-code-block-color-foreground-action);
}
.hds-code-block__header a:not([class*=hds-]):focus, .hds-code-block__header a:not([class*=hds-]):focus-visible {
  text-decoration: none;
  outline: 2px solid var(--token-color-focus-action-internal);
  outline-offset: 1px;
}
.hds-code-block__header a:not([class*=hds-]):hover {
  color: var(--token-color-foreground-action-hover);
}
.hds-code-block__header a:not([class*=hds-]):active {
  color: var(--token-color-foreground-action-active);
}

.hds-code-block__body {
  position: relative;
  border-radius: inherit;
}

.hds-code-block__code {
  outline-style: solid;
  outline-color: transparent;
  position: relative;
  display: grid;
  margin: 0;
  padding: 16px 0 16px 16px;
  overflow: auto;
  scrollbar-width: thin;
  scrollbar-color: var(--token-color-palette-neutral-400) var(--token-color-palette-neutral-500);
  font-size: 0.8125rem;
  font-family: var(--token-typography-code-200-font-family);
  border-radius: inherit;
}
.hds-code-block__code:focus, .hds-code-block__code.mock-focus {
  box-shadow: var(--token-focus-ring-action-box-shadow);
}
.hds-code-block__code:focus:not(:focus-visible) {
  box-shadow: none;
}
.hds-code-block__code:focus-visible {
  box-shadow: var(--token-focus-ring-action-box-shadow);
}
.hds-code-block__code:focus:active, .hds-code-block__code.mock-focus.mock-active {
  box-shadow: none;
}
.hds-code-block__code ::selection {
  color: var(--hds-code-block-color-foreground-selection);
  background-color: var(--hds-code-block-color-surface-selection);
}
.hds-code-block__code code {
  position: relative;
  display: inline-block;
  padding-right: 16px;
}

.hds-code-block__height-toggle-button,
.hds-code-block__copy-button {
  color: var(--hds-code-block-color-foreground-primary);
  background-color: var(--hds-code-block-color-surface-faint);
  border: 1px solid var(--hds-code-block-color-border-strong);
}
.hds-code-block__height-toggle-button:hover, .hds-code-block__height-toggle-button.mock-hover,
.hds-code-block__copy-button:hover,
.hds-code-block__copy-button.mock-hover {
  color: var(--hds-code-block-color-foreground-primary);
  background-color: var(--hds-code-block-color-surface-primary);
  border-color: var(--hds-code-block-color-border-strong);
}
.hds-code-block__height-toggle-button:active, .hds-code-block__height-toggle-button.mock-active,
.hds-code-block__copy-button:active,
.hds-code-block__copy-button.mock-active {
  color: var(--hds-code-block-color-foreground-primary);
  background-color: var(--hds-code-block-color-surface-interactive-active);
}
.hds-code-block__height-toggle-button:focus, .hds-code-block__height-toggle-button.mock-focus, .hds-code-block__height-toggle-button:focus-visible,
.hds-code-block__copy-button:focus,
.hds-code-block__copy-button.mock-focus,
.hds-code-block__copy-button:focus-visible {
  color: var(--hds-code-block-color-foreground-primary);
  background-color: var(--hds-code-block-color-surface-faint);
  border-color: var(--hds-code-block-color-focus-action-internal);
}
.hds-code-block__height-toggle-button:focus::before, .hds-code-block__height-toggle-button.mock-focus::before, .hds-code-block__height-toggle-button:focus-visible::before,
.hds-code-block__copy-button:focus::before,
.hds-code-block__copy-button.mock-focus::before,
.hds-code-block__copy-button:focus-visible::before {
  border-color: var(--hds-code-block-color-focus-action-external);
}
.hds-code-block__height-toggle-button .hds-icon,
.hds-code-block__copy-button .hds-icon {
  color: var(--hds-code-block-color-foreground-primary);
}

.hds-code-block__copy-button {
  position: absolute;
  top: 11px;
  right: 12px;
}
.hds-code-block__copy-button.hds-copy-button--status-success .hds-icon {
  color: var(--hds-code-block-color-foreground-success);
}
.hds-code-block__copy-button.hds-copy-button--status-error .hds-icon {
  color: var(--hds-code-block-color-foreground-critical);
}

.hds-code-block.line-numbers {
  counter-reset: linenumber;
}
.hds-code-block.line-numbers .hds-code-block__code {
  position: relative;
  padding-left: calc(49px + 16px);
}
.hds-code-block.line-numbers .hds-code-block__code code {
  position: static;
}
.hds-code-block.line-numbers .hds-code-block__overlay-footer {
  margin-left: 49px;
}
.hds-code-block.line-numbers .line-numbers-rows {
  position: absolute;
  top: 0;
  left: 0;
  min-width: 49px;
  min-height: 100%;
  padding: 16px 0;
  border-right: 1px solid var(--hds-code-block-color-border-primary);
  user-select: none;
  pointer-events: none;
}
.hds-code-block.line-numbers .line-numbers-rows > span {
  display: block;
  counter-increment: linenumber;
}
.hds-code-block.line-numbers .line-numbers-rows > span::before {
  display: block;
  padding-right: 16px;
  text-align: right;
  content: counter(linenumber);
}
.hds-code-block.line-numbers .line-highlight {
  left: 0;
}
.hds-code-block .line-highlight {
  position: absolute;
  right: 0;
  left: -16px;
  background-color: var(--hds-code-block-color-line-highlight);
  border: solid var(--hds-code-block-color-line-highlight-border);
  border-width: 1px 0 1px 4px;
  mix-blend-mode: screen;
  pointer-events: none;
}
@media print {
  .hds-code-block .line-highlight {
    /*
     * This will prevent browsers from replacing the background color with white.
     * It's necessary because the element is layered on top of the displayed code.
     */
    -webkit-print-color-adjust: exact;
    color-adjust: exact;
  }
}
.hds-code-block .token.bold {
  font-weight: bold;
}
.hds-code-block .token.italic {
  font-style: italic;
}

.hds-code-block__overlay-footer {
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 10px 16px 10px 16px;
  pointer-events: none;
}
.hds-code-block__overlay-footer > * {
  pointer-events: auto;
}

.hds-code-block--has-overlay-footer .hds-code-block__code::after {
  position: sticky;
  bottom: -16px;
  left: 0;
  display: block;
  height: 48px;
  margin: 0 0 -16px -1000px;
  background: linear-gradient(360deg, #0d0e12 37.07%, rgba(13, 14, 18, 0.25) 100%);
  content: "";
  pointer-events: none;
}
.hds-code-block--has-overlay-footer .line-numbers .line-numbers-rows {
  padding-bottom: 48px;
}
.hds-code-block--has-overlay-footer .line-numbers-rows {
  z-index: 1;
  isolation: isolate;
}

.hds-code-block--is-expanded .hds-code-block__code {
  padding-bottom: 48px;
}
.hds-code-block--is-expanded .hds-code-block__code::after {
  content: none;
}
.hds-code-block--is-expanded .hds-code-block__overlay-footer {
  background: none;
}

/**
 * Copyright (c) HashiCorp, Inc.
 * SPDX-License-Identifier: MPL-2.0
 */
/**
 * Copyright (c) HashiCorp, Inc.
 * SPDX-License-Identifier: MPL-2.0
 */
.hds-code-editor--theme-dark {
  --hds-code-editor-color-border-strong: rgba(178, 182, 189, 40%);
  --hds-code-editor-color-border-primary: rgba(178, 182, 189, 20%);
  --hds-code-editor-color-foreground-primary: #d5d7db;
  --hds-code-editor-color-foreground-faint: #878a8f;
  --hds-code-editor-color-foreground-high-contrast: #fff;
  --hds-code-editor-color-surface-faint: #15181e;
  --hds-code-editor-color-surface-primary: #0d0e12;
  --hds-code-editor-color-surface-interactive-active: #2b303c;
  --hds-code-editor-color-focus-action-internal: #9bc7fd;
  --hds-code-editor-color-focus-action-external: #0d69f2;
}

.hds-code-editor {
  display: flex;
  flex-direction: column;
  overflow: hidden;
  background-color: var(--hds-code-editor-color-surface-primary);
  border: 1px solid var(--hds-code-editor-color-border-strong);
}
.hds-code-editor.hds-code-editor--is-standalone {
  border-radius: var(--token-border-radius-medium);
}
.hds-code-editor.hds-code-editor--is-full-screen {
  position: fixed;
  inset: 0;
  z-index: 1000;
  border: none;
  border-radius: 0;
}
.hds-code-editor.hds-code-editor--is-full-screen .hds-code-editor__editor {
  max-height: unset;
}
.hds-code-editor .hds-code-editor__header {
  display: flex;
  gap: 12px;
  align-items: start;
  padding: 16px;
  background-color: var(--hds-code-editor-color-surface-faint);
  border-bottom: 1px solid var(--hds-code-editor-color-border-primary);
}
.hds-code-editor .hds-code-editor__header-content {
  display: flex;
  flex-direction: column;
  flex-grow: 1;
}
.hds-code-editor .hds-code-editor__title {
  color: var(--hds-code-editor-color-foreground-primary);
}
.hds-code-editor .hds-code-editor__title + .hds-code-editor__description {
  margin-top: 4px;
}
.hds-code-editor .hds-code-editor__description {
  color: var(--hds-code-editor-color-foreground-faint);
}
.hds-code-editor .hds-code-editor__title + .hds-code-editor__header-generic,
.hds-code-editor .hds-code-editor__description + .hds-code-editor__header-generic {
  margin-top: 12px;
}
.hds-code-editor .hds-code-editor__header-actions {
  display: flex;
  gap: 8px;
  align-items: center;
}
.hds-code-editor .hds-code-editor__header-actions .hds-button {
  outline-offset: 0;
}
.hds-code-editor .hds-code-editor__editor {
  flex-grow: 1;
  overflow: auto;
}
.hds-code-editor .hds-code-editor__loader {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 164px;
  color: var(--hds-code-editor-color-foreground-primary);
  background-color: var(--hds-code-editor-color-surface-primary);
}
.hds-code-editor .hds-button {
  color: var(--hds-code-editor-color-foreground-primary);
  background-color: var(--hds-code-editor-color-surface-faint);
  border: 1px solid var(--hds-code-editor-color-border-strong);
}
.hds-code-editor .hds-button:focus, .hds-code-editor .hds-button:hover {
  background-color: var(--hds-code-editor-color-surface-primary);
  border-color: var(--hds-code-editor-color-focus-action-internal);
}
.hds-code-editor .hds-button:focus::before, .hds-code-editor .hds-button:hover::before {
  border-color: var(--hds-code-editor-color-focus-action-external);
}
.hds-code-editor .hds-button:focus .hds-button__icon, .hds-code-editor .hds-button:hover .hds-button__icon {
  color: var(--hds-code-editor-color-foreground-primary);
}
.hds-code-editor .hds-button:active {
  background-color: var(--hds-code-editor-color-surface-interactive-active);
}
.hds-code-editor .hds-button .hds-button__icon {
  color: var(--hds-code-editor-color-foreground-primary);
}

/**
 * Copyright (c) HashiCorp, Inc.
 * SPDX-License-Identifier: MPL-2.0
 */
/**
 * Copyright (c) HashiCorp, Inc.
 * SPDX-License-Identifier: MPL-2.0
 */
.hds-copy-button {
  cursor: pointer;
}
.hds-copy-button .hds-button__icon {
  color: var(--token-color-foreground-action);
}
.hds-copy-button:hover .hds-button__icon, .hds-copy-button.mock-hover .hds-button__icon {
  color: var(--token-color-foreground-action-hover);
}
.hds-copy-button:active .hds-button__icon, .hds-copy-button.mock-active .hds-button__icon {
  color: var(--token-color-foreground-action-active);
}
.hds-copy-button.hds-copy-button--status-success .hds-button__icon {
  color: var(--token-color-foreground-success);
}
.hds-copy-button.hds-copy-button--status-error .hds-button__icon {
  color: var(--token-color-foreground-critical);
}

/**
 * Copyright (c) HashiCorp, Inc.
 * SPDX-License-Identifier: MPL-2.0
 */
.hds-copy-snippet {
  position: relative;
  outline-style: solid;
  outline-color: transparent;
  isolation: isolate;
  display: flex;
  gap: 8px;
  align-items: center;
  justify-content: space-between;
  padding: 6px 4px;
  text-align: left;
  border: 1px solid transparent;
  border-radius: var(--token-border-radius-small);
  cursor: pointer;
}
.hds-copy-snippet::before {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: -1;
  border-radius: 5px;
  content: "";
}
.hds-copy-snippet:focus::before, .hds-copy-snippet.mock-focus::before {
  box-shadow: var(--token-focus-ring-action-box-shadow);
}
.hds-copy-snippet:focus:not(:focus-visible)::before {
  box-shadow: none;
}
.hds-copy-snippet:focus-visible::before {
  box-shadow: var(--token-focus-ring-action-box-shadow);
}
.hds-copy-snippet:focus:active::before, .hds-copy-snippet.mock-focus.mock-active::before {
  box-shadow: none;
}

.hds-copy-snippet--color-primary {
  color: var(--token-color-foreground-action);
  background-color: transparent;
}
.hds-copy-snippet--color-primary:hover, .hds-copy-snippet--color-primary.mock-hover {
  color: var(--token-color-foreground-action-hover);
  background-color: var(--token-color-surface-interactive);
  border-color: var(--token-color-border-strong);
}
.hds-copy-snippet--color-primary:active, .hds-copy-snippet--color-primary.mock-active {
  color: var(--token-color-foreground-action-active);
  background-color: var(--token-color-surface-interactive-active);
  border-color: var(--token-color-border-strong);
}
.hds-copy-snippet--color-primary.hds-copy-snippet--status-success {
  background-color: var(--token-color-surface-interactive);
}
.hds-copy-snippet--color-primary.hds-copy-snippet--status-success .hds-copy-snippet__icon {
  color: var(--token-color-foreground-success);
}
.hds-copy-snippet--color-primary.hds-copy-snippet--status-error {
  background-color: var(--token-color-surface-interactive);
}
.hds-copy-snippet--color-primary.hds-copy-snippet--status-error .hds-copy-snippet__icon {
  color: var(--token-color-foreground-critical);
}

.hds-copy-snippet--color-secondary {
  color: var(--token-color-foreground-primary);
  background-color: transparent;
}
.hds-copy-snippet--color-secondary .hds-copy-snippet__icon {
  color: var(--token-color-foreground-action);
}
.hds-copy-snippet--color-secondary:hover, .hds-copy-snippet--color-secondary.mock-hover {
  background-color: var(--token-color-surface-interactive);
  border-color: var(--token-color-border-strong);
}
.hds-copy-snippet--color-secondary:hover .hds-copy-snippet__icon, .hds-copy-snippet--color-secondary.mock-hover .hds-copy-snippet__icon {
  color: var(--token-color-foreground-action-hover);
}
.hds-copy-snippet--color-secondary:active, .hds-copy-snippet--color-secondary.mock-active {
  background-color: var(--token-color-surface-interactive-active);
  border-color: var(--token-color-border-strong);
}
.hds-copy-snippet--color-secondary:active .hds-copy-snippet__icon, .hds-copy-snippet--color-secondary.mock-active .hds-copy-snippet__icon {
  color: var(--token-color-foreground-action-active);
}
.hds-copy-snippet--color-secondary.hds-copy-snippet--status-success {
  background-color: var(--token-color-surface-interactive);
}
.hds-copy-snippet--color-secondary.hds-copy-snippet--status-success .hds-copy-snippet__icon {
  color: var(--token-color-foreground-success);
}
.hds-copy-snippet--color-secondary.hds-copy-snippet--status-error {
  background-color: var(--token-color-surface-interactive);
}
.hds-copy-snippet--color-secondary.hds-copy-snippet--status-error .hds-copy-snippet__icon {
  color: var(--token-color-foreground-critical);
}

.hds-copy-snippet--status-success {
  background-color: var(--token-color-surface-interactive);
}
.hds-copy-snippet--status-success .hds-copy-snippet__icon {
  color: var(--token-color-foreground-success);
}

.hds-copy-snippet--status-error {
  background-color: var(--token-color-surface-interactive);
}
.hds-copy-snippet--status-error .hds-copy-snippet__icon {
  color: var(--token-color-foreground-critical);
}

.hds-copy-snippet__text {
  flex: 1 0 0;
}

.hds-copy-snippet__icon {
  flex: none;
}

.hds-copy-snippet--width-full {
  width: 100%;
  max-width: 100%;
}

.hds-copy-snippet--is-truncated {
  width: 100%;
  max-width: 100%;
}
.hds-copy-snippet--is-truncated .hds-copy-snippet__text {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

/**
 * Copyright (c) HashiCorp, Inc.
 * SPDX-License-Identifier: MPL-2.0
 */
:where(.hds-dialog-primitive__wrapper) {
  position: initial;
  inset: initial;
  display: flex;
  flex-direction: column;
  width: 100%;
  height: 100%;
  margin: 0;
  padding: 0;
  background: var(--token-color-surface-primary);
  border: none;
}

.hds-dialog-primitive__wrapper-header {
  flex: none;
  background: var(--token-color-surface-faint);
  border-bottom: 1px solid var(--token-color-border-primary);
  border-top-left-radius: inherit;
  border-top-right-radius: inherit;
}
.hds-dialog-primitive__wrapper-header:not(:has(> *)) {
  display: none;
}

.hds-dialog-primitive__wrapper-body {
  flex: 1 1 auto;
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
}

.hds-dialog-primitive__wrapper-footer {
  flex: none;
  border-top: 1px solid var(--token-color-border-primary);
  border-bottom-right-radius: inherit;
  border-bottom-left-radius: inherit;
}
.hds-dialog-primitive__wrapper-footer:not(:has(> *)) {
  display: none;
}

.hds-dialog-primitive__header {
  display: flex;
  gap: 16px;
  align-items: flex-start;
  padding: 16px 24px;
  color: var(--token-color-foreground-strong);
  border-top-left-radius: inherit;
  border-top-right-radius: inherit;
}

.hds-dialog-primitive__icon {
  flex: none;
  align-self: center;
}

.hds-dialog-primitive__title {
  flex-grow: 1;
  margin: 0;
}

.hds-dialog-primitive__tagline {
  margin-bottom: 4px;
  color: var(--token-color-foreground-faint);
}

.hds-dialog-primitive__dismiss {
  align-self: flex-start;
}

.hds-dialog-primitive__description {
  padding: 0 24px 16px;
}

.hds-dialog-primitive__body {
  padding: 24px;
}

.hds-dialog-primitive__footer {
  padding: 16px 24px;
  background: var(--token-color-surface-faint);
  border-bottom-right-radius: inherit;
  border-bottom-left-radius: inherit;
}
.hds-dialog-primitive__footer .hds-button-set .hds-button--color-tertiary {
  margin-left: auto;
}

.hds-dialog-primitive__overlay {
  position: fixed;
  inset: 0;
  z-index: 49;
  background: var(--token-color-palette-neutral-700);
  opacity: 0.5;
}

/**
 * Copyright (c) HashiCorp, Inc.
 * SPDX-License-Identifier: MPL-2.0
 */
.hds-disclosure-primitive {
  position: relative;
}

/**
 * Copyright (c) HashiCorp, Inc.
 * SPDX-License-Identifier: MPL-2.0
 */
.hds-dismiss-button {
  flex: none;
  padding: 0;
  color: var(--token-color-foreground-faint);
  background-color: transparent;
  border: none;
  cursor: pointer;
  position: relative;
  outline-style: solid;
  outline-color: transparent;
  isolation: isolate;
}
.hds-dismiss-button:hover::before, .hds-dismiss-button.mock-hover::before {
  background-color: rgba(222, 223, 227, 0.4);
}
.hds-dismiss-button::before {
  position: absolute;
  top: -4px;
  right: -4px;
  bottom: -4px;
  left: -4px;
  z-index: -1;
  border-radius: 5px;
  content: "";
}
.hds-dismiss-button:focus::before, .hds-dismiss-button.mock-focus::before {
  box-shadow: var(--token-focus-ring-action-box-shadow);
}
.hds-dismiss-button:focus:not(:focus-visible)::before {
  box-shadow: none;
}
.hds-dismiss-button:focus-visible::before {
  box-shadow: var(--token-focus-ring-action-box-shadow);
}
.hds-dismiss-button:focus:active::before, .hds-dismiss-button.mock-focus.mock-active::before {
  box-shadow: none;
}
.hds-dismiss-button:active, .hds-dismiss-button.mock-active {
  color: var(--token-color-foreground-secondary);
}
.hds-dismiss-button:active::before, .hds-dismiss-button.mock-active::before {
  background-color: rgba(222, 223, 227, 0.4);
  border: 1px solid var(--token-color-border-strong);
}

/**
 * Copyright (c) HashiCorp, Inc.
 * SPDX-License-Identifier: MPL-2.0
 */
/**
 * Copyright (c) HashiCorp, Inc.
 * SPDX-License-Identifier: MPL-2.0
 */
.hds-dropdown--is-inline {
  display: inline-block;
}
.hds-dropdown--is-inline .hds-dropdown-toggle-icon,
.hds-dropdown--is-inline .hds-dropdown-toggle-button {
  display: inline-flex;
}

.hds-dropdown-toggle-icon {
  position: relative;
  display: flex;
  gap: 2px;
  align-items: center;
  justify-content: center;
  padding: 1px;
  color: var(--token-color-foreground-primary);
  background-color: var(--token-color-surface-faint);
  border: 1px solid var(--token-color-border-strong);
  border-radius: var(--token-border-radius-small);
  outline-style: solid;
  outline-color: transparent;
  isolation: isolate;
}
.hds-dropdown-toggle-icon:hover, .hds-dropdown-toggle-icon.mock-hover {
  background-color: var(--token-color-surface-interactive);
  cursor: pointer;
}
.hds-dropdown-toggle-icon:focus, .hds-dropdown-toggle-icon.mock-focus {
  box-shadow: none;
  border-color: var(--token-color-focus-action-internal);
}
.hds-dropdown-toggle-icon:focus::before, .hds-dropdown-toggle-icon.mock-focus::before {
  position: absolute;
  top: -4px;
  right: -4px;
  bottom: -4px;
  left: -4px;
  z-index: -1;
  border: 3px solid transparent;
  border-radius: calc(var(--token-border-radius-small) + 3px);
  content: "";
}
.hds-dropdown-toggle-icon:focus::before, .hds-dropdown-toggle-icon.mock-focus::before {
  border-color: var(--token-color-focus-action-external);
}
.hds-dropdown-toggle-icon:active, .hds-dropdown-toggle-icon.mock-active {
  background-color: var(--token-color-surface-interactive-active);
  border-color: var(--token-color-border-strong);
}
.hds-dropdown-toggle-icon:active::before, .hds-dropdown-toggle-icon.mock-active::before {
  border-color: transparent;
}
.hds-dropdown-toggle-icon:disabled, .hds-dropdown-toggle-icon.mock-disabled {
  color: var(--token-color-foreground-disabled);
  background-color: var(--token-color-surface-faint);
  border-color: var(--token-color-border-primary);
  box-shadow: none;
  cursor: not-allowed;
}

.hds-dropdown-toggle-icon__wrapper {
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: calc(var(--token-border-radius-small) - 2px);
}
.hds-dropdown-toggle-icon__wrapper img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: inherit;
}

.hds-dropdown-toggle-icon--size-small .hds-dropdown-toggle-icon__wrapper {
  width: 24px;
  height: 24px;
}
.hds-dropdown-toggle-icon--size-small.hds-dropdown-toggle-icon--has-chevron .hds-icon {
  width: 12px;
  height: 12px;
}

.hds-dropdown-toggle-icon--size-medium .hds-dropdown-toggle-icon__wrapper {
  width: 32px;
  height: 32px;
}

.hds-dropdown-toggle-button {
  position: relative;
  display: flex;
  gap: 0.375rem;
  align-items: center;
  justify-content: center;
  width: auto;
  font-weight: var(--token-typography-font-weight-regular);
  font-family: var(--token-typography-font-stack-text);
  text-decoration: none;
  border: 1px solid transparent;
  border-radius: var(--token-border-radius-small);
  outline-style: solid;
  outline-color: transparent;
  isolation: isolate;
}
.hds-dropdown-toggle-button:focus, .hds-dropdown-toggle-button.mock-focus {
  box-shadow: none;
}
.hds-dropdown-toggle-button:focus::before, .hds-dropdown-toggle-button.mock-focus::before {
  position: absolute;
  top: -4px;
  right: -4px;
  bottom: -4px;
  left: -4px;
  z-index: -1;
  border: 3px solid transparent;
  border-radius: calc(var(--token-border-radius-small) + 3px);
  content: "";
}
.hds-dropdown-toggle-button:disabled, .hds-dropdown-toggle-button.mock-disabled, .hds-dropdown-toggle-button:disabled:focus, .hds-dropdown-toggle-button.mock-disabled:focus, .hds-dropdown-toggle-button:disabled:hover, .hds-dropdown-toggle-button.mock-disabled:hover {
  color: var(--token-color-foreground-disabled);
  background-color: var(--token-color-surface-faint);
  border-color: var(--token-color-border-primary);
  box-shadow: none;
  cursor: not-allowed;
}
.hds-dropdown-toggle-button:disabled .hds-dropdown-toggle-button__badge,
.hds-dropdown-toggle-button:disabled .hds-dropdown-toggle-button__count, .hds-dropdown-toggle-button.mock-disabled .hds-dropdown-toggle-button__badge,
.hds-dropdown-toggle-button.mock-disabled .hds-dropdown-toggle-button__count, .hds-dropdown-toggle-button:disabled:focus .hds-dropdown-toggle-button__badge,
.hds-dropdown-toggle-button:disabled:focus .hds-dropdown-toggle-button__count, .hds-dropdown-toggle-button.mock-disabled:focus .hds-dropdown-toggle-button__badge,
.hds-dropdown-toggle-button.mock-disabled:focus .hds-dropdown-toggle-button__count, .hds-dropdown-toggle-button:disabled:hover .hds-dropdown-toggle-button__badge,
.hds-dropdown-toggle-button:disabled:hover .hds-dropdown-toggle-button__count, .hds-dropdown-toggle-button.mock-disabled:hover .hds-dropdown-toggle-button__badge,
.hds-dropdown-toggle-button.mock-disabled:hover .hds-dropdown-toggle-button__count {
  color: var(--token-color-foreground-primary);
  background-color: var(--token-color-surface-strong);
}

.hds-dropdown-toggle-button--size-small {
  min-height: 1.75rem;
  padding: 0.375rem 0.6875rem;
}
.hds-dropdown-toggle-button--size-small .hds-dropdown-toggle-button__icon {
  width: 0.75rem;
  height: 0.75rem;
}
.hds-dropdown-toggle-button--size-small .hds-dropdown-toggle-button__text {
  font-size: 0.8125rem;
  line-height: 0.875rem;
}
.hds-dropdown-toggle-button--size-small.hds-dropdown-toggle-button--is-icon-only {
  min-width: 1.75rem;
  padding-right: 0.375rem;
  padding-left: 0.375rem;
}

.hds-dropdown-toggle-button--size-medium {
  min-height: 2.25rem;
  padding: 0.5625rem 0.9375rem;
}
.hds-dropdown-toggle-button--size-medium .hds-dropdown-toggle-button__icon {
  width: 1rem;
  height: 1rem;
}
.hds-dropdown-toggle-button--size-medium .hds-dropdown-toggle-button__text {
  font-size: 0.875rem;
  line-height: 1rem;
}
.hds-dropdown-toggle-button--size-medium.hds-dropdown-toggle-button--is-icon-only {
  min-width: 2.25rem;
  padding-right: 0.5625rem;
  padding-left: 0.5625rem;
}

.hds-dropdown-toggle-button--size-large {
  min-height: 3rem;
  padding: 0.6875rem 1.1875rem;
}
.hds-dropdown-toggle-button--size-large .hds-dropdown-toggle-button__icon {
  width: 1.5rem;
  height: 1.5rem;
}
.hds-dropdown-toggle-button--size-large .hds-dropdown-toggle-button__text {
  font-size: 1rem;
  line-height: 1.5rem;
}
.hds-dropdown-toggle-button--size-large.hds-dropdown-toggle-button--is-icon-only {
  min-width: 3rem;
  padding-right: 0.6875rem;
  padding-left: 0.6875rem;
}

.hds-dropdown-toggle-button--size-small {
  padding-right: 0.375rem;
}
.hds-dropdown-toggle-button--size-small .hds-dropdown-toggle-chevron .hds-icon {
  width: 12px;
  height: 12px;
}

.hds-dropdown-toggle-button--size-medium {
  padding-right: 0.5625rem;
}

.hds-dropdown-toggle-button--color-primary {
  color: var(--token-color-foreground-high-contrast);
  background-color: var(--token-color-palette-blue-200);
  border-color: var(--token-color-palette-blue-300);
  box-shadow: var(--token-elevation-low-box-shadow);
}
.hds-dropdown-toggle-button--color-primary:hover, .hds-dropdown-toggle-button--color-primary.mock-hover {
  color: var(--token-color-foreground-high-contrast);
  background-color: var(--token-color-palette-blue-300);
  border-color: var(--token-color-palette-blue-400);
  cursor: pointer;
}
.hds-dropdown-toggle-button--color-primary:focus, .hds-dropdown-toggle-button--color-primary.mock-focus {
  color: var(--token-color-foreground-high-contrast);
  background-color: var(--token-color-palette-blue-200);
  border-color: var(--token-color-focus-action-internal);
}
.hds-dropdown-toggle-button--color-primary:focus::before, .hds-dropdown-toggle-button--color-primary.mock-focus::before {
  top: -6px;
  right: -6px;
  bottom: -6px;
  left: -6px;
  border-color: var(--token-color-focus-action-external);
  border-radius: calc(var(--token-border-radius-small) + 3px + 2px);
}
.hds-dropdown-toggle-button--color-primary:active, .hds-dropdown-toggle-button--color-primary.mock-active {
  color: var(--token-color-foreground-high-contrast);
  background-color: var(--token-color-palette-blue-400);
  border-color: var(--token-color-palette-blue-400);
  box-shadow: none;
}
.hds-dropdown-toggle-button--color-primary:active::before, .hds-dropdown-toggle-button--color-primary.mock-active::before {
  border-color: transparent;
}

.hds-dropdown-toggle-button--color-secondary {
  color: var(--token-color-foreground-primary);
  background-color: var(--token-color-surface-faint);
  border-color: var(--token-color-border-strong);
  box-shadow: var(--token-elevation-low-box-shadow);
}
.hds-dropdown-toggle-button--color-secondary:hover, .hds-dropdown-toggle-button--color-secondary.mock-hover {
  color: var(--token-color-foreground-primary);
  background-color: var(--token-color-surface-primary);
  border-color: var(--token-color-border-strong);
  cursor: pointer;
}
.hds-dropdown-toggle-button--color-secondary:focus, .hds-dropdown-toggle-button--color-secondary.mock-focus {
  color: var(--token-color-foreground-primary);
  background-color: var(--token-color-surface-faint);
  border-color: var(--token-color-focus-action-internal);
}
.hds-dropdown-toggle-button--color-secondary:focus::before, .hds-dropdown-toggle-button--color-secondary.mock-focus::before {
  border-color: var(--token-color-focus-action-external);
}
.hds-dropdown-toggle-button--color-secondary:active, .hds-dropdown-toggle-button--color-secondary.mock-active {
  color: var(--token-color-foreground-primary);
  background-color: var(--token-color-surface-interactive-active);
  border-color: var(--token-color-border-strong);
  box-shadow: none;
}
.hds-dropdown-toggle-button--color-secondary:active::before, .hds-dropdown-toggle-button--color-secondary.mock-active::before {
  border-color: transparent;
}

.hds-dropdown-toggle-button--width-full {
  justify-content: space-between;
  width: 100%;
  max-width: 100%;
}

.hds-dropdown-toggle-button__text {
  text-align: left;
}

.hds-dropdown-toggle-button__icon {
  flex: none;
}

.hds-dropdown-toggle-button__badge,
.hds-dropdown-toggle-button__count {
  margin: -3px 0 -3px 0;
}

.hds-dropdown-toggle-chevron {
  margin-left: auto;
  padding-left: 2px;
}
@media (prefers-reduced-motion: no-preference) {
  .hds-dropdown-toggle-chevron .hds-icon-chevron-down {
    transition: transform 0.3s;
  }
}
.hds-dropdown-toggle-icon--is-open .hds-dropdown-toggle-chevron .hds-icon-chevron-down, .hds-dropdown-toggle-button--is-open .hds-dropdown-toggle-chevron .hds-icon-chevron-down {
  transform: rotate(-180deg);
}

.hds-dropdown__content {
  position: relative;
  display: flex;
  flex-direction: column;
  width: max-content;
  min-width: 200px;
  max-width: 400px;
  background-color: var(--token-color-surface-primary);
  border-radius: var(--token-border-radius-medium);
  box-shadow: var(--token-surface-high-box-shadow);
}
:where(.hds-dropdown__content[popover]) {
  width: fit-content;
  height: fit-content;
  margin: 0;
  padding: 0;
  overflow: visible;
  color: inherit;
  background: none;
  border: none;
  inset: 0;
}

.hds-dropdown .hds-dropdown__content {
  display: none;
}
.hds-dropdown .hds-dropdown__content[popover]:popover-open {
  display: flex;
}

.hds-dropdown__content--fixed-width {
  min-width: initial;
  max-width: initial;
}

.hds-dropdown__list {
  flex: 1 1 auto;
  margin: 0;
  padding: 4px 0;
  overflow-y: auto;
  list-style: none;
  overscroll-behavior: contain;
}

.hds-dropdown__header,
.hds-dropdown__footer {
  position: relative;
  flex: none;
  padding: 0 8px;
}
.hds-dropdown__header > .hds-link-standalone,
.hds-dropdown__footer > .hds-link-standalone {
  width: initial;
  margin: 4px 0;
  padding: 7px 8px;
}
.hds-dropdown__header > .hds-link-standalone::before,
.hds-dropdown__footer > .hds-link-standalone::before {
  top: 0;
  bottom: 0;
}
.hds-dropdown__header > .hds-button,
.hds-dropdown__header > .hds-form-text-input,
.hds-dropdown__footer > .hds-button,
.hds-dropdown__footer > .hds-form-text-input {
  margin: 8px 0;
}
.hds-dropdown__header > .hds-button-set,
.hds-dropdown__footer > .hds-button-set {
  gap: 8px;
  margin: 8px 0;
}

.hds-dropdown__header--with-divider {
  border-bottom: 1px solid var(--token-color-border-primary);
}

.hds-dropdown__footer--with-divider {
  border-top: 1px solid var(--token-color-border-primary);
}

.hds-dropdown-list-item__copy-item-title {
  padding: 2px 0 4px;
  color: var(--token-color-foreground-faint);
}

.hds-dropdown-list-item--variant-copy-item {
  width: 100%;
  padding: 10px 16px 12px;
}

.hds-dropdown-list-item--variant-description {
  padding: 2px 16px 4px;
  color: var(--token-color-foreground-faint);
}

.hds-dropdown-list-item--variant-generic {
  padding-right: 16px;
  padding-left: 16px;
}

.hds-dropdown-list-item--variant-interactive,
.hds-dropdown-list-item--variant-checkmark {
  position: relative;
  min-height: 36px;
  isolation: isolate;
}
.hds-dropdown-list-item--variant-interactive button,
.hds-dropdown-list-item--variant-checkmark button {
  width: 100%;
  background-color: transparent;
}
.hds-dropdown-list-item--variant-interactive button:hover,
.hds-dropdown-list-item--variant-checkmark button:hover {
  cursor: pointer;
}
.hds-dropdown-list-item--variant-interactive a,
.hds-dropdown-list-item--variant-interactive button,
.hds-dropdown-list-item--variant-checkmark a,
.hds-dropdown-list-item--variant-checkmark button {
  display: flex;
  align-items: flex-start;
  padding: 7px 9px 7px 15px;
  text-decoration: none;
  border: 1px solid transparent;
  outline-style: solid;
  outline-color: transparent;
}
.hds-dropdown-list-item--variant-interactive a::before,
.hds-dropdown-list-item--variant-interactive button::before,
.hds-dropdown-list-item--variant-checkmark a::before,
.hds-dropdown-list-item--variant-checkmark button::before {
  position: absolute;
  top: 6px;
  bottom: 6px;
  left: 4px;
  z-index: -1;
  width: 2px;
  border-radius: 1px;
  content: "";
}
.hds-dropdown-list-item--variant-interactive a::after,
.hds-dropdown-list-item--variant-interactive button::after,
.hds-dropdown-list-item--variant-checkmark a::after,
.hds-dropdown-list-item--variant-checkmark button::after {
  position: absolute;
  top: 0;
  right: 4px;
  bottom: 0;
  left: 10px;
  z-index: -1;
  border-radius: var(--token-border-radius-small);
  content: "";
}
.hds-dropdown-list-item--variant-interactive a:hover, .hds-dropdown-list-item--variant-interactive a.mock-hover,
.hds-dropdown-list-item--variant-interactive button:hover,
.hds-dropdown-list-item--variant-interactive button.mock-hover,
.hds-dropdown-list-item--variant-checkmark a:hover,
.hds-dropdown-list-item--variant-checkmark a.mock-hover,
.hds-dropdown-list-item--variant-checkmark button:hover,
.hds-dropdown-list-item--variant-checkmark button.mock-hover {
  color: var(--current-color-hover);
}
.hds-dropdown-list-item--variant-interactive a:hover::before, .hds-dropdown-list-item--variant-interactive a.mock-hover::before,
.hds-dropdown-list-item--variant-interactive button:hover::before,
.hds-dropdown-list-item--variant-interactive button.mock-hover::before,
.hds-dropdown-list-item--variant-checkmark a:hover::before,
.hds-dropdown-list-item--variant-checkmark a.mock-hover::before,
.hds-dropdown-list-item--variant-checkmark button:hover::before,
.hds-dropdown-list-item--variant-checkmark button.mock-hover::before {
  background-color: currentColor;
}
.hds-dropdown-list-item--variant-interactive a:focus, .hds-dropdown-list-item--variant-interactive a.mock-focus,
.hds-dropdown-list-item--variant-interactive button:focus,
.hds-dropdown-list-item--variant-interactive button.mock-focus,
.hds-dropdown-list-item--variant-checkmark a:focus,
.hds-dropdown-list-item--variant-checkmark a.mock-focus,
.hds-dropdown-list-item--variant-checkmark button:focus,
.hds-dropdown-list-item--variant-checkmark button.mock-focus {
  color: var(--current-color-focus);
}
.hds-dropdown-list-item--variant-interactive a:focus::after, .hds-dropdown-list-item--variant-interactive a.mock-focus::after,
.hds-dropdown-list-item--variant-interactive button:focus::after,
.hds-dropdown-list-item--variant-interactive button.mock-focus::after,
.hds-dropdown-list-item--variant-checkmark a:focus::after,
.hds-dropdown-list-item--variant-checkmark a.mock-focus::after,
.hds-dropdown-list-item--variant-checkmark button:focus::after,
.hds-dropdown-list-item--variant-checkmark button.mock-focus::after {
  left: 4px;
  box-shadow: var(--current-focus-ring-box-shadow);
}
.hds-dropdown-list-item--variant-interactive a:focus:not(:focus-visible)::after,
.hds-dropdown-list-item--variant-interactive button:focus:not(:focus-visible)::after,
.hds-dropdown-list-item--variant-checkmark a:focus:not(:focus-visible)::after,
.hds-dropdown-list-item--variant-checkmark button:focus:not(:focus-visible)::after {
  background-color: transparent;
  box-shadow: none;
}
.hds-dropdown-list-item--variant-interactive a:focus-visible,
.hds-dropdown-list-item--variant-interactive button:focus-visible,
.hds-dropdown-list-item--variant-checkmark a:focus-visible,
.hds-dropdown-list-item--variant-checkmark button:focus-visible {
  color: var(--current-color-focus);
}
.hds-dropdown-list-item--variant-interactive a:focus-visible::after,
.hds-dropdown-list-item--variant-interactive button:focus-visible::after,
.hds-dropdown-list-item--variant-checkmark a:focus-visible::after,
.hds-dropdown-list-item--variant-checkmark button:focus-visible::after {
  left: 4px;
  box-shadow: var(--current-focus-ring-box-shadow);
}
.hds-dropdown-list-item--variant-interactive a:focus:active::after, .hds-dropdown-list-item--variant-interactive a:focus-visible:active::after, .hds-dropdown-list-item--variant-interactive a.mock-focus.mock-active::after,
.hds-dropdown-list-item--variant-interactive button:focus:active::after,
.hds-dropdown-list-item--variant-interactive button:focus-visible:active::after,
.hds-dropdown-list-item--variant-interactive button.mock-focus.mock-active::after,
.hds-dropdown-list-item--variant-checkmark a:focus:active::after,
.hds-dropdown-list-item--variant-checkmark a:focus-visible:active::after,
.hds-dropdown-list-item--variant-checkmark a.mock-focus.mock-active::after,
.hds-dropdown-list-item--variant-checkmark button:focus:active::after,
.hds-dropdown-list-item--variant-checkmark button:focus-visible:active::after,
.hds-dropdown-list-item--variant-checkmark button.mock-focus.mock-active::after {
  left: 10px;
  background-color: var(--current-background-color);
  box-shadow: none;
}
.hds-dropdown-list-item--variant-interactive a:active, .hds-dropdown-list-item--variant-interactive a.mock-active,
.hds-dropdown-list-item--variant-interactive button:active,
.hds-dropdown-list-item--variant-interactive button.mock-active,
.hds-dropdown-list-item--variant-checkmark a:active,
.hds-dropdown-list-item--variant-checkmark a.mock-active,
.hds-dropdown-list-item--variant-checkmark button:active,
.hds-dropdown-list-item--variant-checkmark button.mock-active {
  color: var(--current-color-active);
}
.hds-dropdown-list-item--variant-interactive a:active::before, .hds-dropdown-list-item--variant-interactive a.mock-active::before,
.hds-dropdown-list-item--variant-interactive button:active::before,
.hds-dropdown-list-item--variant-interactive button.mock-active::before,
.hds-dropdown-list-item--variant-checkmark a:active::before,
.hds-dropdown-list-item--variant-checkmark a.mock-active::before,
.hds-dropdown-list-item--variant-checkmark button:active::before,
.hds-dropdown-list-item--variant-checkmark button.mock-active::before {
  background-color: currentColor;
}

.hds-dropdown-list-item__interactive-icon {
  display: block;
  margin-top: 2px;
}

.hds-dropdown-list-item__interactive-icon--leading {
  margin-right: 8px;
}

.hds-dropdown-list-item__interactive-icon--trailing {
  margin-left: 8px;
}

.hds-dropdown-list-item__interactive-text {
  display: block;
  flex: 1;
  text-align: left;
}

.hds-dropdown-list-item--color-action a,
.hds-dropdown-list-item--color-action button {
  color: var(--token-color-foreground-primary);
  --current-color-hover: var(--token-color-foreground-action-hover);
  --current-color-focus: var(--token-color-foreground-action-active);
  --current-color-active: var(--token-color-foreground-action-active);
}
.hds-dropdown-list-item--color-action a::after,
.hds-dropdown-list-item--color-action button::after {
  --current-focus-ring-box-shadow: var(--token-focus-ring-action-box-shadow);
}

.hds-dropdown-list-item--color-critical a,
.hds-dropdown-list-item--color-critical button {
  color: var(--token-color-foreground-critical);
  --current-color-hover: var(--token-color-palette-red-300);
  --current-color-focus: var(--token-color-palette-red-400);
  --current-color-active: var(--token-color-palette-red-400);
}
.hds-dropdown-list-item--color-critical a::after,
.hds-dropdown-list-item--color-critical button::after {
  --current-background-color: var(--token-color-surface-critical);
  --current-focus-ring-box-shadow: var(--token-focus-ring-critical-box-shadow);
}

.hds-dropdown-list-item__interactive-loading-wrapper {
  display: flex;
  align-items: center;
  padding: 8px 10px 8px 16px;
}
.hds-dropdown-list-item__interactive-loading-wrapper .hds-dropdown-list-item__interactive-text {
  color: var(--token-color-foreground-faint);
}
.hds-dropdown-list-item__interactive-loading-wrapper .hds-dropdown-list-item__interactive-icon {
  color: var(--token-color-foreground-primary);
}

.hds-dropdown-list-item--variant-separator {
  position: relative;
  width: 100%;
  height: 4px;
}
.hds-dropdown-list-item--variant-separator::before {
  position: absolute;
  right: 6px;
  bottom: 0;
  left: 6px;
  border-bottom: 1px solid var(--token-color-border-primary);
  content: "";
}

.hds-dropdown-list-item--variant-title {
  padding: 10px 16px 4px;
  color: var(--token-color-foreground-strong);
}

.hds-dropdown-list-item--variant-checkmark-selected .hds-dropdown-list-item__checkmark {
  color: var(--token-color-foreground-action);
}

.hds-dropdown-list-item__checkmark {
  display: flex;
  width: 16px;
  height: 20px;
  margin-left: 8px;
}

.hds-dropdown-list-item__checkmark-icon {
  align-self: center;
}

.hds-dropdown-list-item__interactive[disabled],
.hds-dropdown-list-item__interactive[disabled]:hover {
  color: var(--token-color-foreground-disabled);
  cursor: not-allowed;
}

.hds-dropdown-list-item--variant-checkbox,
.hds-dropdown-list-item--variant-radio {
  display: flex;
  align-items: self-start;
  padding: 8px 16px;
}
.hds-dropdown-list-item--variant-checkbox .hds-dropdown-list-item__control,
.hds-dropdown-list-item--variant-radio .hds-dropdown-list-item__control {
  flex-shrink: 0;
  margin-top: 2px;
  margin-right: 8px;
}
.hds-dropdown-list-item--variant-checkbox .hds-dropdown-list-item__control[disabled] ~ .hds-dropdown-list-item__icon, .hds-dropdown-list-item--variant-checkbox .hds-dropdown-list-item__control[disabled] ~ .hds-dropdown-list-item__count, .hds-dropdown-list-item--variant-checkbox .hds-dropdown-list-item__control[disabled] ~ .hds-dropdown-list-item__text-content,
.hds-dropdown-list-item--variant-radio .hds-dropdown-list-item__control[disabled] ~ .hds-dropdown-list-item__icon,
.hds-dropdown-list-item--variant-radio .hds-dropdown-list-item__control[disabled] ~ .hds-dropdown-list-item__count,
.hds-dropdown-list-item--variant-radio .hds-dropdown-list-item__control[disabled] ~ .hds-dropdown-list-item__text-content {
  color: var(--token-color-foreground-disabled);
}
.hds-dropdown-list-item--variant-checkbox .hds-dropdown-list-item__label,
.hds-dropdown-list-item--variant-radio .hds-dropdown-list-item__label {
  display: flex;
  flex-grow: 1;
  align-items: flex-start;
  color: var(--token-color-foreground-primary);
}
.hds-dropdown-list-item--variant-checkbox .hds-dropdown-list-item__icon,
.hds-dropdown-list-item--variant-radio .hds-dropdown-list-item__icon {
  margin-top: 2px;
  margin-right: 4px;
}

.hds-dropdown-list-item__count {
  margin-left: auto;
  padding-left: 8px;
  color: var(--token-color-foreground-faint);
  line-height: 20px;
}

.hds-dropdown-list-item--variant-checkmark .hds-badge,
.hds-dropdown-list-item--variant-checkbox .hds-badge,
.hds-dropdown-list-item--variant-radio .hds-badge {
  vertical-align: bottom;
}

/**
 * Copyright (c) HashiCorp, Inc.
 * SPDX-License-Identifier: MPL-2.0
 */
.hds-flyout {
  position: fixed;
  z-index: 49;
  inset: 0;
  height: 100vh;
  max-height: 100vh;
  background: var(--token-color-surface-primary);
  border: none;
  box-shadow: 0 2px 3px 0 rgba(59, 61, 69, 0.2509803922), 0 12px 24px 0 rgba(59, 61, 69, 0.3490196078);
}
.hds-flyout:not([open]) {
  display: none;
}
.hds-flyout::backdrop {
  display: none;
}

.hds-flyout--size-medium {
  width: min(480px, calc(100vw - var(--hds-app-sidenav-width-minimized) / 2));
  max-width: calc(100vw - var(--hds-app-sidenav-width-minimized) / 2);
}
.hds-flyout--size-medium[open] {
  margin-left: calc(100% - min(480px, calc(100vw - var(--hds-app-sidenav-width-minimized) / 2)));
}

.hds-flyout--size-large {
  width: min(720px, calc(100vw - var(--hds-app-sidenav-width-minimized) / 2));
  max-width: calc(100vw - var(--hds-app-sidenav-width-minimized) / 2);
}
.hds-flyout--size-large[open] {
  margin-left: calc(100% - min(720px, calc(100vw - var(--hds-app-sidenav-width-minimized) / 2)));
}

/**
 * Copyright (c) HashiCorp, Inc.
 * SPDX-License-Identifier: MPL-2.0
 */
/**
 * Copyright (c) HashiCorp, Inc.
 * SPDX-License-Identifier: MPL-2.0
 */
/**
 * Copyright (c) HashiCorp, Inc.
 * SPDX-License-Identifier: MPL-2.0
 */
.hds-form {
  --hds-form-section-max-width: 672px;
  display: flex;
  flex-direction: column;
  gap: 32px;
}

.hds-form__header,
.hds-form__section-header {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.hds-form__section {
  display: flex;
  flex-direction: column;
  gap: 24px;
}
.hds-form__section:empty {
  display: none;
}

.hds-form__section-multi-field-group {
  display: flex;
  flex-direction: row;
  gap: 16px;
  align-items: end;
}
@media screen and (max-width: 767.98px) {
  .hds-form__section-multi-field-group {
    flex-direction: column;
    gap: 24px;
    align-items: start;
  }
}

.hds-form__section-multi-field-group-item {
  width: var(--hds-form-section-multi-field-group-item-width, auto);
}

.hds-form__header,
.hds-form__section,
.hds-form__separator,
.hds-form__footer {
  max-width: var(--hds-form-section-max-width);
}

.hds-form-content--is-full-width {
  max-width: none;
}

/**
 * Copyright (c) HashiCorp, Inc.
 * SPDX-License-Identifier: MPL-2.0
 */
.hds-form-label {
  display: block;
  width: max-content;
  max-width: 100%;
  color: var(--token-form-label-color);
}
.hds-form-label .hds-badge {
  vertical-align: initial;
}

/**
 * Copyright (c) HashiCorp, Inc.
 * SPDX-License-Identifier: MPL-2.0
 */
.hds-form-helper-text {
  display: block;
  color: var(--token-form-helper-text-color);
}

/**
 * Copyright (c) HashiCorp, Inc.
 * SPDX-License-Identifier: MPL-2.0
 */
.hds-form-character-count {
  color: var(--token-form-helper-text-color);
}

/**
 * Copyright (c) HashiCorp, Inc.
 * SPDX-License-Identifier: MPL-2.0
 */
.hds-form-error {
  display: flex;
  gap: 8px;
  align-items: flex-start;
  color: var(--token-form-error-color);
}

.hds-form-error__icon {
  flex: none;
  width: var(--token-form-error-icon-size);
  height: var(--token-form-error-icon-size);
  margin: 2px 0 2px 0;
}

.hds-form-error__content {
  flex: 1 1 auto;
}

.hds-form-error__message {
  margin: 0;
}

/**
 * Copyright (c) HashiCorp, Inc.
 * SPDX-License-Identifier: MPL-2.0
 */
.hds-form-field--layout-vertical {
  display: grid;
  justify-items: start;
  width: 100%;
}
.hds-form-field--layout-vertical .hds-form-field__label {
  width: fit-content;
}
.hds-form-field--layout-vertical .hds-form-field__helper-text:not(:first-child) {
  margin-top: 4px;
}
.hds-form-field--layout-vertical .hds-form-field__helper-text + .hds-form-helper-text {
  margin-top: 2px;
}
.hds-form-field--layout-vertical .hds-form-field__control {
  display: flex;
  justify-self: stretch;
}
.hds-form-field--layout-vertical .hds-form-field__control:not(:first-child) {
  margin-top: 8px;
}
.hds-form-field--layout-vertical .hds-form-field__control:not(:last-child) {
  margin-bottom: 8px;
}
.hds-form-field--layout-vertical .hds-form-field__character-count + .hds-form-error {
  margin-top: 8px;
}

.hds-form-field--layout-flag {
  display: grid;
  grid-auto-flow: row;
  grid-template-areas: "control label" "control helper-text" "control error";
  grid-template-rows: auto auto auto;
  grid-template-columns: auto 1fr;
  justify-items: start;
}
.hds-form-field--layout-flag .hds-form-field__label {
  grid-area: label;
  width: fit-content;
}
.hds-form-field--layout-flag .hds-form-field__helper-text {
  grid-area: helper-text;
  margin-top: 4px;
}
.hds-form-field--layout-flag .hds-form-field__control {
  display: flex;
  grid-area: control;
}
.hds-form-field--layout-flag .hds-form-field__control:not(:only-child) {
  margin-top: 2px;
  margin-right: 8px;
}
.hds-form-field--layout-flag .hds-form-field__error {
  grid-area: error;
  margin-top: 4px;
}

/**
 * Copyright (c) HashiCorp, Inc.
 * SPDX-License-Identifier: MPL-2.0
 */
/**
 * Copyright (c) HashiCorp, Inc.
 * SPDX-License-Identifier: MPL-2.0
 */
.hds-form-file-input {
  margin: -4px 0 -4px -4px;
  padding: 3px 0 3px 3px;
  color: var(--token-color-foreground-primary);
}
.hds-form-file-input:focus, .hds-form-file-input:focus-visible {
  outline: none;
}

.hds-form-file-input::file-selector-button {
  min-height: 36px;
  margin-right: 16px;
  padding: 7px 16px 7px 37px;
  color: var(--token-color-foreground-primary);
  font: inherit;
  background-color: var(--token-color-surface-faint);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none' viewBox='0 0 16 16'%3E%3Cg fill='%233b3d45'%3E%3Cpath d='M4.24 5.8a.75.75 0 001.06-.04l1.95-2.1v6.59a.75.75 0 001.5 0V3.66l1.95 2.1a.75.75 0 101.1-1.02l-3.25-3.5a.75.75 0 00-1.101.001L4.2 4.74a.75.75 0 00.04 1.06z'/%3E%3Cpath d='M1.75 9a.75.75 0 01.75.75v3c0 .414.336.75.75.75h9.5a.75.75 0 00.75-.75v-3a.75.75 0 011.5 0v3A2.25 2.25 0 0112.75 15h-9.5A2.25 2.25 0 011 12.75v-3A.75.75 0 011.75 9z'/%3E%3C/g%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: 15px 50%;
  background-size: var(--token-form-text-input-background-image-size);
  border: 1px solid var(--token-color-border-strong);
  border-radius: var(--token-border-radius-small);
  box-shadow: var(--token-elevation-low-box-shadow);
  cursor: pointer;
}

.hds-form-file-input::file-selector-button:hover,
.hds-form-file-input.mock-hover::file-selector-button {
  color: var(--token-color-foreground-primary);
  background-color: var(--token-color-surface-primary);
  border-color: var(--token-color-border-strong);
}

.hds-form-file-input:focus-within::file-selector-button,
.hds-form-file-input.mock-focus::file-selector-button {
  color: var(--token-color-foreground-primary);
  background-color: var(--token-color-surface-faint);
  border-color: var(--token-color-focus-action-internal);
  outline: 3px solid var(--token-color-focus-action-external);
}

.hds-form-file-input:not(:focus, .mock-focus)::file-selector-button {
  border-color: var(--token-color-border-strong);
  outline: 0;
}

.hds-form-file-input::file-selector-button:active,
.hds-form-file-input.mock-active::file-selector-button {
  color: var(--token-color-foreground-primary);
  background-color: var(--token-color-surface-interactive-active);
  border-color: var(--token-color-border-strong);
  box-shadow: none;
}

.hds-form-file-input:disabled, .hds-form-file-input[disabled], .hds-form-file-input.mock-disabled, .hds-form-file-input:disabled:focus, .hds-form-file-input[disabled]:focus, .hds-form-file-input.mock-disabled:focus, .hds-form-file-input:disabled:hover, .hds-form-file-input[disabled]:hover, .hds-form-file-input.mock-disabled:hover {
  color: var(--token-color-foreground-disabled);
}
.hds-form-file-input:disabled::file-selector-button, .hds-form-file-input[disabled]::file-selector-button, .hds-form-file-input.mock-disabled::file-selector-button, .hds-form-file-input:disabled:focus::file-selector-button, .hds-form-file-input[disabled]:focus::file-selector-button, .hds-form-file-input.mock-disabled:focus::file-selector-button, .hds-form-file-input:disabled:hover::file-selector-button, .hds-form-file-input[disabled]:hover::file-selector-button, .hds-form-file-input.mock-disabled:hover::file-selector-button {
  color: var(--token-color-foreground-disabled);
  background-color: var(--token-color-surface-faint);
  border-color: var(--token-color-border-primary);
  box-shadow: none;
  cursor: not-allowed;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none' viewBox='0 0 16 16'%3E%3Cg fill='%238c909c'%3E%3Cpath d='M4.24 5.8a.75.75 0 001.06-.04l1.95-2.1v6.59a.75.75 0 001.5 0V3.66l1.95 2.1a.75.75 0 101.1-1.02l-3.25-3.5a.75.75 0 00-1.101.001L4.2 4.74a.75.75 0 00.04 1.06z'/%3E%3Cpath d='M1.75 9a.75.75 0 01.75.75v3c0 .414.336.75.75.75h9.5a.75.75 0 00.75-.75v-3a.75.75 0 011.5 0v3A2.25 2.25 0 0112.75 15h-9.5A2.25 2.25 0 011 12.75v-3A.75.75 0 011.75 9z'/%3E%3C/g%3E%3C/svg%3E");
}

/**
 * Copyright (c) HashiCorp, Inc.
 * SPDX-License-Identifier: MPL-2.0
 */
.hds-form-legend {
  display: block;
  color: var(--token-form-legend-color);
}
.hds-form-legend .hds-badge {
  vertical-align: initial;
}

/**
 * Copyright (c) HashiCorp, Inc.
 * SPDX-License-Identifier: MPL-2.0
 */
.hds-form-group {
  display: block;
  margin: 0;
  padding: 0;
  border: none;
}

.hds-form-group__legend {
  margin: 0 0 8px 0;
  padding: 0;
}

.hds-form-group__legend ~ .hds-form-group__control-fields-wrapper .hds-form-label {
  font-weight: var(--token-typography-font-weight-regular);
}

.hds-form-group--layout-vertical .hds-form-group__control-fields-wrapper {
  display: flex;
  flex-direction: column;
}
.hds-form-group--layout-vertical .hds-form-group__control-field + .hds-form-group__control-field {
  margin-top: 12px;
}

.hds-form-group--layout-horizontal .hds-form-group__control-fields-wrapper {
  display: flex;
  flex-wrap: wrap;
  margin-bottom: -4px;
}
.hds-form-group--layout-horizontal .hds-form-group__control-field {
  margin-right: 16px;
  margin-bottom: 4px;
}

.hds-form-group__helper-text {
  margin-bottom: 8px;
}

.hds-form-group__error {
  margin-top: 8px;
}

/**
 * Copyright (c) HashiCorp, Inc.
 * SPDX-License-Identifier: MPL-2.0
 */
.hds-form-indicator--optional {
  color: var(--token-form-indicator-optional-color);
}

/**
 * Copyright (c) HashiCorp, Inc.
 * SPDX-License-Identifier: MPL-2.0
 */
.hds-form-checkbox {
  width: var(--token-form-checkbox-size);
  height: var(--token-form-checkbox-size);
  margin: 0;
  padding: 0;
  background-position: center center;
  background-size: var(--token-form-checkbox-background-image-size) var(--token-form-checkbox-background-image-size);
  border-style: solid;
  border-width: var(--token-form-checkbox-border-width);
  border-radius: var(--token-form-checkbox-border-radius);
  cursor: pointer;
  appearance: none;
}
.hds-form-checkbox:not(:checked, :indeterminate) {
  background-color: var(--token-form-control-base-surface-color-default);
  border-color: var(--token-form-control-base-border-color-default);
  box-shadow: var(--token-elevation-inset-box-shadow);
}
.hds-form-checkbox:checked {
  background-color: var(--token-form-control-checked-surface-color-default);
  background-image: var(--token-form-checkbox-background-image-data-url);
  border-color: var(--token-form-control-checked-border-color-default);
}
.hds-form-checkbox:indeterminate {
  background-color: var(--token-form-control-checked-surface-color-default);
  background-image: var(--token-form-checkbox-background-image-data-url-indeterminate);
  border-color: var(--token-form-control-checked-border-color-default);
}
.hds-form-checkbox:hover:not(:checked, :indeterminate), .hds-form-checkbox.mock-hover:not(:checked, :indeterminate) {
  background-color: var(--token-form-control-base-surface-color-hover);
  border-color: var(--token-form-control-base-border-color-hover);
}
.hds-form-checkbox:hover:checked, .hds-form-checkbox.mock-hover:checked, .hds-form-checkbox:hover:indeterminate, .hds-form-checkbox.mock-hover:indeterminate {
  background-color: var(--token-form-control-checked-border-color-default);
  border-color: var(--token-form-control-checked-border-color-hover);
}
.hds-form-checkbox:focus, .hds-form-checkbox.mock-focus {
  outline: 3px solid var(--token-color-focus-action-external);
  outline-offset: 1px;
}
.hds-form-checkbox:disabled:not(:checked, :indeterminate) {
  background-color: var(--token-form-control-disabled-surface-color);
  border-color: var(--token-form-control-disabled-border-color);
  box-shadow: none;
  cursor: not-allowed;
}
.hds-form-checkbox:disabled:checked {
  background-color: var(--token-form-control-disabled-surface-color);
  background-image: var(--token-form-checkbox-background-image-data-url-disabled);
  border-color: var(--token-form-control-disabled-border-color);
  box-shadow: none;
  cursor: not-allowed;
}
.hds-form-checkbox:disabled:indeterminate {
  background-color: var(--token-form-control-disabled-surface-color);
  background-image: var(--token-form-checkbox-background-image-data-url-indeterminate-disabled);
  background-repeat: no-repeat;
  border-color: var(--token-form-control-disabled-border-color);
  box-shadow: none;
  cursor: not-allowed;
}

/**
 * Copyright (c) HashiCorp, Inc.
 * SPDX-License-Identifier: MPL-2.0
 */
.hds-form-masked-input {
  position: relative;
  display: grid;
  grid-template-areas: "input copy-button";
  grid-template-columns: 1fr auto;
  width: 100%;
}
.hds-form-masked-input .hds-form-masked-input__control {
  grid-area: input;
  padding-right: calc(var(--token-form-control-padding) + 24px);
  scrollbar-width: thin;
}

.hds-form-masked-input--is-masked .hds-form-masked-input__control {
  -webkit-text-security: disc;
}

.hds-form-masked-input--is-not-masked .hds-form-masked-input__control {
  -webkit-text-security: none;
}

.hds-form-masked-input__toggle-button {
  position: absolute;
  top: calc(var(--token-form-control-padding) - var(--token-form-control-border-width));
  right: calc(var(--token-form-control-padding) - var(--token-form-control-border-width));
  grid-area: input;
}

.hds-form-masked-input__copy-button {
  grid-area: copy-button;
  align-self: flex-start;
  margin-left: 8px;
}

/**
 * Copyright (c) HashiCorp, Inc.
 * SPDX-License-Identifier: MPL-2.0
 */
.hds-form-radio {
  width: var(--token-form-radio-size);
  height: var(--token-form-radio-size);
  margin: 0;
  padding: 0;
  background-position: center center;
  background-size: var(--token-form-radio-background-image-size) var(--token-form-radio-background-image-size);
  border-style: solid;
  border-width: var(--token-form-radio-border-width);
  border-radius: 50%;
  cursor: pointer;
  appearance: none;
}
.hds-form-radio:not(:checked) {
  background-color: var(--token-form-control-base-surface-color-default);
  border-color: var(--token-form-control-base-border-color-default);
  box-shadow: var(--token-elevation-inset-box-shadow);
}
.hds-form-radio:checked {
  background-color: var(--token-form-control-checked-surface-color-default);
  background-image: var(--token-form-radio-background-image-data-url);
  border-color: var(--token-form-control-checked-border-color-default);
}
.hds-form-radio:hover:not(:checked), .hds-form-radio.mock-hover:not(:checked) {
  background-color: var(--token-form-control-base-surface-color-hover);
  border-color: var(--token-form-control-base-border-color-hover);
}
.hds-form-radio:hover:checked, .hds-form-radio.mock-hover:checked {
  background-color: var(--token-form-control-checked-border-color-default);
  border-color: var(--token-form-control-checked-border-color-hover);
}
.hds-form-radio:focus, .hds-form-radio.mock-focus {
  outline: 3px solid var(--token-color-focus-action-external);
  outline-offset: 1px;
}
.hds-form-radio:disabled:not(:checked) {
  background-color: var(--token-form-control-disabled-surface-color);
  border-color: var(--token-form-control-disabled-border-color);
  box-shadow: none;
  cursor: not-allowed;
}
.hds-form-radio:disabled:checked {
  background-color: var(--token-form-control-disabled-surface-color);
  background-image: var(--token-form-radio-background-image-data-url-disabled);
  border-color: var(--token-form-control-disabled-border-color);
  box-shadow: none;
  cursor: not-allowed;
}

/**
 * Copyright (c) HashiCorp, Inc.
 * SPDX-License-Identifier: MPL-2.0
 */
.hds-form-group--radio-cards .hds-form-group__control-fields-wrapper {
  margin: calc(-1 * var(--token-form-radiocard-group-gap) / 2);
}
.hds-form-group--radio-cards .hds-form-group__legend {
  margin-bottom: 12px;
}
.hds-form-group--radio-cards .hds-form-radio-card {
  margin: calc(var(--token-form-radiocard-group-gap) / 2);
}
.hds-form-group--radio-cards .hds-form-radio-card--has-fluid-width {
  flex: 1 0 0;
}
.hds-form-group--radio-cards .hds-form-radio-card--has-fixed-width {
  flex: 1 0 100%;
}

.hds-form-radio-card {
  display: flex;
  flex-direction: column;
  background-color: var(--token-color-surface-primary);
  border: var(--token-form-radiocard-border-width) solid var(--token-color-border-primary);
  border-radius: var(--token-form-radiocard-border-radius);
  box-shadow: var(--token-elevation-mid-box-shadow);
  cursor: pointer;
}
.hds-form-radio-card .hds-form-radio-card__control {
  outline-color: transparent;
}
.hds-form-radio-card:hover, .hds-form-radio-card.mock-hover {
  box-shadow: var(--token-elevation-high-box-shadow);
  transition: var(--token-form-radiocard-transition-duration);
}
.hds-form-radio-card:focus-within, .hds-form-radio-card.mock-focus {
  border-color: var(--token-color-focus-action-internal);
  box-shadow: 0 0 0 3px var(--token-color-focus-action-external);
}
.hds-form-radio-card.hds-form-radio-card--checked {
  border-color: var(--token-color-palette-blue-300);
}
.hds-form-radio-card.hds-form-radio-card--checked .hds-form-radio-card__control-wrapper {
  background-color: var(--token-color-surface-action);
  border-color: var(--token-color-border-action);
}
.hds-form-radio-card.hds-form-radio-card--checked:hover, .hds-form-radio-card.hds-form-radio-card--checked.mock-hover {
  border-color: var(--token-color-palette-blue-400);
}
.hds-form-radio-card.hds-form-radio-card--disabled {
  background-color: var(--token-color-surface-interactive-disabled);
  border-color: var(--token-color-border-primary);
  box-shadow: none;
  cursor: not-allowed;
}
.hds-form-radio-card.hds-form-radio-card--disabled .hds-form-radio-card__control-wrapper {
  background-color: var(--token-color-surface-interactive-disabled);
  border-color: var(--token-color-border-primary);
}
.hds-form-radio-card.hds-form-radio-card--disabled .hds-form-radio-card__content {
  opacity: 0.5;
}
.hds-form-radio-card.hds-form-radio-card--disabled:hover, .hds-form-radio-card.hds-form-radio-card--disabled.mock-hover {
  border-color: var(--token-color-border-primary);
}

.hds-form-radio-card--align-left {
  text-align: left;
}

.hds-form-radio-card--align-center {
  text-align: center;
}
.hds-form-radio-card--align-center .hds-icon {
  margin: auto;
}

.hds-form-radio-card--control-bottom .hds-form-radio-card__control-wrapper {
  border-top-width: var(--token-form-radiocard-border-width);
  border-top-style: solid;
  border-bottom-right-radius: inherit;
  border-bottom-left-radius: inherit;
}

.hds-form-radio-card--control-left {
  flex-direction: row-reverse;
}
.hds-form-radio-card--control-left .hds-form-radio-card__control-wrapper {
  display: flex;
  align-items: center;
  border-right-width: var(--token-form-radiocard-border-width);
  border-right-style: solid;
  border-top-left-radius: inherit;
  border-bottom-left-radius: inherit;
}

.hds-form-radio-card__content {
  flex: 1;
  padding: var(--token-form-radiocard-content-padding);
}
.hds-form-radio-card__content .hds-badge {
  margin-bottom: 12px;
}

.hds-form-radio-card__label {
  display: block;
  margin: 8px 0;
  color: var(--token-form-label-color);
  overflow-wrap: break-word;
}
.hds-form-radio-card__label:first-child {
  margin-top: 0;
}

.hds-form-radio-card__description {
  display: block;
  color: var(--token-color-foreground-primary);
}

.hds-form-radio-card__control-wrapper {
  padding: var(--token-form-radiocard-control-padding);
  background-color: var(--token-color-surface-faint);
  border-color: var(--token-color-border-primary);
}

.hds-form-radio-card__control {
  display: block;
  margin: auto;
}

/**
 * Copyright (c) HashiCorp, Inc.
 * SPDX-License-Identifier: MPL-2.0
 */
.hds-form-select {
  max-width: 100%;
  padding: var(--token-form-control-padding);
  padding-right: calc(var(--token-form-control-padding) + 24px);
  color: var(--token-form-control-base-foreground-value-color);
  background-color: var(--token-form-control-base-surface-color-default);
  background-image: var(--token-form-select-background-image-data-url);
  background-repeat: no-repeat;
  background-position: right var(--token-form-select-background-image-position-right-x) top var(--token-form-select-background-image-position-top-y);
  background-size: var(--token-form-select-background-image-size) var(--token-form-select-background-image-size);
  border: var(--token-form-control-border-width) solid var(--token-form-control-base-border-color-default);
  border-radius: var(--token-form-control-border-radius);
  box-shadow: var(--token-elevation-low-box-shadow);
  appearance: none;
}
.hds-form-select:hover, .hds-form-select.mock-hover {
  border-color: var(--token-form-control-base-border-color-hover);
}
.hds-form-select:focus, .hds-form-select.mock-focus {
  border-color: var(--token-color-focus-action-internal);
  outline: 3px solid var(--token-color-focus-action-external);
  outline-offset: 0;
}
.hds-form-select:disabled {
  color: var(--token-form-control-disabled-foreground-color);
  background-color: var(--token-form-control-disabled-surface-color);
  background-image: var(--token-form-select-background-image-data-url-disabled);
  border-color: var(--token-form-control-disabled-border-color);
  box-shadow: none;
  cursor: not-allowed;
}
.hds-form-select.hds-form-select--is-invalid {
  border-color: var(--token-form-control-invalid-border-color-default);
}
.hds-form-select.hds-form-select--is-invalid:hover, .hds-form-select.hds-form-select--is-invalid.mock-hover {
  border-color: var(--token-form-control-invalid-border-color-hover);
}
.hds-form-select.hds-form-select--is-invalid:focus, .hds-form-select.hds-form-select--is-invalid.mock-focus {
  border-color: var(--token-color-focus-critical-internal);
  outline-color: var(--token-color-focus-critical-external);
}

.hds-form-select[multiple], .hds-form-select[size] {
  background: none;
}
.hds-form-select[multiple] option, .hds-form-select[size] option {
  margin: 2px auto;
  border-radius: var(--token-border-radius-x-small);
}
.hds-form-select[multiple] option:hover, .hds-form-select[size] option:hover {
  color: var(--token-color-foreground-action);
}
.hds-form-select[multiple] option:disabled, .hds-form-select[size] option:disabled {
  color: var(--token-color-foreground-disabled);
}
.hds-form-select[multiple] option:checked, .hds-form-select[size] option:checked {
  color: var(--token-color-foreground-high-contrast);
  background: var(--token-color-palette-blue-200);
}
.hds-form-select[multiple] optgroup, .hds-form-select[size] optgroup {
  color: var(--token-color-foreground-strong);
  font-weight: var(--token-typography-font-weight-semibold);
  font-style: normal;
}

/**
 * Copyright (c) HashiCorp, Inc.
 * SPDX-License-Identifier: MPL-2.0
 */
.hds-form-super-select {
  width: 100%;
}

.hds-form-super-select .ember-basic-dropdown .ember-basic-dropdown-trigger,
.hds-form-super-select .ember-basic-dropdown .ember-power-select-trigger {
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: center;
  max-width: 100%;
  min-height: 36px;
  padding-top: 4px;
  padding-right: calc(var(--token-form-control-padding) + 21px);
  padding-bottom: 4px;
  padding-left: 11px;
  color: var(--token-form-control-base-foreground-value-color);
  line-height: var(--token-typography-body-200-line-height);
  background-color: var(--token-form-control-base-surface-color-default);
  background-image: var(--token-form-select-background-image-data-url);
  background-repeat: no-repeat;
  background-position: right var(--token-form-select-background-image-position-right-x) center, top var(--token-form-select-background-image-position-top-y) left 20px;
  background-size: var(--token-form-select-background-image-size) var(--token-form-select-background-image-size);
  border: var(--token-form-control-border-width) solid var(--token-form-control-base-border-color-default);
  border-radius: var(--token-form-control-border-radius);
  box-shadow: var(--token-elevation-low-box-shadow);
}
.hds-form-super-select .ember-basic-dropdown .ember-basic-dropdown-trigger:hover, .hds-form-super-select .ember-basic-dropdown .ember-basic-dropdown-trigger.mock-hover,
.hds-form-super-select .ember-basic-dropdown .ember-power-select-trigger:hover,
.hds-form-super-select .ember-basic-dropdown .ember-power-select-trigger.mock-hover {
  border-color: var(--token-form-control-base-border-color-hover);
}
.hds-form-super-select .ember-basic-dropdown .ember-basic-dropdown-trigger:focus, .hds-form-super-select .ember-basic-dropdown .ember-basic-dropdown-trigger.mock-focus,
.hds-form-super-select .ember-basic-dropdown .ember-power-select-trigger:focus,
.hds-form-super-select .ember-basic-dropdown .ember-power-select-trigger.mock-focus {
  border-color: var(--token-color-focus-action-internal);
  outline: 3px solid var(--token-color-focus-action-external);
  outline-offset: 0;
}
.hds-form-super-select .ember-basic-dropdown .ember-basic-dropdown-trigger[aria-expanded=true].ember-basic-dropdown-trigger--in-place,
.hds-form-super-select .ember-basic-dropdown .ember-power-select-trigger[aria-expanded=true].ember-basic-dropdown-trigger--in-place {
  border-radius: var(--token-form-control-border-radius);
}
.hds-form-super-select .ember-basic-dropdown .ember-basic-dropdown-trigger .ember-power-select-status-icon,
.hds-form-super-select .ember-basic-dropdown .ember-power-select-trigger .ember-power-select-status-icon {
  display: none;
}
.hds-form-super-select .ember-basic-dropdown .ember-basic-dropdown-trigger .ember-power-select-placeholder,
.hds-form-super-select .ember-basic-dropdown .ember-basic-dropdown-trigger .ember-power-select-selected-item,
.hds-form-super-select .ember-basic-dropdown .ember-power-select-trigger .ember-power-select-placeholder,
.hds-form-super-select .ember-basic-dropdown .ember-power-select-trigger .ember-power-select-selected-item {
  flex: 1;
  margin-left: 0;
}
.hds-form-super-select .ember-basic-dropdown .ember-basic-dropdown-trigger .ember-power-select-placeholder,
.hds-form-super-select .ember-basic-dropdown .ember-power-select-trigger .ember-power-select-placeholder {
  color: var(--token-form-control-base-foreground-placeholder-color);
  font-size: var(--token-typography-body-200-font-size);
  font-family: var(--token-typography-body-200-font-family);
  line-height: var(--token-typography-body-200-line-height);
}
.hds-form-super-select .ember-basic-dropdown .ember-basic-dropdown-trigger[aria-disabled=true],
.hds-form-super-select .ember-basic-dropdown .ember-power-select-trigger[aria-disabled=true] {
  color: var(--token-form-control-disabled-foreground-color);
  background-color: var(--token-form-control-disabled-surface-color);
  background-image: var(--token-form-select-background-image-data-url-disabled);
  border-color: var(--token-form-control-disabled-border-color);
  box-shadow: none;
  cursor: not-allowed;
  opacity: 1;
}
.hds-form-super-select .ember-basic-dropdown .ember-basic-dropdown-trigger[aria-disabled=true] .ember-power-select-selected-item,
.hds-form-super-select .ember-basic-dropdown .ember-power-select-trigger[aria-disabled=true] .ember-power-select-selected-item {
  opacity: inherit;
}
.hds-form-super-select .ember-basic-dropdown .ember-basic-dropdown-trigger::after,
.hds-form-super-select .ember-basic-dropdown .ember-power-select-trigger::after {
  display: var(--hds-form-super-select-selected-text-display);
  flex-shrink: 0;
  align-items: center;
  align-self: stretch;
  padding-left: 8px;
  color: var(--token-color-foreground-faint);
  font-size: var(--token-typography-body-100-font-size);
  font-family: var(--token-typography-body-100-font-family);
  line-height: var(--token-typography-body-100-line-height);
  border-left: 1px solid var(--token-color-border-strong);
  content: var(--hds-form-super-select-selected-text);
}
.hds-form-super-select .ember-basic-dropdown .ember-basic-dropdown-content {
  max-width: var(--hds-form-super-select-dropdown-max-width, none);
  margin: 0;
  border: var(--token-form-control-border-width) solid var(--token-form-control-base-border-color-default);
  border-radius: var(--token-form-control-border-radius);
}
.hds-form-super-select .ember-basic-dropdown .ember-basic-dropdown-content.ember-basic-dropdown-content--in-place {
  box-shadow: var(--token-elevation-high-box-shadow), var(--token-elevation-high-box-shadow);
}
.hds-form-super-select .ember-basic-dropdown .ember-basic-dropdown-content.ember-basic-dropdown-content--below {
  margin-top: 4px;
}
.hds-form-super-select .ember-basic-dropdown .ember-basic-dropdown-content.ember-basic-dropdown-content--above {
  top: unset !important;
  bottom: 100%;
  margin-bottom: 4px;
}
.hds-form-super-select .ember-basic-dropdown .ember-basic-dropdown-content > .ember-power-select-options > .hds-form-super-select__option-group:first-child::before {
  display: none;
}
.hds-form-super-select .ember-basic-dropdown .ember-power-select-options {
  padding: 3px 0;
}
.hds-form-super-select .ember-basic-dropdown .ember-power-select-options .ember-power-select-options {
  padding: 0;
}
.hds-form-super-select .ember-basic-dropdown .ember-power-select-option {
  position: relative;
  min-height: 36px;
  padding: 7px 7px 7px 39px;
  color: var(--token-color-foreground-primary);
  font-size: var(--token-typography-body-200-font-size);
  font-family: var(--token-typography-body-200-font-family);
  line-height: var(--token-typography-body-200-line-height);
  overflow-wrap: break-word;
  border: none;
}
.hds-form-super-select .ember-basic-dropdown .ember-power-select-option + .ember-power-select-option {
  margin-top: 8px;
}
.hds-form-super-select .ember-basic-dropdown .ember-power-select-option[aria-current=true] {
  color: var(--token-form-control-base-foreground-value-color);
  background-color: var(--token-form-control-base-surface-color-default);
}
.hds-form-super-select .ember-basic-dropdown .ember-power-select-option[aria-selected=true] {
  background-color: var(--token-form-control-base-surface-color-default);
}
.hds-form-super-select .ember-basic-dropdown .ember-power-select-option[aria-current=true], .hds-form-super-select .ember-basic-dropdown .ember-power-select-option:hover, .hds-form-super-select .ember-basic-dropdown .ember-power-select-option.mock-hover {
  border: none;
}
.hds-form-super-select .ember-basic-dropdown .ember-power-select-option[aria-current=true]::after, .hds-form-super-select .ember-basic-dropdown .ember-power-select-option:hover::after, .hds-form-super-select .ember-basic-dropdown .ember-power-select-option.mock-hover::after {
  position: absolute;
  top: 6px;
  bottom: 6px;
  left: 3px;
  width: 2px;
  background-color: var(--token-color-foreground-action-hover);
  border-radius: 500px;
  content: "";
}
.hds-form-super-select .ember-basic-dropdown .ember-power-select-option:active::after, .hds-form-super-select .ember-basic-dropdown .ember-power-select-option.mock-active::after {
  background-color: var(--token-color-foreground-action-active);
}
.hds-form-super-select .ember-basic-dropdown .hds-form-super-select__option-group:first-child .hds-form-super-select__option-group-title {
  margin-top: 0;
}
.hds-form-super-select .ember-basic-dropdown .hds-form-super-select__option-group::before {
  display: block;
  height: 5px;
  margin: 7px 5px 9px 5px;
  border-bottom: 1px solid var(--token-color-border-primary);
  content: "";
}
.hds-form-super-select .ember-basic-dropdown .hds-form-super-select__option-group .hds-form-super-select__option-group {
  padding-left: 16px;
}
.hds-form-super-select .ember-basic-dropdown .hds-form-super-select__option-group .hds-form-super-select__option-group:first-child::before {
  display: none;
}
.hds-form-super-select .ember-basic-dropdown .hds-form-super-select__option-group-title {
  margin: 8px 0;
  padding: 6px 7px 2px 15px;
}
.hds-form-super-select .ember-basic-dropdown .ember-power-select-search {
  margin-bottom: 3px;
  padding: 11px 11px 0 11px;
  border-radius: var(--token-form-control-border-radius);
}
.hds-form-super-select .ember-basic-dropdown .ember-power-select-search-input {
  width: 100%;
  min-height: 36px;
  padding: var(--token-form-control-padding);
  color: var(--token-form-control-base-foreground-value-color);
  font-size: var(--token-typography-body-200-font-size);
  font-family: var(--token-typography-body-200-font-family);
  line-height: 1rem;
  background-color: var(--token-form-control-base-surface-color-default);
  border: var(--token-form-control-border-width) solid var(--token-form-control-base-border-color-default);
  border-radius: var(--token-form-control-border-radius);
  box-shadow: var(--token-elevation-inset-box-shadow);
}
.hds-form-super-select .ember-basic-dropdown .ember-power-select-search-input::placeholder {
  color: var(--token-form-control-base-foreground-placeholder-color);
}
.hds-form-super-select .ember-basic-dropdown .ember-power-select-search-input:hover, .hds-form-super-select .ember-basic-dropdown .ember-power-select-search-input.mock-hover {
  border-color: var(--token-form-control-base-border-color-hover);
}
.hds-form-super-select .ember-basic-dropdown .ember-power-select-search-input:focus, .hds-form-super-select .ember-basic-dropdown .ember-power-select-search-input.mock-focus {
  border-color: var(--token-color-focus-action-internal);
  outline: 3px solid var(--token-color-focus-action-external);
  outline-offset: 0;
}
.hds-form-super-select .ember-basic-dropdown .ember-power-select-search-input[type=search] {
  padding-left: calc(var(--token-form-control-padding) + 24px);
  background-image: var(--token-form-text-input-background-image-data-url-search);
  background-repeat: no-repeat;
  background-position: var(--token-form-text-input-background-image-position-x) 50%;
  background-size: var(--token-form-text-input-background-image-size);
}
.hds-form-super-select .ember-basic-dropdown .ember-power-select-search-input[type=search]::-webkit-search-cancel-button {
  width: var(--token-form-text-input-background-image-size);
  height: var(--token-form-text-input-background-image-size);
  background-image: var(--token-form-text-input-background-image-data-url-search-cancel);
  background-position: center center;
  background-size: var(--token-form-text-input-background-image-size);
  appearance: none;
}
.hds-form-super-select .ember-basic-dropdown .ember-power-select-multiple-options {
  display: flex;
  flex-grow: 1;
  flex-wrap: nowrap;
  min-width: 0;
  overflow: hidden;
  list-style: none;
}
.hds-form-super-select .ember-basic-dropdown .ember-power-select-multiple-option {
  flex-shrink: 0;
  float: none;
  min-width: 0;
  margin: 0 4px 0 0;
  padding: 3px 10px 5px 10px;
  font-size: var(--token-typography-body-100-font-size);
  font-family: var(--token-typography-body-100-font-family);
  line-height: 1rem;
  vertical-align: middle;
  overflow-wrap: break-word;
  background-color: var(--token-color-surface-interactive);
  border: 1px solid var(--token-color-border-strong);
  border-radius: 50px;
}
.hds-form-super-select .ember-basic-dropdown .ember-power-select-multiple-remove-btn {
  display: none;
}
.hds-form-super-select .ember-basic-dropdown .ember-power-select-trigger-multiple-input {
  color: var(--token-form-control-base-foreground-value-color);
  font-size: var(--token-typography-body-200-font-size);
  font-family: var(--token-typography-body-200-font-family);
}
.hds-form-super-select .ember-basic-dropdown .ember-power-select-trigger-multiple-input::-webkit-search-cancel-button {
  width: var(--token-form-text-input-background-image-size);
  height: var(--token-form-text-input-background-image-size);
  background-image: var(--token-form-text-input-background-image-data-url-search-cancel);
  background-position: center center;
  background-size: var(--token-form-text-input-background-image-size);
  cursor: pointer;
  -webkit-appearance: none;
}

.hds-form-super-select.hds-form-super-select--is-invalid .ember-basic-dropdown .ember-basic-dropdown-trigger,
.hds-form-super-select.hds-form-super-select--is-invalid .ember-basic-dropdown .ember-power-select-trigger {
  border-color: var(--token-form-control-invalid-border-color-default);
}
.hds-form-super-select.hds-form-super-select--is-invalid .ember-basic-dropdown .ember-basic-dropdown-trigger:hover, .hds-form-super-select.hds-form-super-select--is-invalid .ember-basic-dropdown .ember-basic-dropdown-trigger.mock-hover,
.hds-form-super-select.hds-form-super-select--is-invalid .ember-basic-dropdown .ember-power-select-trigger:hover,
.hds-form-super-select.hds-form-super-select--is-invalid .ember-basic-dropdown .ember-power-select-trigger.mock-hover {
  border-color: var(--token-form-control-invalid-border-color-hover);
}
.hds-form-super-select.hds-form-super-select--is-invalid .ember-basic-dropdown .ember-basic-dropdown-trigger:focus, .hds-form-super-select.hds-form-super-select--is-invalid .ember-basic-dropdown .ember-basic-dropdown-trigger.mock-focus,
.hds-form-super-select.hds-form-super-select--is-invalid .ember-basic-dropdown .ember-power-select-trigger:focus,
.hds-form-super-select.hds-form-super-select--is-invalid .ember-basic-dropdown .ember-power-select-trigger.mock-focus {
  border-color: var(--token-color-focus-critical-internal);
  outline-color: var(--token-color-focus-critical-external);
}

.hds-form-super-select.hds-form-super-select--show-only-selected .ember-basic-dropdown .ember-power-select-option:not([aria-selected=true]) {
  display: none;
}
.hds-form-super-select.hds-form-super-select--show-only-selected .ember-basic-dropdown .hds-form-super-select__option-group:not(:has(.ember-power-select-option[aria-selected=true])) {
  display: none;
}
.hds-form-super-select.hds-form-super-select--show-only-selected .ember-basic-dropdown .hds-form-super-select__option-group::before {
  display: none;
}
.hds-form-super-select.hds-form-super-select--show-only-selected .ember-basic-dropdown .hds-form-super-select__option-group:has(.ember-power-select-option[aria-selected=true]) ~ .hds-form-super-select__option-group:has(.ember-power-select-option[aria-selected=true])::before {
  display: block;
}

.hds-form-super-select-single .ember-basic-dropdown .ember-power-select-option:not(.ember-power-select-option--no-matches-message) {
  background-repeat: no-repeat;
  background-position: 15px 10px;
  background-size: var(--token-form-select-background-image-size) var(--token-form-select-background-image-size);
}
.hds-form-super-select-single .ember-basic-dropdown .ember-power-select-option:not(.ember-power-select-option--no-matches-message)[aria-selected=true]:not([aria-disabled=true]) {
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M14.78 4.28a.75.75 0 00-1.06-1.06l-7.97 7.97-3.47-3.47a.75.75 0 00-1.06 1.06l4 4a.75.75 0 001.06 0l8.5-8.5z' fill='%231060ff'/%3E%3C/svg%3E");
}
.hds-form-super-select-single .ember-basic-dropdown .ember-power-select-option:not(.ember-power-select-option--no-matches-message)[aria-selected=true]:not([aria-disabled=true]):hover, .hds-form-super-select-single .ember-basic-dropdown .ember-power-select-option:not(.ember-power-select-option--no-matches-message)[aria-selected=true]:not([aria-disabled=true]).mock-hover {
  color: var(--token-color-foreground-action-hover);
}
.hds-form-super-select-single .ember-basic-dropdown .ember-power-select-option:not(.ember-power-select-option--no-matches-message)[aria-selected=true]:not([aria-disabled=true]):active, .hds-form-super-select-single .ember-basic-dropdown .ember-power-select-option:not(.ember-power-select-option--no-matches-message)[aria-selected=true]:not([aria-disabled=true]).mock-active {
  color: var(--token-color-foreground-action-active);
}
.hds-form-super-select-single .ember-basic-dropdown .ember-power-select-option:not(.ember-power-select-option--no-matches-message)[aria-current=true], .hds-form-super-select-single .ember-basic-dropdown .ember-power-select-option:not(.ember-power-select-option--no-matches-message):hover, .hds-form-super-select-single .ember-basic-dropdown .ember-power-select-option:not(.ember-power-select-option--no-matches-message).mock-hover {
  color: var(--token-color-foreground-action-hover);
}
.hds-form-super-select-single .ember-basic-dropdown .ember-power-select-option:not(.ember-power-select-option--no-matches-message):active, .hds-form-super-select-single .ember-basic-dropdown .ember-power-select-option:not(.ember-power-select-option--no-matches-message).mock-active {
  color: var(--token-color-foreground-action-active);
}
.hds-form-super-select-single .ember-basic-dropdown .ember-power-select-option:not(.ember-power-select-option--no-matches-message)[aria-selected=true][aria-disabled=true] {
  background-image: url("data:image/svg+xml,%3Csvg width='16' height='16' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M14.7803 4.28033C15.0732 3.98744 15.0732 3.51256 14.7803 3.21967C14.4874 2.92678 14.0126 2.92678 13.7197 3.21967L5.75 11.1893L2.28033 7.71967C1.98744 7.42678 1.51256 7.42678 1.21967 7.71967C0.926777 8.01256 0.926777 8.48744 1.21967 8.78033L5.21967 12.7803C5.51256 13.0732 5.98744 13.0732 6.28033 12.7803L14.7803 4.28033Z' fill='%238C909C'/%3E%3C/svg%3E");
}

.hds-form-super-select-multiple .ember-basic-dropdown .ember-power-select-option:not(.ember-power-select-option--no-matches-message) {
  position: relative;
}
.hds-form-super-select-multiple .ember-basic-dropdown .ember-power-select-option:not(.ember-power-select-option--no-matches-message)::before {
  position: absolute;
  top: 9px;
  left: 15px;
  display: block;
  width: var(--token-form-checkbox-size);
  height: var(--token-form-checkbox-size);
  background-position: center center;
  background-size: var(--token-form-checkbox-background-image-size) var(--token-form-checkbox-background-image-size);
  border-style: solid;
  border-width: var(--token-form-checkbox-border-width);
  border-radius: var(--token-form-checkbox-border-radius);
  cursor: pointer;
  content: "";
}
.hds-form-super-select-multiple .ember-basic-dropdown .ember-power-select-option:not(.ember-power-select-option--no-matches-message):not([aria-selected=true])::before {
  background-color: var(--token-form-control-base-surface-color-default);
  border-color: var(--token-form-control-base-border-color-default);
  box-shadow: var(--token-elevation-inset-box-shadow);
}
.hds-form-super-select-multiple .ember-basic-dropdown .ember-power-select-option:not(.ember-power-select-option--no-matches-message)[aria-current=true]::before, .hds-form-super-select-multiple .ember-basic-dropdown .ember-power-select-option:not(.ember-power-select-option--no-matches-message):hover:not([aria-selected=true])::before, .hds-form-super-select-multiple .ember-basic-dropdown .ember-power-select-option:not(.ember-power-select-option--no-matches-message).mock-hover:not([aria-selected=true])::before {
  background-color: var(--token-form-control-base-surface-color-hover);
  border-color: var(--token-form-control-base-border-color-hover);
}
.hds-form-super-select-multiple .ember-basic-dropdown .ember-power-select-option:not(.ember-power-select-option--no-matches-message)[aria-disabled=true]:not([aria-selected=true])::before {
  background-color: var(--token-form-control-disabled-surface-color);
  border-color: var(--token-form-control-disabled-border-color);
  box-shadow: none;
  cursor: not-allowed;
}
.hds-form-super-select-multiple .ember-basic-dropdown .ember-power-select-option:not(.ember-power-select-option--no-matches-message)[aria-selected=true]:not([aria-disabled=true])::before {
  background-color: var(--token-form-control-checked-surface-color-default);
  background-image: var(--token-form-checkbox-background-image-data-url);
  border-color: var(--token-form-control-checked-border-color-default);
}
.hds-form-super-select-multiple .ember-basic-dropdown .ember-power-select-option:not(.ember-power-select-option--no-matches-message)[aria-selected=true][aria-current=true]::before, .hds-form-super-select-multiple .ember-basic-dropdown .ember-power-select-option:not(.ember-power-select-option--no-matches-message)[aria-selected=true]:hover[aria-selected=true]::before, .hds-form-super-select-multiple .ember-basic-dropdown .ember-power-select-option:not(.ember-power-select-option--no-matches-message)[aria-selected=true].mock-hover[aria-selected=true]::before {
  background-color: var(--token-form-control-checked-border-color-default);
  border-color: var(--token-form-control-checked-border-color-hover);
}
.hds-form-super-select-multiple .ember-basic-dropdown .ember-power-select-option:not(.ember-power-select-option--no-matches-message)[aria-selected=true][aria-disabled=true]::before {
  background-color: var(--token-form-control-disabled-surface-color);
  background-image: var(--token-form-checkbox-background-image-data-url-disabled);
  border-color: var(--token-form-control-disabled-border-color);
  box-shadow: none;
  cursor: not-allowed;
}

.hds-form-super-select .ember-basic-dropdown .ember-power-select-option--no-matches-message {
  padding-left: 12px;
  cursor: inherit;
}
.hds-form-super-select .ember-basic-dropdown .ember-power-select-option--no-matches-message::after {
  display: none;
}

.hds-form-super-select__after-options {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  padding: 8px 12px;
  background-color: var(--token-color-surface-strong);
  border-top: var(--token-form-control-border-width) solid var(--token-form-control-base-border-color-default);
}

.hds-form-super-select__result-count {
  margin-left: auto;
}

.hds-form-super-select__no-options-selected {
  min-height: 36px;
  padding: 4px 15px 10px;
}

.hds-form-super-select--dropdown-content-auto-width .ember-power-select-dropdown.ember-basic-dropdown-content {
  width: auto;
}

/**
 * Copyright (c) HashiCorp, Inc.
 * SPDX-License-Identifier: MPL-2.0
 */
.hds-form-text-input {
  width: 100%;
  max-width: 100%;
  padding: var(--token-form-control-padding);
  color: var(--token-form-control-base-foreground-value-color);
  background-color: var(--token-form-control-base-surface-color-default);
  border: var(--token-form-control-border-width) solid var(--token-form-control-base-border-color-default);
  border-radius: var(--token-form-control-border-radius);
  box-shadow: var(--token-elevation-inset-box-shadow);
}
.hds-form-text-input ::placeholder {
  color: var(--token-form-control-base-foreground-placeholder-color);
}
.hds-form-text-input:hover, .hds-form-text-input.mock-hover {
  border-color: var(--token-form-control-base-border-color-hover);
}
.hds-form-text-input:focus, .hds-form-text-input.mock-focus {
  border-color: var(--token-color-focus-action-internal);
  outline: 3px solid var(--token-color-focus-action-external);
  outline-offset: 0;
}
.hds-form-text-input:read-only {
  color: var(--token-form-control-readonly-foreground-color);
  background-color: var(--token-form-control-readonly-surface-color);
  border-color: var(--token-form-control-readonly-border-color);
  box-shadow: none;
}
.hds-form-text-input:disabled {
  color: var(--token-form-control-disabled-foreground-color);
  background-color: var(--token-form-control-disabled-surface-color);
  border-color: var(--token-form-control-disabled-border-color);
  box-shadow: none;
  cursor: not-allowed;
}
.hds-form-text-input.hds-form-text-input--is-invalid {
  border-color: var(--token-form-control-invalid-border-color-default);
}
.hds-form-text-input.hds-form-text-input--is-invalid:hover, .hds-form-text-input.hds-form-text-input--is-invalid.mock-hover {
  border-color: var(--token-form-control-invalid-border-color-hover);
}
.hds-form-text-input.hds-form-text-input--is-invalid:focus, .hds-form-text-input.hds-form-text-input--is-invalid.mock-focus {
  border-color: var(--token-color-focus-critical-internal);
  outline-color: var(--token-color-focus-critical-external);
}

.hds-form-text-input__wrapper {
  position: relative;
  width: 100%;
}

.hds-form-text-input--has-visibility-toggle {
  padding-right: calc(var(--token-form-control-padding) + 24px);
}

.hds-form-text-input__visibility-toggle {
  position: absolute;
  top: calc(var(--token-form-control-padding) - var(--token-form-control-border-width));
  right: calc(var(--token-form-control-padding) - var(--token-form-control-border-width));
}

.hds-form-text-input[type=date], .hds-form-text-input[type=time], .hds-form-text-input[type=datetime-local], .hds-form-text-input[type=month], .hds-form-text-input[type=week] {
  width: initial;
}
.hds-form-text-input[type=date]:disabled::-webkit-calendar-picker-indicator, .hds-form-text-input[type=time]:disabled::-webkit-calendar-picker-indicator, .hds-form-text-input[type=datetime-local]:disabled::-webkit-calendar-picker-indicator, .hds-form-text-input[type=month]:disabled::-webkit-calendar-picker-indicator, .hds-form-text-input[type=week]:disabled::-webkit-calendar-picker-indicator {
  visibility: visible;
  opacity: 0.5;
}
.hds-form-text-input[type=date][readonly]::-webkit-calendar-picker-indicator, .hds-form-text-input[type=time][readonly]::-webkit-calendar-picker-indicator, .hds-form-text-input[type=datetime-local][readonly]::-webkit-calendar-picker-indicator, .hds-form-text-input[type=month][readonly]::-webkit-calendar-picker-indicator, .hds-form-text-input[type=week][readonly]::-webkit-calendar-picker-indicator {
  visibility: visible;
}
.hds-form-text-input[type=date]::-webkit-calendar-picker-indicator, .hds-form-text-input[type=datetime-local]::-webkit-calendar-picker-indicator, .hds-form-text-input[type=month]::-webkit-calendar-picker-indicator, .hds-form-text-input[type=week]::-webkit-calendar-picker-indicator {
  background-image: var(--token-form-text-input-background-image-data-url-date);
  background-position: center center;
  background-size: var(--token-form-text-input-background-image-size);
}
.hds-form-text-input[type=time]::-webkit-calendar-picker-indicator {
  background-image: var(--token-form-text-input-background-image-data-url-time);
  background-position: center center;
  background-size: var(--token-form-text-input-background-image-size);
}
.hds-form-text-input[type=search] {
  padding-left: calc(var(--token-form-control-padding) + 24px);
  background-image: var(--token-form-text-input-background-image-data-url-search);
  background-repeat: no-repeat;
  background-position: var(--token-form-text-input-background-image-position-x) 50%;
  background-size: var(--token-form-text-input-background-image-size);
}
.hds-form-text-input[type=search]::-webkit-search-cancel-button {
  width: var(--token-form-text-input-background-image-size);
  height: var(--token-form-text-input-background-image-size);
  background-image: var(--token-form-text-input-background-image-data-url-search-cancel);
  background-position: center center;
  background-size: var(--token-form-text-input-background-image-size);
  -webkit-appearance: none;
}
.hds-form-text-input[type=search].hds-form-text-input--is-loading {
  background-image: var(--token-form-text-input-background-image-data-url-search-loading);
}

/**
 * Copyright (c) HashiCorp, Inc.
 * SPDX-License-Identifier: MPL-2.0
 */
.hds-form-textarea {
  width: 100%;
  max-width: 100%;
  min-height: 36px;
  padding: var(--token-form-control-padding);
  color: var(--token-form-control-base-foreground-value-color);
  background-color: var(--token-form-control-base-surface-color-default);
  border: var(--token-form-control-border-width) solid var(--token-form-control-base-border-color-default);
  border-radius: var(--token-form-control-border-radius);
  box-shadow: var(--token-elevation-inset-box-shadow);
  resize: vertical;
}
.hds-form-textarea ::placeholder {
  color: var(--token-form-control-base-foreground-placeholder-color);
}
.hds-form-textarea:hover, .hds-form-textarea.mock-hover {
  border-color: var(--token-form-control-base-border-color-hover);
}
.hds-form-textarea:focus, .hds-form-textarea.mock-focus {
  border-color: var(--token-color-focus-action-internal);
  outline: 3px solid var(--token-color-focus-action-external);
  outline-offset: 0;
}
.hds-form-textarea:read-only {
  color: var(--token-form-control-readonly-foreground-color);
  background-color: var(--token-form-control-readonly-surface-color);
  border-color: var(--token-form-control-readonly-border-color);
  box-shadow: none;
}
.hds-form-textarea:disabled {
  color: var(--token-form-control-disabled-foreground-color);
  background-color: var(--token-form-control-disabled-surface-color);
  border-color: var(--token-form-control-disabled-border-color);
  box-shadow: none;
  cursor: not-allowed;
}
.hds-form-textarea.hds-form-textarea--is-invalid {
  border-color: var(--token-form-control-invalid-border-color-default);
}
.hds-form-textarea.hds-form-textarea--is-invalid:hover, .hds-form-textarea.hds-form-textarea--is-invalid.mock-hover {
  border-color: var(--token-form-control-invalid-border-color-hover);
}
.hds-form-textarea.hds-form-textarea--is-invalid:focus, .hds-form-textarea.hds-form-textarea--is-invalid.mock-focus {
  border-color: var(--token-color-focus-critical-internal);
  outline-color: var(--token-color-focus-critical-external);
}

/**
 * Copyright (c) HashiCorp, Inc.
 * SPDX-License-Identifier: MPL-2.0
 */
.hds-form-toggle {
  position: relative;
  display: inline-block;
  isolation: isolate;
}

.hds-form-toggle__control {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 1;
  display: block;
  height: 100%;
  margin: 0;
  padding: 0;
  color: transparent;
  background-color: transparent;
  border: none;
  outline: none;
  cursor: pointer;
  opacity: 0;
  appearance: none;
}
.hds-form-toggle__control:disabled {
  cursor: not-allowed;
}

.hds-form-toggle__facade {
  position: relative;
  display: block;
  width: var(--token-form-toggle-width);
  height: var(--token-form-toggle-height);
  background-image: var(--token-form-toggle-background-image-data-url);
  background-repeat: no-repeat;
  background-position: var(--token-form-toggle-background-image-position-x) 50%;
  background-size: var(--token-form-toggle-background-image-size) var(--token-form-toggle-background-image-size);
  border: var(--token-form-radio-border-width) solid var(--border-color);
  border-radius: calc(var(--token-form-toggle-height) / 2);
}
@media (prefers-reduced-motion: no-preference) {
  .hds-form-toggle__facade {
    transition-timing-function: var(--token-form-toggle-transition-timing-function);
    transition-duration: var(--token-form-toggle-transition-duration);
    transition-property: all;
  }
}
.hds-form-toggle__facade::after {
  position: absolute;
  top: calc(var(--token-form-radio-border-width) * -1);
  left: calc(var(--token-form-radio-border-width) * -1);
  width: var(--token-form-toggle-thumb-size);
  height: var(--token-form-toggle-thumb-size);
  background-color: var(--token-form-control-base-surface-color-default);
  border: var(--token-form-radio-border-width) solid var(--border-color);
  border-radius: 50%;
  transform: translate3d(0, 0, 0);
  content: "";
}
@media (prefers-reduced-motion: no-preference) {
  .hds-form-toggle__facade::after {
    transition-timing-function: var(--token-form-toggle-transition-timing-function);
    transition-duration: var(--token-form-toggle-transition-duration);
    transition-property: all;
  }
}
.hds-form-toggle__facade::before {
  position: absolute;
  top: -5px;
  right: -5px;
  bottom: -5px;
  left: -5px;
  margin: auto;
  border-width: 3px;
  border-radius: calc(var(--token-form-toggle-height) / 2 + 3px + 1px);
  content: "";
}
:not(:checked) + .hds-form-toggle__facade {
  --border-color: var(--token-form-control-base-border-color-default);
  background-color: var(--token-form-toggle-base-surface-color-default);
}
:checked + .hds-form-toggle__facade {
  --border-color: var(--token-form-control-checked-border-color-default);
  background-color: var(--token-form-control-checked-surface-color-default);
}
:checked + .hds-form-toggle__facade::after {
  transform: translate3d(calc(var(--token-form-toggle-width) - var(--token-form-toggle-thumb-size)), 0, 0);
}
:hover:not(:checked) + .hds-form-toggle__facade, .mock-hover:not(:checked) + .hds-form-toggle__facade {
  --border-color: var(--token-form-control-base-border-color-hover);
}
:hover:checked + .hds-form-toggle__facade, .mock-hover:checked + .hds-form-toggle__facade {
  --border-color: var(--token-form-control-checked-border-color-hover);
  background-color: var(--token-form-control-checked-border-color-default);
}
:focus + .hds-form-toggle__facade::before, .mock-focus + .hds-form-toggle__facade::before {
  border-color: var(--token-color-focus-action-external);
  border-style: solid;
}
:disabled:not(:checked) + .hds-form-toggle__facade, :disabled:checked + .hds-form-toggle__facade {
  --border-color: var(--token-form-control-disabled-border-color);
  background-color: var(--token-form-control-disabled-surface-color);
  background-image: var(--token-form-toggle-background-image-data-url-disabled);
}

/**
 * Copyright (c) HashiCorp, Inc.
 * SPDX-License-Identifier: MPL-2.0
 */
.hds-form-visibility-toggle {
  width: 24px;
  height: 24px;
  padding: 2px;
  color: var(--token-color-foreground-primary);
  background-color: transparent;
  border-color: transparent;
  cursor: pointer;
}

/**
 * Copyright (c) HashiCorp, Inc.
 * SPDX-License-Identifier: MPL-2.0
 */
/**
 * Copyright (c) HashiCorp, Inc.
 * SPDX-License-Identifier: MPL-2.0
 */
/**
 * Copyright (c) HashiCorp, Inc.
 * SPDX-License-Identifier: MPL-2.0
 */
/**
 * Copyright (c) HashiCorp, Inc.
 * SPDX-License-Identifier: MPL-2.0
 */
.hds-form-key-value-inputs {
  display: flex;
  flex-direction: column;
  margin: 0;
  padding: 0;
  border: none;
  row-gap: 24px;
}
@media screen and (min-width: 768px) {
  .hds-form-key-value-inputs {
    row-gap: 12px;
  }
}
.hds-form-key-value-inputs:focus {
  outline: none;
}

.hds-form-key-value-inputs__row {
  display: flex;
  flex-direction: column;
  row-gap: 8px;
  align-items: flex-start;
}
@media screen and (min-width: 768px) {
  .hds-form-key-value-inputs__row {
    display: grid;
    flex-grow: 1;
    grid-template-columns: var(--hds-key-value-inputs-columns, 1fr 1fr 2.25rem);
    align-items: flex-end;
    column-gap: 8px;
    row-gap: 0;
  }
  .hds-form-key-value-inputs__row.hds-form-key-value-inputs__row--first .hds-form-key-value-inputs__delete-row-button-container,
  .hds-form-key-value-inputs__row.hds-form-key-value-inputs__row--first .hds-form-key-value-inputs__generic-container {
    grid-row: 2;
    grid-column: var(--hds-key-value-inputs-column-index);
  }
  .hds-form-key-value-inputs__row:not(.hds-form-key-value-inputs__row--first) .hds-form-key-value-inputs__field-header {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    margin: -1px !important;
    padding: 0 !important;
    overflow: hidden !important;
    white-space: nowrap !important; /* 3 */
    border: 0 !important;
    clip: rect(1px, 1px, 1px, 1px) !important; /* 1 */
    clip-path: inset(50%) !important; /* 2 */
  }
}

.hds-form-key-value-inputs__footer {
  display: flex;
  flex-direction: column;
  row-gap: 12px;
  align-items: flex-start;
}

.hds-form-key-value-inputs__field {
  display: grid;
  grid-row: span 2;
  grid-template-rows: subgrid;
  width: 100%;
}
.hds-form-key-value-inputs__field .hds-form-key-value-inputs__field-header {
  align-self: flex-end;
  min-width: 0;
  margin-bottom: 8px;
}
@media screen and (min-width: 768px) {
  .hds-form-key-value-inputs__field .hds-form-key-value-inputs__field-header {
    margin-bottom: 12px;
  }
}
.hds-form-key-value-inputs__field .hds-form-select {
  width: 100%;
}
.hds-form-key-value-inputs__field .hds-form-key-value-inputs__field-control {
  display: flex;
  flex-direction: column;
  align-self: flex-start;
  justify-self: stretch;
  width: 100%;
}

.hds-form-key-value-inputs__helper-text:not(:first-child) {
  margin-top: 4px;
}
.hds-form-key-value-inputs__helper-text + .hds-form-key-value-inputs__helper-text {
  margin-top: 2px;
}

.hds-form-key-value-inputs__field-helper-text:not(:first-child) {
  margin-top: 4px;
}
.hds-form-key-value-inputs__field-helper-text + .hds-form-key-value-inputs__field-helper-text {
  margin-top: 2px;
}

.hds-form-key-value-inputs__field-error {
  margin-top: 8px;
}

.hds-form-key-value-inputs__generic-container,
.hds-form-key-value-inputs__delete-row-button-container {
  align-self: flex-start;
}

/**
 * Copyright (c) HashiCorp, Inc.
 * SPDX-License-Identifier: MPL-2.0
 */
.hds-icon {
  display: block;
}

.hds-icon--is-inline {
  display: inline-block;
}

@keyframes hds-icon-animation-rotation {
  to {
    transform: rotate(360deg);
  }
}
.hds-icon--animation-loading {
  animation: hds-icon-animation-rotation 9s linear infinite;
}

.hds-icon--animation-running {
  animation: hds-icon-animation-rotation 9s linear infinite;
}

@media (prefers-reduced-motion: no-preference) {
  .hds-icon--animation-loading {
    animation-duration: 0.7s;
  }
  .hds-icon--animation-running {
    animation-duration: 1s;
  }
}
.flight-sprite-container {
  position: absolute;
  width: 0;
  height: 0;
  visibility: hidden;
}

/**
 * Copyright (c) HashiCorp, Inc.
 * SPDX-License-Identifier: MPL-2.0
 */
.hds-icon-tile {
  position: relative;
  display: flex;
  border: 1px solid transparent;
  border-radius: var(--token-border-radius-medium);
}

.hds-icon-tile__icon,
.hds-icon-tile__logo {
  display: flex;
  margin: auto;
}

.hds-icon-tile__extra {
  position: absolute;
  right: -6px;
  bottom: -6px;
  display: flex;
  box-sizing: content-box;
  background-color: var(--token-color-surface-primary);
  border: 1px solid var(--token-color-border-primary);
}

.hds-icon-tile__extra-icon {
  display: flex;
  margin: auto;
  color: var(--token-color-foreground-strong);
}

.hds-icon-tile--size-small {
  width: 1.75rem;
  height: 1.75rem;
  border-radius: 5px;
}
.hds-icon-tile--size-small .hds-icon-tile__icon {
  width: 1rem;
  height: 1rem;
}
.hds-icon-tile--size-small .hds-icon-tile__logo {
  width: 1.125rem;
  height: 1.125rem;
}
.hds-icon-tile--size-small .hds-icon-tile__extra {
  width: 1.125rem;
  height: 1.125rem;
  border-radius: 4px;
}
.hds-icon-tile--size-small .hds-icon-tile__extra-icon {
  width: 0.75rem;
  height: 0.75rem;
}

.hds-icon-tile--size-medium {
  width: 2.5rem;
  height: 2.5rem;
  border-radius: 6px;
}
.hds-icon-tile--size-medium .hds-icon-tile__icon {
  width: 1.5rem;
  height: 1.5rem;
}
.hds-icon-tile--size-medium .hds-icon-tile__logo {
  width: 1.75rem;
  height: 1.75rem;
}
.hds-icon-tile--size-medium .hds-icon-tile__extra {
  width: 1.25rem;
  height: 1.25rem;
  border-radius: 5px;
}
.hds-icon-tile--size-medium .hds-icon-tile__extra-icon {
  width: 0.75rem;
  height: 0.75rem;
}

.hds-icon-tile--size-large {
  width: 3rem;
  height: 3rem;
  border-radius: 6px;
}
.hds-icon-tile--size-large .hds-icon-tile__icon {
  width: 1.5rem;
  height: 1.5rem;
}
.hds-icon-tile--size-large .hds-icon-tile__logo {
  width: 2rem;
  height: 2rem;
}
.hds-icon-tile--size-large .hds-icon-tile__extra {
  width: 1.5rem;
  height: 1.5rem;
  border-radius: 5px;
}
.hds-icon-tile--size-large .hds-icon-tile__extra-icon {
  width: 1rem;
  height: 1rem;
}

.hds-icon-tile--logo {
  background-color: var(--token-color-surface-primary);
  border-color: var(--token-color-border-primary);
}

.hds-icon-tile--icon.hds-icon-tile--color-neutral {
  color: var(--token-color-foreground-faint);
  background-color: var(--token-color-surface-strong);
}
.hds-icon-tile--icon.hds-icon-tile--color-boundary {
  color: var(--token-color-boundary-foreground);
  background-color: var(--token-color-boundary-surface);
}
.hds-icon-tile--icon.hds-icon-tile--color-consul {
  color: var(--token-color-consul-foreground);
  background-color: var(--token-color-consul-surface);
}
.hds-icon-tile--icon.hds-icon-tile--color-hcp {
  color: var(--token-color-palette-hcp-brand);
  background-color: var(--token-color-surface-strong);
}
.hds-icon-tile--icon.hds-icon-tile--color-nomad {
  color: var(--token-color-nomad-foreground);
  background-color: var(--token-color-nomad-surface);
}
.hds-icon-tile--icon.hds-icon-tile--color-packer {
  color: var(--token-color-packer-foreground);
  background-color: var(--token-color-packer-surface);
}
.hds-icon-tile--icon.hds-icon-tile--color-terraform {
  color: var(--token-color-terraform-foreground);
  background-color: var(--token-color-terraform-surface);
}
.hds-icon-tile--icon.hds-icon-tile--color-vagrant {
  color: var(--token-color-vagrant-foreground);
  background-color: var(--token-color-vagrant-surface);
}
.hds-icon-tile--icon.hds-icon-tile--color-vault {
  color: var(--token-color-vault-foreground);
  background-color: var(--token-color-vault-surface);
}
.hds-icon-tile--icon.hds-icon-tile--color-vault-secrets {
  color: var(--token-color-vault-secrets-foreground);
  background-color: var(--token-color-vault-secrets-surface);
}
.hds-icon-tile--icon.hds-icon-tile--color-vault-radar {
  color: var(--token-color-vault-radar-foreground);
  background-color: var(--token-color-vault-radar-surface);
}
.hds-icon-tile--icon.hds-icon-tile--color-waypoint {
  color: var(--token-color-waypoint-foreground);
  background-color: var(--token-color-waypoint-surface);
}

/**
 * Copyright (c) HashiCorp, Inc.
 * SPDX-License-Identifier: MPL-2.0
 */
/**
 * Copyright (c) HashiCorp, Inc.
 * SPDX-License-Identifier: MPL-2.0
 */
.hds-layout-flex {
  display: flex;
  gap: var(--hds-layout-flex-row-gap) var(--hds-layout-flex-column-gap);
}

.hds-layout-flex--is-inline {
  display: inline-flex;
}

.hds-layout-flex--direction-row {
  flex-direction: row;
}

.hds-layout-flex--direction-column {
  flex-direction: column;
}

.hds-layout-flex--has-wrapping {
  flex-wrap: wrap;
}

.hds-layout-flex--justify-content-start {
  justify-content: start;
}

.hds-layout-flex--justify-content-center {
  justify-content: center;
}

.hds-layout-flex--justify-content-end {
  justify-content: end;
}

.hds-layout-flex--justify-content-space-between {
  justify-content: space-between;
}

.hds-layout-flex--justify-content-space-around {
  justify-content: space-around;
}

.hds-layout-flex--justify-content-space-evenly {
  justify-content: space-evenly;
}

.hds-layout-flex--justify-content-stretch {
  justify-content: stretch;
}

.hds-layout-flex--align-items-start {
  align-items: start;
}

.hds-layout-flex--align-items-center {
  align-items: center;
}

.hds-layout-flex--align-items-end {
  align-items: end;
}

.hds-layout-flex--align-items-stretch {
  align-items: stretch;
}

.hds-layout-flex--row-gap-0 {
  --hds-layout-flex-row-gap: 0px;
}

.hds-layout-flex--row-gap-4 {
  --hds-layout-flex-row-gap: 4px;
}

.hds-layout-flex--row-gap-8 {
  --hds-layout-flex-row-gap: 8px;
}

.hds-layout-flex--row-gap-12 {
  --hds-layout-flex-row-gap: 12px;
}

.hds-layout-flex--row-gap-16 {
  --hds-layout-flex-row-gap: 16px;
}

.hds-layout-flex--row-gap-24 {
  --hds-layout-flex-row-gap: 24px;
}

.hds-layout-flex--row-gap-32 {
  --hds-layout-flex-row-gap: 32px;
}

.hds-layout-flex--row-gap-48 {
  --hds-layout-flex-row-gap: 48px;
}

.hds-layout-flex--column-gap-0 {
  --hds-layout-flex-column-gap: 0px;
}

.hds-layout-flex--column-gap-4 {
  --hds-layout-flex-column-gap: 4px;
}

.hds-layout-flex--column-gap-8 {
  --hds-layout-flex-column-gap: 8px;
}

.hds-layout-flex--column-gap-12 {
  --hds-layout-flex-column-gap: 12px;
}

.hds-layout-flex--column-gap-16 {
  --hds-layout-flex-column-gap: 16px;
}

.hds-layout-flex--column-gap-24 {
  --hds-layout-flex-column-gap: 24px;
}

.hds-layout-flex--column-gap-32 {
  --hds-layout-flex-column-gap: 32px;
}

.hds-layout-flex--column-gap-48 {
  --hds-layout-flex-column-gap: 48px;
}

.hds-layout-flex-item--basis-0 {
  flex-basis: 0;
}

.hds-layout-flex-item--grow-0 {
  flex-grow: 0;
}

.hds-layout-flex-item--grow-1 {
  flex-grow: 1;
}

.hds-layout-flex-item--shrink-0 {
  flex-shrink: 0;
}

.hds-layout-flex-item--shrink-1 {
  flex-shrink: 1;
}

.hds-layout-flex-item--enable-collapse-below-content-size {
  min-width: 0;
}

/**
 * Copyright (c) HashiCorp, Inc.
 * SPDX-License-Identifier: MPL-2.0
 */
.hds-layout-grid {
  --hds-layout-grid-column-min-width: 0px;
  display: grid;
  grid-template-columns: repeat(var(--hds-layout-grid-column-fill-type, auto-fit), minmax(calc(var(--hds-layout-grid-column-min-width) - var(--hds-layout-grid-column-gap)), 1fr));
  gap: var(--hds-layout-grid-row-gap) var(--hds-layout-grid-column-gap);
}

.hds-layout-grid--align-items-start {
  align-items: start;
}

.hds-layout-grid--align-items-center {
  align-items: center;
}

.hds-layout-grid--align-items-end {
  align-items: end;
}

.hds-layout-grid--align-items-stretch {
  align-items: stretch;
}

.hds-layout-grid--row-gap-0 {
  --hds-layout-grid-row-gap: 0px;
}

.hds-layout-grid--row-gap-4 {
  --hds-layout-grid-row-gap: 4px;
}

.hds-layout-grid--row-gap-8 {
  --hds-layout-grid-row-gap: 8px;
}

.hds-layout-grid--row-gap-12 {
  --hds-layout-grid-row-gap: 12px;
}

.hds-layout-grid--row-gap-16 {
  --hds-layout-grid-row-gap: 16px;
}

.hds-layout-grid--row-gap-24 {
  --hds-layout-grid-row-gap: 24px;
}

.hds-layout-grid--row-gap-32 {
  --hds-layout-grid-row-gap: 32px;
}

.hds-layout-grid--row-gap-48 {
  --hds-layout-grid-row-gap: 48px;
}

.hds-layout-grid--column-gap-0 {
  --hds-layout-grid-column-gap: 0px;
}

.hds-layout-grid--column-gap-4 {
  --hds-layout-grid-column-gap: 4px;
}

.hds-layout-grid--column-gap-8 {
  --hds-layout-grid-column-gap: 8px;
}

.hds-layout-grid--column-gap-12 {
  --hds-layout-grid-column-gap: 12px;
}

.hds-layout-grid--column-gap-16 {
  --hds-layout-grid-column-gap: 16px;
}

.hds-layout-grid--column-gap-24 {
  --hds-layout-grid-column-gap: 24px;
}

.hds-layout-grid--column-gap-32 {
  --hds-layout-grid-column-gap: 32px;
}

.hds-layout-grid--column-gap-48 {
  --hds-layout-grid-column-gap: 48px;
}

.hds-layout-grid-item {
  --hds-layout-grid-row-span: 1;
  --hds-layout-grid-column-span: 1;
  grid-row-start: span var(--hds-layout-grid-row-span);
  grid-column-start: span var(--hds-layout-grid-column-span);
}

/**
 * Copyright (c) HashiCorp, Inc.
 * SPDX-License-Identifier: MPL-2.0
 */
/**
 * Copyright (c) HashiCorp, Inc.
 * SPDX-License-Identifier: MPL-2.0
 */
.hds-link-inline {
  border-radius: 2px;
}
.hds-link-inline:focus, .hds-link-inline.mock-focus, .hds-link-inline:focus-visible {
  text-decoration: none;
  outline: 2px solid var(--token-color-focus-action-internal);
  outline-offset: 1px;
}

.hds-link-inline__icon {
  display: inline-block;
  width: 1em;
  height: 1em;
  vertical-align: text-bottom;
}
.hds-link-inline--icon-leading > .hds-link-inline__icon {
  margin-right: 0.25em;
}
.hds-link-inline--icon-trailing > .hds-link-inline__icon {
  margin-left: 0.25em;
}

.hds-link-inline--color-primary {
  color: var(--token-color-foreground-action);
}
.hds-link-inline--color-primary:hover, .hds-link-inline--color-primary.mock-hover {
  color: var(--token-color-foreground-action-hover);
}
.hds-link-inline--color-primary:active, .hds-link-inline--color-primary.mock-active {
  color: var(--token-color-foreground-action-active);
}

.hds-link-inline--color-secondary {
  color: var(--token-color-foreground-strong);
}
.hds-link-inline--color-secondary:hover, .hds-link-inline--color-secondary.mock-hover {
  color: var(--token-color-foreground-primary);
}
.hds-link-inline--color-secondary:active, .hds-link-inline--color-secondary.mock-active {
  color: var(--token-color-foreground-faint);
}

/**
 * Copyright (c) HashiCorp, Inc.
 * SPDX-License-Identifier: MPL-2.0
 */
.hds-link-standalone {
  display: flex;
  gap: 0.375rem;
  align-items: center;
  justify-content: center;
  width: fit-content;
  padding-top: 4px;
  padding-bottom: 4px;
  font-weight: var(--token-typography-font-weight-regular);
  font-family: var(--token-typography-font-stack-text);
  background-color: transparent;
  border: 1px solid transparent;
  text-decoration-color: transparent;
}

.hds-link-standalone__icon {
  display: block;
}

.hds-link-standalone__text {
  display: block;
  flex: 1 0 0;
  text-decoration: underline;
  text-decoration-color: transparent;
  transition: text-decoration-color 0.25s ease-in;
}

.hds-link-standalone--size-small .hds-link-standalone__icon {
  width: 0.75rem;
  height: 0.75rem;
}
.hds-link-standalone--size-small .hds-link-standalone__text {
  font-size: 0.8125rem;
  line-height: 1.231;
}

.hds-link-standalone--size-medium .hds-link-standalone__icon {
  width: 1rem;
  height: 1rem;
}
.hds-link-standalone--size-medium .hds-link-standalone__text {
  font-size: 0.875rem;
  line-height: 1.143;
}

.hds-link-standalone--size-large .hds-link-standalone__icon {
  width: 1.5rem;
  height: 1.5rem;
}
.hds-link-standalone--size-large .hds-link-standalone__text {
  font-size: 1rem;
  line-height: 1.5;
}

.hds-link-standalone--color-primary {
  color: var(--token-color-foreground-action);
}
.hds-link-standalone--color-primary:hover, .hds-link-standalone--color-primary.mock-hover {
  color: var(--token-color-foreground-action-hover);
}
.hds-link-standalone--color-primary:hover .hds-link-standalone__text, .hds-link-standalone--color-primary.mock-hover .hds-link-standalone__text {
  text-decoration-color: #4e81e8;
}
.hds-link-standalone--color-primary:active, .hds-link-standalone--color-primary.mock-active {
  color: var(--token-color-foreground-action-active);
}
.hds-link-standalone--color-primary:active .hds-link-standalone__text, .hds-link-standalone--color-primary.mock-active .hds-link-standalone__text {
  text-decoration-color: #396ed6;
}
.hds-link-standalone--color-primary:active::before, .hds-link-standalone--color-primary.mock-active::before {
  background-color: var(--token-color-surface-action);
}

.hds-link-standalone--color-secondary {
  color: var(--token-color-foreground-strong);
}
.hds-link-standalone--color-secondary:hover .hds-link-standalone__text, .hds-link-standalone--color-secondary.mock-hover .hds-link-standalone__text {
  text-decoration-color: #4d4d4f;
}
.hds-link-standalone--color-secondary:active, .hds-link-standalone--color-secondary.mock-active {
  color: var(--token-color-foreground-primary);
}
.hds-link-standalone--color-secondary:active .hds-link-standalone__text, .hds-link-standalone--color-secondary.mock-active .hds-link-standalone__text {
  text-decoration-color: #6e7075;
}
.hds-link-standalone--color-secondary:active::before, .hds-link-standalone--color-secondary.mock-active::before {
  background-color: var(--token-color-surface-interactive-active);
}

.hds-link-standalone {
  position: relative;
  outline-style: solid;
  outline-color: transparent;
  isolation: isolate;
}
.hds-link-standalone::before {
  position: absolute;
  top: 0;
  right: -5px;
  bottom: 0;
  left: -5px;
  z-index: -1;
  border-radius: var(--token-border-radius-small);
  content: "";
}
.hds-link-standalone:focus::before, .hds-link-standalone.mock-focus::before {
  box-shadow: var(--token-focus-ring-action-box-shadow);
}
.hds-link-standalone:focus:not(:focus-visible)::before {
  box-shadow: none;
}
.hds-link-standalone:focus-visible::before {
  box-shadow: var(--token-focus-ring-action-box-shadow);
}
.hds-link-standalone:focus:active::before, .hds-link-standalone.mock-focus.mock-active::before {
  box-shadow: none;
}
.hds-link-standalone.hds-link-standalone--icon-position-leading::before {
  right: -7px;
}
.hds-link-standalone.hds-link-standalone--icon-position-trailing::before {
  left: -7px;
}

/**
 * Copyright (c) HashiCorp, Inc.
 * SPDX-License-Identifier: MPL-2.0
 */
.hds-menu-primitive {
  position: relative;
  width: fit-content;
}

/**
 * Copyright (c) HashiCorp, Inc.
 * SPDX-License-Identifier: MPL-2.0
 */
.hds-modal {
  position: fixed;
  z-index: 50;
  height: fit-content;
  max-height: 95vh;
  inset: 0;
  margin: auto;
  border-radius: var(--token-border-radius-large);
  box-shadow: var(--token-surface-overlay-box-shadow);
}
.hds-modal:not([open]) {
  display: none;
}
.hds-modal::backdrop {
  display: none;
}

.hds-modal--size-small {
  width: min(400px, 95vw);
}

.hds-modal--size-medium {
  width: min(600px, 95vw);
}

.hds-modal--size-large {
  width: min(800px, 95vw);
}

.hds-modal--color-warning .hds-dialog-primitive__wrapper-header {
  background: var(--token-color-surface-warning);
  border-bottom: 1px solid var(--token-color-border-warning);
}
.hds-modal--color-warning .hds-dialog-primitive__header,
.hds-modal--color-warning .hds-dialog-primitive__tagline {
  color: var(--token-color-foreground-warning-on-surface);
}

.hds-modal--color-critical .hds-dialog-primitive__wrapper-header {
  background: var(--token-color-surface-critical);
  border-bottom: 1px solid var(--token-color-border-critical);
}
.hds-modal--color-critical .hds-dialog-primitive__header,
.hds-modal--color-critical .hds-dialog-primitive__tagline {
  color: var(--token-color-foreground-critical-on-surface);
}

/**
 * Copyright (c) HashiCorp, Inc.
 * SPDX-License-Identifier: MPL-2.0
 */
.hds-page-header {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 16px;
  container-type: inline-size;
}

.hds-page-header__body {
  display: flex;
  flex-direction: column;
  gap: 8px 16px;
}
.hds-page-header__body .hds-icon-tile {
  flex-shrink: 0;
}
@container (min-width: 400px) {
  .hds-page-header__body {
    flex-direction: row;
  }
}

.hds-page-header__main {
  display: flex;
  flex-direction: column;
  flex-grow: 1;
  gap: 16px;
  align-items: start;
  justify-content: start;
}
@container (min-width: 768px) {
  .hds-page-header__main {
    flex-direction: row;
    justify-content: space-between;
    min-width: 0;
  }
}

.hds-page-header__content {
  display: flex;
  flex-direction: column;
  flex-grow: 1;
  min-width: 0;
  max-width: 100%;
}

.hds-page-header__title-wrapper {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  gap: 8px 16px;
  align-items: center;
}

.hds-page-header__title {
  max-width: 100%;
  overflow-wrap: break-word;
}

.hds-page-header__badges-wrapper {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.hds-page-header__metadata {
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.hds-page-header__metadata > *:first-child {
  margin-top: 8px;
}

.hds-page-header__subtitle,
.hds-page-header__description {
  overflow-wrap: break-word;
}

.hds-page-header__actions {
  display: flex;
  flex-direction: row;
  flex-shrink: 0;
  flex-wrap: wrap;
  gap: 16px;
  align-items: center;
}

/**
 * Copyright (c) HashiCorp, Inc.
 * SPDX-License-Identifier: MPL-2.0
 */
/**
 * Copyright (c) HashiCorp, Inc.
 * SPDX-License-Identifier: MPL-2.0
 */
.hds-pagination {
  display: grid;
  grid-template-areas: "info nav selector";
  grid-template-rows: auto;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  margin: 0 auto;
}
@media screen and (max-width: 1087.98px) {
  .hds-pagination {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
  }
}
.hds-pagination .hds-pagination-info {
  grid-area: info;
  justify-self: flex-start;
  margin-right: var(--token-pagination-child-spacing-horizontal);
}
@media screen and (max-width: 1087.98px) {
  .hds-pagination .hds-pagination-info {
    margin-top: var(--token-pagination-child-spacing-vertical);
    margin-left: var(--token-pagination-child-spacing-horizontal);
  }
}
.hds-pagination .hds-pagination-nav {
  grid-area: nav;
}
@media screen and (max-width: 1087.98px) {
  .hds-pagination .hds-pagination-nav {
    justify-content: center;
    order: -1;
    width: 100%;
  }
}
.hds-pagination .hds-pagination-size-selector {
  grid-area: selector;
  justify-self: flex-end;
  margin-left: var(--token-pagination-child-spacing-horizontal);
}
@media screen and (max-width: 1087.98px) {
  .hds-pagination .hds-pagination-size-selector {
    margin-top: var(--token-pagination-child-spacing-vertical);
    margin-right: var(--token-pagination-child-spacing-horizontal);
  }
}

.hds-pagination-info {
  white-space: nowrap;
}

.hds-pagination-nav {
  display: flex;
}

.hds-pagination-nav__page-list {
  display: flex;
  margin: 0;
  padding: 0;
}

.hds-pagination-nav__page-item {
  list-style-type: none;
}

.hds-pagination-nav__control {
  display: flex;
  align-items: center;
  height: var(--token-pagination-nav-control-height);
  padding: 0 calc(var(--token-pagination-nav-control-padding-horizontal) - 1px);
  color: var(--token-color-foreground-primary);
  text-decoration: none;
  background-color: transparent;
  border: 1px solid transparent;
  position: relative;
  outline-style: solid;
  outline-color: transparent;
  isolation: isolate;
}
.hds-pagination-nav__control::before {
  position: absolute;
  top: var(--token-pagination-nav-control-focus-inset);
  right: var(--token-pagination-nav-control-focus-inset);
  bottom: var(--token-pagination-nav-control-focus-inset);
  left: var(--token-pagination-nav-control-focus-inset);
  z-index: -1;
  border-radius: 5px;
  content: "";
}
.hds-pagination-nav__control:focus::before, .hds-pagination-nav__control.mock-focus::before {
  box-shadow: var(--token-focus-ring-action-box-shadow);
}
.hds-pagination-nav__control:focus:not(:focus-visible)::before {
  box-shadow: none;
}
.hds-pagination-nav__control:focus-visible::before {
  box-shadow: var(--token-focus-ring-action-box-shadow);
}
.hds-pagination-nav__control:focus:active::before, .hds-pagination-nav__control.mock-focus.mock-active::before {
  box-shadow: none;
}
.hds-pagination-nav__control:hover, .hds-pagination-nav__control.mock-hover {
  color: var(--token-color-foreground-action-hover);
}
.hds-pagination-nav__control:active, .hds-pagination-nav__control.mock-active {
  color: var(--token-color-foreground-action-active);
}

.hds-pagination-nav__arrow {
  gap: var(--token-pagination-nav-control-icon-spacing);
}
.hds-pagination-nav__arrow:disabled, .hds-pagination-nav__arrow.mock-disabled {
  color: var(--token-color-foreground-disabled);
  cursor: not-allowed;
}

.hds-pagination-nav__arrow--direction-prev {
  flex-direction: row;
  justify-content: flex-start;
}

.hds-pagination-nav__arrow--direction-next {
  flex-direction: row-reverse;
  justify-content: flex-end;
}

.hds-pagination-nav__number--is-selected {
  position: relative;
  color: var(--token-color-foreground-action);
}
.hds-pagination-nav__number--is-selected:hover {
  color: var(--token-color-foreground-action-hover);
}
.hds-pagination-nav__number--is-selected:active {
  color: var(--token-color-foreground-action-active);
}
.hds-pagination-nav__number--is-selected::after {
  position: absolute;
  right: calc(var(--token-pagination-nav-indicator-spacing) - 1px);
  bottom: -1px;
  left: calc(var(--token-pagination-nav-indicator-spacing) - 1px);
  height: var(--token-pagination-nav-indicator-height);
  margin: 0 auto;
  background-color: currentColor;
  border-radius: 2px;
  content: "";
}

.hds-pagination-nav__ellipsis {
  display: flex;
  align-items: center;
  height: var(--token-pagination-nav-control-height);
  padding: 0 var(--token-pagination-nav-control-padding-horizontal);
  color: var(--token-color-foreground-faint);
}

.hds-pagination-size-selector {
  display: flex;
  align-items: center;
}
.hds-pagination-size-selector > label {
  white-space: nowrap;
}
.hds-pagination-size-selector > select {
  height: 28px;
  margin-left: 12px;
  padding: 0 24px 0 8px;
  font-size: var(--token-typography-body-100-font-size);
  font-family: var(--token-typography-body-100-font-family);
  line-height: var(--token-typography-body-100-line-height);
  background-position: center right 5px;
}

/**
 * Copyright (c) HashiCorp, Inc.
 * SPDX-License-Identifier: MPL-2.0
 */
.hds-reveal {
  width: fit-content;
}

.hds-reveal__toggle-button {
  min-height: 1.75rem;
  padding: 0.313rem 0.313rem 0.313rem 0.188rem;
}
@media (prefers-reduced-motion: no-preference) {
  .hds-reveal__toggle-button .hds-icon-chevron-down {
    transition: transform 0.3s;
  }
}

.hds-reveal__toggle-button--is-open .hds-icon-chevron-down {
  transform: rotate(-180deg);
}

.hds-reveal__content {
  margin-top: 4px;
}

/**
 * Copyright (c) HashiCorp, Inc.
 * SPDX-License-Identifier: MPL-2.0
 */
.hds-rich-tooltip {
  display: contents;
}

:where(.hds-rich-tooltip__toggle) {
  width: fit-content;
  height: fit-content;
  margin: 0;
  padding: 0;
  color: inherit;
  font: inherit;
  text-align: inherit;
  background-color: inherit;
  border: none;
  cursor: pointer;
}

.hds-rich-tooltip__toggle {
  --text-color: var(--token-color-foreground-strong);
  --icon-color: var(--token-color-foreground-strong);
  position: relative;
  outline-style: solid;
  outline-color: transparent;
  isolation: isolate;
}
.hds-rich-tooltip__toggle:hover, .hds-rich-tooltip__toggle.mock-hover {
  --text-color: var(--token-color-foreground-primary);
  --icon-color: var(--token-color-foreground-primary);
}
.hds-rich-tooltip__toggle:active, .hds-rich-tooltip__toggle.mock-active {
  --text-color: var(--token-color-foreground-faint);
  --icon-color: var(--token-color-foreground-faint);
}
.hds-rich-tooltip__toggle::before {
  position: absolute;
  top: -2px;
  right: -2px;
  bottom: -2px;
  left: -2px;
  z-index: -1;
  border-radius: 5px;
  content: "";
}
.hds-rich-tooltip__toggle:focus::before, .hds-rich-tooltip__toggle.mock-focus::before {
  box-shadow: var(--token-focus-ring-action-box-shadow);
}
.hds-rich-tooltip__toggle:focus:not(:focus-visible)::before {
  box-shadow: none;
}
.hds-rich-tooltip__toggle:focus-visible::before {
  box-shadow: var(--token-focus-ring-action-box-shadow);
}
.hds-rich-tooltip__toggle:focus:active::before, .hds-rich-tooltip__toggle.mock-focus.mock-active::before {
  box-shadow: none;
}

.hds-rich-tooltip__toggle-text {
  color: var(--text-color);
  text-decoration: underline;
  text-decoration-style: dotted;
  text-underline-offset: 2px;
}

.hds-rich-tooltip__toggle-icon {
  flex: none;
  width: 1em;
  height: 1em;
  color: var(--icon-color);
}
.hds-rich-tooltip__toggle-icon:first-child:not(:only-child) {
  margin-right: 0.25rem;
}
.hds-rich-tooltip__toggle-icon:last-child:not(:only-child) {
  margin-left: 0.25rem;
}

:where(.hds-rich-tooltip__toggle--is-inline) {
  display: inline-flex;
  align-items: center;
  vertical-align: bottom;
}
:where(.hds-rich-tooltip__toggle--is-inline):has(.hds-rich-tooltip__toggle-icon:only-child) {
  vertical-align: middle;
}

:where(.hds-rich-tooltip__toggle--is-block) {
  display: flex;
  align-items: center;
}

.hds-rich-tooltip__toggle--size-small {
  font-weight: var(--token-typography-font-weight-regular);
  font-size: var(--token-typography-body-100-font-size);
  font-family: var(--token-typography-body-100-font-family);
  line-height: var(--token-typography-body-100-line-height);
}

.hds-rich-tooltip__toggle--size-medium {
  font-weight: var(--token-typography-font-weight-regular);
  font-size: var(--token-typography-body-200-font-size);
  font-family: var(--token-typography-body-200-font-family);
  line-height: var(--token-typography-body-200-line-height);
}

.hds-rich-tooltip__toggle--size-large {
  font-weight: var(--token-typography-font-weight-regular);
  font-size: var(--token-typography-body-300-font-size);
  font-family: var(--token-typography-body-300-font-family);
  line-height: var(--token-typography-body-300-line-height);
}

.hds-rich-tooltip__bubble {
  position: relative;
  width: fit-content;
  max-width: var(--token-tooltip-max-width);
  height: fit-content;
  max-height: none;
  padding: 16px;
  background: var(--token-color-surface-primary);
  border-radius: var(--token-border-radius-small);
  box-shadow: var(--token-surface-higher-box-shadow);
  opacity: 0;
  transition: opacity 0.3s;
  will-change: opacity;
}
:where(.hds-rich-tooltip__bubble[popover]) {
  width: fit-content;
  height: fit-content;
  margin: 0;
  padding: 0;
  overflow: visible;
  color: inherit;
  background: none;
  border: none;
  inset: 0;
}

.hds-rich-tooltip__bubble-arrow {
  position: absolute;
  z-index: 1;
  display: block;
  width: 20px;
  height: 20px;
  background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" fill="none"><path fill="%23fff" d="M9.056 11.607.398 20h19.091l-8.37-8.393S10.69 11 10.089 11c-.602 0-1.032.608-1.032.608Z"/><path fill="%23656A76" fill-opacity=".2" fill-rule="evenodd" d="M9.359 11.308 1.423 19H0l8.674-8.417.342.362-.342-.362v-.001l.002-.001.003-.003.007-.007a1.622 1.622 0 0 1 .103-.087c.066-.053.16-.122.277-.191.224-.134.571-.293.977-.293a2.158 2.158 0 0 1 1.374.492 1.658 1.658 0 0 1 .107.098l.004.004L20 19h-1.518l-7.665-7.707-.004-.003-.002-.002a1.069 1.069 0 0 0-.18-.131 1.167 1.167 0 0 0-.588-.157.958.958 0 0 0-.47.153 1.527 1.527 0 0 0-.208.15l-.006.005Z" clip-rule="evenodd"/></svg>') no-repeat 0 0/20px 20px;
  pointer-events: none;
}
.hds-rich-tooltip__bubble-arrow[data-hds-anchored-arrow-placement^=top] {
  bottom: -20px;
  transform: rotate(180deg);
}
.hds-rich-tooltip__bubble-arrow[data-hds-anchored-arrow-placement^=right] {
  left: -20px;
  transform: rotate(-90deg);
}
.hds-rich-tooltip__bubble-arrow[data-hds-anchored-arrow-placement^=bottom] {
  top: -20px;
  transform: rotate(0deg);
}
.hds-rich-tooltip__bubble-arrow[data-hds-anchored-arrow-placement^=left] {
  right: -20px;
  transform: rotate(90deg);
}

.hds-rich-tooltip__bubble-inner-content {
  all: initial;
  display: contents;
  box-sizing: border-box;
}
.hds-rich-tooltip__bubble-inner-content *,
.hds-rich-tooltip__bubble-inner-content *::before,
.hds-rich-tooltip__bubble-inner-content *::after {
  box-sizing: inherit;
}

/* clean-css ignore:start */
.hds-rich-tooltip__bubble[popover]:popover-open {
  opacity: 1;
}
@starting-style {
  .hds-rich-tooltip__bubble[popover]:popover-open {
    opacity: 0;
  }
}
@starting-style {
  .hds-rich-tooltip__bubble[popover].\:popover-open {
    opacity: 0;
  }
}

/* clean-css ignore:end */
/**
 * Copyright (c) HashiCorp, Inc.
 * SPDX-License-Identifier: MPL-2.0
 */
.hds-segmented-group {
  display: inline-flex;
}
.hds-segmented-group > .hds-button:first-child:not(:only-child),
.hds-segmented-group > .hds-dropdown:first-child:not(:only-child),
.hds-segmented-group > .hds-form-select:first-child:not(:only-child),
.hds-segmented-group > .hds-form-text-input:first-child:not(:only-child) {
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
}
.hds-segmented-group > .hds-button:first-child:not(:only-child)::before,
.hds-segmented-group > .hds-button:first-child:not(:only-child) .hds-dropdown-toggle-button,
.hds-segmented-group > .hds-button:first-child:not(:only-child) .hds-dropdown-toggle-button::before,
.hds-segmented-group > .hds-dropdown:first-child:not(:only-child)::before,
.hds-segmented-group > .hds-dropdown:first-child:not(:only-child) .hds-dropdown-toggle-button,
.hds-segmented-group > .hds-dropdown:first-child:not(:only-child) .hds-dropdown-toggle-button::before,
.hds-segmented-group > .hds-form-select:first-child:not(:only-child)::before,
.hds-segmented-group > .hds-form-select:first-child:not(:only-child) .hds-dropdown-toggle-button,
.hds-segmented-group > .hds-form-select:first-child:not(:only-child) .hds-dropdown-toggle-button::before,
.hds-segmented-group > .hds-form-text-input:first-child:not(:only-child)::before,
.hds-segmented-group > .hds-form-text-input:first-child:not(:only-child) .hds-dropdown-toggle-button,
.hds-segmented-group > .hds-form-text-input:first-child:not(:only-child) .hds-dropdown-toggle-button::before {
  border-top-right-radius: inherit;
  border-bottom-right-radius: inherit;
}
.hds-segmented-group > .hds-button:last-child:not(:only-child),
.hds-segmented-group > .hds-dropdown:last-child:not(:only-child),
.hds-segmented-group > .hds-form-select:last-child:not(:only-child),
.hds-segmented-group > .hds-form-text-input:last-child:not(:only-child) {
  margin-left: -1px;
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
}
.hds-segmented-group > .hds-button:last-child:not(:only-child)::before,
.hds-segmented-group > .hds-button:last-child:not(:only-child) .hds-dropdown-toggle-button,
.hds-segmented-group > .hds-button:last-child:not(:only-child) .hds-dropdown-toggle-button::before,
.hds-segmented-group > .hds-dropdown:last-child:not(:only-child)::before,
.hds-segmented-group > .hds-dropdown:last-child:not(:only-child) .hds-dropdown-toggle-button,
.hds-segmented-group > .hds-dropdown:last-child:not(:only-child) .hds-dropdown-toggle-button::before,
.hds-segmented-group > .hds-form-select:last-child:not(:only-child)::before,
.hds-segmented-group > .hds-form-select:last-child:not(:only-child) .hds-dropdown-toggle-button,
.hds-segmented-group > .hds-form-select:last-child:not(:only-child) .hds-dropdown-toggle-button::before,
.hds-segmented-group > .hds-form-text-input:last-child:not(:only-child)::before,
.hds-segmented-group > .hds-form-text-input:last-child:not(:only-child) .hds-dropdown-toggle-button,
.hds-segmented-group > .hds-form-text-input:last-child:not(:only-child) .hds-dropdown-toggle-button::before {
  border-top-left-radius: inherit;
  border-bottom-left-radius: inherit;
}
.hds-segmented-group > .hds-button:not(:first-child, :last-child, :only-child),
.hds-segmented-group > .hds-dropdown:not(:first-child, :last-child, :only-child),
.hds-segmented-group > .hds-form-select:not(:first-child, :last-child, :only-child),
.hds-segmented-group > .hds-form-text-input:not(:first-child, :last-child, :only-child) {
  margin-left: -1px;
  border-radius: 0;
}
.hds-segmented-group > .hds-button:not(:first-child, :last-child, :only-child)::before,
.hds-segmented-group > .hds-button:not(:first-child, :last-child, :only-child) .hds-dropdown-toggle-button,
.hds-segmented-group > .hds-button:not(:first-child, :last-child, :only-child) .hds-dropdown-toggle-button::before,
.hds-segmented-group > .hds-dropdown:not(:first-child, :last-child, :only-child)::before,
.hds-segmented-group > .hds-dropdown:not(:first-child, :last-child, :only-child) .hds-dropdown-toggle-button,
.hds-segmented-group > .hds-dropdown:not(:first-child, :last-child, :only-child) .hds-dropdown-toggle-button::before,
.hds-segmented-group > .hds-form-select:not(:first-child, :last-child, :only-child)::before,
.hds-segmented-group > .hds-form-select:not(:first-child, :last-child, :only-child) .hds-dropdown-toggle-button,
.hds-segmented-group > .hds-form-select:not(:first-child, :last-child, :only-child) .hds-dropdown-toggle-button::before,
.hds-segmented-group > .hds-form-text-input:not(:first-child, :last-child, :only-child)::before,
.hds-segmented-group > .hds-form-text-input:not(:first-child, :last-child, :only-child) .hds-dropdown-toggle-button,
.hds-segmented-group > .hds-form-text-input:not(:first-child, :last-child, :only-child) .hds-dropdown-toggle-button::before {
  border-radius: inherit;
}
.hds-segmented-group > .hds-button:focus, .hds-segmented-group > .hds-button.mock-focus,
.hds-segmented-group > .hds-button .hds-dropdown-toggle-button:focus,
.hds-segmented-group > .hds-dropdown:focus,
.hds-segmented-group > .hds-dropdown.mock-focus,
.hds-segmented-group > .hds-dropdown .hds-dropdown-toggle-button:focus,
.hds-segmented-group > .hds-form-select:focus,
.hds-segmented-group > .hds-form-select.mock-focus,
.hds-segmented-group > .hds-form-select .hds-dropdown-toggle-button:focus,
.hds-segmented-group > .hds-form-text-input:focus,
.hds-segmented-group > .hds-form-text-input.mock-focus,
.hds-segmented-group > .hds-form-text-input .hds-dropdown-toggle-button:focus {
  z-index: 1;
}

/**
 * Copyright (c) HashiCorp, Inc.
 * SPDX-License-Identifier: MPL-2.0
 */
.hds-separator {
  border: none;
  border-top: 1px solid var(--token-color-border-primary);
}

.hds-separator--spacing-24 {
  margin: 24px 0;
}

.hds-separator--spacing-0 {
  margin: 0;
}

/**
 * Copyright (c) HashiCorp, Inc.
 * SPDX-License-Identifier: MPL-2.0
 */
/**
 * Copyright (c) HashiCorp, Inc.
 * SPDX-License-Identifier: MPL-2.0
 */
/**
 * Copyright (c) HashiCorp, Inc.
 * SPDX-License-Identifier: MPL-2.0
 */
/**
 * Copyright (c) HashiCorp, Inc.
 * SPDX-License-Identifier: MPL-2.0
 */
:root {
  --hds-app-desktop-breakpoint: 1088px;
  --hds-app-sidenav-width-minimized: 48px;
  --hds-app-sidenav-width-expanded: 280px;
  --hds-app-sidenav-width-fixed: var(--hds-app-sidenav-width-expanded);
  --hds-app-sidenav-animation-duration: 200ms;
  --hds-app-sidenav-animation-delay: var(--hds-app-sidenav-animation-duration);
  --hds-app-sidenav-animation-easing: cubic-bezier(0.65, 0, 0.35, 1);
  --hds-app-sidenav-toggle-button-width: 24px;
  --hds-app-sidenav-color-focus-action-internal: #bcc7fd;
  --hds-app-sidenav-color-focus-action-external: #0d69f2;
  --hds-app-sidenav-focus-ring-action-box-shadow: inset 0 0 0 1px #bcc7fd, 0 0 0 3px #0d69f2;
}

@media (prefers-reduced-motion) {
  :root {
    --hds-app-sidenav-animation-duration: 0;
  }
}
/**
 * Copyright (c) HashiCorp, Inc.
 * SPDX-License-Identifier: MPL-2.0
 */
.hds-side-nav {
  position: relative;
  width: var(--hds-app-sidenav-width-fixed);
  height: 100%;
  min-height: 100%;
  isolation: isolate;
}
.hds-side-nav.hds-side-nav--is-headerless {
  --hds-app-sidenav-width-minimized: 16px;
}
.hds-side-nav.hds-side-nav--is-responsive {
  transition: width var(--hds-app-sidenav-animation-duration) var(--hds-app-sidenav-animation-easing);
}
.hds-side-nav.hds-side-nav--is-mobile {
  width: var(--hds-app-sidenav-width-minimized);
}
.hds-side-nav.hds-side-nav--is-desktop.hds-side-nav--is-not-minimized {
  width: var(--hds-app-sidenav-width-expanded);
}
.hds-side-nav.hds-side-nav--is-desktop.hds-side-nav--is-minimized {
  width: var(--hds-app-sidenav-width-minimized);
}

.hds-side-nav__overlay {
  position: fixed;
  z-index: -1;
  inset: 0;
  background-color: var(--token-color-palette-neutral-700);
  opacity: 0.2;
  transition: opacity var(--hds-app-sidenav-animation-duration) var(--hds-app-sidenav-animation-easing) var(--hds-app-sidenav-animation-delay);
}
.hds-side-nav--is-minimized .hds-side-nav__overlay {
  opacity: 0;
  pointer-events: none;
}
.hds-side-nav--is-desktop .hds-side-nav__overlay {
  display: none;
}

.hds-side-nav__wrapper {
  display: flex;
  flex-direction: column;
  height: 100%;
  color: var(--token-side-nav-color-foreground-primary);
  background: var(--token-side-nav-color-surface-primary);
  border-right: var(--token-side-nav-wrapper-border-width) solid var(--token-side-nav-wrapper-border-color);
}
.hds-side-nav--is-responsive .hds-side-nav__wrapper {
  transition: width var(--hds-app-sidenav-animation-duration) var(--hds-app-sidenav-animation-easing);
}
.hds-side-nav--is-minimized .hds-side-nav__wrapper {
  width: var(--hds-app-sidenav-width-minimized);
}
.hds-side-nav--is-not-minimized .hds-side-nav__wrapper {
  width: var(--hds-app-sidenav-width-expanded);
}

.hds-side-nav__wrapper-header {
  padding-top: var(--token-side-nav-wrapper-padding-vertical);
  padding-right: var(--token-side-nav-wrapper-padding-horizontal);
  padding-bottom: 8px;
  padding-left: var(--token-side-nav-wrapper-padding-horizontal);
  transition: padding var(--hds-app-sidenav-animation-duration) var(--hds-app-sidenav-animation-easing);
}
.hds-side-nav--is-minimized .hds-side-nav__wrapper-header {
  padding-top: var(--token-side-nav-wrapper-padding-vertical-minimized);
  padding-right: var(--token-side-nav-wrapper-padding-horizontal-minimized);
  padding-left: var(--token-side-nav-wrapper-padding-horizontal-minimized);
}
.hds-side-nav__wrapper-header:empty {
  padding: 0;
}

.hds-side-nav__wrapper-body {
  flex: 1;
  padding: var(--token-side-nav-wrapper-padding-vertical) var(--token-side-nav-wrapper-padding-horizontal);
  overflow-x: hidden;
  overflow-y: auto;
}

.hds-side-nav__wrapper-footer {
  padding: var(--token-side-nav-wrapper-padding-vertical) var(--token-side-nav-wrapper-padding-horizontal);
}
.hds-side-nav__wrapper-footer:empty {
  min-height: var(--token-side-nav-wrapper-padding-horizontal);
  padding: 0;
}

.hds-side-nav--is-minimized .hds-side-nav-hide-when-minimized {
  visibility: hidden !important;
  opacity: 0;
  pointer-events: none;
}
.hds-side-nav--is-not-minimized .hds-side-nav-hide-when-minimized {
  visibility: visible;
  opacity: 1;
  transition: opacity var(--hds-app-sidenav-animation-duration) var(--hds-app-sidenav-animation-easing) var(--hds-app-sidenav-animation-delay);
}
.hds-side-nav--is-animating .hds-side-nav-hide-when-minimized {
  pointer-events: none;
}

/**
 * Copyright (c) HashiCorp, Inc.
 * SPDX-License-Identifier: MPL-2.0
 */
/**
 * Copyright (c) HashiCorp, Inc.
 * SPDX-License-Identifier: MPL-2.0
 */
.hds-side-nav-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.hds-side-nav-header__logo-container {
  display: flex;
  flex: none;
  align-items: center;
  justify-content: center;
  width: var(--token-side-nav-header-home-link-logo-size);
  height: var(--token-side-nav-header-home-link-logo-size);
  transition: width var(--hds-app-sidenav-animation-duration) var(--hds-app-sidenav-animation-easing), height var(--hds-app-sidenav-animation-duration) var(--hds-app-sidenav-animation-easing);
}
.hds-side-nav--is-minimized .hds-side-nav-header__logo-container {
  width: var(--token-side-nav-header-home-link-logo-size-minimized);
  height: var(--token-side-nav-header-home-link-logo-size-minimized);
}

.hds-side-nav__home-link {
  --token-focus-ring-action-box-shadow: inset 0 0 0 1px #bcc7fd, 0 0 0 3px #0d69f2;
  border: 1px solid transparent;
  cursor: pointer;
  color: var(--token-side-nav-color-foreground-strong);
  background-color: transparent;
  border-radius: var(--token-side-nav-body-list-item-border-radius);
  display: block;
  width: 100%;
  height: 100%;
  padding: calc(var(--token-side-nav-header-home-link-padding) - 1px);
}
.hds-side-nav__home-link:hover, .hds-side-nav__home-link.mock-hover {
  color: var(--token-side-nav-color-foreground-strong);
  background-color: var(--token-side-nav-color-surface-interactive-hover);
}
.hds-side-nav__home-link:focus, .hds-side-nav__home-link.mock-focus {
  position: relative;
  outline-style: solid;
  outline-color: transparent;
  isolation: isolate;
  color: var(--token-color-foreground-high-contrast);
  background-color: var(--token-color-palette-neutral-700);
}
.hds-side-nav__home-link:focus::before, .hds-side-nav__home-link.mock-focus::before {
  position: absolute;
  top: -1px;
  right: -1px;
  bottom: -1px;
  left: -1px;
  z-index: -1;
  border-radius: 5px;
  content: "";
}
.hds-side-nav__home-link:focus:focus::before, .hds-side-nav__home-link:focus.mock-focus::before, .hds-side-nav__home-link.mock-focus:focus::before, .hds-side-nav__home-link.mock-focus.mock-focus::before {
  box-shadow: var(--token-focus-ring-action-box-shadow);
}
.hds-side-nav__home-link:focus:focus:not(:focus-visible)::before, .hds-side-nav__home-link.mock-focus:focus:not(:focus-visible)::before {
  box-shadow: none;
}
.hds-side-nav__home-link:focus:focus-visible::before, .hds-side-nav__home-link.mock-focus:focus-visible::before {
  box-shadow: var(--token-focus-ring-action-box-shadow);
}
.hds-side-nav__home-link:focus:focus:active::before, .hds-side-nav__home-link:focus.mock-focus.mock-active::before, .hds-side-nav__home-link.mock-focus:focus:active::before, .hds-side-nav__home-link.mock-focus.mock-focus.mock-active::before {
  box-shadow: none;
}
.hds-side-nav__home-link:focus::before, .hds-side-nav__home-link.mock-focus::before {
  color: var(--token-color-foreground-high-contrast);
  border: none;
}
.hds-side-nav__home-link:focus:focus:not(:focus-visible)::before {
  box-shadow: inset 0 0 0 1px #bcc7fd, 0 0 0 3px #0d69f2;
}
.hds-side-nav__home-link:active, .hds-side-nav__home-link.mock-active {
  color: var(--token-side-nav-color-foreground-strong);
  background-color: var(--token-side-nav-color-surface-interactive-active);
}
.hds-side-nav__home-link:disabled, .hds-side-nav__home-link[disabled], .hds-side-nav__home-link.mock-disabled, .hds-side-nav__home-link:disabled:focus, .hds-side-nav__home-link[disabled]:focus, .hds-side-nav__home-link.mock-disabled:focus, .hds-side-nav__home-link:disabled:hover, .hds-side-nav__home-link[disabled]:hover, .hds-side-nav__home-link.mock-disabled:hover {
  color: var(--token-color-foreground-disabled);
  background-color: var(--token-color-palette-neutral-600);
  border-color: var(--token-color-palette-neutral-500);
}

.hds-side-nav-header__actions-container {
  display: flex;
  gap: var(--token-side-nav-header-actions-spacing);
}

.hds-side-nav__dropdown .hds-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *),
.hds-side-nav__dropdown .hds-dropdown-toggle-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *),
.hds-side-nav__dropdown .hds-dropdown-toggle-icon:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *),
.hds-side-nav .hds-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *),
.hds-side-nav .hds-dropdown-toggle-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *),
.hds-side-nav .hds-dropdown-toggle-icon:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *),
.hds-side-nav-header .hds-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *),
.hds-side-nav-header .hds-dropdown-toggle-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *),
.hds-side-nav-header .hds-dropdown-toggle-icon:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *) {
  --token-focus-ring-action-box-shadow: inset 0 0 0 1px #bcc7fd, 0 0 0 3px #0d69f2;
  border: 1px solid transparent;
  cursor: pointer;
  border-color: var(--token-color-palette-neutral-500);
  color: var(--token-color-foreground-high-contrast);
  background-color: var(--token-color-palette-neutral-700);
  border-radius: var(--token-border-radius-small);
}
.hds-side-nav__dropdown .hds-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):hover, .hds-side-nav__dropdown .hds-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-hover,
.hds-side-nav__dropdown .hds-dropdown-toggle-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):hover,
.hds-side-nav__dropdown .hds-dropdown-toggle-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-hover,
.hds-side-nav__dropdown .hds-dropdown-toggle-icon:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):hover,
.hds-side-nav__dropdown .hds-dropdown-toggle-icon:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-hover,
.hds-side-nav .hds-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):hover,
.hds-side-nav .hds-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-hover,
.hds-side-nav .hds-dropdown-toggle-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):hover,
.hds-side-nav .hds-dropdown-toggle-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-hover,
.hds-side-nav .hds-dropdown-toggle-icon:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):hover,
.hds-side-nav .hds-dropdown-toggle-icon:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-hover,
.hds-side-nav-header .hds-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):hover,
.hds-side-nav-header .hds-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-hover,
.hds-side-nav-header .hds-dropdown-toggle-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):hover,
.hds-side-nav-header .hds-dropdown-toggle-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-hover,
.hds-side-nav-header .hds-dropdown-toggle-icon:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):hover,
.hds-side-nav-header .hds-dropdown-toggle-icon:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-hover {
  border-color: var(--token-color-palette-neutral-500);
  color: var(--token-color-foreground-high-contrast);
  background-color: var(--token-color-palette-neutral-600);
}
.hds-side-nav__dropdown .hds-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):focus, .hds-side-nav__dropdown .hds-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-focus,
.hds-side-nav__dropdown .hds-dropdown-toggle-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):focus,
.hds-side-nav__dropdown .hds-dropdown-toggle-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-focus,
.hds-side-nav__dropdown .hds-dropdown-toggle-icon:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):focus,
.hds-side-nav__dropdown .hds-dropdown-toggle-icon:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-focus,
.hds-side-nav .hds-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):focus,
.hds-side-nav .hds-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-focus,
.hds-side-nav .hds-dropdown-toggle-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):focus,
.hds-side-nav .hds-dropdown-toggle-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-focus,
.hds-side-nav .hds-dropdown-toggle-icon:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):focus,
.hds-side-nav .hds-dropdown-toggle-icon:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-focus,
.hds-side-nav-header .hds-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):focus,
.hds-side-nav-header .hds-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-focus,
.hds-side-nav-header .hds-dropdown-toggle-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):focus,
.hds-side-nav-header .hds-dropdown-toggle-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-focus,
.hds-side-nav-header .hds-dropdown-toggle-icon:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):focus,
.hds-side-nav-header .hds-dropdown-toggle-icon:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-focus {
  position: relative;
  outline-style: solid;
  outline-color: transparent;
  isolation: isolate;
  color: var(--token-color-foreground-high-contrast);
  background-color: var(--token-color-palette-neutral-700);
  border-color: #bcc7fd;
}
.hds-side-nav__dropdown .hds-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):focus::before, .hds-side-nav__dropdown .hds-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-focus::before,
.hds-side-nav__dropdown .hds-dropdown-toggle-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):focus::before,
.hds-side-nav__dropdown .hds-dropdown-toggle-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-focus::before,
.hds-side-nav__dropdown .hds-dropdown-toggle-icon:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):focus::before,
.hds-side-nav__dropdown .hds-dropdown-toggle-icon:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-focus::before,
.hds-side-nav .hds-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):focus::before,
.hds-side-nav .hds-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-focus::before,
.hds-side-nav .hds-dropdown-toggle-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):focus::before,
.hds-side-nav .hds-dropdown-toggle-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-focus::before,
.hds-side-nav .hds-dropdown-toggle-icon:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):focus::before,
.hds-side-nav .hds-dropdown-toggle-icon:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-focus::before,
.hds-side-nav-header .hds-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):focus::before,
.hds-side-nav-header .hds-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-focus::before,
.hds-side-nav-header .hds-dropdown-toggle-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):focus::before,
.hds-side-nav-header .hds-dropdown-toggle-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-focus::before,
.hds-side-nav-header .hds-dropdown-toggle-icon:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):focus::before,
.hds-side-nav-header .hds-dropdown-toggle-icon:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-focus::before {
  position: absolute;
  top: -1px;
  right: -1px;
  bottom: -1px;
  left: -1px;
  z-index: -1;
  border-radius: 5px;
  content: "";
}
.hds-side-nav__dropdown .hds-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):focus:focus::before, .hds-side-nav__dropdown .hds-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):focus.mock-focus::before, .hds-side-nav__dropdown .hds-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-focus:focus::before, .hds-side-nav__dropdown .hds-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-focus.mock-focus::before,
.hds-side-nav__dropdown .hds-dropdown-toggle-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):focus:focus::before,
.hds-side-nav__dropdown .hds-dropdown-toggle-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):focus.mock-focus::before,
.hds-side-nav__dropdown .hds-dropdown-toggle-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-focus:focus::before,
.hds-side-nav__dropdown .hds-dropdown-toggle-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-focus.mock-focus::before,
.hds-side-nav__dropdown .hds-dropdown-toggle-icon:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):focus:focus::before,
.hds-side-nav__dropdown .hds-dropdown-toggle-icon:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):focus.mock-focus::before,
.hds-side-nav__dropdown .hds-dropdown-toggle-icon:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-focus:focus::before,
.hds-side-nav__dropdown .hds-dropdown-toggle-icon:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-focus.mock-focus::before,
.hds-side-nav .hds-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):focus:focus::before,
.hds-side-nav .hds-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):focus.mock-focus::before,
.hds-side-nav .hds-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-focus:focus::before,
.hds-side-nav .hds-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-focus.mock-focus::before,
.hds-side-nav .hds-dropdown-toggle-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):focus:focus::before,
.hds-side-nav .hds-dropdown-toggle-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):focus.mock-focus::before,
.hds-side-nav .hds-dropdown-toggle-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-focus:focus::before,
.hds-side-nav .hds-dropdown-toggle-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-focus.mock-focus::before,
.hds-side-nav .hds-dropdown-toggle-icon:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):focus:focus::before,
.hds-side-nav .hds-dropdown-toggle-icon:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):focus.mock-focus::before,
.hds-side-nav .hds-dropdown-toggle-icon:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-focus:focus::before,
.hds-side-nav .hds-dropdown-toggle-icon:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-focus.mock-focus::before,
.hds-side-nav-header .hds-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):focus:focus::before,
.hds-side-nav-header .hds-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):focus.mock-focus::before,
.hds-side-nav-header .hds-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-focus:focus::before,
.hds-side-nav-header .hds-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-focus.mock-focus::before,
.hds-side-nav-header .hds-dropdown-toggle-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):focus:focus::before,
.hds-side-nav-header .hds-dropdown-toggle-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):focus.mock-focus::before,
.hds-side-nav-header .hds-dropdown-toggle-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-focus:focus::before,
.hds-side-nav-header .hds-dropdown-toggle-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-focus.mock-focus::before,
.hds-side-nav-header .hds-dropdown-toggle-icon:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):focus:focus::before,
.hds-side-nav-header .hds-dropdown-toggle-icon:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):focus.mock-focus::before,
.hds-side-nav-header .hds-dropdown-toggle-icon:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-focus:focus::before,
.hds-side-nav-header .hds-dropdown-toggle-icon:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-focus.mock-focus::before {
  box-shadow: var(--token-focus-ring-action-box-shadow);
}
.hds-side-nav__dropdown .hds-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):focus:focus:not(:focus-visible)::before, .hds-side-nav__dropdown .hds-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-focus:focus:not(:focus-visible)::before,
.hds-side-nav__dropdown .hds-dropdown-toggle-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):focus:focus:not(:focus-visible)::before,
.hds-side-nav__dropdown .hds-dropdown-toggle-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-focus:focus:not(:focus-visible)::before,
.hds-side-nav__dropdown .hds-dropdown-toggle-icon:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):focus:focus:not(:focus-visible)::before,
.hds-side-nav__dropdown .hds-dropdown-toggle-icon:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-focus:focus:not(:focus-visible)::before,
.hds-side-nav .hds-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):focus:focus:not(:focus-visible)::before,
.hds-side-nav .hds-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-focus:focus:not(:focus-visible)::before,
.hds-side-nav .hds-dropdown-toggle-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):focus:focus:not(:focus-visible)::before,
.hds-side-nav .hds-dropdown-toggle-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-focus:focus:not(:focus-visible)::before,
.hds-side-nav .hds-dropdown-toggle-icon:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):focus:focus:not(:focus-visible)::before,
.hds-side-nav .hds-dropdown-toggle-icon:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-focus:focus:not(:focus-visible)::before,
.hds-side-nav-header .hds-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):focus:focus:not(:focus-visible)::before,
.hds-side-nav-header .hds-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-focus:focus:not(:focus-visible)::before,
.hds-side-nav-header .hds-dropdown-toggle-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):focus:focus:not(:focus-visible)::before,
.hds-side-nav-header .hds-dropdown-toggle-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-focus:focus:not(:focus-visible)::before,
.hds-side-nav-header .hds-dropdown-toggle-icon:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):focus:focus:not(:focus-visible)::before,
.hds-side-nav-header .hds-dropdown-toggle-icon:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-focus:focus:not(:focus-visible)::before {
  box-shadow: none;
}
.hds-side-nav__dropdown .hds-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):focus:focus-visible::before, .hds-side-nav__dropdown .hds-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-focus:focus-visible::before,
.hds-side-nav__dropdown .hds-dropdown-toggle-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):focus:focus-visible::before,
.hds-side-nav__dropdown .hds-dropdown-toggle-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-focus:focus-visible::before,
.hds-side-nav__dropdown .hds-dropdown-toggle-icon:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):focus:focus-visible::before,
.hds-side-nav__dropdown .hds-dropdown-toggle-icon:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-focus:focus-visible::before,
.hds-side-nav .hds-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):focus:focus-visible::before,
.hds-side-nav .hds-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-focus:focus-visible::before,
.hds-side-nav .hds-dropdown-toggle-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):focus:focus-visible::before,
.hds-side-nav .hds-dropdown-toggle-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-focus:focus-visible::before,
.hds-side-nav .hds-dropdown-toggle-icon:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):focus:focus-visible::before,
.hds-side-nav .hds-dropdown-toggle-icon:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-focus:focus-visible::before,
.hds-side-nav-header .hds-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):focus:focus-visible::before,
.hds-side-nav-header .hds-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-focus:focus-visible::before,
.hds-side-nav-header .hds-dropdown-toggle-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):focus:focus-visible::before,
.hds-side-nav-header .hds-dropdown-toggle-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-focus:focus-visible::before,
.hds-side-nav-header .hds-dropdown-toggle-icon:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):focus:focus-visible::before,
.hds-side-nav-header .hds-dropdown-toggle-icon:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-focus:focus-visible::before {
  box-shadow: var(--token-focus-ring-action-box-shadow);
}
.hds-side-nav__dropdown .hds-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):focus:focus:active::before, .hds-side-nav__dropdown .hds-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):focus.mock-focus.mock-active::before, .hds-side-nav__dropdown .hds-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-focus:focus:active::before, .hds-side-nav__dropdown .hds-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-focus.mock-focus.mock-active::before,
.hds-side-nav__dropdown .hds-dropdown-toggle-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):focus:focus:active::before,
.hds-side-nav__dropdown .hds-dropdown-toggle-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):focus.mock-focus.mock-active::before,
.hds-side-nav__dropdown .hds-dropdown-toggle-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-focus:focus:active::before,
.hds-side-nav__dropdown .hds-dropdown-toggle-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-focus.mock-focus.mock-active::before,
.hds-side-nav__dropdown .hds-dropdown-toggle-icon:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):focus:focus:active::before,
.hds-side-nav__dropdown .hds-dropdown-toggle-icon:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):focus.mock-focus.mock-active::before,
.hds-side-nav__dropdown .hds-dropdown-toggle-icon:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-focus:focus:active::before,
.hds-side-nav__dropdown .hds-dropdown-toggle-icon:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-focus.mock-focus.mock-active::before,
.hds-side-nav .hds-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):focus:focus:active::before,
.hds-side-nav .hds-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):focus.mock-focus.mock-active::before,
.hds-side-nav .hds-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-focus:focus:active::before,
.hds-side-nav .hds-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-focus.mock-focus.mock-active::before,
.hds-side-nav .hds-dropdown-toggle-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):focus:focus:active::before,
.hds-side-nav .hds-dropdown-toggle-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):focus.mock-focus.mock-active::before,
.hds-side-nav .hds-dropdown-toggle-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-focus:focus:active::before,
.hds-side-nav .hds-dropdown-toggle-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-focus.mock-focus.mock-active::before,
.hds-side-nav .hds-dropdown-toggle-icon:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):focus:focus:active::before,
.hds-side-nav .hds-dropdown-toggle-icon:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):focus.mock-focus.mock-active::before,
.hds-side-nav .hds-dropdown-toggle-icon:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-focus:focus:active::before,
.hds-side-nav .hds-dropdown-toggle-icon:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-focus.mock-focus.mock-active::before,
.hds-side-nav-header .hds-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):focus:focus:active::before,
.hds-side-nav-header .hds-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):focus.mock-focus.mock-active::before,
.hds-side-nav-header .hds-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-focus:focus:active::before,
.hds-side-nav-header .hds-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-focus.mock-focus.mock-active::before,
.hds-side-nav-header .hds-dropdown-toggle-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):focus:focus:active::before,
.hds-side-nav-header .hds-dropdown-toggle-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):focus.mock-focus.mock-active::before,
.hds-side-nav-header .hds-dropdown-toggle-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-focus:focus:active::before,
.hds-side-nav-header .hds-dropdown-toggle-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-focus.mock-focus.mock-active::before,
.hds-side-nav-header .hds-dropdown-toggle-icon:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):focus:focus:active::before,
.hds-side-nav-header .hds-dropdown-toggle-icon:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):focus.mock-focus.mock-active::before,
.hds-side-nav-header .hds-dropdown-toggle-icon:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-focus:focus:active::before,
.hds-side-nav-header .hds-dropdown-toggle-icon:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-focus.mock-focus.mock-active::before {
  box-shadow: none;
}
.hds-side-nav__dropdown .hds-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):focus::before, .hds-side-nav__dropdown .hds-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-focus::before,
.hds-side-nav__dropdown .hds-dropdown-toggle-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):focus::before,
.hds-side-nav__dropdown .hds-dropdown-toggle-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-focus::before,
.hds-side-nav__dropdown .hds-dropdown-toggle-icon:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):focus::before,
.hds-side-nav__dropdown .hds-dropdown-toggle-icon:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-focus::before,
.hds-side-nav .hds-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):focus::before,
.hds-side-nav .hds-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-focus::before,
.hds-side-nav .hds-dropdown-toggle-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):focus::before,
.hds-side-nav .hds-dropdown-toggle-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-focus::before,
.hds-side-nav .hds-dropdown-toggle-icon:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):focus::before,
.hds-side-nav .hds-dropdown-toggle-icon:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-focus::before,
.hds-side-nav-header .hds-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):focus::before,
.hds-side-nav-header .hds-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-focus::before,
.hds-side-nav-header .hds-dropdown-toggle-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):focus::before,
.hds-side-nav-header .hds-dropdown-toggle-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-focus::before,
.hds-side-nav-header .hds-dropdown-toggle-icon:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):focus::before,
.hds-side-nav-header .hds-dropdown-toggle-icon:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-focus::before {
  color: var(--token-color-foreground-high-contrast);
  border: none;
}
.hds-side-nav__dropdown .hds-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):focus:focus:not(:focus-visible)::before,
.hds-side-nav__dropdown .hds-dropdown-toggle-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):focus:focus:not(:focus-visible)::before,
.hds-side-nav__dropdown .hds-dropdown-toggle-icon:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):focus:focus:not(:focus-visible)::before,
.hds-side-nav .hds-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):focus:focus:not(:focus-visible)::before,
.hds-side-nav .hds-dropdown-toggle-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):focus:focus:not(:focus-visible)::before,
.hds-side-nav .hds-dropdown-toggle-icon:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):focus:focus:not(:focus-visible)::before,
.hds-side-nav-header .hds-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):focus:focus:not(:focus-visible)::before,
.hds-side-nav-header .hds-dropdown-toggle-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):focus:focus:not(:focus-visible)::before,
.hds-side-nav-header .hds-dropdown-toggle-icon:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):focus:focus:not(:focus-visible)::before {
  box-shadow: inset 0 0 0 1px #bcc7fd, 0 0 0 3px #0d69f2;
}
.hds-side-nav__dropdown .hds-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):active, .hds-side-nav__dropdown .hds-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-active,
.hds-side-nav__dropdown .hds-dropdown-toggle-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):active,
.hds-side-nav__dropdown .hds-dropdown-toggle-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-active,
.hds-side-nav__dropdown .hds-dropdown-toggle-icon:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):active,
.hds-side-nav__dropdown .hds-dropdown-toggle-icon:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-active,
.hds-side-nav .hds-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):active,
.hds-side-nav .hds-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-active,
.hds-side-nav .hds-dropdown-toggle-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):active,
.hds-side-nav .hds-dropdown-toggle-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-active,
.hds-side-nav .hds-dropdown-toggle-icon:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):active,
.hds-side-nav .hds-dropdown-toggle-icon:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-active,
.hds-side-nav-header .hds-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):active,
.hds-side-nav-header .hds-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-active,
.hds-side-nav-header .hds-dropdown-toggle-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):active,
.hds-side-nav-header .hds-dropdown-toggle-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-active,
.hds-side-nav-header .hds-dropdown-toggle-icon:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):active,
.hds-side-nav-header .hds-dropdown-toggle-icon:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-active {
  color: var(--token-color-foreground-high-contrast);
  background-color: var(--token-color-palette-neutral-500);
  border-color: var(--token-color-palette-neutral-400);
}
.hds-side-nav__dropdown .hds-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):disabled, .hds-side-nav__dropdown .hds-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *)[disabled], .hds-side-nav__dropdown .hds-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-disabled, .hds-side-nav__dropdown .hds-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):disabled:focus, .hds-side-nav__dropdown .hds-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *)[disabled]:focus, .hds-side-nav__dropdown .hds-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-disabled:focus, .hds-side-nav__dropdown .hds-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):disabled:hover, .hds-side-nav__dropdown .hds-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *)[disabled]:hover, .hds-side-nav__dropdown .hds-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-disabled:hover,
.hds-side-nav__dropdown .hds-dropdown-toggle-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):disabled,
.hds-side-nav__dropdown .hds-dropdown-toggle-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *)[disabled],
.hds-side-nav__dropdown .hds-dropdown-toggle-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-disabled,
.hds-side-nav__dropdown .hds-dropdown-toggle-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):disabled:focus,
.hds-side-nav__dropdown .hds-dropdown-toggle-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *)[disabled]:focus,
.hds-side-nav__dropdown .hds-dropdown-toggle-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-disabled:focus,
.hds-side-nav__dropdown .hds-dropdown-toggle-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):disabled:hover,
.hds-side-nav__dropdown .hds-dropdown-toggle-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *)[disabled]:hover,
.hds-side-nav__dropdown .hds-dropdown-toggle-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-disabled:hover,
.hds-side-nav__dropdown .hds-dropdown-toggle-icon:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):disabled,
.hds-side-nav__dropdown .hds-dropdown-toggle-icon:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *)[disabled],
.hds-side-nav__dropdown .hds-dropdown-toggle-icon:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-disabled,
.hds-side-nav__dropdown .hds-dropdown-toggle-icon:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):disabled:focus,
.hds-side-nav__dropdown .hds-dropdown-toggle-icon:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *)[disabled]:focus,
.hds-side-nav__dropdown .hds-dropdown-toggle-icon:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-disabled:focus,
.hds-side-nav__dropdown .hds-dropdown-toggle-icon:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):disabled:hover,
.hds-side-nav__dropdown .hds-dropdown-toggle-icon:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *)[disabled]:hover,
.hds-side-nav__dropdown .hds-dropdown-toggle-icon:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-disabled:hover,
.hds-side-nav .hds-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):disabled,
.hds-side-nav .hds-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *)[disabled],
.hds-side-nav .hds-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-disabled,
.hds-side-nav .hds-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):disabled:focus,
.hds-side-nav .hds-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *)[disabled]:focus,
.hds-side-nav .hds-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-disabled:focus,
.hds-side-nav .hds-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):disabled:hover,
.hds-side-nav .hds-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *)[disabled]:hover,
.hds-side-nav .hds-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-disabled:hover,
.hds-side-nav .hds-dropdown-toggle-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):disabled,
.hds-side-nav .hds-dropdown-toggle-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *)[disabled],
.hds-side-nav .hds-dropdown-toggle-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-disabled,
.hds-side-nav .hds-dropdown-toggle-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):disabled:focus,
.hds-side-nav .hds-dropdown-toggle-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *)[disabled]:focus,
.hds-side-nav .hds-dropdown-toggle-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-disabled:focus,
.hds-side-nav .hds-dropdown-toggle-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):disabled:hover,
.hds-side-nav .hds-dropdown-toggle-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *)[disabled]:hover,
.hds-side-nav .hds-dropdown-toggle-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-disabled:hover,
.hds-side-nav .hds-dropdown-toggle-icon:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):disabled,
.hds-side-nav .hds-dropdown-toggle-icon:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *)[disabled],
.hds-side-nav .hds-dropdown-toggle-icon:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-disabled,
.hds-side-nav .hds-dropdown-toggle-icon:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):disabled:focus,
.hds-side-nav .hds-dropdown-toggle-icon:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *)[disabled]:focus,
.hds-side-nav .hds-dropdown-toggle-icon:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-disabled:focus,
.hds-side-nav .hds-dropdown-toggle-icon:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):disabled:hover,
.hds-side-nav .hds-dropdown-toggle-icon:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *)[disabled]:hover,
.hds-side-nav .hds-dropdown-toggle-icon:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-disabled:hover,
.hds-side-nav-header .hds-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):disabled,
.hds-side-nav-header .hds-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *)[disabled],
.hds-side-nav-header .hds-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-disabled,
.hds-side-nav-header .hds-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):disabled:focus,
.hds-side-nav-header .hds-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *)[disabled]:focus,
.hds-side-nav-header .hds-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-disabled:focus,
.hds-side-nav-header .hds-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):disabled:hover,
.hds-side-nav-header .hds-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *)[disabled]:hover,
.hds-side-nav-header .hds-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-disabled:hover,
.hds-side-nav-header .hds-dropdown-toggle-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):disabled,
.hds-side-nav-header .hds-dropdown-toggle-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *)[disabled],
.hds-side-nav-header .hds-dropdown-toggle-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-disabled,
.hds-side-nav-header .hds-dropdown-toggle-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):disabled:focus,
.hds-side-nav-header .hds-dropdown-toggle-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *)[disabled]:focus,
.hds-side-nav-header .hds-dropdown-toggle-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-disabled:focus,
.hds-side-nav-header .hds-dropdown-toggle-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):disabled:hover,
.hds-side-nav-header .hds-dropdown-toggle-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *)[disabled]:hover,
.hds-side-nav-header .hds-dropdown-toggle-button:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-disabled:hover,
.hds-side-nav-header .hds-dropdown-toggle-icon:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):disabled,
.hds-side-nav-header .hds-dropdown-toggle-icon:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *)[disabled],
.hds-side-nav-header .hds-dropdown-toggle-icon:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-disabled,
.hds-side-nav-header .hds-dropdown-toggle-icon:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):disabled:focus,
.hds-side-nav-header .hds-dropdown-toggle-icon:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *)[disabled]:focus,
.hds-side-nav-header .hds-dropdown-toggle-icon:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-disabled:focus,
.hds-side-nav-header .hds-dropdown-toggle-icon:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *):disabled:hover,
.hds-side-nav-header .hds-dropdown-toggle-icon:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *)[disabled]:hover,
.hds-side-nav-header .hds-dropdown-toggle-icon:not(.hds-dropdown * *, .ember-basic-dropdown-trigger * *, .ember-basic-dropdown-content * *).mock-disabled:hover {
  color: var(--token-color-foreground-disabled);
  background-color: var(--token-color-palette-neutral-600);
  border-color: var(--token-color-palette-neutral-500);
}

.hds-side-nav__icon-button {
  --token-focus-ring-action-box-shadow: inset 0 0 0 1px #bcc7fd, 0 0 0 3px #0d69f2;
  border: 1px solid transparent;
  cursor: pointer;
  border-color: var(--token-color-palette-neutral-500);
  color: var(--token-color-foreground-high-contrast);
  background-color: var(--token-color-palette-neutral-700);
  border-radius: var(--token-border-radius-small);
  display: flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  padding: 5px;
}
.hds-side-nav__icon-button:hover, .hds-side-nav__icon-button.mock-hover {
  border-color: var(--token-color-palette-neutral-500);
  color: var(--token-color-foreground-high-contrast);
  background-color: var(--token-color-palette-neutral-600);
}
.hds-side-nav__icon-button:focus, .hds-side-nav__icon-button.mock-focus {
  position: relative;
  outline-style: solid;
  outline-color: transparent;
  isolation: isolate;
  color: var(--token-color-foreground-high-contrast);
  background-color: var(--token-color-palette-neutral-700);
  border-color: #bcc7fd;
}
.hds-side-nav__icon-button:focus::before, .hds-side-nav__icon-button.mock-focus::before {
  position: absolute;
  top: -1px;
  right: -1px;
  bottom: -1px;
  left: -1px;
  z-index: -1;
  border-radius: 5px;
  content: "";
}
.hds-side-nav__icon-button:focus:focus::before, .hds-side-nav__icon-button:focus.mock-focus::before, .hds-side-nav__icon-button.mock-focus:focus::before, .hds-side-nav__icon-button.mock-focus.mock-focus::before {
  box-shadow: var(--token-focus-ring-action-box-shadow);
}
.hds-side-nav__icon-button:focus:focus:not(:focus-visible)::before, .hds-side-nav__icon-button.mock-focus:focus:not(:focus-visible)::before {
  box-shadow: none;
}
.hds-side-nav__icon-button:focus:focus-visible::before, .hds-side-nav__icon-button.mock-focus:focus-visible::before {
  box-shadow: var(--token-focus-ring-action-box-shadow);
}
.hds-side-nav__icon-button:focus:focus:active::before, .hds-side-nav__icon-button:focus.mock-focus.mock-active::before, .hds-side-nav__icon-button.mock-focus:focus:active::before, .hds-side-nav__icon-button.mock-focus.mock-focus.mock-active::before {
  box-shadow: none;
}
.hds-side-nav__icon-button:focus::before, .hds-side-nav__icon-button.mock-focus::before {
  color: var(--token-color-foreground-high-contrast);
  border: none;
}
.hds-side-nav__icon-button:focus:focus:not(:focus-visible)::before {
  box-shadow: inset 0 0 0 1px #bcc7fd, 0 0 0 3px #0d69f2;
}
.hds-side-nav__icon-button:active, .hds-side-nav__icon-button.mock-active {
  color: var(--token-color-foreground-high-contrast);
  background-color: var(--token-color-palette-neutral-500);
  border-color: var(--token-color-palette-neutral-400);
}
.hds-side-nav__icon-button:disabled, .hds-side-nav__icon-button[disabled], .hds-side-nav__icon-button.mock-disabled, .hds-side-nav__icon-button:disabled:focus, .hds-side-nav__icon-button[disabled]:focus, .hds-side-nav__icon-button.mock-disabled:focus, .hds-side-nav__icon-button:disabled:hover, .hds-side-nav__icon-button[disabled]:hover, .hds-side-nav__icon-button.mock-disabled:hover {
  color: var(--token-color-foreground-disabled);
  background-color: var(--token-color-palette-neutral-600);
  border-color: var(--token-color-palette-neutral-500);
}

/**
 * Copyright (c) HashiCorp, Inc.
 * SPDX-License-Identifier: MPL-2.0
 */
.hds-side-nav__content {
  margin: 0 calc(var(--token-side-nav-wrapper-padding-horizontal) * -1);
}
.hds-side-nav--is-minimized .hds-side-nav__content {
  height: 0;
  overflow: hidden;
}

.hds-side-nav__content-panels {
  display: grid;
  grid-template-columns: repeat(5, var(--hds-app-sidenav-width-expanded));
  width: 100%;
}

.hds-side-nav__content-panel {
  padding: 0 var(--token-side-nav-wrapper-padding-horizontal);
  overflow: hidden;
}
.hds-side-nav__content-panel[aria-hidden=true] {
  max-height: 0;
}

.hds-side-nav__list-title {
  min-height: var(--token-side-nav-body-list-item-height);
  margin-top: var(--token-side-nav-body-list-margin-vertical);
  padding: 9px var(--token-side-nav-body-list-item-padding-horizontal);
  color: var(--token-side-nav-color-foreground-faint);
  overflow-wrap: break-word;
}
.hds-side-nav__list-wrapper:first-child .hds-side-nav__list-item:first-child > .hds-side-nav__list-title {
  margin-top: 0;
}

.hds-side-nav__list-wrapper,
.hds-side-nav__list {
  margin: 0;
  padding: 0;
}

.hds-side-nav__list-item {
  list-style-type: none;
}
.hds-side-nav__list-item + .hds-side-nav__list-item {
  margin-top: var(--token-side-nav-body-list-item-spacing-vertical);
}

.hds-side-nav__list-item-link {
  --token-focus-ring-action-box-shadow: var(--hds-app-sidenav-focus-ring-action-box-shadow);
  display: flex;
  gap: var(--token-side-nav-body-list-item-content-spacing-horizontal);
  align-items: center;
  width: 100%;
  min-height: var(--token-side-nav-body-list-item-height);
  padding: var(--token-side-nav-body-list-item-padding-vertical) var(--token-side-nav-body-list-item-padding-horizontal);
  color: var(--token-side-nav-color-foreground-primary);
  text-decoration: none;
  background: var(--token-side-nav-color-surface-primary);
  border-color: transparent;
  border-width: 0;
  border-radius: var(--token-side-nav-body-list-item-border-radius);
}
.hds-side-nav__list-item-link:focus, .hds-side-nav__list-item-link.mock-focus {
  position: relative;
  outline-style: solid;
  outline-color: transparent;
  isolation: isolate;
}
.hds-side-nav__list-item-link:focus::before, .hds-side-nav__list-item-link.mock-focus::before {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: -1;
  border-radius: 5px;
  content: "";
}
.hds-side-nav__list-item-link:focus:focus::before, .hds-side-nav__list-item-link:focus.mock-focus::before, .hds-side-nav__list-item-link.mock-focus:focus::before, .hds-side-nav__list-item-link.mock-focus.mock-focus::before {
  box-shadow: var(--token-focus-ring-action-box-shadow);
}
.hds-side-nav__list-item-link:focus:focus:not(:focus-visible)::before, .hds-side-nav__list-item-link.mock-focus:focus:not(:focus-visible)::before {
  box-shadow: none;
}
.hds-side-nav__list-item-link:focus:focus-visible::before, .hds-side-nav__list-item-link.mock-focus:focus-visible::before {
  box-shadow: var(--token-focus-ring-action-box-shadow);
}
.hds-side-nav__list-item-link:focus:focus:active::before, .hds-side-nav__list-item-link:focus.mock-focus.mock-active::before, .hds-side-nav__list-item-link.mock-focus:focus:active::before, .hds-side-nav__list-item-link.mock-focus.mock-focus.mock-active::before {
  box-shadow: none;
}
.hds-side-nav__list-item-link:hover, .hds-side-nav__list-item-link.mock-hover {
  background: var(--token-side-nav-color-surface-interactive-hover);
  border-color: transparent;
}
.hds-side-nav__list-item-link:hover .hds-side-nav__list-item-text,
.hds-side-nav__list-item-link:hover .hds-side-nav__list-item-icon-leading,
.hds-side-nav__list-item-link:hover .hds-side-nav__list-item-icon-trailing, .hds-side-nav__list-item-link.mock-hover .hds-side-nav__list-item-text,
.hds-side-nav__list-item-link.mock-hover .hds-side-nav__list-item-icon-leading,
.hds-side-nav__list-item-link.mock-hover .hds-side-nav__list-item-icon-trailing {
  color: var(--token-side-nav-color-foreground-strong);
}
.hds-side-nav__list-item-link:hover:focus, .hds-side-nav__list-item-link.active, .hds-side-nav__list-item-link:active, .hds-side-nav__list-item-link.mock-active {
  background: var(--token-side-nav-color-surface-interactive-active);
}
.hds-side-nav__list-item-link:hover:focus .hds-side-nav__list-item-text,
.hds-side-nav__list-item-link:hover:focus .hds-side-nav__list-item-icon-leading,
.hds-side-nav__list-item-link:hover:focus .hds-side-nav__list-item-icon-trailing, .hds-side-nav__list-item-link.active .hds-side-nav__list-item-text,
.hds-side-nav__list-item-link.active .hds-side-nav__list-item-icon-leading,
.hds-side-nav__list-item-link.active .hds-side-nav__list-item-icon-trailing, .hds-side-nav__list-item-link:active .hds-side-nav__list-item-text,
.hds-side-nav__list-item-link:active .hds-side-nav__list-item-icon-leading,
.hds-side-nav__list-item-link:active .hds-side-nav__list-item-icon-trailing, .hds-side-nav__list-item-link.mock-active .hds-side-nav__list-item-text,
.hds-side-nav__list-item-link.mock-active .hds-side-nav__list-item-icon-leading,
.hds-side-nav__list-item-link.mock-active .hds-side-nav__list-item-icon-trailing {
  color: var(--token-side-nav-color-foreground-strong);
}
.hds-side-nav__list-item-link:hover:focus .hds-badge,
.hds-side-nav__list-item-link:hover:focus .hds-badge-count, .hds-side-nav__list-item-link.active .hds-badge,
.hds-side-nav__list-item-link.active .hds-badge-count, .hds-side-nav__list-item-link:active .hds-badge,
.hds-side-nav__list-item-link:active .hds-badge-count, .hds-side-nav__list-item-link.mock-active .hds-badge,
.hds-side-nav__list-item-link.mock-active .hds-badge-count {
  color: var(--token-color-foreground-primary);
  background: var(--token-color-surface-strong);
}

.hds-side-nav__list-item-link--back-link:active, .hds-side-nav__list-item-link--back-link.mock-active {
  background: var(--token-side-nav-color-surface-primary);
}
.hds-side-nav__list-item-link--back-link:active .hds-side-nav__list-item-text,
.hds-side-nav__list-item-link--back-link:active .hds-side-nav__list-item-icon-leading,
.hds-side-nav__list-item-link--back-link:active .hds-side-nav__list-item-icon-trailing, .hds-side-nav__list-item-link--back-link.mock-active .hds-side-nav__list-item-text,
.hds-side-nav__list-item-link--back-link.mock-active .hds-side-nav__list-item-icon-leading,
.hds-side-nav__list-item-link--back-link.mock-active .hds-side-nav__list-item-icon-trailing {
  color: var(--token-side-nav-color-foreground-primary);
}

.hds-side-nav__list-item-text {
  min-width: 0;
  max-width: 100%;
  color: var(--token-side-nav-color-foreground-primary);
  text-align: left;
  overflow-wrap: break-word;
}

.hds-side-nav__list-item-icon-leading {
  flex: none;
}

.hds-side-nav__list-item-icon-trailing {
  flex: none;
  margin-left: auto;
}

/**
 * Copyright (c) HashiCorp, Inc.
 * SPDX-License-Identifier: MPL-2.0
 */
.hds-side-nav__toggle-button {
  position: absolute;
  top: 22px;
  left: calc(var(--token-side-nav-wrapper-border-width) * -1);
  z-index: 1;
  display: flex;
  flex-direction: row-reverse;
  align-items: center;
  width: var(--hds-app-sidenav-toggle-button-width);
  height: 36px;
  padding: 0 4px;
  color: var(--token-color-foreground-high-contrast);
  background: none;
  background-color: var(--token-side-nav-color-surface-primary);
  border: var(--token-side-nav-wrapper-border-width) solid var(--token-side-nav-wrapper-border-color);
  border-left-color: transparent;
  border-top-right-radius: var(--token-side-nav-toggle-button-border-radius);
  border-bottom-right-radius: var(--token-side-nav-toggle-button-border-radius);
  transform: translateX(var(--hds-app-sidenav-width-expanded));
  cursor: pointer;
  transition: transform var(--hds-app-sidenav-animation-duration) var(--hds-app-sidenav-animation-easing), width var(--hds-app-sidenav-animation-duration) var(--hds-app-sidenav-animation-easing);
}
.hds-side-nav__toggle-button::before {
  position: absolute;
  top: calc(var(--token-side-nav-toggle-button-border-radius) * -2);
  left: calc(var(--token-side-nav-wrapper-border-width) * -1);
  box-sizing: border-box;
  width: calc(var(--token-side-nav-toggle-button-border-radius) * 2);
  height: calc(var(--token-side-nav-toggle-button-border-radius) * 2);
  border-bottom: var(--token-side-nav-wrapper-border-width) solid var(--token-side-nav-wrapper-border-color);
  border-left: var(--token-side-nav-wrapper-border-width) solid var(--token-side-nav-wrapper-border-color);
  border-bottom-left-radius: var(--token-side-nav-toggle-button-border-radius);
  box-shadow: 0 var(--token-side-nav-toggle-button-border-radius) 0 var(--token-side-nav-color-surface-primary);
  content: "";
}
.hds-side-nav__toggle-button::after {
  position: absolute;
  bottom: calc(var(--token-side-nav-toggle-button-border-radius) * -2);
  left: calc(var(--token-side-nav-wrapper-border-width) * -1);
  box-sizing: border-box;
  width: calc(var(--token-side-nav-toggle-button-border-radius) * 2);
  height: calc(var(--token-side-nav-toggle-button-border-radius) * 2);
  border-top: var(--token-side-nav-wrapper-border-width) solid var(--token-side-nav-wrapper-border-color);
  border-left: var(--token-side-nav-wrapper-border-width) solid var(--token-side-nav-wrapper-border-color);
  border-top-left-radius: var(--token-side-nav-toggle-button-border-radius);
  box-shadow: 0 calc(var(--token-side-nav-toggle-button-border-radius) * -1) 0 var(--token-side-nav-color-surface-primary);
  content: "";
}
.hds-side-nav__toggle-button:hover, .hds-side-nav__toggle-button.mock-hover {
  width: 30px;
  background-color: var(--token-side-nav-color-surface-interactive-hover);
}
.hds-side-nav__toggle-button:hover::before, .hds-side-nav__toggle-button.mock-hover::before {
  box-shadow: 0 var(--token-side-nav-toggle-button-border-radius) 0 var(--token-side-nav-color-surface-interactive-hover);
}
.hds-side-nav__toggle-button:hover::after, .hds-side-nav__toggle-button.mock-hover::after {
  box-shadow: 0 calc(var(--token-side-nav-toggle-button-border-radius) * -1) 0 var(--token-side-nav-color-surface-interactive-hover);
}
.hds-side-nav__toggle-button:active, .hds-side-nav__toggle-button.mock-active {
  background-color: var(--token-side-nav-color-surface-interactive-active);
}
.hds-side-nav__toggle-button:active::before, .hds-side-nav__toggle-button.mock-active::before {
  box-shadow: 0 var(--token-side-nav-toggle-button-border-radius) 0 var(--token-side-nav-color-surface-interactive-active);
}
.hds-side-nav__toggle-button:active::after, .hds-side-nav__toggle-button.mock-active::after {
  box-shadow: 0 calc(var(--token-side-nav-toggle-button-border-radius) * -1) 0 var(--token-side-nav-color-surface-interactive-active);
}
.hds-side-nav__toggle-button:focus-visible, .hds-side-nav__toggle-button.mock-focus {
  border-color: var(--hds-app-sidenav-color-focus-action-internal);
  outline: 3px solid var(--hds-app-sidenav-color-focus-action-external);
}
.hds-side-nav__toggle-button:focus-visible::before, .hds-side-nav__toggle-button:focus-visible::after, .hds-side-nav__toggle-button.mock-focus::before, .hds-side-nav__toggle-button.mock-focus::after {
  display: none;
}
.hds-side-nav--is-minimized .hds-side-nav__toggle-button {
  transform: translateX(var(--hds-app-sidenav-width-minimized));
}
.hds-side-nav:has(.hds-side-nav__wrapper-header:empty) .hds-side-nav__toggle-button {
  top: var(--token-side-nav-wrapper-padding-vertical);
}

/**
 * Copyright (c) HashiCorp, Inc.
 * SPDX-License-Identifier: MPL-2.0
 */
.hds-side-nav .ember-a11y-refocus-skip-link {
  top: 10px;
  left: 10px;
  z-index: 20;
  width: max-content;
  padding: 2px 10px 4px;
  color: var(--token-color-foreground-action);
  font-size: var(--token-typography-display-200-font-size);
  font-family: var(--token-typography-display-200-font-family);
  line-height: var(--token-typography-display-200-line-height);
  background-color: var(--token-color-surface-faint);
  border-radius: var(--token-border-radius-x-small);
  transform: translateY(-200%);
  transition: 0.6s ease-in-out;
}
.hds-side-nav .ember-a11y-refocus-skip-link:focus {
  transform: translateY(0);
}

/**
 * Copyright (c) HashiCorp, Inc.
 * SPDX-License-Identifier: MPL-2.0
 */
/**
 * Copyright (c) HashiCorp, Inc.
 * SPDX-License-Identifier: MPL-2.0
 */
.hds-stepper-list {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.hds-stepper-list,
.hds-stepper-list__step {
  margin: 0;
  padding: 0;
  list-style-type: none;
}

.hds-stepper-list__step {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 8px;
}
.hds-stepper-list__step:not(:last-of-type) .hds-stepper-list__step-progress::before, .hds-stepper-list__step:not(:last-of-type) .hds-stepper-list__step-progress::after {
  position: absolute;
  top: 1px;
  left: 11px;
  z-index: -1;
  width: 2px;
  content: "";
}
.hds-stepper-list__step:not(:last-of-type) .hds-stepper-list__step-progress::before {
  height: calc(100% + 16px);
  background: linear-gradient(0deg, var(--token-color-palette-alpha-200) 0%, var(--token-color-palette-alpha-200) 100%), var(--token-color-palette-neutral-100);
}
.hds-stepper-list__step:not(:last-of-type) .hds-stepper-list__step-progress::after {
  background-color: var(--token-color-palette-neutral-700);
}

.hds-stepper-list__step-progress {
  position: relative;
  isolation: isolate;
}

.hds-stepper-list__step-text {
  margin-top: 2px;
}

.hds-stepper-list__step-description {
  margin-top: 4px;
}

.hds-stepper-list__step-content {
  margin-top: 8px;
}

.hds-stepper-list__step:not(:last-of-type).hds-stepper-list__step--complete .hds-stepper-list__step-progress::after {
  height: calc(100% + 16px - 4px);
}
.hds-stepper-list__step:not(:last-of-type, :first-of-type).hds-stepper-list__step--complete .hds-stepper-list__step-progress::after {
  top: -4px;
  height: calc(100% + 16px);
}
.hds-stepper-list__step:not(:first-of-type):last-of-type.hds-stepper-list__step--complete .hds-stepper-list__step-progress::after {
  position: absolute;
  top: -4px;
  left: 11px;
  z-index: -1;
  width: 2px;
  height: 6px;
  background-color: var(--token-color-palette-neutral-700);
  content: "";
}
.hds-stepper-list__step.hds-stepper-list__step--complete:has(+ :not(.hds-stepper-list__step--complete)) .hds-stepper-list__step-progress::after {
  border-radius: 0 0 var(--token-border-radius-x-small) var(--token-border-radius-x-small);
}

/**
 * Copyright (c) HashiCorp, Inc.
 * SPDX-License-Identifier: MPL-2.0
 */
/**
 * Copyright (c) HashiCorp, Inc.
 * SPDX-License-Identifier: MPL-2.0
 */
/**
 * Copyright (c) HashiCorp, Inc.
 * SPDX-License-Identifier: MPL-2.0
 */
.hds-stepper-indicator-step {
  position: relative;
  width: 24px;
  height: 24px;
}

.hds-stepper-indicator-step__svg-hexagon {
  width: 100%;
  height: 100%;
  filter: drop-shadow(0 1px 1px rgba(101, 106, 118, 0.05));
}

.hds-stepper-indicator-step__status {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}

.hds-stepper-indicator-step__icon {
  width: 12px;
  height: 12px;
}

.hds-stepper-indicator-step__text {
  width: 20px;
  overflow: hidden;
  white-space: nowrap;
  text-align: center;
  user-select: none;
}

.hds-stepper-indicator-step--status-incomplete .hds-stepper-indicator-step__status {
  color: var(--token-color-foreground-primary);
}
.hds-stepper-indicator-step--status-incomplete .hds-stepper-indicator-step__svg-hexagon path {
  fill: var(--token-color-surface-primary);
  stroke: var(--token-color-border-strong);
}

.hds-stepper-indicator-step--status-progress .hds-stepper-indicator-step__status {
  color: var(--token-color-foreground-high-contrast);
}
.hds-stepper-indicator-step--status-progress .hds-stepper-indicator-step__svg-hexagon path {
  fill: var(--token-color-foreground-strong);
  stroke: var(--token-color-foreground-strong);
}

.hds-stepper-indicator-step--status-processing .hds-stepper-indicator-step__status {
  color: var(--token-color-foreground-high-contrast);
}
.hds-stepper-indicator-step--status-processing .hds-stepper-indicator-step__svg-hexagon path {
  fill: var(--token-color-foreground-strong);
  stroke: var(--token-color-foreground-strong);
}

.hds-stepper-indicator-step--status-complete .hds-stepper-indicator-step__status {
  color: var(--token-color-foreground-high-contrast);
}
.hds-stepper-indicator-step--status-complete .hds-stepper-indicator-step__svg-hexagon path {
  fill: var(--token-color-foreground-strong);
  stroke: var(--token-color-foreground-strong);
}

.hds-stepper-indicator-step--is-interactive {
  cursor: pointer;
}
.hds-stepper-indicator-step--is-interactive.hds-stepper-indicator-step--status-incomplete .hds-stepper-indicator-step__status {
  color: var(--token-color-foreground-primary);
}
.hds-stepper-indicator-step--is-interactive.hds-stepper-indicator-step--status-incomplete .hds-stepper-indicator-step__svg-hexagon path {
  fill: var(--token-color-surface-interactive);
  stroke: var(--token-color-border-strong);
}
.hds-stepper-indicator-step--is-interactive.hds-stepper-indicator-step--status-incomplete:hover .hds-stepper-indicator-step__svg-hexagon path, .hds-stepper-indicator-step--is-interactive.hds-stepper-indicator-step--status-incomplete.mock-hover .hds-stepper-indicator-step__svg-hexagon path {
  fill: var(--token-color-surface-interactive-hover);
}
.hds-stepper-indicator-step--is-interactive.hds-stepper-indicator-step--status-incomplete:active .hds-stepper-indicator-step__svg-hexagon path, .hds-stepper-indicator-step--is-interactive.hds-stepper-indicator-step--status-incomplete.mock-active .hds-stepper-indicator-step__svg-hexagon path {
  fill: var(--token-color-surface-interactive-active);
}
.hds-stepper-indicator-step--is-interactive.hds-stepper-indicator-step--status-progress .hds-stepper-indicator-step__status {
  color: var(--token-color-foreground-high-contrast);
}
.hds-stepper-indicator-step--is-interactive.hds-stepper-indicator-step--status-progress .hds-stepper-indicator-step__svg-hexagon path {
  fill: var(--token-color-palette-blue-200);
  stroke: var(--token-color-palette-blue-300);
}
.hds-stepper-indicator-step--is-interactive.hds-stepper-indicator-step--status-progress:hover .hds-stepper-indicator-step__svg-hexagon path, .hds-stepper-indicator-step--is-interactive.hds-stepper-indicator-step--status-progress.mock-hover .hds-stepper-indicator-step__svg-hexagon path {
  fill: var(--token-color-palette-blue-300);
  stroke: var(--token-color-palette-blue-400);
}
.hds-stepper-indicator-step--is-interactive.hds-stepper-indicator-step--status-progress:active .hds-stepper-indicator-step__svg-hexagon path, .hds-stepper-indicator-step--is-interactive.hds-stepper-indicator-step--status-progress.mock-active .hds-stepper-indicator-step__svg-hexagon path {
  fill: var(--token-color-palette-blue-400);
  stroke: var(--token-color-palette-blue-400);
}
.hds-stepper-indicator-step--is-interactive.hds-stepper-indicator-step--status-processing .hds-stepper-indicator-step__status {
  color: var(--token-color-foreground-high-contrast);
}
.hds-stepper-indicator-step--is-interactive.hds-stepper-indicator-step--status-processing .hds-stepper-indicator-step__svg-hexagon path {
  fill: var(--token-color-palette-blue-200);
  stroke: var(--token-color-palette-blue-300);
}
.hds-stepper-indicator-step--is-interactive.hds-stepper-indicator-step--status-processing:hover .hds-stepper-indicator-step__svg-hexagon path, .hds-stepper-indicator-step--is-interactive.hds-stepper-indicator-step--status-processing.mock-hover .hds-stepper-indicator-step__svg-hexagon path {
  fill: var(--token-color-palette-blue-300);
  stroke: var(--token-color-palette-blue-400);
}
.hds-stepper-indicator-step--is-interactive.hds-stepper-indicator-step--status-processing:active .hds-stepper-indicator-step__svg-hexagon path, .hds-stepper-indicator-step--is-interactive.hds-stepper-indicator-step--status-processing.mock-active .hds-stepper-indicator-step__svg-hexagon path {
  fill: var(--token-color-palette-blue-400);
  stroke: var(--token-color-palette-blue-400);
}
.hds-stepper-indicator-step--is-interactive.hds-stepper-indicator-step--status-complete .hds-stepper-indicator-step__status {
  color: var(--token-color-palette-blue-200);
}
.hds-stepper-indicator-step--is-interactive.hds-stepper-indicator-step--status-complete .hds-stepper-indicator-step__svg-hexagon path {
  fill: var(--token-color-surface-action);
  stroke: var(--token-color-palette-blue-300);
}
.hds-stepper-indicator-step--is-interactive.hds-stepper-indicator-step--status-complete:hover .hds-stepper-indicator-step__status, .hds-stepper-indicator-step--is-interactive.hds-stepper-indicator-step--status-complete.mock-hover .hds-stepper-indicator-step__status {
  color: var(--token-color-palette-blue-300);
}
.hds-stepper-indicator-step--is-interactive.hds-stepper-indicator-step--status-complete:hover .hds-stepper-indicator-step__svg-hexagon path, .hds-stepper-indicator-step--is-interactive.hds-stepper-indicator-step--status-complete.mock-hover .hds-stepper-indicator-step__svg-hexagon path {
  fill: var(--token-color-palette-blue-100);
  stroke: var(--token-color-palette-blue-400);
}
.hds-stepper-indicator-step--is-interactive.hds-stepper-indicator-step--status-complete:active .hds-stepper-indicator-step__status, .hds-stepper-indicator-step--is-interactive.hds-stepper-indicator-step--status-complete.mock-active .hds-stepper-indicator-step__status {
  color: var(--token-color-palette-blue-400);
}
.hds-stepper-indicator-step--is-interactive.hds-stepper-indicator-step--status-complete:active .hds-stepper-indicator-step__svg-hexagon path, .hds-stepper-indicator-step--is-interactive.hds-stepper-indicator-step--status-complete.mock-active .hds-stepper-indicator-step__svg-hexagon path {
  fill: var(--token-color-palette-blue-100);
  stroke: var(--token-color-palette-blue-400);
}

.hds-stepper-nav__progress-bar {
  position: relative;
  isolation: isolate;
}
.hds-stepper-nav__progress-bar::before, .hds-stepper-nav__progress-bar::after {
  position: absolute;
  top: -4px;
  left: 0;
  z-index: -1;
  height: 4px;
  content: "";
}
.hds-stepper-nav__progress-bar::before {
  width: 100%;
  background: linear-gradient(0deg, var(--token-color-palette-alpha-200) 0%, var(--token-color-palette-alpha-200) 100%), var(--token-color-palette-neutral-100);
}
.hds-stepper-nav__progress-bar::after {
  width: var(--hds-stepper-nav-progress-bar-width, 0);
  background-color: var(--token-color-palette-neutral-700);
  border-radius: 0 var(--token-border-radius-x-small) var(--token-border-radius-x-small) 0;
}
@media (prefers-reduced-motion: no-preference) {
  .hds-stepper-nav__progress-bar::after {
    transition: width 0.25s ease-in-out;
  }
}

.hds-stepper-nav__list,
.hds-stepper-nav__step {
  margin: 0;
  padding: 0;
  list-style: none;
}

.hds-stepper-nav__list {
  display: flex;
  text-align: center;
}

.hds-stepper-nav__step {
  width: 100%;
}

.hds-stepper-nav__step-button {
  border-radius: 0 0 var(--token-border-radius-medium) var(--token-border-radius-medium);
}

.hds-stepper-nav__step-content {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
  padding: 0;
  background-color: transparent;
  border: none;
}

.hds-stepper-nav__step-progress {
  position: absolute;
  top: -14px;
  left: 0;
  z-index: 0;
  display: flex;
  justify-content: center;
  width: 100%;
}

.hds-stepper-nav__step-text {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 16px 8px 12px 8px;
}

.hds-stepper-nav__step-title {
  color: var(--token-color-foreground-faint);
  text-decoration: none;
}

.hds-stepper-nav__step-description {
  margin-top: 4px;
  color: var(--token-color-foreground-faint);
}

.hds-stepper-nav__step--complete .hds-stepper-nav__step-title,
.hds-stepper-nav__step--active .hds-stepper-nav__step-title {
  color: var(--token-color-foreground-strong);
}
.hds-stepper-nav__step--complete .hds-stepper-nav__step-description,
.hds-stepper-nav__step--active .hds-stepper-nav__step-description {
  color: var(--token-color-foreground-primary);
}

@media (prefers-reduced-motion: no-preference) {
  .hds-stepper-nav__step--active .hds-stepper-indicator-step__svg-hexagon path,
  .hds-stepper-nav__step--active .hds-stepper-indicator-step__status,
  .hds-stepper-nav__step--active .hds-stepper-nav__step-title {
    transition: all 0.15s ease-in-out 0.25s;
  }
}

.hds-stepper-nav--interactive .hds-stepper-nav__progress-bar::after {
  background-color: var(--token-color-palette-blue-200);
}
.hds-stepper-nav--interactive .hds-stepper-nav__step--complete .hds-stepper-nav__step-title,
.hds-stepper-nav--interactive .hds-stepper-nav__step--active .hds-stepper-nav__step-title {
  color: var(--token-color-foreground-action);
}
.hds-stepper-nav--interactive .hds-stepper-nav__step--complete .hds-stepper-nav__step-title {
  text-decoration: underline;
  text-decoration-skip-ink: none;
  text-underline-position: from-font;
}
.hds-stepper-nav--interactive .hds-stepper-nav__step--active .hds-stepper-nav__step-button {
  position: relative;
  outline-style: solid;
  outline-color: transparent;
  isolation: isolate;
}
.hds-stepper-nav--interactive .hds-stepper-nav__step--active .hds-stepper-nav__step-button::before {
  position: absolute;
  top: -3px;
  right: -1px;
  bottom: -1px;
  left: -1px;
  z-index: -1;
  border-radius: 0 0 var(--token-border-radius-medium) var(--token-border-radius-medium);
  content: "";
}
.hds-stepper-nav--interactive .hds-stepper-nav__step--active .hds-stepper-nav__step-button:focus::before, .hds-stepper-nav--interactive .hds-stepper-nav__step--active .hds-stepper-nav__step-button.mock-focus::before {
  box-shadow: var(--token-focus-ring-action-box-shadow);
}
.hds-stepper-nav--interactive .hds-stepper-nav__step--active .hds-stepper-nav__step-button:focus:not(:focus-visible)::before {
  box-shadow: none;
}
.hds-stepper-nav--interactive .hds-stepper-nav__step--active .hds-stepper-nav__step-button:focus-visible::before {
  box-shadow: var(--token-focus-ring-action-box-shadow);
}
.hds-stepper-nav--interactive .hds-stepper-nav__step--active .hds-stepper-nav__step-button:focus:active::before, .hds-stepper-nav--interactive .hds-stepper-nav__step--active .hds-stepper-nav__step-button.mock-focus.mock-active::before {
  box-shadow: none;
}

.hds-stepper-nav__step--interactive .hds-stepper-nav__step-button {
  position: relative;
  outline-style: solid;
  outline-color: transparent;
  isolation: isolate;
  cursor: pointer;
}
.hds-stepper-nav__step--interactive .hds-stepper-nav__step-button::before {
  position: absolute;
  top: -3px;
  right: -1px;
  bottom: -1px;
  left: -1px;
  z-index: -1;
  border-radius: 0 0 6px 6px;
  content: "";
}
.hds-stepper-nav__step--interactive .hds-stepper-nav__step-button:focus::before, .hds-stepper-nav__step--interactive .hds-stepper-nav__step-button.mock-focus::before {
  box-shadow: var(--token-focus-ring-action-box-shadow);
}
.hds-stepper-nav__step--interactive .hds-stepper-nav__step-button:focus:not(:focus-visible)::before {
  box-shadow: none;
}
.hds-stepper-nav__step--interactive .hds-stepper-nav__step-button:focus-visible::before {
  box-shadow: var(--token-focus-ring-action-box-shadow);
}
.hds-stepper-nav__step--interactive .hds-stepper-nav__step-button:focus:active::before, .hds-stepper-nav__step--interactive .hds-stepper-nav__step-button.mock-focus.mock-active::before {
  box-shadow: none;
}
.hds-stepper-nav__step--interactive .hds-stepper-nav__step-button:hover, .hds-stepper-nav__step--interactive .hds-stepper-nav__step-button.mock-hover {
  background-color: var(--token-color-surface-interactive-hover);
}
.hds-stepper-nav__step--interactive .hds-stepper-nav__step-button:hover .hds-stepper-nav__step-title, .hds-stepper-nav__step--interactive .hds-stepper-nav__step-button.mock-hover .hds-stepper-nav__step-title {
  color: var(--token-color-foreground-action-hover);
}
.hds-stepper-nav__step--interactive .hds-stepper-nav__step-button:active, .hds-stepper-nav__step--interactive .hds-stepper-nav__step-button.mock-active {
  background-color: var(--token-color-surface-interactive-active);
}
.hds-stepper-nav__step--interactive .hds-stepper-nav__step-button:active .hds-stepper-nav__step-title, .hds-stepper-nav__step--interactive .hds-stepper-nav__step-button.mock-active .hds-stepper-nav__step-title {
  color: var(--token-color-foreground-action-active);
}

.hds-stepper-nav__step--nav-interactive .hds-stepper-nav__step-button:hover .hds-stepper-indicator-step--status-incomplete.hds-stepper-indicator-step,
.hds-stepper-nav__step--nav-interactive .hds-stepper-nav__step-button.mock-hover .hds-stepper-indicator-step--status-incomplete.hds-stepper-indicator-step {
  cursor: default;
}
.hds-stepper-nav__step--nav-interactive .hds-stepper-nav__step-button:hover .hds-stepper-indicator-step--status-incomplete .hds-stepper-indicator-step__status,
.hds-stepper-nav__step--nav-interactive .hds-stepper-nav__step-button.mock-hover .hds-stepper-indicator-step--status-incomplete .hds-stepper-indicator-step__status {
  color: var(--token-color-foreground-primary);
}
.hds-stepper-nav__step--nav-interactive .hds-stepper-nav__step-button:hover .hds-stepper-indicator-step--status-incomplete .hds-stepper-indicator-step__svg-hexagon path,
.hds-stepper-nav__step--nav-interactive .hds-stepper-nav__step-button.mock-hover .hds-stepper-indicator-step--status-incomplete .hds-stepper-indicator-step__svg-hexagon path {
  fill: var(--token-color-surface-interactive);
  stroke: var(--token-color-border-strong);
}
.hds-stepper-nav__step--nav-interactive.hds-stepper-nav__step--interactive .hds-stepper-nav__step-button:hover .hds-stepper-indicator-step--status-incomplete.hds-stepper-indicator-step,
.hds-stepper-nav__step--nav-interactive.hds-stepper-nav__step--interactive .hds-stepper-nav__step-button.mock-hover .hds-stepper-indicator-step--status-incomplete.hds-stepper-indicator-step {
  cursor: pointer;
}
.hds-stepper-nav__step--nav-interactive.hds-stepper-nav__step--interactive .hds-stepper-nav__step-button:hover .hds-stepper-indicator-step--status-incomplete .hds-stepper-indicator-step__svg-hexagon path,
.hds-stepper-nav__step--nav-interactive.hds-stepper-nav__step--interactive .hds-stepper-nav__step-button.mock-hover .hds-stepper-indicator-step--status-incomplete .hds-stepper-indicator-step__svg-hexagon path {
  fill: var(--token-color-surface-interactive-hover);
}
.hds-stepper-nav__step--nav-interactive .hds-stepper-nav__step-button:active .hds-stepper-indicator-step--status-incomplete.hds-stepper-indicator-step,
.hds-stepper-nav__step--nav-interactive .hds-stepper-nav__step-button.mock-active .hds-stepper-indicator-step--status-incomplete.hds-stepper-indicator-step {
  cursor: default;
}
.hds-stepper-nav__step--nav-interactive .hds-stepper-nav__step-button:active .hds-stepper-indicator-step--status-incomplete .hds-stepper-indicator-step__status,
.hds-stepper-nav__step--nav-interactive .hds-stepper-nav__step-button.mock-active .hds-stepper-indicator-step--status-incomplete .hds-stepper-indicator-step__status {
  color: var(--token-color-foreground-primary);
}
.hds-stepper-nav__step--nav-interactive .hds-stepper-nav__step-button:active .hds-stepper-indicator-step--status-incomplete .hds-stepper-indicator-step__svg-hexagon path,
.hds-stepper-nav__step--nav-interactive .hds-stepper-nav__step-button.mock-active .hds-stepper-indicator-step--status-incomplete .hds-stepper-indicator-step__svg-hexagon path {
  fill: var(--token-color-surface-interactive);
  stroke: var(--token-color-border-strong);
}
.hds-stepper-nav__step--nav-interactive.hds-stepper-nav__step--interactive .hds-stepper-nav__step-button:active .hds-stepper-indicator-step--status-incomplete.hds-stepper-indicator-step,
.hds-stepper-nav__step--nav-interactive.hds-stepper-nav__step--interactive .hds-stepper-nav__step-button.mock-active .hds-stepper-indicator-step--status-incomplete.hds-stepper-indicator-step {
  cursor: pointer;
}
.hds-stepper-nav__step--nav-interactive.hds-stepper-nav__step--interactive .hds-stepper-nav__step-button:active .hds-stepper-indicator-step--status-incomplete .hds-stepper-indicator-step__svg-hexagon path,
.hds-stepper-nav__step--nav-interactive.hds-stepper-nav__step--interactive .hds-stepper-nav__step-button.mock-active .hds-stepper-indicator-step--status-incomplete .hds-stepper-indicator-step__svg-hexagon path {
  fill: var(--token-color-surface-interactive-active);
}

.hds-stepper-nav__step--nav-interactive .hds-stepper-nav__step-button:hover .hds-stepper-indicator-step--status-progress.hds-stepper-indicator-step,
.hds-stepper-nav__step--nav-interactive .hds-stepper-nav__step-button.mock-hover .hds-stepper-indicator-step--status-progress.hds-stepper-indicator-step {
  cursor: default;
}
.hds-stepper-nav__step--nav-interactive .hds-stepper-nav__step-button:hover .hds-stepper-indicator-step--status-progress .hds-stepper-indicator-step__status,
.hds-stepper-nav__step--nav-interactive .hds-stepper-nav__step-button.mock-hover .hds-stepper-indicator-step--status-progress .hds-stepper-indicator-step__status {
  color: var(--token-color-foreground-high-contrast);
}
.hds-stepper-nav__step--nav-interactive .hds-stepper-nav__step-button:hover .hds-stepper-indicator-step--status-progress .hds-stepper-indicator-step__svg-hexagon path,
.hds-stepper-nav__step--nav-interactive .hds-stepper-nav__step-button.mock-hover .hds-stepper-indicator-step--status-progress .hds-stepper-indicator-step__svg-hexagon path {
  fill: var(--token-color-palette-blue-200);
  stroke: var(--token-color-palette-blue-300);
}
.hds-stepper-nav__step--nav-interactive.hds-stepper-nav__step--interactive .hds-stepper-nav__step-button:hover .hds-stepper-indicator-step--status-progress.hds-stepper-indicator-step,
.hds-stepper-nav__step--nav-interactive.hds-stepper-nav__step--interactive .hds-stepper-nav__step-button.mock-hover .hds-stepper-indicator-step--status-progress.hds-stepper-indicator-step {
  cursor: pointer;
}
.hds-stepper-nav__step--nav-interactive.hds-stepper-nav__step--interactive .hds-stepper-nav__step-button:hover .hds-stepper-indicator-step--status-progress .hds-stepper-indicator-step__svg-hexagon path,
.hds-stepper-nav__step--nav-interactive.hds-stepper-nav__step--interactive .hds-stepper-nav__step-button.mock-hover .hds-stepper-indicator-step--status-progress .hds-stepper-indicator-step__svg-hexagon path {
  fill: var(--token-color-palette-blue-300);
  stroke: var(--token-color-palette-blue-400);
}
.hds-stepper-nav__step--nav-interactive .hds-stepper-nav__step-button:active .hds-stepper-indicator-step--status-progress.hds-stepper-indicator-step,
.hds-stepper-nav__step--nav-interactive .hds-stepper-nav__step-button.mock-active .hds-stepper-indicator-step--status-progress.hds-stepper-indicator-step {
  cursor: default;
}
.hds-stepper-nav__step--nav-interactive .hds-stepper-nav__step-button:active .hds-stepper-indicator-step--status-progress .hds-stepper-indicator-step__status,
.hds-stepper-nav__step--nav-interactive .hds-stepper-nav__step-button.mock-active .hds-stepper-indicator-step--status-progress .hds-stepper-indicator-step__status {
  color: var(--token-color-foreground-high-contrast);
}
.hds-stepper-nav__step--nav-interactive .hds-stepper-nav__step-button:active .hds-stepper-indicator-step--status-progress .hds-stepper-indicator-step__svg-hexagon path,
.hds-stepper-nav__step--nav-interactive .hds-stepper-nav__step-button.mock-active .hds-stepper-indicator-step--status-progress .hds-stepper-indicator-step__svg-hexagon path {
  fill: var(--token-color-palette-blue-200);
  stroke: var(--token-color-palette-blue-300);
}
.hds-stepper-nav__step--nav-interactive.hds-stepper-nav__step--interactive .hds-stepper-nav__step-button:active .hds-stepper-indicator-step--status-progress.hds-stepper-indicator-step,
.hds-stepper-nav__step--nav-interactive.hds-stepper-nav__step--interactive .hds-stepper-nav__step-button.mock-active .hds-stepper-indicator-step--status-progress.hds-stepper-indicator-step {
  cursor: pointer;
}
.hds-stepper-nav__step--nav-interactive.hds-stepper-nav__step--interactive .hds-stepper-nav__step-button:active .hds-stepper-indicator-step--status-progress .hds-stepper-indicator-step__svg-hexagon path,
.hds-stepper-nav__step--nav-interactive.hds-stepper-nav__step--interactive .hds-stepper-nav__step-button.mock-active .hds-stepper-indicator-step--status-progress .hds-stepper-indicator-step__svg-hexagon path {
  fill: var(--token-color-palette-blue-400);
  stroke: var(--token-color-palette-blue-400);
}

.hds-stepper-nav__step--nav-interactive .hds-stepper-nav__step-button:hover .hds-stepper-indicator-step--status-processing.hds-stepper-indicator-step,
.hds-stepper-nav__step--nav-interactive .hds-stepper-nav__step-button.mock-hover .hds-stepper-indicator-step--status-processing.hds-stepper-indicator-step {
  cursor: default;
}
.hds-stepper-nav__step--nav-interactive .hds-stepper-nav__step-button:hover .hds-stepper-indicator-step--status-processing .hds-stepper-indicator-step__status,
.hds-stepper-nav__step--nav-interactive .hds-stepper-nav__step-button.mock-hover .hds-stepper-indicator-step--status-processing .hds-stepper-indicator-step__status {
  color: var(--token-color-foreground-high-contrast);
}
.hds-stepper-nav__step--nav-interactive .hds-stepper-nav__step-button:hover .hds-stepper-indicator-step--status-processing .hds-stepper-indicator-step__svg-hexagon path,
.hds-stepper-nav__step--nav-interactive .hds-stepper-nav__step-button.mock-hover .hds-stepper-indicator-step--status-processing .hds-stepper-indicator-step__svg-hexagon path {
  fill: var(--token-color-palette-blue-200);
  stroke: var(--token-color-palette-blue-300);
}
.hds-stepper-nav__step--nav-interactive.hds-stepper-nav__step--interactive .hds-stepper-nav__step-button:hover .hds-stepper-indicator-step--status-processing.hds-stepper-indicator-step,
.hds-stepper-nav__step--nav-interactive.hds-stepper-nav__step--interactive .hds-stepper-nav__step-button.mock-hover .hds-stepper-indicator-step--status-processing.hds-stepper-indicator-step {
  cursor: pointer;
}
.hds-stepper-nav__step--nav-interactive.hds-stepper-nav__step--interactive .hds-stepper-nav__step-button:hover .hds-stepper-indicator-step--status-processing .hds-stepper-indicator-step__svg-hexagon path,
.hds-stepper-nav__step--nav-interactive.hds-stepper-nav__step--interactive .hds-stepper-nav__step-button.mock-hover .hds-stepper-indicator-step--status-processing .hds-stepper-indicator-step__svg-hexagon path {
  fill: var(--token-color-palette-blue-300);
  stroke: var(--token-color-palette-blue-400);
}
.hds-stepper-nav__step--nav-interactive .hds-stepper-nav__step-button:active .hds-stepper-indicator-step--status-processing.hds-stepper-indicator-step,
.hds-stepper-nav__step--nav-interactive .hds-stepper-nav__step-button.mock-active .hds-stepper-indicator-step--status-processing.hds-stepper-indicator-step {
  cursor: default;
}
.hds-stepper-nav__step--nav-interactive .hds-stepper-nav__step-button:active .hds-stepper-indicator-step--status-processing .hds-stepper-indicator-step__status,
.hds-stepper-nav__step--nav-interactive .hds-stepper-nav__step-button.mock-active .hds-stepper-indicator-step--status-processing .hds-stepper-indicator-step__status {
  color: var(--token-color-foreground-high-contrast);
}
.hds-stepper-nav__step--nav-interactive .hds-stepper-nav__step-button:active .hds-stepper-indicator-step--status-processing .hds-stepper-indicator-step__svg-hexagon path,
.hds-stepper-nav__step--nav-interactive .hds-stepper-nav__step-button.mock-active .hds-stepper-indicator-step--status-processing .hds-stepper-indicator-step__svg-hexagon path {
  fill: var(--token-color-palette-blue-200);
  stroke: var(--token-color-palette-blue-300);
}
.hds-stepper-nav__step--nav-interactive.hds-stepper-nav__step--interactive .hds-stepper-nav__step-button:active .hds-stepper-indicator-step--status-processing.hds-stepper-indicator-step,
.hds-stepper-nav__step--nav-interactive.hds-stepper-nav__step--interactive .hds-stepper-nav__step-button.mock-active .hds-stepper-indicator-step--status-processing.hds-stepper-indicator-step {
  cursor: pointer;
}
.hds-stepper-nav__step--nav-interactive.hds-stepper-nav__step--interactive .hds-stepper-nav__step-button:active .hds-stepper-indicator-step--status-processing .hds-stepper-indicator-step__svg-hexagon path,
.hds-stepper-nav__step--nav-interactive.hds-stepper-nav__step--interactive .hds-stepper-nav__step-button.mock-active .hds-stepper-indicator-step--status-processing .hds-stepper-indicator-step__svg-hexagon path {
  fill: var(--token-color-palette-blue-400);
  stroke: var(--token-color-palette-blue-400);
}

.hds-stepper-nav__step--nav-interactive .hds-stepper-nav__step-button:hover .hds-stepper-indicator-step--status-complete.hds-stepper-indicator-step,
.hds-stepper-nav__step--nav-interactive .hds-stepper-nav__step-button.mock-hover .hds-stepper-indicator-step--status-complete.hds-stepper-indicator-step {
  cursor: default;
}
.hds-stepper-nav__step--nav-interactive .hds-stepper-nav__step-button:hover .hds-stepper-indicator-step--status-complete .hds-stepper-indicator-step__status,
.hds-stepper-nav__step--nav-interactive .hds-stepper-nav__step-button.mock-hover .hds-stepper-indicator-step--status-complete .hds-stepper-indicator-step__status {
  color: var(--token-color-palette-blue-200);
}
.hds-stepper-nav__step--nav-interactive .hds-stepper-nav__step-button:hover .hds-stepper-indicator-step--status-complete .hds-stepper-indicator-step__svg-hexagon path,
.hds-stepper-nav__step--nav-interactive .hds-stepper-nav__step-button.mock-hover .hds-stepper-indicator-step--status-complete .hds-stepper-indicator-step__svg-hexagon path {
  fill: var(--token-color-surface-action);
  stroke: var(--token-color-palette-blue-300);
}
.hds-stepper-nav__step--nav-interactive.hds-stepper-nav__step--interactive .hds-stepper-nav__step-button:hover .hds-stepper-indicator-step--status-complete.hds-stepper-indicator-step,
.hds-stepper-nav__step--nav-interactive.hds-stepper-nav__step--interactive .hds-stepper-nav__step-button.mock-hover .hds-stepper-indicator-step--status-complete.hds-stepper-indicator-step {
  cursor: pointer;
}
.hds-stepper-nav__step--nav-interactive.hds-stepper-nav__step--interactive .hds-stepper-nav__step-button:hover .hds-stepper-indicator-step--status-complete .hds-stepper-indicator-step__status,
.hds-stepper-nav__step--nav-interactive.hds-stepper-nav__step--interactive .hds-stepper-nav__step-button.mock-hover .hds-stepper-indicator-step--status-complete .hds-stepper-indicator-step__status {
  color: var(--token-color-palette-blue-300);
}
.hds-stepper-nav__step--nav-interactive.hds-stepper-nav__step--interactive .hds-stepper-nav__step-button:hover .hds-stepper-indicator-step--status-complete .hds-stepper-indicator-step__svg-hexagon path,
.hds-stepper-nav__step--nav-interactive.hds-stepper-nav__step--interactive .hds-stepper-nav__step-button.mock-hover .hds-stepper-indicator-step--status-complete .hds-stepper-indicator-step__svg-hexagon path {
  fill: var(--token-color-palette-blue-100);
  stroke: var(--token-color-palette-blue-400);
}
.hds-stepper-nav__step--nav-interactive .hds-stepper-nav__step-button:active .hds-stepper-indicator-step--status-complete.hds-stepper-indicator-step,
.hds-stepper-nav__step--nav-interactive .hds-stepper-nav__step-button.mock-active .hds-stepper-indicator-step--status-complete.hds-stepper-indicator-step {
  cursor: default;
}
.hds-stepper-nav__step--nav-interactive .hds-stepper-nav__step-button:active .hds-stepper-indicator-step--status-complete .hds-stepper-indicator-step__status,
.hds-stepper-nav__step--nav-interactive .hds-stepper-nav__step-button.mock-active .hds-stepper-indicator-step--status-complete .hds-stepper-indicator-step__status {
  color: var(--token-color-palette-blue-200);
}
.hds-stepper-nav__step--nav-interactive .hds-stepper-nav__step-button:active .hds-stepper-indicator-step--status-complete .hds-stepper-indicator-step__svg-hexagon path,
.hds-stepper-nav__step--nav-interactive .hds-stepper-nav__step-button.mock-active .hds-stepper-indicator-step--status-complete .hds-stepper-indicator-step__svg-hexagon path {
  fill: var(--token-color-surface-action);
  stroke: var(--token-color-palette-blue-300);
}
.hds-stepper-nav__step--nav-interactive.hds-stepper-nav__step--interactive .hds-stepper-nav__step-button:active .hds-stepper-indicator-step--status-complete.hds-stepper-indicator-step,
.hds-stepper-nav__step--nav-interactive.hds-stepper-nav__step--interactive .hds-stepper-nav__step-button.mock-active .hds-stepper-indicator-step--status-complete.hds-stepper-indicator-step {
  cursor: pointer;
}
.hds-stepper-nav__step--nav-interactive.hds-stepper-nav__step--interactive .hds-stepper-nav__step-button:active .hds-stepper-indicator-step--status-complete .hds-stepper-indicator-step__status,
.hds-stepper-nav__step--nav-interactive.hds-stepper-nav__step--interactive .hds-stepper-nav__step-button.mock-active .hds-stepper-indicator-step--status-complete .hds-stepper-indicator-step__status {
  color: var(--token-color-palette-blue-400);
}
.hds-stepper-nav__step--nav-interactive.hds-stepper-nav__step--interactive .hds-stepper-nav__step-button:active .hds-stepper-indicator-step--status-complete .hds-stepper-indicator-step__svg-hexagon path,
.hds-stepper-nav__step--nav-interactive.hds-stepper-nav__step--interactive .hds-stepper-nav__step-button.mock-active .hds-stepper-indicator-step--status-complete .hds-stepper-indicator-step__svg-hexagon path {
  fill: var(--token-color-palette-blue-100);
  stroke: var(--token-color-palette-blue-400);
}

@media screen and (max-width: 479.98px) {
  .hds-stepper-nav__progress-bar::before, .hds-stepper-nav__progress-bar::after {
    content: none;
  }
  .hds-stepper-nav__list {
    flex-direction: column;
  }
  .hds-stepper-nav__step-content {
    align-items: start;
    padding: 8px;
    border-radius: 0;
  }
  .hds-stepper-nav__step:first-of-type .hds-stepper-nav__step-content {
    padding-top: 0;
  }
  .hds-stepper-nav__step-progress {
    position: static;
    justify-content: start;
  }
  .hds-stepper-nav__step-text {
    align-items: start;
    margin-top: 4px;
    padding: 0;
  }
  .hds-stepper-nav--interactive .hds-stepper-nav__step--interactive .hds-stepper-nav__step-button,
  .hds-stepper-nav--interactive .hds-stepper-nav__step--active .hds-stepper-nav__step-button {
    position: relative;
    outline-style: solid;
    outline-color: transparent;
    isolation: isolate;
  }
  .hds-stepper-nav--interactive .hds-stepper-nav__step--interactive .hds-stepper-nav__step-button::before,
  .hds-stepper-nav--interactive .hds-stepper-nav__step--active .hds-stepper-nav__step-button::before {
    position: absolute;
    top: -1px;
    right: -1px;
    bottom: -1px;
    left: -1px;
    z-index: -1;
    border-radius: 0;
    content: "";
  }
  .hds-stepper-nav--interactive .hds-stepper-nav__step--interactive .hds-stepper-nav__step-button:focus::before, .hds-stepper-nav--interactive .hds-stepper-nav__step--interactive .hds-stepper-nav__step-button.mock-focus::before,
  .hds-stepper-nav--interactive .hds-stepper-nav__step--active .hds-stepper-nav__step-button:focus::before,
  .hds-stepper-nav--interactive .hds-stepper-nav__step--active .hds-stepper-nav__step-button.mock-focus::before {
    box-shadow: var(--token-focus-ring-action-box-shadow);
  }
  .hds-stepper-nav--interactive .hds-stepper-nav__step--interactive .hds-stepper-nav__step-button:focus:not(:focus-visible)::before,
  .hds-stepper-nav--interactive .hds-stepper-nav__step--active .hds-stepper-nav__step-button:focus:not(:focus-visible)::before {
    box-shadow: none;
  }
  .hds-stepper-nav--interactive .hds-stepper-nav__step--interactive .hds-stepper-nav__step-button:focus-visible::before,
  .hds-stepper-nav--interactive .hds-stepper-nav__step--active .hds-stepper-nav__step-button:focus-visible::before {
    box-shadow: var(--token-focus-ring-action-box-shadow);
  }
  .hds-stepper-nav--interactive .hds-stepper-nav__step--interactive .hds-stepper-nav__step-button:focus:active::before, .hds-stepper-nav--interactive .hds-stepper-nav__step--interactive .hds-stepper-nav__step-button.mock-focus.mock-active::before,
  .hds-stepper-nav--interactive .hds-stepper-nav__step--active .hds-stepper-nav__step-button:focus:active::before,
  .hds-stepper-nav--interactive .hds-stepper-nav__step--active .hds-stepper-nav__step-button.mock-focus.mock-active::before {
    box-shadow: none;
  }
  .hds-stepper-nav__step--active .hds-stepper-indicator-step__svg-hexagon path,
  .hds-stepper-nav__step--active .hds-stepper-indicator-step__status,
  .hds-stepper-nav__step--active .hds-stepper-nav__step-title {
    transition: none;
  }
}
/**
 * Copyright (c) HashiCorp, Inc.
 * SPDX-License-Identifier: MPL-2.0
 */
/**
 * Copyright (c) HashiCorp, Inc.
 * SPDX-License-Identifier: MPL-2.0
 */
.hds-stepper-indicator-task {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 16px;
  height: 16px;
  color: var(--token-color-foreground-strong);
}

.hds-stepper-indicator-task__icon {
  width: 12px;
  height: 12px;
}

.hds-stepper-indicator-task--is-interactive {
  cursor: pointer;
}
.hds-stepper-indicator-task--is-interactive.hds-stepper-indicator-task--status-incomplete {
  color: var(--token-color-palette-neutral-300);
}
.hds-stepper-indicator-task--is-interactive.hds-stepper-indicator-task--status-incomplete:hover, .hds-stepper-indicator-task--is-interactive.hds-stepper-indicator-task--status-incomplete.mock-hover {
  color: var(--token-color-foreground-action-hover);
}
.hds-stepper-indicator-task--is-interactive.hds-stepper-indicator-task--status-incomplete:active, .hds-stepper-indicator-task--is-interactive.hds-stepper-indicator-task--status-incomplete.mock-active {
  color: var(--token-color-foreground-action-active);
}
.hds-stepper-indicator-task--is-interactive.hds-stepper-indicator-task--status-progress {
  color: var(--token-color-foreground-action);
}
.hds-stepper-indicator-task--is-interactive.hds-stepper-indicator-task--status-progress:hover, .hds-stepper-indicator-task--is-interactive.hds-stepper-indicator-task--status-progress.mock-hover {
  color: var(--token-color-foreground-action-hover);
}
.hds-stepper-indicator-task--is-interactive.hds-stepper-indicator-task--status-progress:active, .hds-stepper-indicator-task--is-interactive.hds-stepper-indicator-task--status-progress.mock-active {
  color: var(--token-color-foreground-action-active);
}
.hds-stepper-indicator-task--is-interactive.hds-stepper-indicator-task--status-processing {
  color: var(--token-color-foreground-action);
}
.hds-stepper-indicator-task--is-interactive.hds-stepper-indicator-task--status-processing:hover, .hds-stepper-indicator-task--is-interactive.hds-stepper-indicator-task--status-processing.mock-hover {
  color: var(--token-color-foreground-action-hover);
}
.hds-stepper-indicator-task--is-interactive.hds-stepper-indicator-task--status-processing:active, .hds-stepper-indicator-task--is-interactive.hds-stepper-indicator-task--status-processing.mock-active {
  color: var(--token-color-foreground-action-active);
}
.hds-stepper-indicator-task--is-interactive.hds-stepper-indicator-task--status-complete {
  color: var(--token-color-foreground-success);
}
.hds-stepper-indicator-task--is-interactive.hds-stepper-indicator-task--status-complete:hover, .hds-stepper-indicator-task--is-interactive.hds-stepper-indicator-task--status-complete.mock-hover {
  color: var(--token-color-palette-green-300);
}
.hds-stepper-indicator-task--is-interactive.hds-stepper-indicator-task--status-complete:active, .hds-stepper-indicator-task--is-interactive.hds-stepper-indicator-task--status-complete.mock-active {
  color: var(--token-color-palette-green-400);
}

/**
 * Copyright (c) HashiCorp, Inc.
 * SPDX-License-Identifier: MPL-2.0
 */
.hds-table {
  width: 100%;
  border-radius: var(--token-border-radius-medium);
  border-spacing: 0;
}

.hds-table--layout-fixed {
  table-layout: fixed;
}

.hds-table,
.hds-table__th,
.hds-table__td {
  border: calc(1px / 2) solid var(--token-color-border-primary);
}

.hds-table__thead .hds-table__tr {
  color: var(--token-color-foreground-strong);
  background-color: var(--token-color-surface-strong);
}
.hds-table__thead .hds-table__tr .hds-table__th {
  padding: 14px 16px 13px 16px;
  text-align: left;
}
.hds-table__thead .hds-table__tr .hds-table__th--align-center,
.hds-table__thead .hds-table__tr .hds-table__td--align-center {
  text-align: center;
}
.hds-table__thead .hds-table__tr .hds-table__th--align-center .hds-table__th-content,
.hds-table__thead .hds-table__tr .hds-table__td--align-center .hds-table__th-content {
  justify-content: center;
}
.hds-table__thead .hds-table__tr .hds-table__th--align-right,
.hds-table__thead .hds-table__tr .hds-table__td--align-right {
  text-align: right;
}
.hds-table__thead .hds-table__tr .hds-table__th--align-right .hds-table__th-content,
.hds-table__thead .hds-table__tr .hds-table__td--align-right .hds-table__th-content {
  justify-content: flex-end;
}
.hds-table__thead .hds-table__tr:first-of-type .hds-table__th:first-child {
  border-top-left-radius: calc(var(--token-border-radius-medium) - 1px);
}
.hds-table__thead .hds-table__tr:first-of-type .hds-table__th:last-child {
  border-top-right-radius: calc(var(--token-border-radius-medium) - 1px);
}

.hds-table__th--is-selectable {
  width: 48px;
}

.hds-table__th-content {
  display: flex;
  gap: 8px;
  align-items: center;
  justify-content: flex-start;
}

.hds-table__th-button {
  display: flex;
  flex: none;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 24px;
  margin: -2px 0;
  padding: 0;
  color: var(--token-color-foreground-faint);
  background-color: transparent;
  border: 1px solid transparent;
  border-radius: var(--token-border-radius-x-small);
  position: relative;
  outline-style: solid;
  outline-color: transparent;
  isolation: isolate;
}
.hds-table__th-button:hover, .hds-table__th-button.mock-hover {
  color: var(--token-color-foreground-primary);
  background-color: var(--token-color-surface-interactive);
  border-color: var(--token-color-border-strong);
  box-shadow: var(--token-elevation-low-box-shadow);
  cursor: pointer;
}
.hds-table__th-button::before {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: -1;
  border-radius: inherit;
  content: "";
}
.hds-table__th-button:focus::before, .hds-table__th-button.mock-focus::before {
  box-shadow: var(--token-focus-ring-action-box-shadow);
}
.hds-table__th-button:focus:not(:focus-visible)::before {
  box-shadow: none;
}
.hds-table__th-button:focus-visible::before {
  box-shadow: var(--token-focus-ring-action-box-shadow);
}
.hds-table__th-button:focus:active::before, .hds-table__th-button.mock-focus.mock-active::before {
  box-shadow: none;
}
.hds-table__th-button:active, .hds-table__th-button.mock-active {
  color: var(--token-color-foreground-primary);
  background-color: var(--token-color-surface-interactive-active);
  border-color: var(--token-color-border-strong);
  box-shadow: none;
}

.hds-table__th-button--is-sorted {
  color: var(--token-color-foreground-action);
}
.hds-table__th-button--is-sorted:hover, .hds-table__th-button--is-sorted.mock-hover {
  color: var(--token-color-foreground-action-hover);
}
.hds-table__th-button--is-sorted:active, .hds-table__th-button--is-sorted.mock-active {
  color: var(--token-color-foreground-action-active);
}

.hds-table__th-button-aria-label-hidden-segment {
  display: none;
}

.hds-table__tbody .hds-table__tr {
  color: var(--token-color-foreground-primary);
  background-color: var(--token-color-surface-primary);
}
.hds-table--striped .hds-table__tbody .hds-table__tr:nth-child(even) {
  background-color: var(--token-color-surface-faint);
}
.hds-table__tbody .hds-table__tr:last-of-type .hds-table__th:first-child,
.hds-table__tbody .hds-table__tr:last-of-type .hds-table__td:first-child {
  border-bottom-left-radius: calc(var(--token-border-radius-medium) - 1px);
}
.hds-table__tbody .hds-table__tr:last-of-type .hds-table__td:last-child {
  border-bottom-right-radius: calc(var(--token-border-radius-medium) - 1px);
}
.hds-table__tbody .hds-table__th,
.hds-table__tbody .hds-table__td {
  text-align: left;
}
.hds-table--density-short .hds-table__tbody .hds-table__th,
.hds-table--density-short .hds-table__tbody .hds-table__td {
  padding: 6px 16px 5px 16px;
}
.hds-table--density-medium .hds-table__tbody .hds-table__th,
.hds-table--density-medium .hds-table__tbody .hds-table__td {
  padding: 14px 16px 13px 16px;
}
.hds-table--density-tall .hds-table__tbody .hds-table__th,
.hds-table--density-tall .hds-table__tbody .hds-table__td {
  padding: 22px 16px 21px 16px;
}
.hds-table__tbody .hds-table__th--align-center,
.hds-table__tbody .hds-table__td--align-center {
  text-align: center;
}
.hds-table__tbody .hds-table__th--align-center .hds-table__th-content,
.hds-table__tbody .hds-table__td--align-center .hds-table__th-content {
  justify-content: center;
}
.hds-table__tbody .hds-table__th--align-right,
.hds-table__tbody .hds-table__td--align-right {
  text-align: right;
}
.hds-table__tbody .hds-table__th--align-right .hds-table__th-content,
.hds-table__tbody .hds-table__td--align-right .hds-table__th-content {
  justify-content: flex-end;
}
.hds-table--valign-top .hds-table__tbody .hds-table__th,
.hds-table--valign-top .hds-table__tbody .hds-table__td {
  vertical-align: top;
}
.hds-table--valign-middle .hds-table__tbody .hds-table__th,
.hds-table--valign-middle .hds-table__tbody .hds-table__td {
  vertical-align: middle;
}
.hds-table--valign-baseline .hds-table__tbody .hds-table__th,
.hds-table--valign-baseline .hds-table__tbody .hds-table__td {
  vertical-align: baseline;
}

.hds-table__checkbox {
  display: block;
  margin: 2px 0;
}

/**
 * Copyright (c) HashiCorp, Inc.
 * SPDX-License-Identifier: MPL-2.0
 */
.hds-tabs__tablist-wrapper {
  position: relative;
}
.hds-tabs__tablist-wrapper::before {
  position: absolute;
  right: 0;
  bottom: calc((var(--token-tabs-indicator-height) - var(--token-tabs-divider-height)) / 2);
  left: 0;
  display: block;
  border-top: var(--token-tabs-divider-height) solid var(--token-color-border-primary);
  content: "";
}

.hds-tabs__tablist {
  position: relative;
  display: flex;
  margin: 0;
  padding: 0;
  overflow-x: auto;
  isolation: isolate;
  -webkit-overflow-scrolling: touch;
}

.hds-tabs__tab {
  position: relative;
  display: flex;
  align-items: center;
  margin: 0;
  color: var(--token-color-foreground-primary);
  white-space: nowrap;
  text-decoration: none;
  list-style: none;
}
.hds-tabs__tab:hover, .hds-tabs__tab.mock-hover {
  color: var(--token-color-foreground-action);
}
.hds-tabs__tab.hds-tabs__tab--is-selected {
  color: var(--token-color-foreground-action);
}
.hds-tabs__tab.hds-tabs__tab--is-selected:hover {
  color: var(--token-color-foreground-action-hover);
}
.hds-tabs__tab.hds-tabs__tab--is-selected:hover ~ .hds-tabs__tab-indicator {
  background: var(--token-color-foreground-action-hover);
}

.hds-tabs__tab-button {
  position: relative;
  outline-style: solid;
  outline-color: transparent;
  isolation: isolate;
  position: static;
  display: flex;
  gap: var(--token-tabs-tab-gutter);
  align-items: center;
  padding: 0;
  color: inherit;
  font-weight: var(--token-typography-font-weight-medium);
  font-family: var(--token-typography-body-200-font-family);
  background-color: transparent;
  border: none;
  border-radius: var(--token-tabs-tab-border-radius);
  cursor: pointer;
}
.hds-tabs__tab-button::before {
  position: absolute;
  top: var(--token-tabs-tab-focus-inset);
  right: var(--token-tabs-tab-focus-inset);
  bottom: var(--token-tabs-tab-focus-inset);
  left: var(--token-tabs-tab-focus-inset);
  z-index: -1;
  border-radius: 5px;
  content: "";
}
.hds-tabs__tab-button:focus::before, .hds-tabs__tab-button.mock-focus::before {
  box-shadow: var(--token-focus-ring-action-box-shadow);
}
.hds-tabs__tab-button:focus:not(:focus-visible)::before {
  box-shadow: none;
}
.hds-tabs__tab-button:focus-visible::before {
  box-shadow: var(--token-focus-ring-action-box-shadow);
}
.hds-tabs__tab-button:focus:active::before, .hds-tabs__tab-button.mock-focus.mock-active::before {
  box-shadow: none;
}
.hds-tabs__tab-button::after {
  position: absolute;
  content: "";
  inset: 0;
}

.hds-tabs__tab-indicator {
  position: absolute;
  right: 0;
  bottom: 0;
  left: var(--indicator-left-pos, 0);
  z-index: 1;
  display: block;
  width: var(--indicator-width, 0);
  height: var(--token-tabs-indicator-height);
  background-color: var(--token-color-foreground-action);
  border-radius: var(--token-tabs-indicator-height);
}
@media screen and (prefers-reduced-motion: no-preference) {
  .hds-tabs__tab-indicator {
    transition-timing-function: var(--token-tabs-indicator-transition-function);
    transition-duration: var(--token-tabs-indicator-transition-duration);
    transition-property: left, width;
  }
}

.hds-tabs__panel[hidden] {
  display: none;
}

.hds-tabs--size-medium .hds-tabs__tab {
  height: var(--token-tabs-tab-height-medium);
  padding: var(--token-tabs-tab-padding-vertical) var(--token-tabs-tab-padding-horizontal-medium);
}
.hds-tabs--size-medium .hds-tabs__tab-button {
  font-size: var(--token-typography-body-200-font-size);
}

.hds-tabs--size-large .hds-tabs__tab {
  height: var(--token-tabs-tab-height-large);
  padding: var(--token-tabs-tab-padding-vertical) var(--token-tabs-tab-padding-horizontal-large);
}
.hds-tabs--size-large .hds-tabs__tab-button {
  font-size: var(--token-typography-body-300-font-size);
}

/**
 * Copyright (c) HashiCorp, Inc.
 * SPDX-License-Identifier: MPL-2.0
 */
.hds-tag {
  display: inline-flex;
  align-items: stretch;
  width: fit-content;
  max-width: 100%;
  vertical-align: middle;
  background-color: var(--token-color-surface-interactive);
  border: 1px solid var(--token-color-border-strong);
  border-radius: 50px;
}

.hds-tag__dismiss {
  flex: 0 0 auto;
  margin: 0;
  padding: 6px 4px 6px 8px;
  background-color: var(--token-color-surface-interactive);
  border: none;
  border-radius: inherit;
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
}

.hds-tag__dismiss-icon {
  width: 12px;
  height: 12px;
}

.hds-tag__dismiss-icon,
.hds-tag__text {
  color: var(--token-color-foreground-primary);
}

.hds-tag__text,
.hds-tag__link {
  flex: 1 0 0;
  max-width: 166px;
  padding: 3px 10px 5px 10px;
  background-color: var(--token-color-surface-interactive);
  border-radius: inherit;
}

.hds-tag__text-container {
  display: -webkit-box;
  overflow: hidden;
  line-height: 1rem;
  word-break: break-all;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
  line-clamp: 1;
}

.hds-tag__dismiss ~ .hds-tag__text,
.hds-tag__dismiss ~ .hds-tag__link {
  max-width: 160px;
  padding: 3px 8px 5px 6px;
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
}

.hds-tag__dismiss,
.hds-tag__link {
  cursor: pointer;
}
.hds-tag__dismiss:hover, .hds-tag__dismiss.mock-hover,
.hds-tag__link:hover,
.hds-tag__link.mock-hover {
  background-color: var(--token-color-surface-interactive-hover);
}
.hds-tag__dismiss:active, .hds-tag__dismiss.mock-active,
.hds-tag__link:active,
.hds-tag__link.mock-active {
  background-color: var(--token-color-surface-interactive-active);
}
.hds-tag__dismiss:focus, .hds-tag__dismiss.mock-focus,
.hds-tag__link:focus,
.hds-tag__link.mock-focus {
  outline-style: solid;
  outline-color: transparent;
  z-index: 1;
}
.hds-tag__dismiss:focus:focus, .hds-tag__dismiss:focus.mock-focus, .hds-tag__dismiss.mock-focus:focus, .hds-tag__dismiss.mock-focus.mock-focus,
.hds-tag__link:focus:focus,
.hds-tag__link:focus.mock-focus,
.hds-tag__link.mock-focus:focus,
.hds-tag__link.mock-focus.mock-focus {
  box-shadow: var(--token-focus-ring-action-box-shadow);
}
.hds-tag__dismiss:focus:focus:not(:focus-visible), .hds-tag__dismiss.mock-focus:focus:not(:focus-visible),
.hds-tag__link:focus:focus:not(:focus-visible),
.hds-tag__link.mock-focus:focus:not(:focus-visible) {
  box-shadow: none;
}
.hds-tag__dismiss:focus:focus-visible, .hds-tag__dismiss.mock-focus:focus-visible,
.hds-tag__link:focus:focus-visible,
.hds-tag__link.mock-focus:focus-visible {
  box-shadow: var(--token-focus-ring-action-box-shadow);
}
.hds-tag__dismiss:focus:focus:active, .hds-tag__dismiss:focus.mock-focus.mock-active, .hds-tag__dismiss.mock-focus:focus:active, .hds-tag__dismiss.mock-focus.mock-focus.mock-active,
.hds-tag__link:focus:focus:active,
.hds-tag__link:focus.mock-focus.mock-active,
.hds-tag__link.mock-focus:focus:active,
.hds-tag__link.mock-focus.mock-focus.mock-active {
  box-shadow: none;
}

.hds-tooltip-button.hds-tag__text {
  cursor: text;
  user-select: text;
}
.hds-tooltip-button.hds-tag__text:focus, .hds-tooltip-button.hds-tag__text.mock-focus {
  outline-style: solid;
  outline-color: transparent;
  z-index: 1;
}
.hds-tooltip-button.hds-tag__text:focus:focus, .hds-tooltip-button.hds-tag__text:focus.mock-focus, .hds-tooltip-button.hds-tag__text.mock-focus:focus, .hds-tooltip-button.hds-tag__text.mock-focus.mock-focus {
  box-shadow: var(--token-focus-ring-action-box-shadow);
}
.hds-tooltip-button.hds-tag__text:focus:focus:not(:focus-visible), .hds-tooltip-button.hds-tag__text.mock-focus:focus:not(:focus-visible) {
  box-shadow: none;
}
.hds-tooltip-button.hds-tag__text:focus:focus-visible, .hds-tooltip-button.hds-tag__text.mock-focus:focus-visible {
  box-shadow: var(--token-focus-ring-action-box-shadow);
}
.hds-tooltip-button.hds-tag__text:focus:focus:active, .hds-tooltip-button.hds-tag__text:focus.mock-focus.mock-active, .hds-tooltip-button.hds-tag__text.mock-focus:focus:active, .hds-tooltip-button.hds-tag__text.mock-focus.mock-focus.mock-active {
  box-shadow: none;
}
.hds-tooltip-button.hds-tag__text:focus-visible::before {
  box-shadow: none;
}

.hds-tag--color-primary .hds-tag__link {
  color: var(--token-color-foreground-action);
}
.hds-tag--color-primary .hds-tag__link:hover, .hds-tag--color-primary .hds-tag__link.mock-hover {
  color: var(--token-color-foreground-action-hover);
}
.hds-tag--color-primary .hds-tag__link:active, .hds-tag--color-primary .hds-tag__link.mock-active {
  color: var(--token-color-foreground-action-active);
}

.hds-tag--color-secondary .hds-tag__link {
  color: var(--token-color-foreground-strong);
}

/**
 * Copyright (c) HashiCorp, Inc.
 * SPDX-License-Identifier: MPL-2.0
 */
.hds-text--align-left {
  text-align: left;
}

.hds-text--align-center {
  text-align: center;
}

.hds-text--align-right {
  text-align: right;
}

/**
 * Copyright (c) HashiCorp, Inc.
 * SPDX-License-Identifier: MPL-2.0
 */
.hds-time--range {
  display: inline-flex;
  gap: 2px;
}

.hds-time-wrapper .hds-time {
  text-decoration: underline;
  text-decoration-style: dotted;
  text-underline-offset: 2px;
}

/**
 * Copyright (c) HashiCorp, Inc.
 * SPDX-License-Identifier: MPL-2.0
 */
.hds-toast {
  width: fit-content;
  min-width: min(360px, 80vw);
  max-width: min(500px, 80vw);
  box-shadow: var(--token-elevation-higher-box-shadow);
}

/**
 * Copyright (c) HashiCorp, Inc.
 * SPDX-License-Identifier: MPL-2.0
 */
.hds-tooltip-button {
  position: relative;
  outline-style: solid;
  outline-color: transparent;
  isolation: isolate;
}
.hds-tooltip-button::before {
  position: absolute;
  top: var(--token-tooltip-focus-offset);
  right: var(--token-tooltip-focus-offset);
  bottom: var(--token-tooltip-focus-offset);
  left: var(--token-tooltip-focus-offset);
  z-index: -1;
  border-radius: 5px;
  content: "";
}
.hds-tooltip-button:focus::before, .hds-tooltip-button.mock-focus::before {
  box-shadow: var(--token-focus-ring-action-box-shadow);
}
.hds-tooltip-button:focus:not(:focus-visible)::before {
  box-shadow: none;
}
.hds-tooltip-button:focus-visible::before {
  box-shadow: var(--token-focus-ring-action-box-shadow);
}
.hds-tooltip-button:focus:active::before, .hds-tooltip-button.mock-focus.mock-active::before {
  box-shadow: none;
}

:where(.hds-tooltip-button) {
  margin: 0;
  padding: 0;
  color: inherit;
  font: inherit;
  text-align: inherit;
  background-color: inherit;
  border: none;
}

:where(.hds-tooltip-button--is-inline) {
  display: inline-flex;
}

:where(.hds-tooltip-button--is-block) {
  display: flex;
}

.tippy-box[data-theme~=hds] {
  padding: var(--token-tooltip-padding-vertical) var(--token-tooltip-padding-horizontal);
  color: var(--token-tooltip-color-foreground-primary);
  font-weight: var(--token-typography-font-weight-regular);
  font-size: var(--token-typography-body-200-font-size);
  font-family: var(--token-typography-body-200-font-family);
  line-height: var(--token-typography-body-200-line-height);
  overflow-wrap: break-word;
  background-color: var(--token-tooltip-color-surface-primary);
  border-radius: var(--token-tooltip-border-radius);
  box-shadow: var(--token-elevation-higher-box-shadow);
  transition-property: transform, visibility, opacity;
}
.tippy-box[data-theme~=hds][data-animation=fade][data-state=hidden] {
  opacity: 0;
}
.tippy-box[data-theme~=hds][data-inertia][data-state=visible] {
  transition-timing-function: var(--token-tooltip-transition-function);
}
.tippy-box[data-theme~=hds] .tippy-content {
  position: relative;
  z-index: 1;
  max-width: calc(var(--token-tooltip-max-width) - 2 * var(--token-tooltip-padding-horizontal));
  white-space: normal;
  text-align: left;
}
.tippy-box[data-theme~=hds] .tippy-svg-arrow {
  width: 16px;
  height: 16px;
  text-align: initial;
  fill: var(--token-tooltip-color-surface-primary);
}
.tippy-box[data-theme~=hds] .tippy-svg-arrow, .tippy-box[data-theme~=hds] .tippy-svg-arrow > svg {
  position: absolute;
}
.tippy-box[data-theme~=hds][data-placement^=top] > .tippy-svg-arrow {
  bottom: 0;
}
.tippy-box[data-theme~=hds][data-placement^=top] > .tippy-svg-arrow::after, .tippy-box[data-theme~=hds][data-placement^=top] > .tippy-svg-arrow > svg {
  top: 16px;
  transform: rotate(180deg);
}
.tippy-box[data-theme~=hds][data-placement^=bottom] > .tippy-svg-arrow {
  top: 0;
}
.tippy-box[data-theme~=hds][data-placement^=bottom] > .tippy-svg-arrow > svg {
  bottom: 16px;
}
.tippy-box[data-theme~=hds][data-placement^=left] > .tippy-svg-arrow {
  right: 0;
}
.tippy-box[data-theme~=hds][data-placement^=left] > .tippy-svg-arrow::after, .tippy-box[data-theme~=hds][data-placement^=left] > .tippy-svg-arrow > svg {
  top: calc(50% - 3px);
  left: 11px;
  transform: rotate(90deg);
}
.tippy-box[data-theme~=hds][data-placement^=right] > .tippy-svg-arrow {
  left: 0;
}
.tippy-box[data-theme~=hds][data-placement^=right] > .tippy-svg-arrow::after, .tippy-box[data-theme~=hds][data-placement^=right] > .tippy-svg-arrow > svg {
  top: calc(50% - 3px);
  right: 11px;
  transform: rotate(-90deg);
}

/**
 * Copyright (c) HashiCorp, Inc.
 * SPDX-License-Identifier: MPL-2.0
 */
.sr-only {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  margin: -1px !important;
  padding: 0 !important;
  overflow: hidden !important;
  white-space: nowrap !important; /* 3 */
  border: 0 !important;
  clip: rect(1px, 1px, 1px, 1px) !important; /* 1 */
  clip-path: inset(50%) !important; /* 2 */
}