@import "./hardline.css";

body:has(#nd-docs-layout),
#nd-docs-layout {
  --color-fd-primary: #ff5b31;
  --color-fd-primary-foreground: #140f0c;
  --color-fd-ring: #141210;
  --color-fd-background: #f6ead9;
  --color-fd-foreground: #15120f;
  --color-fd-card: #fbf4ea;
  --color-fd-card-foreground: #15120f;
  --color-fd-popover: #fbf4ea;
  --color-fd-popover-foreground: #15120f;
  --color-fd-secondary: #eadcc9;
  --color-fd-secondary-foreground: #15120f;
  --color-fd-muted: #e2d0b9;
  --color-fd-muted-foreground: #5b4e42;
  --color-fd-accent: #245dff;
  --color-fd-accent-foreground: #f8f5ef;
  --color-fd-border: #141210;
  --fd-nav-height: 68px;
}

html.dark body:has(#nd-docs-layout),
body.dark:has(#nd-docs-layout),
body:has(#nd-docs-layout.dark),
:is(html.dark, body.dark) #nd-docs-layout,
#nd-docs-layout.dark {
  --color-fd-primary: #ff744d;
  --color-fd-primary-foreground: #180f0b;
  --color-fd-ring: #ff744d;
  --color-fd-background: #12100f;
  --color-fd-foreground: #f6eee2;
  --color-fd-card: #1a1614;
  --color-fd-card-foreground: #f6eee2;
  --color-fd-popover: #1a1614;
  --color-fd-popover-foreground: #f6eee2;
  --color-fd-secondary: #211b18;
  --color-fd-secondary-foreground: #f6eee2;
  --color-fd-muted: #2d2520;
  --color-fd-muted-foreground: #c8b6a5;
  --color-fd-accent: #7ba2ff;
  --color-fd-accent-foreground: #101216;
  --color-fd-border: rgba(246, 238, 226, 0.88);
}

#nd-docs-layout > header,
#nd-docs-layout [role="banner"] {
  background: linear-gradient(180deg, color-mix(in srgb, var(--color-fd-primary) 10%, var(--color-fd-background)), var(--color-fd-background));
}

#nd-docs-layout aside a[data-active] {
  text-transform: uppercase;
  letter-spacing: 0.045em;
  font-size: 0.79rem;
}

#nd-docs-layout aside a[data-active="true"],
#nd-docs-layout .fd-page-action-btn:hover,
#nd-docs-layout .fd-page-action-btn[data-selected="true"],
#nd-docs-layout .fd-page-action-btn[data-copied="true"],
#nd-docs-layout .fd-feedback-choice:hover,
#nd-docs-layout .fd-feedback-choice[data-selected="true"],
#nd-docs-layout .fd-ai-tab[data-active="true"] {
  box-shadow: 5px 5px 0 var(--color-fd-border);
  transform: translate(-2px, -2px);
}

:is(html.dark, body.dark) #nd-docs-layout aside a[data-active="true"],
#nd-docs-layout.dark aside a[data-active="true"],
:is(html.dark, body.dark) #nd-docs-layout .fd-page-action-btn:hover,
#nd-docs-layout.dark .fd-page-action-btn:hover,
:is(html.dark, body.dark) #nd-docs-layout .fd-page-action-btn[data-selected="true"],
#nd-docs-layout.dark .fd-page-action-btn[data-selected="true"],
:is(html.dark, body.dark) #nd-docs-layout .fd-page-action-btn[data-copied="true"],
#nd-docs-layout.dark .fd-page-action-btn[data-copied="true"],
:is(html.dark, body.dark) #nd-docs-layout .fd-feedback-choice:hover,
#nd-docs-layout.dark .fd-feedback-choice:hover,
:is(html.dark, body.dark) #nd-docs-layout .fd-feedback-choice[data-selected="true"],
#nd-docs-layout.dark .fd-feedback-choice[data-selected="true"],
:is(html.dark, body.dark) #nd-docs-layout .fd-ai-tab[data-active="true"],
#nd-docs-layout.dark .fd-ai-tab[data-active="true"] {
  box-shadow: 5px 5px 0 color-mix(in srgb, var(--color-fd-primary) 55%, transparent);
}

#nd-docs-layout .omni-item-active {
  background: color-mix(in srgb, var(--color-fd-primary) 20%, var(--color-fd-card)) !important;
  color: var(--color-fd-foreground) !important;
}

