@reference "tailwindcss";

.custom-md {
  h1 {
    @apply text-3xl;
  }

  h1,
  h2,
  h3,
  h4,
  h5,
  h6 {
    .anchor {
      @apply !transition !-m-0.5 !ml-[0.2ch] !p-0.5 !select-none !opacity-0 !no-underline;

      .anchor-icon {
        @apply !mx-[0.45ch];
      }
    }

    &:hover {
      .anchor {
        @apply !opacity-100;
      }
    }
  }

  a:not(.no-styling) {
    @apply relative bg-none font-medium text-(--primary) underline decoration-(--link-underline) decoration-1 decoration-dashed underline-offset-4;
    box-decoration-break: clone;
    -webkit-box-decoration-break: clone;

    &:hover,
    &:active {
      @apply decoration-transparent;
      background: var(--btn-plain-bg-hover);
      border-bottom: 1px dashed var(--link-hover);
      text-decoration: none;
    }
  }

  code {
    @apply bg-(--inline-code-bg) text-(--inline-code-color) px-1 py-0.5 rounded-md overflow-hidden;

    font-family:
      "JetBrains Mono Variable",
      ui-monospace,
      SFMono-Regular,
      Menlo,
      Monaco,
      Consolas,
      Liberation Mono,
      Courier New,
      monospace;

    &:before {
      content: none;
    }

    &:after {
      content: none;
    }

    counter-reset: line;

    span.line {
      &:before {
        @apply text-white/25 mr-4 w-4 inline-block;
        content: counter(line);
        counter-increment: line;
        direction: rtl;
      }

      &:last-child:empty,
      &:last-child:has(> span:empty:only-child) {
        display: none;
      }
    }
  }

  .expressive-code {
    @apply my-4;
  }

  ul,
  ol {
    li::marker {
      @apply text-(--primary);
    }
  }

  blockquote {
    @apply not-italic border-transparent relative;
    font-weight: inherit;

    &:before {
      @apply content-[''] absolute -left-1 block transition bg-(--btn-regular-bg) h-full w-1 rounded-full;
    }

    /* Remove the double quotes from default styles */
    p:before,
    p:after {
      @apply content-none;
    }
  }

  .katex-display-container {
    max-width: 100%;
    overflow-x: auto;
    margin: 1em 0;
  }
}