@import "./partials/code-highlight.css";
@import "./partials/code.css";
@import "./partials/lists.css";
@import "./partials/misc.css";
@import "./partials/typography.css";
@import "./partials/zoom.css";

:root {
  --mt-overlay: rgba(251, 251, 251, 0.75);
  --mt-transparent-foreground: rgba(0, 0, 0, 0.4);
  --mt-bg-secondary: rgba(251, 251, 251, 0.8);
  --checkbox-bg-image: url("data:image/svg+xml;utf8,%3Csvg%20width=%2210%22%20height=%229%22%20viewBox=%220%200%2010%208%22%20xmlns=%22http://www.w3.org/2000/svg%22%20fill=%22%23fbfbfb%22%3E%3Cpath%20d=%22M3.46975%205.70757L1.88358%204.1225C1.65832%203.8974%201.29423%203.8974%201.06897%204.1225C0.843675%204.34765%200.843675%204.7116%201.06897%204.93674L3.0648%206.93117C3.29006%207.15628%203.65414%207.15628%203.8794%206.93117L8.93103%201.88306C9.15633%201.65792%209.15633%201.29397%208.93103%201.06883C8.70578%200.843736%208.34172%200.843724%208.11646%201.06879C8.11645%201.0688%208.11643%201.06882%208.11642%201.06883L3.46975%205.70757Z%22%20stroke-width=%220.2%22%20/%3E%3C/svg%3E");

  --la-code-background: rgba(8, 43, 120, 0.047);
  --la-code-color: rgb(212, 212, 212);
  --la-secondary: rgb(157, 157, 159);
  --la-pre-background: rgb(236, 236, 236);
  --la-pre-border: rgb(224, 224, 224);
  --la-pre-color: rgb(47, 47, 49);
  --la-hr: rgb(220, 220, 220);
  --la-drag-handle-hover: rgb(92, 92, 94);

  --hljs-string: rgb(170, 67, 15);
  --hljs-title: rgb(176, 136, 54);
  --hljs-comment: rgb(153, 153, 153);
  --hljs-keyword: rgb(12, 94, 177);
  --hljs-attr: rgb(58, 146, 188);
  --hljs-literal: rgb(200, 43, 15);
  --hljs-name: rgb(37, 151, 146);
  --hljs-selector-tag: rgb(200, 80, 15);
  --hljs-number: rgb(61, 160, 103);
}

.dark .ProseMirror {
  --mt-overlay: rgba(31, 32, 35, 0.75);
  --mt-transparent-foreground: rgba(255, 255, 255, 0.4);
  --mt-bg-secondary: rgba(31, 32, 35, 0.8);
  --checkbox-bg-image: url("data:image/svg+xml;utf8,%3Csvg%20width=%2210%22%20height=%229%22%20viewBox=%220%200%2010%208%22%20xmlns=%22http://www.w3.org/2000/svg%22%20fill=%22lch%284.8%25%200.7%20272%29%22%3E%3Cpath%20d=%22M3.46975%205.70757L1.88358%204.1225C1.65832%203.8974%201.29423%203.8974%201.06897%204.1225C0.843675%204.34765%200.843675%204.7116%201.06897%204.93674L3.0648%206.93117C3.29006%207.15628%203.65414%207.15628%203.8794%206.93117L8.93103%201.88306C9.15633%201.65792%209.15633%201.29397%208.93103%201.06883C8.70578%200.843736%208.34172%200.843724%208.11646%201.06879C8.11645%201.0688%208.11643%201.06882%208.11642%201.06883L3.46975%205.70757Z%22%20stroke-width=%220.2%22%20/%3E%3C/svg%3E");

  --la-code-background: rgba(255, 255, 255, 0.075);
  --la-code-color: rgb(44, 46, 51);
  --la-secondary: rgb(89, 90, 92);
  --la-pre-background: rgb(8, 8, 8);
  --la-pre-border: rgb(35, 37, 42);
  --la-pre-color: rgb(227, 228, 230);
  --la-hr: rgb(38, 40, 45);
  --la-drag-handle-hover: rgb(150, 151, 153);

  --hljs-string: rgb(218, 147, 107);
  --hljs-title: rgb(241, 213, 157);
  --hljs-comment: rgb(170, 170, 170);
  --hljs-keyword: rgb(102, 153, 204);
  --hljs-attr: rgb(144, 202, 232);
  --hljs-literal: rgb(242, 119, 122);
  --hljs-name: rgb(95, 192, 160);
  --hljs-selector-tag: rgb(232, 199, 133);
  --hljs-number: rgb(182, 231, 182);
}

.la-editor .ProseMirror {
  @apply block flex-1 whitespace-pre-wrap outline-0 focus:outline-none;
}

.la-editor .ProseMirror .block-node:not(:last-child),
.la-editor .ProseMirror .list-node:not(:last-child),
.la-editor .ProseMirror .text-node:not(:last-child) {
  @apply mb-2.5;
}

.la-editor .ProseMirror ol,
.la-editor .ProseMirror ul {
  @apply pl-6;
}

.la-editor .ProseMirror blockquote,
.la-editor .ProseMirror dl,
.la-editor .ProseMirror ol,
.la-editor .ProseMirror p,
.la-editor .ProseMirror pre,
.la-editor .ProseMirror ul {
  @apply m-0;
}

.la-editor .ProseMirror li {
  @apply leading-7;
}

.la-editor .ProseMirror p {
  @apply break-words;
}

.la-editor .ProseMirror li .text-node:has(+ .list-node),
.la-editor .ProseMirror li > .list-node,
.la-editor .ProseMirror li > .text-node,
.la-editor .ProseMirror li p {
  @apply mb-0;
}

.la-editor .ProseMirror blockquote {
  @apply relative pl-3.5;
}

.la-editor .ProseMirror blockquote::before,
.la-editor .ProseMirror blockquote.is-empty::before {
  @apply absolute bottom-0 left-0 top-0 h-full w-1 rounded-sm bg-accent-foreground/15 content-[''];
}

.la-editor .ProseMirror hr {
  @apply my-3 h-0.5 w-full border-none bg-[var(--la-hr)];
}

.la-editor .ProseMirror-focused hr.ProseMirror-selectednode {
  @apply rounded-full outline outline-2 outline-offset-1 outline-muted-foreground;
}

.la-editor .ProseMirror .ProseMirror-gapcursor {
  @apply pointer-events-none absolute hidden;
}

.la-editor .ProseMirror .ProseMirror-hideselection {
  @apply caret-transparent;
}

.la-editor .ProseMirror.resize-cursor {
  @apply cursor-col-resize;
}

.la-editor .ProseMirror .selection {
  @apply inline-block;
}

.la-editor .ProseMirror .selection,
.la-editor .ProseMirror *::selection,
::selection {
  @apply bg-primary/40;
}

/* Override native selection when custom selection is present */
.la-editor .ProseMirror .selection::selection {
  background: transparent;
}

[data-theme="slash-command"] {
  width: 1000vw;
}