#nd-docs-layout .omni-item-active .omni-item-icon,
#nd-docs-layout .omni-item-active .omni-item-badge,
#nd-docs-layout .omni-item-active .omni-item-ext,
#nd-docs-layout .omni-item-active .omni-item-chevron {
  color: var(--color-fd-foreground) !important;
}

#nd-docs-layout .omni-item-active .omni-item-subtitle,
#nd-docs-layout .omni-item-active .omni-item-shortcuts {
  color: color-mix(in srgb, var(--color-fd-foreground) 78%, var(--color-fd-muted-foreground)) !important;
  opacity: 1;
}

:is(html.dark, body.dark) #nd-docs-layout .omni-item-active,
#nd-docs-layout.dark .omni-item-active {
  background: color-mix(in srgb, var(--color-fd-primary) 26%, var(--color-fd-card)) !important;
}

#nd-docs-layout .fd-card,
#nd-docs-layout [data-card],
#nd-docs-layout .fd-callout,
#nd-docs-layout .fd-page-action-menu,
#nd-docs-layout .fd-page-action-btn,
#nd-docs-layout .fd-docs-content pre,
#nd-docs-layout .fd-docs-content .shiki,
#nd-docs-layout .fd-docs-content [data-codeblock],
#nd-docs-layout .fd-page-nav,
#nd-docs-layout .fd-page-nav-card,
#nd-docs-layout [class*="page-nav"] a,
#nd-docs-layout .fd-hover-link-card {
  box-shadow: 6px 6px 0 var(--color-fd-border);
}

:is(html.dark, body.dark) #nd-docs-layout .fd-card,
#nd-docs-layout.dark .fd-card,
:is(html.dark, body.dark) #nd-docs-layout [data-card],
#nd-docs-layout.dark [data-card],
:is(html.dark, body.dark) #nd-docs-layout .fd-callout,
#nd-docs-layout.dark .fd-callout,
:is(html.dark, body.dark) #nd-docs-layout .fd-page-action-menu,
#nd-docs-layout.dark .fd-page-action-menu,
:is(html.dark, body.dark) #nd-docs-layout .fd-page-action-btn,
#nd-docs-layout.dark .fd-page-action-btn,
:is(html.dark, body.dark) #nd-docs-layout .fd-docs-content pre,
#nd-docs-layout.dark .fd-docs-content pre,
:is(html.dark, body.dark) #nd-docs-layout .fd-docs-content .shiki,
#nd-docs-layout.dark .fd-docs-content .shiki,
:is(html.dark, body.dark) #nd-docs-layout .fd-docs-content [data-codeblock],
#nd-docs-layout.dark .fd-docs-content [data-codeblock],
:is(html.dark, body.dark) #nd-docs-layout .fd-page-nav,
#nd-docs-layout.dark .fd-page-nav,
:is(html.dark, body.dark) #nd-docs-layout .fd-page-nav-card,
#nd-docs-layout.dark .fd-page-nav-card,
:is(html.dark, body.dark) #nd-docs-layout [class*="page-nav"] a,
#nd-docs-layout.dark [class*="page-nav"] a,
:is(html.dark, body.dark) #nd-docs-layout .fd-hover-link-card,
#nd-docs-layout.dark .fd-hover-link-card {
  box-shadow: 6px 6px 0 color-mix(in srgb, var(--color-fd-primary) 42%, transparent);
}

#nd-docs-layout :is(.fd-docs-content, .prose) table {
  border: 3px solid var(--color-fd-border);
  box-shadow: 6px 6px 0 var(--color-fd-border);
  background: var(--color-fd-card);
}

:is(html.dark, body.dark) #nd-docs-layout :is(.fd-docs-content, .prose) table,
#nd-docs-layout.dark :is(.fd-docs-content, .prose) table {
  box-shadow: 6px 6px 0 color-mix(in srgb, var(--color-fd-primary) 42%, transparent);
}

#nd-docs-layout :is(.fd-docs-content, .prose) th,
#nd-docs-layout .fd-page-body th {
  background: var(--color-fd-foreground);
  color: var(--color-fd-background);
  text-transform: uppercase;
  letter-spacing: 0.08em;
  font-family: var(--fd-font-mono, ui-monospace, monospace);
  font-size: 0.74rem;
}

#nd-docs-layout :is(.fd-docs-content, .prose) td,
#nd-docs-layout .fd-page-body td {
  font-weight: 550;
}

