:root,
::backdrop {
  --sl-font: "Inter", "Roboto Mono";
  --sl-sidebar-width: 23rem;
  --sl-text-3xl: 1.5rem;
  --sl-text-2xl: 1.3rem;
}

/*
https://github.com/withastro/starlight/blob/main/packages/starlight/style/props.css
https://github.com/rescript-lang/rescript-lang.org/blob/4e4f9520f6fc7a0376db82a0a6db52211e8a8187/tailwind.config.mjs#L13
*/

@media (prefers-reduced-motion: no-preference) {
  html {
    scroll-behavior: smooth; /* Enables smooth scrolling for users without motion sensitivity */
  }
}

:root[data-theme="light"],
[data-theme="light"] ::backdrop {
  --sl-color-accent-low: #4a0f14;
  --sl-color-accent: #e6484f;
  --sl-color-accent-high: #f9d5d7;
  --sl-color-bg-nav: rgb(20, 22, 44);

  & starlight-theme-select {
    --sl-color-gray-1: var(--sl-color-black);
    --sl-color-gray-2: var(--sl-color-gray-5);
  }
}

body,
#starlight__sidebar {
  --scrollbar-track-background: #222222;
  --scrollbar-track-border: #4a4a4a;
  --scrollbar-thumb-background: #686868;
  &::-webkit-scrollbar {
    height: 8px;
    width: 8px;

    @media (min-width: 1024px) {
      width: 14px;
    }
  }

  &::-webkit-scrollbar-track {
    background-color: var(--scrollbar-track-background);
    border: 1px solid var(--scrollbar-track-border);
  }

  &::-webkit-scrollbar-thumb {
    background-color: var(--scrollbar-thumb-background);
  }
}

.sl-markdown-content .inline-icon {
  display: inline-block;
  vertical-align: text-bottom;
}