/* docara-shell-source: runtime/component/kbd/css/kbd.css */
@layer sf.components {
  :where(kbd:not(.sf-kbd--group), .sf-kbd:not(.sf-kbd--group)) {
    --sf-kbd--min-block-size: var(--sf-text-height-1\/3);
    --sf-kbd--min-inline-size: var(--sf-text-height-1\/3);
    --sf-kbd--padding-block: var(--sf-space-1\/4);
    --sf-kbd--padding-inline: var(--sf-space-1\/2);
    --sf-kbd--color: var(--sf-on-surface);
    --sf-kbd--background: var(--sf-surface-container);
    --sf-on-surface-variant: var(--sf-on-surface-container--variant);
    --sf-kbd--border-color: var(--sf-outline-variant);
    --sf-kbd--border-width: var(--sf-px);
    --sf-kbd--radius: var(--sf-radius--ui);
    --sf-kbd--font-family: var(--sf-mono);
    --sf-kbd--font-size: var(--sf-text-size-1\/3);
    --sf-kbd--font-weight: var(--sf-font-weight-medium);
    --sf-kbd--line-height: var(--sf-text-height-1\/3);
    display: inline-flex;
    box-sizing: border-box;
    align-items: center;
    justify-content: center;
    min-height: var(--sf-kbd--min-block-size);
    min-block-size: var(--sf-kbd--min-block-size);
    min-width: var(--sf-kbd--min-inline-size);
    min-inline-size: var(--sf-kbd--min-inline-size);
    padding-top: var(--sf-kbd--padding-block);
    padding-bottom: var(--sf-kbd--padding-block);
    padding-block: var(--sf-kbd--padding-block);
    padding-left: var(--sf-kbd--padding-inline);
    padding-right: var(--sf-kbd--padding-inline);
    padding-inline: var(--sf-kbd--padding-inline);
    color: var(--sf-kbd--color);
    background: var(--sf-kbd--background);
    border: var(--sf-kbd--border-width) solid var(--sf-kbd--border-color);
    border-radius: var(--sf-kbd--radius);
    font-family: var(--sf-kbd--font-family);
    font-size: var(--sf-kbd--font-size);
    font-weight: var(--sf-kbd--font-weight);
    line-height: var(--sf-kbd--line-height);
    unicode-bidi: -webkit-isolate;
    unicode-bidi: -moz-isolate;
    unicode-bidi: isolate;
    vertical-align: baseline;
    white-space: nowrap;
  }
  kbd[\:has\(\%3E\%20kbd\)],
  .sf-kbd--group {
    display: inline-flex;
    box-sizing: border-box;
    align-items: center;
    gap: var(--sf-space-1\/4);
    min-height: var(--sf-0);
    min-block-size: var(--sf-0);
    min-width: var(--sf-0);
    min-inline-size: var(--sf-0);
    margin: var(--sf-0);
    padding: var(--sf-0);
    color: inherit;
    background: var(--sf-transparent);
    border: none;
    border-radius: var(--sf-0);
    font: inherit;
    line-height: inherit;
    unicode-bidi: -webkit-isolate;
    unicode-bidi: -moz-isolate;
    unicode-bidi: isolate;
    vertical-align: baseline;
    white-space: nowrap;
  }
  kbd[\:has\(\%3E\%20kbd\)],
  .sf-kbd--group {
    display: inline-flex;
    box-sizing: border-box;
    align-items: center;
    gap: var(--sf-space-1\/4);
    min-height: var(--sf-0);
    min-height: var(--sf-0);
    min-block-size: var(--sf-0);
    min-width: var(--sf-0);
    min-width: var(--sf-0);
    min-inline-size: var(--sf-0);
    margin: var(--sf-0);
    padding: var(--sf-0);
    color: inherit;
    background: var(--sf-transparent);
    border: none;
    border-radius: var(--sf-0);
    font: inherit;
    line-height: inherit;
    unicode-bidi: -webkit-isolate;
    unicode-bidi: -moz-isolate;
    unicode-bidi: isolate;
    vertical-align: baseline;
    white-space: nowrap;
  }
  kbd:has(> kbd),
  .sf-kbd--group {
    display: inline-flex;
    box-sizing: border-box;
    align-items: center;
    gap: var(--sf-space-1\/4);
    min-height: var(--sf-0);
    min-block-size: var(--sf-0);
    min-width: var(--sf-0);
    min-inline-size: var(--sf-0);
    margin: var(--sf-0);
    padding: var(--sf-0);
    color: inherit;
    background: var(--sf-transparent);
    border: none;
    border-radius: var(--sf-0);
    font: inherit;
    line-height: inherit;
    unicode-bidi: -webkit-isolate;
    unicode-bidi: -moz-isolate;
    unicode-bidi: isolate;
    vertical-align: baseline;
    white-space: nowrap;
  }
  @media (forced-colors: active) {
    :where(kbd:not(.sf-kbd--group), .sf-kbd:not(.sf-kbd--group)) {
      border-color: CanvasText;
    }
  }
}