#nd-docs-layout :is(.fd-docs-content, .prose) tbody tr:nth-child(odd) td,
#nd-docs-layout .fd-page-body tbody tr:nth-child(odd) td {
  background: color-mix(in srgb, var(--color-fd-secondary) 72%, white 28%);
}

:is(html.dark, body.dark) #nd-docs-layout :is(.fd-docs-content, .prose) tbody tr:nth-child(odd) td,
#nd-docs-layout.dark :is(.fd-docs-content, .prose) tbody tr:nth-child(odd) td,
:is(html.dark, body.dark) #nd-docs-layout .fd-page-body tbody tr:nth-child(odd) td,
#nd-docs-layout.dark .fd-page-body tbody tr:nth-child(odd) td {
  background: color-mix(in srgb, var(--color-fd-secondary) 92%, black 8%);
}

#nd-docs-layout :is(.fd-docs-content, .prose) tbody tr:hover td,
#nd-docs-layout .fd-page-body tbody tr:hover td {
  background: color-mix(in srgb, var(--color-fd-primary) 16%, var(--color-fd-card));
}

#nd-docs-layout .fd-docs-content pre,
#nd-docs-layout .fd-docs-content .shiki,
#nd-docs-layout .fd-docs-content [data-codeblock],
#nd-docs-layout .fd-docs-content .fd-codeblock,
#nd-docs-layout .fd-ai-code-block {
  border-width: 3px !important;
  box-shadow: 6px 6px 0 var(--color-fd-border);
  background:
    linear-gradient(180deg, color-mix(in srgb, var(--color-fd-primary) 7%, var(--color-fd-card)) 0, var(--color-fd-card) 56px) !important;
}

:is(html.dark, body.dark) #nd-docs-layout .fd-docs-content pre,
#nd-docs-layout.dark .fd-docs-content pre,
:is(html.dark, body.dark) #nd-docs-layout .fd-docs-content .shiki,
#nd-docs-layout.dark .fd-docs-content .shiki,
:is(html.dark, body.dark) #nd-docs-layout .fd-docs-content [data-codeblock],
#nd-docs-layout.dark .fd-docs-content [data-codeblock],
:is(html.dark, body.dark) #nd-docs-layout .fd-docs-content .fd-codeblock,
#nd-docs-layout.dark .fd-docs-content .fd-codeblock,
:is(html.dark, body.dark) #nd-docs-layout .fd-ai-code-block,
#nd-docs-layout.dark .fd-ai-code-block {
  box-shadow: 6px 6px 0 color-mix(in srgb, var(--color-fd-primary) 42%, transparent);
  background:
    linear-gradient(180deg, color-mix(in srgb, var(--color-fd-primary) 10%, var(--color-fd-card)) 0, var(--color-fd-card) 56px) !important;
}

#nd-docs-layout .fd-codeblock-title {
  font-family: var(--fd-font-mono, ui-monospace, monospace);
  text-transform: uppercase;
  letter-spacing: 0.08em;
  font-size: 0.72rem;
  font-weight: 700;
  padding-block: 0.8rem;
  padding-inline: 1rem;
  border-bottom: 3px solid var(--color-fd-border);
  background: color-mix(in srgb, var(--color-fd-primary) 12%, var(--color-fd-card));
}

#nd-docs-layout .fd-copy-btn,
#nd-docs-layout .fd-ai-code-copy {
  border: 2px solid var(--color-fd-border) !important;
  border-radius: 0 !important;
  background: var(--color-fd-background) !important;
  color: var(--color-fd-foreground) !important;
  box-shadow: 3px 3px 0 var(--color-fd-border);
  font-family: var(--fd-font-mono, ui-monospace, monospace);
  font-size: 0.7rem;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

#nd-docs-layout .fd-copy-btn:hover,
#nd-docs-layout .fd-ai-code-copy:hover {
  background: var(--color-fd-primary) !important;
  color: var(--color-fd-primary-foreground) !important;
  transform: translate(-1px, -1px);
}

#nd-docs-layout .fd-tabs {
  border: 3px solid var(--color-fd-border);
  box-shadow: 6px 6px 0 var(--color-fd-border);
  background: var(--color-fd-card);
}

:is(html.dark, body.dark) #nd-docs-layout .fd-tabs,
#nd-docs-layout.dark .fd-tabs {
  box-shadow: 6px 6px 0 color-mix(in srgb, var(--color-fd-primary) 42%, transparent);
}

