@source "node_modules/streamdown/dist/*.js";
@source "../../streamdown/dist/*.js";

@source "./dist/**/*.js";

@source "./src/**/*.{ts,tsx}";

button:not(:disabled, [aria-disabled="true"]) {
  cursor: pointer;
}

.prose h1 {
  @apply font-sans font-[450] text-[32px] leading-[40px] tracking-[-1.28px] [&>strong]:font-medium [&>strong]:text-gray-900;
}

.prose h2 {
  @apply font-sans font-[450] text-[24px] leading-[32px] tracking-[-0.96px] [&>strong]:font-medium [&>strong]:text-gray-900;
}

.prose h3 {
  @apply font-sans font-[450] text-[20px] leading-[26px] tracking-[-0.4px] [&>strong]:font-medium [&>strong]:text-gray-900;
}

.prose h4 {
  @apply font-sans font-[450] text-[16px] leading-[24px] tracking-[-0.32px] [&>strong]:font-medium [&>strong]:text-gray-900;
}

.prose h5,
.prose h6 {
  @apply font-sans font-[450] text-[14px] leading-[20px] tracking-[-0.28px];
}

.prose :is(h1, h2, h3, h4, h5, h6)[id] {
  position: relative;
}

.prose :is(h1, h2, h3, h4, h5, h6)[id] > a:first-child {
  position: static;
}

.prose :is(h1, h2, h3, h4, h5, h6)[id] > a:first-child::after {
  position: absolute;
  inset: 0;
  content: "";
}

.prose :is(h1, h2, h3, h4, h5, h6)[id] > svg {
  pointer-events: none;
}

.prose :is(h1, h2, h3, h4, h5, h6)[id]:is(:hover, :focus-within) > svg {
  opacity: 1;
}

.prose ul:where(:not(.not-prose, .not-prose *)) {
  padding-left: 1.25rem;
}

.prose ul > li:where(:not(.not-prose, .not-prose *)) {
  padding-left: 0.5rem;
}

/* Numbered steps. Overrides the fumadocs rail-and-disc layout with a bordered
   Geist counter aligned to each step heading. Emitted by remarkSteps for
   `### 1. Title` headings and by the Steps/Step components. */
.prose .fd-steps {
  --geistdocs-step-size: 1.75rem;
  padding-left: 0;
  margin-top: 1.5rem;
  margin-left: 0;
  counter-reset: step;
  border-left: 0;
}

.prose .fd-step {
  position: relative;
  padding-bottom: 2rem;
  padding-left: calc(var(--geistdocs-step-size) + 0.75rem);
}

.prose .fd-step:last-child {
  padding-bottom: 0;
}

.prose .fd-step::before {
  position: absolute;
  top: -1px;
  left: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  width: var(--geistdocs-step-size);
  height: var(--geistdocs-step-size);
  font-size: 0.8125rem;
  font-weight: 500;
  line-height: 1;
  color: var(--ds-gray-1000);
  content: counter(step);
  counter-increment: step;
  background-color: var(--ds-background-100);
  border: 1px solid var(--ds-gray-400);
  border-radius: 9999px;
}

.prose .fd-step > :first-child {
  margin-top: 0;
}

.prose .fd-step > :last-child {
  margin-bottom: 0;
}

#nd-page h1:not(:where(.prose *)) {
  @apply font-sans font-[450] text-[40px] leading-[48px] tracking-tighter;
}

@media (width >= 80rem) {
  #nd-page {
    max-width: 780px;
    transform: translateX(-20px);
  }
}

@layer utilities {
  .line-numbers code {
    counter-reset: step;
    counter-increment: step 0;
  }

  .line-numbers code .line::before {
    content: counter(step);
    counter-increment: step;
    @apply mr-5 inline-block w-4 shrink-0 text-right font-mono text-[13px] tabular-nums text-gray-600;
  }
}

:root {
  --fd-layout-width: 100%;
  --fd-page-width: 100%;
}

#nd-docs-layout > div[data-state] {
  @apply top-16;
}

#nd-sidebar-mobile {
  @apply mt-16;
}

#nd-sidebar-mobile > div:first-child > div:first-child {
  @apply hidden;
}

:root {
  --shiki-color-text: var(--ds-gray-1000);
  --shiki-color-background: var(--ds-background-100);
  --shiki-token-constant: var(--ds-blue-900);
  --shiki-token-string: var(--ds-green-900);
  --shiki-token-comment: var(--ds-gray-900);
  --shiki-token-keyword: var(--ds-pink-900);
  --shiki-token-parameter: var(--ds-amber-900);
  --shiki-token-function: var(--ds-purple-900);
  --shiki-token-string-expression: var(--ds-green-900);
  --shiki-token-punctuation: var(--ds-gray-1000);
  --shiki-token-link: var(--ds-green-900);
}

@theme static {
  --color-fd-background: var(--ds-background-100);
  --color-fd-foreground: var(--ds-gray-1000);
  --color-fd-muted: var(--ds-gray-100);
  --color-fd-muted-foreground: var(--ds-gray-800);
  --color-fd-popover: var(--ds-background-100);
  --color-fd-popover-foreground: var(--ds-gray-1000);
  --color-fd-card: var(--ds-background-100);
  --color-fd-card-foreground: var(--ds-gray-1000);
  --color-fd-border: var(--ds-gray-alpha-400);
  --color-fd-primary: var(--ds-gray-1000);
  --color-fd-primary-foreground: var(--ds-background-100);
  --color-fd-secondary: var(--ds-gray-100);
  --color-fd-secondary-foreground: var(--ds-gray-1000);
  --color-fd-accent: var(--ds-gray-100);
  --color-fd-accent-foreground: var(--ds-gray-1000);
  --color-fd-ring: var(--ds-gray-600);
  --color-fd-error: var(--ds-red-800);
  --color-fd-diff-remove: rgb(200 10 100 / 0.12);
  --color-fd-diff-remove-symbol: rgb(230 10 100);
  --color-fd-diff-add: rgb(14 180 100 / 0.1);
  --color-fd-diff-add-symbol: rgb(10 200 100);
}

