/* ==========================================================================
   SpaceKeep Docs — custom theme
   Light mode is the standard experience.
   ========================================================================== */

:root {
  --sk-font-body: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  --sk-font-mono: 'JetBrains Mono', 'SFMono-Regular', Consolas, 'Liberation Mono', monospace;

  /* Light palette — the standard SpaceKeep docs experience */
  --base-bg: #ffffff;
  --base-text: #2d3047;
  --base-text-muted: #8695a8;
  --base-text-strong: #070f1a;
  --base-border: #e2e7f2;
  --base-border-hover: #bcc9dc;
  --base-border-strong: #8695a8;
  --base-link: #2563eb;
  --base-link-hover: #1d4ed8;
  --base-link-weight: 500;
  --base-item-text: #070f1a;
  --base-item-text-active: #2563eb;
  --base-item-bg-hover: #f1f5f9;
  --base-item-bg-active: #e8f0fe;
  --selector: #2563eb;
  --selection-bg: #dbeafe;
  --selection-text: #070f1a;
  --skeleton-bg: #e2e7f2;
  --heading-text: #070f1a;
  --body-link-decoration-color: #bcc9dc;
  --body-link-decoration-color-hover: #2563eb;

  /* Branding */
  --branding-label-text: #2563eb;
  --branding-label-bg: rgba(37, 99, 235, 0.08);
  --branding-label-border: rgba(37, 99, 235, 0.28);

  /* Header */
  --header-bg: #ffffff;
  --header-border: #e2e7f2;
  --header-text: #2563eb;
  --header-text-hover: #1d4ed8;
  --header-text-weight: 500;

  /* Search */
  --search-text: #2d3047;
  --search-placeholder: #8695a8;
  --search-bg: #f8fafc;
  --search-border: #e2e7f2;
  --search-border-hover: #bcc9dc;
  --search-border-focus: #bcc9dc;
  --search-highlight-bg: #dbeafe;
  --search-hint-text: #8695a8;
  --search-hint-bg: #f8fafc;
  --search-hint-border: #e2e7f2;
  --search-result-heading: #070f1a;
  --search-result-text: #8695a8;
  --search-result-breadcrumb: #2563eb;
  --search-result-breadcrumb-hover: #1d4ed8;
  --search-result-icon: #8695a8;
  --search-result-hover: #f1f5f9;
  --search-result-active-bg: #f1f5f9;
  --search-result-active-ring: #dbeafe;
  --search-result-active-radius: 0.5rem;
  --search-result-border: #e2e7f2;
  --search-result-code-bg: #f8fafc;
  --search-result-count: #8695a8;
  --search-no-results-text: #8695a8;
  --search-no-results-icon: #bcc9dc;
  --search-footer-text: #8695a8;
  --search-footer-kbd-bg: #e2e7f2;
  --search-modal-bg: #f8fafc;
  --search-modal-border: #e2e7f2;
  --search-results-bg: #f8fafc;
  --search-backdrop: rgba(255, 255, 255, 0.8);
  --filter-border: #e2e7f2;
  --filter-border-hover: #bcc9dc;
  --filter-border-focus: #bcc9dc;

  /* Navigation */
  --nav-item-text: #2d3047;
  --nav-item-text-stack: #070f1a;
  --nav-item-button: #8695a8;

  /* Table of contents */
  --toc-heading: #8695a8;
  --toc-text: #2d3047;
  --toc-label-text-hover: #2563eb;

  /* Footer */
  --footer-text: #8695a8;

  /* Cards */
  --card-border: #e2e7f2;
  --card-border-hover: #bcc9dc;
  --card-image-bg: #e2e7f2;
  --card-image-inner-border: #e2e7f2;
  --card-footer-text: #8695a8;

  /* Callouts */
  --callout-base-bg: #f8fafc;
  --callout-contrast-bg: #070f1a;
  --callout-contrast-text: #ffffff;
  --callout-contrast-border: #e2e7f2;

  /* Tabs */
  --tab-text-active: #2563eb;
  --tab-border-active: #2563eb;
  --tab-text: #8695a8;
  --tab-border-hover: #bcc9dc;

  /* Pager (next/previous) */
  --pager-text: #2d3047;
  --pager-bg: transparent;
  --pager-border: #e2e7f2;
  --pager-text-hover: #2d3047;
  --pager-bg-hover: #f8fafc;
  --pager-border-hover: #e2e7f2;
  --pager-text-active: #070f1a;
  --pager-bg-active: #dbeafe;
  --pager-border-active: #dbeafe;
  --pager-text-active-hover: #070f1a;
  --pager-bg-active-hover: #2563eb;
  --pager-border-active-hover: #2563eb;

  /* Steps */
  --steps-step-line: #e2e7f2;

  /* Badges */
  --badge-base-hover: #dbeafe;
  --badge-primary-hover: #dbeafe;
  --badge-secondary-hover: #f1f5f9;
  --badge-success-hover: #d1fae5;
  --badge-danger-hover: #fee2e2;
  --badge-warning-hover: #fef3c7;
  --badge-question-hover: #ede9fe;
  --badge-light-hover: #f1f5f9;
  --badge-light-text: #2d3047;
  --badge-light-text-hover: #2d3047;
  --badge-light-border: transparent;
  --badge-dark: #e2e7f2;
  --badge-dark-hover: #bcc9dc;
  --badge-dark-border: #e2e7f2;
  --badge-dark-border-hover: #bcc9dc;
  --badge-ghost: #e2e7f2;
  --badge-ghost-hover: #bcc9dc;
  --badge-ghost-text: #8695a8;
  --badge-ghost-text-hover: #2d3047;
  --badge-ghost-border: #e2e7f2;
  --badge-ghost-border-hover: #bcc9dc;
  --badge-contrast: #070f1a;
  --badge-contrast-hover: #1e293b;
  --badge-contrast-text: #ffffff;
  --badge-contrast-text-hover: #ffffff;
  --badge-contrast-border: #070f1a;
  --badge-contrast-border-hover: #070f1a;

  /* Buttons */
  --button-secondary-hover: #f1f5f9;
  --button-light: #e2e8f0;
  --button-light-hover: #cbd5e1;
  --button-light-text: #0a0e14;
  --button-dark: #e2e7f2;
  --button-dark-hover: #bcc9dc;
  --button-dark-text: #8695a8;
  --button-ghost: #f8fafc;
  --button-ghost-hover: #f1f5f9;
  --button-ghost-text: #8695a8;
  --button-contrast: #070f1a;
  --button-contrast-hover: #1e293b;
  --button-contrast-text: #ffffff;

  /* Actions */
  --action-primary-hover-text: #070f1a;
  --action-toggle-hover-text: #070f1a;
  --action-menu-item-text: #2d3047;
  --action-menu-item-description-text: #8695a8;
  --action-menu-item-hover-text: #070f1a;

  /* Misc */
  --description-color: #8695a8;
  --list-unchecked: #8695a8;
  --footnote-popper-link-hover: #1d4ed8;
  --footnote-popper-code-bg: #f8fafc;
  --footnote-popper-ref-open-bg: #dbeafe;
  --footnote-popper-ref-open-border: #2563eb;
}