#nd-docs-layout .fd-tabs-list {
  border-bottom: 3px solid var(--color-fd-border);
  background: var(--color-fd-foreground);
}

#nd-docs-layout .fd-tab-trigger {
  font-family: var(--fd-font-mono, ui-monospace, monospace);
  text-transform: uppercase;
  letter-spacing: 0.08em;
  font-size: 0.72rem;
  color: color-mix(in srgb, var(--color-fd-background) 82%, transparent);
  border-bottom-width: 0;
}

#nd-docs-layout .fd-tab-trigger:hover {
  color: var(--color-fd-background);
  background: color-mix(in srgb, var(--color-fd-primary) 18%, transparent);
}

#nd-docs-layout .fd-tab-trigger.fd-tab-active {
  color: var(--color-fd-primary-foreground);
  background: var(--color-fd-primary);
  box-shadow: inset -3px 0 0 var(--color-fd-border);
}

#nd-docs-layout .fd-callout {
  border-width: 3px !important;
  box-shadow: 6px 6px 0 var(--color-fd-border);
  background: color-mix(in srgb, var(--color-fd-secondary) 82%, white 18%);
}

:is(html.dark, body.dark) #nd-docs-layout .fd-callout,
#nd-docs-layout.dark .fd-callout {
  box-shadow: 6px 6px 0 color-mix(in srgb, var(--color-fd-primary) 42%, transparent);
  background: color-mix(in srgb, var(--color-fd-secondary) 92%, black 8%);
}

#nd-docs-layout .fd-callout-indicator {
  width: 10px;
}

#nd-docs-layout .fd-callout-title {
  font-family: var(--fd-font-mono, ui-monospace, monospace);
  text-transform: uppercase;
  letter-spacing: 0.08em;
  font-size: 0.72rem;
}

#nd-docs-layout .fd-page-nav,
#nd-docs-layout .fd-page-nav-card,
#nd-docs-layout [class*="page-nav"] a,
#nd-docs-layout .fd-hover-link-card,
#nd-docs-layout .fd-page-action-menu,
#nd-docs-layout .fd-ai-dialog,
#nd-docs-layout .fd-ai-input-wrap,
#nd-docs-layout .fd-ai-model-dropdown-menu,
#nd-docs-layout .fd-ai-fm-topbar,
#nd-docs-layout .fd-ai-fm-input-container,
#nd-docs-layout .fd-feedback {
  border-width: 3px !important;
}

#nd-docs-layout .fd-page-nav-card:hover,
#nd-docs-layout [class*="page-nav"] a:hover {
  transform: translate(-2px, -2px);
}

#nd-docs-layout .fd-hover-link-card {
  background:
    linear-gradient(180deg, color-mix(in srgb, var(--color-fd-primary) 10%, var(--color-fd-card)) 0, var(--color-fd-card) 52px);
}

#nd-docs-layout .fd-hover-link-title,
#nd-docs-layout .fd-hover-link-description + a {
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

#nd-docs-layout .fd-toc-link,
#nd-docs-layout .fd-toc-clerk .fd-toc-link {
  font-family: var(--fd-font-mono, ui-monospace, monospace);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  font-size: 0.7rem;
  border-left: 2px solid transparent;
  padding-left: 0.75rem;
}

#nd-docs-layout .fd-toc-link:hover,
#nd-docs-layout .fd-toc-clerk .fd-toc-link:hover {
  border-left-color: var(--color-fd-border);
  background: color-mix(in srgb, var(--color-fd-primary) 12%, transparent);
}

#nd-docs-layout .fd-toc-link-active,
#nd-docs-layout .fd-toc-clerk .fd-toc-link[data-active="true"] {
  border-left-color: var(--color-fd-primary);
  color: var(--color-fd-foreground);
  background: color-mix(in srgb, var(--color-fd-primary) 16%, transparent);
}

#nd-docs-layout .fd-ai-tab,
#nd-docs-layout .fd-feedback-choice,
#nd-docs-layout .fd-feedback-submit,
#nd-docs-layout .fd-ai-send-btn,
#nd-docs-layout .fd-ai-clear-btn,
#nd-docs-layout .fd-ai-model-dropdown-btn,
#nd-docs-layout .fd-ai-fm-send-btn,
#nd-docs-layout .fd-ai-fm-trigger-btn {
  font-family: var(--fd-font-mono, ui-monospace, monospace);
  text-transform: uppercase;
  letter-spacing: 0.07em;
  box-shadow: 3px 3px 0 var(--color-fd-border);
}