#nd-sidebar {
  --color-fd-accent: var(--ds-gray-100);
  --color-fd-accent-foreground: var(--ds-gray-1000);
  --color-fd-ring: var(--ds-gray-600);
  --color-fd-primary-foreground: var(--ds-background-200);
  color: var(--ds-gray-1000);
  background-color: var(--ds-background-200);
  border-color: var(--ds-gray-alpha-400);
}

@property --geistdocs-sidebar-fade-top {
  syntax: "<length>";
  inherits: false;
  initial-value: 0px;
}

@property --geistdocs-sidebar-fade-bottom {
  syntax: "<length>";
  inherits: false;
  initial-value: 0px;
}

.geistdocs-sidebar-scroll {
  -ms-overflow-style: none;
  scrollbar-width: none;
}

.geistdocs-sidebar-scroll::-webkit-scrollbar {
  display: none;
}

.geistdocs-sidebar-pane {
  transition:
    transform 150ms cubic-bezier(0.175, 0.885, 0.32, 1.1),
    opacity 150ms cubic-bezier(0.175, 0.885, 0.32, 1.1);
}

@media (min-width: 961px) {
  .geistdocs-sidebar-scroll {
    --geistdocs-sidebar-fade-size: 40px;
    scroll-padding-block: var(--geistdocs-sidebar-fade-size);
    mask-image: linear-gradient(
      to bottom,
      transparent 0,
      black var(--geistdocs-sidebar-fade-top),
      black calc(100% - var(--geistdocs-sidebar-fade-bottom)),
      transparent 100%
    );
    transition:
      --geistdocs-sidebar-fade-top 150ms ease,
      --geistdocs-sidebar-fade-bottom 150ms ease;
  }

  .geistdocs-sidebar-scroll[data-fade-top="true"] {
    --geistdocs-sidebar-fade-top: var(--geistdocs-sidebar-fade-size);
  }

  .geistdocs-sidebar-scroll[data-fade-bottom="true"] {
    --geistdocs-sidebar-fade-bottom: var(--geistdocs-sidebar-fade-size);
  }

  @supports (animation-timeline: scroll()) {
    .geistdocs-sidebar-scroll {
      animation:
        geistdocs-sidebar-fade-top linear both,
        geistdocs-sidebar-fade-bottom linear both;
      animation-range:
        0 var(--geistdocs-sidebar-fade-size),
        calc(100% - var(--geistdocs-sidebar-fade-size)) 100%;
      animation-timeline: scroll(self), scroll(self);
    }

    @keyframes geistdocs-sidebar-fade-top {
      to {
        --geistdocs-sidebar-fade-top: var(--geistdocs-sidebar-fade-size);
      }
    }

    @keyframes geistdocs-sidebar-fade-bottom {
      from {
        --geistdocs-sidebar-fade-bottom: var(--geistdocs-sidebar-fade-size);
      }
    }
  }
}

@container (max-width: 960px) {
  #nd-page > .text-gray-900:first-child {
    display: none;
  }
}

[data-geistdocs-command-modal] .text-fd-muted-foreground {
  color: var(--ds-gray-900);
}

[data-geistdocs-mobile-sidebar] [data-slot="sheet-header"] {
  height: calc(4rem + env(safe-area-inset-top));
  padding-top: env(safe-area-inset-top);
  padding-right: max(1rem, env(safe-area-inset-right));
  padding-left: max(1rem, env(safe-area-inset-left));
}

[data-geistdocs-mobile-sidebar] nav {
  padding-right: max(0.5rem, env(safe-area-inset-right));
  padding-bottom: max(0.75rem, env(safe-area-inset-bottom));
  padding-left: max(0.5rem, env(safe-area-inset-left));
}

[data-geistdocs-mobile-sidebar] [data-slot="sheet-close"] {
  top: calc(1rem + env(safe-area-inset-top));
  right: max(1rem, env(safe-area-inset-right));
}

#nd-toc .geistdocs-toc-scroll {
  scrollbar-width: none;
}

#nd-toc .geistdocs-toc-scroll::-webkit-scrollbar {
  display: none;
}

[data-mobile-docs-bar] {
  padding-right: max(1.5rem, env(safe-area-inset-right));
  padding-left: max(1.5rem, env(safe-area-inset-left));
}

@media (prefers-reduced-motion: reduce) {
  .geistdocs-sidebar-pane,
  .geistdocs-sidebar-scroll,
  body:has([data-home-route]) header {
    transition: none;
    animation: none;
  }
}

@media (min-width: 1200px) {
  [data-mobile-toc-trigger] {
    display: none;
  }
}

body:has([data-home-route]) header {
  border-bottom-color: transparent !important;
  transition: border-color 200ms ease;
}
html[data-scrolled] body:has([data-home-route]) header {
  border-bottom-color: var(--ds-gray-alpha-400) !important;
}
html
  body
  header:has(
    [data-slot="navigation-menu-trigger"][data-state="open"],
    [data-slot="mobile-menu-toggle"][aria-expanded="true"]
  ) {
  border-bottom-color: transparent !important;
  transition: none !important;
}