/* Keep the same light values when Retype's own .dark class is active */
.dark {
  --base-bg: #ffffff;
  --base-text: #2d3047;
  --base-text-muted: #8695a8;
  --base-text-strong: #070f1a;
  --base-border: #e2e7f2;
  --base-border-hover: #bcc9dc;
  --base-border-strong: #8695a8;
  --base-link: #2563eb;
  --base-link-hover: #1d4ed8;
  --base-item-bg-hover: #f1f5f9;
  --base-item-bg-active: #e8f0fe;
  --selection-bg: #dbeafe;
  --selection-text: #070f1a;
  --skeleton-bg: #e2e7f2;
  --heading-text: #070f1a;
  --branding-label-text: #2563eb;
  --branding-label-bg: rgba(37, 99, 235, 0.08);
  --branding-label-border: rgba(37, 99, 235, 0.28);
  --header-bg: #ffffff;
  --header-border: #e2e7f2;
  --header-text: #2563eb;
  --header-text-hover: #1d4ed8;
  --search-highlight-bg: #dbeafe;
  --search-border: #e2e7f2;
  --search-border-hover: #bcc9dc;
  --search-border-focus: #bcc9dc;
  --search-result-text: #8695a8;
  --search-result-hover: #f1f5f9;
  --search-result-active-bg: #f1f5f9;
  --search-result-active-ring: #dbeafe;
  --search-result-border: #e2e7f2;
  --search-result-code-bg: #f8fafc;
  --search-no-results-icon: #bcc9dc;
  --search-footer-kbd-bg: #e2e7f2;
  --search-modal-bg: #f8fafc;
  --search-modal-border: #e2e7f2;
  --search-results-bg: #f8fafc;
  --search-backdrop: rgba(255, 255, 255, 0.8);
  --filter-border: #e2e7f2;
  --filter-border-hover: #bcc9dc;
  --filter-border-focus: #bcc9dc;
  --nav-item-text: #2d3047;
  --nav-item-text-stack: #070f1a;
  --nav-item-button: #8695a8;
  --toc-heading: #8695a8;
  --toc-text: #2d3047;
  --toc-label-text-hover: #2563eb;
  --footer-text: #8695a8;
  --card-border: #e2e7f2;
  --card-border-hover: #bcc9dc;
  --card-image-bg: #e2e7f2;
  --card-image-inner-border: #e2e7f2;
  --card-footer-text: #8695a8;
  --callout-base-bg: #f8fafc;
  --callout-contrast-bg: #070f1a;
  --callout-contrast-text: #ffffff;
  --callout-contrast-border: #e2e7f2;
  --tab-text-active: #2563eb;
  --tab-border-active: #2563eb;
  --tab-text: #8695a8;
  --tab-border-hover: #bcc9dc;
  --steps-step-line: #e2e7f2;
  --pager-text: #2d3047;
  --pager-border: #e2e7f2;
  --pager-text-hover: #2d3047;
  --pager-bg-hover: #f8fafc;
  --pager-border-hover: #e2e7f2;
  --pager-text-active: #070f1a;
  --pager-bg-active: #dbeafe;
  --pager-border-active: #dbeafe;
  --pager-text-active-hover: #070f1a;
  --pager-bg-active-hover: #2563eb;
  --pager-border-active-hover: #2563eb;
  --badge-base-hover: #dbeafe;
  --badge-primary-hover: #dbeafe;
  --badge-secondary-hover: #f1f5f9;
  --badge-success-hover: #d1fae5;
  --badge-danger-hover: #fee2e2;
  --badge-warning-hover: #fef3c7;
  --badge-question-hover: #ede9fe;
  --badge-light-hover: #f1f5f9;
  --badge-light-text: #2d3047;
  --badge-light-text-hover: #2d3047;
  --badge-light-border: transparent;
  --badge-dark: #e2e7f2;
  --badge-dark-hover: #bcc9dc;
  --badge-dark-border: #e2e7f2;
  --badge-dark-border-hover: #bcc9dc;
  --badge-ghost: #e2e7f2;
  --badge-ghost-hover: #bcc9dc;
  --badge-ghost-text: #8695a8;
  --badge-ghost-text-hover: #2d3047;
  --badge-ghost-border: #e2e7f2;
  --badge-ghost-border-hover: #bcc9dc;
  --badge-contrast: #070f1a;
  --badge-contrast-hover: #1e293b;
  --badge-contrast-text: #ffffff;
  --badge-contrast-text-hover: #ffffff;
  --badge-contrast-border: #070f1a;
  --badge-contrast-border-hover: #070f1a;
  --button-secondary-hover: #f1f5f9;
  --button-light: #e2e8f0;
  --button-light-hover: #cbd5e1;
  --button-light-text: #0a0e14;
  --button-dark: #e2e7f2;
  --button-dark-hover: #bcc9dc;
  --button-dark-text: #8695a8;
  --button-ghost: #f8fafc;
  --button-ghost-hover: #f1f5f9;
  --button-ghost-text: #8695a8;
  --button-contrast: #070f1a;
  --button-contrast-hover: #1e293b;
  --button-contrast-text: #ffffff;
  --action-primary-hover-text: #070f1a;
  --action-toggle-hover-text: #070f1a;
  --action-menu-item-text: #2d3047;
  --action-menu-item-description-text: #8695a8;
  --action-menu-item-hover-text: #070f1a;
  --description-color: #8695a8;
  --list-unchecked: #8695a8;
  --footnote-popper-link-hover: #1d4ed8;
  --footnote-popper-code-bg: #f8fafc;
  --footnote-popper-ref-open-bg: #dbeafe;
  --footnote-popper-ref-open-border: #2563eb;
}

/* ==========================================================================
   Base typography and polish
   ========================================================================== */

html {
  scroll-behavior: smooth;
}

body {
  font-family: var(--sk-font-body);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}

code,
kbd,
pre,
samp {
  font-family: var(--sk-font-mono);
}

::selection {
  background: rgba(37, 99, 235, 0.18);
  color: #070f1a;
}

/* Slim, unobtrusive scrollbars */
::-webkit-scrollbar {
  width: 10px;
  height: 10px;
}
::-webkit-scrollbar-track {
  background: transparent;
}
::-webkit-scrollbar-thumb {
  background: #cbd5e1;
  border-radius: 6px;
  border: 2px solid #ffffff;
}
::-webkit-scrollbar-thumb:hover {
  background: #94a3b8;
}

/* Visible, consistent keyboard focus */
:focus-visible {
  outline: 2px solid rgba(37, 99, 235, 0.6);
  outline-offset: 2px;
  border-radius: 4px;
}