/* docara-shell-source: runtime/component/link/css/link.css */
@layer sf.components {
  /* utility-hint: display/flex (.flex) flex-direction/row (.flex-row) flex-wrap/nowrap (.flex-nowrap) gap/var(--sf-space-1\/3) justify-content/flex-start (.justify-start) align-items/center (.items-center) */
  .sf-link {
    --sf-link--color: var(--sf-link);
    --sf-link--background-color: var(--sf-transparent);
    --sf-link--gap: var(--sf-space-1\/3);
    --sf-link--font-family: var(--sf-text--family);
    --sf-link--font-size: var(--sf-text-size-1);
    --sf-link--font-weight: var(--sf-font-weight-regular);
    --sf-link--line-height: var(--sf-text-height-1);
    --sf-link--text-decoration: underline;
    display: inline-flex;
    box-sizing: border-box;
    align-items: center;
    gap: var(--sf-link--gap);
    min-width: var(--sf-0);
    min-inline-size: var(--sf-0);
    max-width: 100%;
    max-inline-size: 100%;
    color: var(--sf-link--color);
    background-color: var(--sf-link--background-color);
    font-family: var(--sf-link--font-family);
    font-size: var(--sf-link--font-size);
    font-weight: var(--sf-link--font-weight);
    line-height: var(--sf-link--line-height);
    -webkit-text-decoration-line: var(--sf-link--text-decoration);
            text-decoration-line: var(--sf-link--text-decoration);
    -webkit-text-decoration-color: currentColor;
            text-decoration-color: currentColor;
    text-underline-offset: var(--sf-a3);
  }
  .sf-link :where(.sf-link__content, .sf-link-content) {
    min-width: var(--sf-0);
    min-inline-size: var(--sf-0);
    color: inherit;
    font: inherit;
    word-wrap: anywhere;
    text-decoration: inherit;
  }
  .sf-link :where(.sf-link__icon, .sf-link-icon) {
    --sf-link-icon--size: var(--sf-text-height-1);
    flex: none;
    height: var(--sf-link-icon--size);
    block-size: var(--sf-link-icon--size);
    width: var(--sf-link-icon--size);
    inline-size: var(--sf-link-icon--size);
    color: currentColor;
  }
}
@layer sf.states {
  .sf-link:visited:not(.disabled):not([aria-disabled=true]) {
    --sf-link--color: var(--sf-link-visited);
  }
  .sf-link:hover:not(.disabled):not([aria-disabled=true]) {
    --sf-link--color: var(--sf-link-hover);
    --sf-link--text-decoration: none;
  }
  .sf-link:active:not(.disabled):not([aria-disabled=true]) {
    --sf-link--color: var(--sf-link-active);
    --sf-link--text-decoration: none;
  }
  .sf-link:focus {
    outline: none;
  }
  .sf-link.focus-visible {
    border-radius: var(--sf-radius--ui);
    outline-color: var(--sf-focus);
    outline-offset: var(--sf-focus--offset);
    outline-style: var(--sf-focus--style);
    outline-width: var(--sf-focus--width);
  }
  .sf-link:focus-visible {
    border-radius: var(--sf-radius--ui);
    outline-color: var(--sf-focus);
    outline-offset: var(--sf-focus--offset);
    outline-style: var(--sf-focus--style);
    outline-width: var(--sf-focus--width);
  }
  .sf-link.disabled {
    --sf-link--color: var(--sf-on-disable);
    --sf-link--text-decoration: none;
    cursor: default;
  }
  .sf-link[aria-disabled=true] {
    --sf-link--color: var(--sf-on-disable);
    --sf-link--text-decoration: none;
    cursor: default;
  }
  @media (forced-colors: active) {
    .sf-link.focus-visible {
      outline-color: Highlight;
    }
    .sf-link:focus-visible {
      outline-color: Highlight;
    }
  }
}