.markdown-editor .editor-toolbar {
  display: flex;
  align-items: center;
  flex-direction: row;
  padding: 4px 0;
  gap: 4px;
}

.markdown-editor .editor-toolbar > a {
  @apply text-base-content ;
  display: inline-flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
}

.markdown-editor .editor-toolbar > a.active {
  @apply bg-primary text-primary border-primary;
}

.markdown-editor .editor-toolbar > a:hover {
  @apply bg-base-100 ;
}

.markdown-editor .CodeMirror {
  @apply text-base-content bg-base-100 ;
}

.markdown-editor .CodeMirror-cursor {
  @apply border-neutral-content ;
}

pre.CodeMirror-line { overflow-wrap: anywhere ; }

:is(.markdown-content, .editor-preview) {
  @apply bg-base-100 text-base-content font-sans leading-relaxed;
}

/* Headings */
:is(.markdown-content, .editor-preview) h1 {
  @apply text-4xl font-bold text-base-content mb-4;
}
:is(.markdown-content, .editor-preview) h2 {
  @apply text-3xl font-semibold text-base-content mb-3;
}
:is(.markdown-content, .editor-preview) h3 {
  @apply text-2xl font-medium text-base-content mb-2;
}
:is(.markdown-content, .editor-preview) h4 {
  @apply text-xl font-medium text-base-content mb-2;
}
:is(.markdown-content, .editor-preview) h5 {
  @apply text-lg font-semibold text-base-content mb-1;
}
:is(.markdown-content, .editor-preview) h6 {
  @apply text-base font-semibold text-base-content mb-1;
}

/* Paragraphs */
:is(.markdown-content, .editor-preview) p {
  @apply text-base text-base-content mb-4;
}

/* Links */
:is(.markdown-content, .editor-preview) a {
  @apply text-primary hover:text-primary underline;
}
:is(.markdown-content, .editor-preview) a:hover {
  @apply underline;
}

/* Blockquote */
:is(.markdown-content, .editor-preview) blockquote {
  @apply pl-4 border-l-4 border-base-300 italic text-base-content;
}

/* Code */
:is(.markdown-content, .editor-preview) code {
  @apply bg-base-100 text-base-content px-1 py-0.5 rounded font-mono text-sm;
}
:is(.markdown-content, .editor-preview) pre {
  @apply bg-base-200 text-base-content p-4 rounded-md overflow-x-auto;
}

/* Lists */
:is(.markdown-content, .editor-preview) ul {
  @apply list-disc list-inside mb-4;
}
:is(.markdown-content, .editor-preview) ol {
  @apply list-decimal list-inside mb-4;
}
:is(.markdown-content, .editor-preview) li {
  @apply mb-2;
}

/* Tables */
:is(.markdown-content, .editor-preview) table {
  @apply table-auto border-collapse w-full mb-4;
}
:is(.markdown-content, .editor-preview) th {
  @apply bg-base-100 border border-base-300 px-4 py-2 text-left text-base-content font-medium;
}
:is(.markdown-content, .editor-preview) td {
  @apply border border-base-300 px-4 py-2 text-base-content;
}

/* Images */
:is(.markdown-content, .editor-preview) img {
  @apply max-w-full rounded-md shadow-md;
}

/* Horizontal Rules */
:is(.markdown-content, .editor-preview) hr {
  @apply border-t border-base-300 my-6;
}
