:where(lexxy-toolbar) {
  position: sticky;
  top: 0;
  z-index: 10;
}

/* Dark mode styles for Lexxy editor toolbar */
.dark lexxy-toolbar {
  background-color: rgb(0 0 0); /* black */
  border-color: rgb(75 85 99); /* gray-600 */
}

.dark .lexxy-editor__toolbar-button {
  background-color: transparent;
  color: rgb(209 213 219); /* gray-300 */
}

.dark .lexxy-editor__toolbar-button:hover {
  background-color: rgb(55 65 81); /* gray-700 */
}

.dark .lexxy-editor__toolbar-button[aria-pressed="true"],
.dark .lexxy-editor__toolbar-button.is-active {
  background-color: rgb(75 85 99); /* gray-600 */
  color: rgb(243 244 246); /* gray-100 */
}

.dark .lexxy-editor__toolbar-button svg {
  fill: rgb(209 213 219); /* gray-300 */
}

.dark .lexxy-editor__toolbar-button:hover svg {
  fill: rgb(243 244 246); /* gray-100 */
}

.dark .lexxy-editor__toolbar-overflow-menu {
  background-color: rgb(17 24 39); /* gray-900 */
  border-color: rgb(75 85 99); /* gray-600 */
  box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.5);
}

/* Dark mode for link dialog */
.dark .lexxy-link-dialog dialog {
  background-color: rgb(17 24 39); /* gray-900 */
  color: rgb(209 213 219); /* gray-300 */
  border-color: rgb(75 85 99); /* gray-600 */
}

.dark .lexxy-link-dialog input[type="url"] {
  background-color: rgb(0 0 0); /* black */
  border-color: rgb(75 85 99); /* gray-600 */
  color: rgb(243 244 246); /* gray-100 */
}

.dark .lexxy-link-dialog input[type="url"]::placeholder {
  color: rgb(107 114 128); /* gray-500 */
}

.dark .lexxy-link-dialog .btn {
  background-color: rgb(31 41 55); /* gray-800 */
  color: rgb(209 213 219); /* gray-300 */
  border-color: rgb(75 85 99); /* gray-600 */
}

.dark .lexxy-link-dialog .btn:hover {
  background-color: rgb(55 65 81); /* gray-700 */
  color: rgb(243 244 246); /* gray-100 */
}

/* Dark mode text colors for ActionText content */
.dark .lexxy-content,
.dark .lexxy-content p,
.dark .lexxy-content span,
.dark .lexxy-content div,
.dark .lexxy-content strong,
.dark .lexxy-content em,
.dark .lexxy-content b,
.dark .lexxy-content i,
.dark .lexxy-content u,
.dark .lexxy-content h1,
.dark .lexxy-content h2,
.dark .lexxy-content h3,
.dark .lexxy-content h4,
.dark .lexxy-content h5,
.dark .lexxy-content h6,
.dark .lexxy-content li,
.dark .lexxy-content ol,
.dark .lexxy-content ul,
.dark .lexxy-content blockquote,
.dark .lexxy-content pre,
.dark .lexxy-content code {
  color: rgb(209 213 219); /* gray-300 */
}

/* Restore list styles for Lexxy editor and content (Tailwind reset removes them) */
.lexxy-content ul,
.lexxy-editor ul,
lexxy-editor ul,
.trix-content ul {
  list-style-type: disc;
  list-style-position: inside;
  padding-left: 1.5rem;
  margin: 0.5rem 0;
}

.lexxy-content ol,
.lexxy-editor ol,
lexxy-editor ol,
.trix-content ol {
  list-style-type: decimal;
  list-style-position: inside;
  padding-left: 1.5rem;
  margin: 0.5rem 0;
}

.lexxy-content ul ul,
.lexxy-editor ul ul,
lexxy-editor ul ul,
.trix-content ul ul {
  list-style-type: circle;
  padding-left: 1.5rem;
}

.lexxy-content ol ol,
.lexxy-editor ol ol,
lexxy-editor ol ol,
.trix-content ol ol {
  list-style-type: lower-alpha;
  padding-left: 1.5rem;
}

.lexxy-content li,
.lexxy-editor li,
lexxy-editor li,
.trix-content li {
  margin: 0.25rem 0;
}

/* Ensure nested lists have proper indentation */
.lexxy-content li > ul,
.lexxy-content li > ol,
.lexxy-editor li > ul,
.lexxy-editor li > ol,
lexxy-editor li > ul,
lexxy-editor li > ol,
.trix-content li > ul,
.trix-content li > ol {
  margin: 0.25rem 0 0.25rem 0;
}