@reference "../../css/globals.css";

.cm-tooltip .documentation,
.docs-documentation {
  line-height: normal;

  @apply font-prose;

  ol {
    list-style-type: decimal;
    padding-left: 1.5rem;
  }

  ul {
    list-style-type: disc;
    padding-left: 1.5rem;
  }

  p {
    padding: 0.4rem 0;
    white-space: pre-wrap;
  }

  .section {
    line-height: normal;
  }

  ul,
  li,
  ol,
  .docutils p,
  .docutils dd,
  .paragraph {
    white-space: initial;
  }

  table {
    @apply text-sm border rounded my-2;

    th,
    td {
      @apply border p-2;
    }

    th {
      @apply bg-[var(--slate-2)];
    }

    tr:nth-child(2n) {
      @apply bg-[var(--slate-1)];
    }
  }

  a {
    cursor: pointer;
    text-decoration: inherit;

    @apply text-link;
  }

  a:hover,
  a:active {
    text-decoration: underline;
  }

  a:visited {
    @apply text-link-visited;
  }

  code {
    @apply border px-1 rounded font-mono bg-[var(--slate-2)] text-sm mb-4 mt-2;
  }

  code:empty {
    display: none;
  }

  h1,
  h2 {
    font-weight: 600;
    @apply text-xl border-b pb-1 mb-1 text-primary;
  }

  dt {
    @apply font-bold;

    span {
      @apply font-normal;
    }
  }

  .doctest-block,
  .literal-block {
    white-space: pre-wrap;
    @apply bg-[var(--slate-2)] p-2 rounded text-sm;
  }

  .docutils.literal {
    @apply bg-[var(--slate-2)] px-1 border rounded-md text-sm font-mono;
  }

  pre > code,
  .codehilite code {
    width: 100%;
    display: inline-block;
    white-space: pre-wrap;
    @apply bg-[var(--slate-2)] border p-2 rounded-md font-mono text-sm;
  }

  blockquote {
    white-space: pre-wrap;

    @apply pl-2 ml-2;

    p,
    dl.docutils,
    .docutils dt {
      padding: 0;
      white-space: normal;
      font-weight: initial;
      @apply text-sm font-mono;
    }
  }
}

.docutils dd {
  white-space: pre-wrap;
  padding-left: 1rem;
}

/* Custom overrides when in a tooltip */
.cm-tooltip .documentation,
.cm-tooltip .docs-documentation {
  @apply text-sm py-1 px-2;

  h1 {
    @apply text-base;
  }

  code,
  .doctest-block,
  .literal-block,
  .docutils.literal,
  .codehilite code {
    @apply text-xs;
  }

  blockquote {
    p,
    dl.docutils,
    .docutils dt {
      @apply text-xs;
    }
  }
}

/* Syntax highlighting for LSP hover code blocks (lezer classHighlighter tok-* classes) */
.docs-documentation,
.cm-tooltip .documentation {
  .tok-keyword { color: light-dark(#708, #c678dd); font-weight: 500; }
  .tok-string,
  .tok-string2 { color: light-dark(#a11, #98c379); }
  .tok-number { color: light-dark(#164, #d19a66); }
  .tok-bool,
  .tok-atom { color: light-dark(#219, #d19a66); }
  .tok-comment { color: var(--cm-comment); }
  .tok-className { color: light-dark(#00f, #61afef); }
  .tok-typeName,
  .tok-namespace { color: light-dark(#085, #56b6c2); }
  .tok-operator { color: light-dark(#a2f, #56b6c2); }
  .tok-propertyName { color: light-dark(#05a, #e5c07b); }
  .tok-variableName { color: light-dark(#000, #abb2bf); }
  .tok-punctuation { color: light-dark(#000, #abb2bf); }
}
