/* styles/editor.css */

.ProseMirror {
  @apply text-gray-100 min-h-[200px] h-full prose prose-invert max-w-none;
}

.ProseMirror p.is-editor-empty:first-child::before {
  @apply text-gray-400;
  content: attr(data-placeholder);
  float: left;
  height: 0;
  pointer-events: none;
}

.ProseMirror-focused {
  outline: none !important;
}

h1 {
  @apply text-3xl font-bold my-4 text-gray-100 !important;
}

h2 {
  @apply text-2xl font-bold my-3 text-gray-100 !important;
}

h3 {
  @apply text-xl font-bold my-2 text-gray-100 !important;
}

p {
  @apply m-1 text-gray-50 !important;
}

.ProseMirror ul {
  @apply list-disc pl-6 mb-4;
}

.ProseMirror ol {
  @apply list-decimal pl-6 mb-4;
}

.ProseMirror li {
  @apply mb-1;
}

.ProseMirror a {
  @apply text-blue-400 underline;
}

.ProseMirror code {
  @apply bg-gray-800 px-1.5 py-0.5 rounded text-sm;
}

.ProseMirror mark {
  background-color: inherit;
}

.editor-container {
  @apply rounded-lg border border-gray-700 bg-gray-800/50 backdrop-blur-sm;
}

.tiptap {
  @apply outline-none;
}

::-moz-selection {
  color: initial rgba(255, 255, 255, 0.5);
  background: rgba(255, 255, 255, 0.1);
}

::selection {
  color: initial rgba(255, 255, 255, 0.5);
  background: rgba(255, 255, 255, 0.1);
}
