@pubwave/editor 0.3.0 → 0.3.5

package/dist/index.css

@@ -1,884 +1 @@
-/**
- * Pubwave Editor Base Styles
- *
- * This file provides:
- * 1. CSS custom properties (theme tokens) with sensible defaults
- * 2. ProseMirror content styles for the editor
- * 3. Minimal global styles for tippy.js popups
- *
- * Note: Most component styles are now handled via Tailwind CSS classes.
- * Users should include their Tailwind setup and import the pubwave preset
- * from tailwind.config.ts for full styling.
- */
-
-/* Import all modular CSS files */
-
-/**
- * Pubwave Editor Base Styles
- *
- * This file provides:
- * 1. CSS custom properties (theme tokens) with sensible defaults
- * 2. ProseMirror content styles for the editor
- * 3. Minimal global styles for tippy.js popups
- *
- * Note: Most component styles are now handled via Tailwind CSS classes.
- * Users should include their Tailwind setup and import the pubwave preset
- * from tailwind.config.ts for full styling.
- */
-
-/* Import all modular CSS files */
-
-/**
- * Pubwave Editor Theme Variables
- *
- * CSS custom properties (theme tokens) with sensible defaults
- */
-
-:root {
-  /* Colors - Light theme */
-  --pubwave-bg: #ffffff;
-  --pubwave-surface: #ffffff;
-  --pubwave-text: #37352f;
-  --pubwave-text-muted: #9b9a97;
-  --pubwave-border: #e3e2e0;
-  --pubwave-border-light: #f3f4f6;
-  --pubwave-hover: #f7f6f3;
-  --pubwave-focus: rgba(0, 0, 0, 0.05);
-  --pubwave-selection: #3b82f6;
-  --pubwave-selection-bg: rgba(35, 131, 226, 0.15);
-  --pubwave-primary: #2383e2;
-  --pubwave-primary-hover: #2563eb;
-  --pubwave-handle-color: #9b9a97;
-  --pubwave-primary-faded: rgba(59, 130, 246, 0.1);
-  --pubwave-drop-indicator: #3b82f6;
-  --pubwave-drop-target: rgba(59, 130, 246, 0.05);
-  --pubwave-error: #ef4444;
-  --pubwave-success: #10b981;
-  --pubwave-warning: #f59e0b;
-  --pubwave-text-secondary: #374151;
-  --pubwave-text-tertiary: #4b5563;
-  --pubwave-hover-bg: #f3f4f6;
-  --pubwave-hover-task: rgba(0, 0, 0, 0.05);
-  --pubwave-checked-text: #9ca3af;
-
-  /* Spacing */
-  --pubwave-spacing-xs: 0.25rem;
-  --pubwave-spacing-sm: 0.5rem;
-  --pubwave-spacing-md: 1rem;
-  --pubwave-spacing-lg: 1.5rem;
-  --pubwave-spacing-xl: 2rem;
-  --pubwave-spacing-1: 4px;
-  --pubwave-spacing-2: 8px;
-  --pubwave-spacing-3: 12px;
-  --pubwave-spacing-4: 16px;
-  --pubwave-spacing-7: 28px;
-
-  /* Typography */
-  --pubwave-font-family: inherit;
-  --pubwave-font-mono:
-    ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
-  --pubwave-font-size-xs: 0.75rem;
-  --pubwave-font-size-sm: 0.875rem;
-  --pubwave-font-size-base: 1rem;
-  --pubwave-font-size-md: 1.125rem;
-  --pubwave-font-size-lg: 1.25rem;
-  --pubwave-font-size-xl: 1.4rem;
-  --pubwave-font-size-2xl: 1.775rem;
-  --pubwave-font-size-3xl: 2.1rem;
-  --pubwave-line-height: 1.625;
-  --pubwave-line-height-heading: 1.25;
-
-  /* Component sizes */
-  --pubwave-button-width: 28px;
-  --pubwave-button-height: 28px;
-  --pubwave-icon-size: 20px;
-  --pubwave-checkbox-size: 20px;
-  --pubwave-checkbox-input-size: 16px;
-  --pubwave-divider-width: 1px;
-  --pubwave-divider-height: 20px;
-  --pubwave-drop-indicator-width: 2px;
-  --pubwave-drop-indicator-height: 2px;
-  --pubwave-task-item-height: 30px;
-
-  /* Borders */
-  --pubwave-radius-xs: 3px;
-  --pubwave-radius-sm: 4px;
-  --pubwave-radius: 6px;
-  --pubwave-radius-md: 6px;
-  --pubwave-radius-lg: 8px;
-
-  /* Shadows */
-  --pubwave-shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
-  --pubwave-shadow:
-    0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
-  --pubwave-shadow-lg:
-    0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
-}
-
-/* Dark theme */
-
-[data-theme='dark'] {
-  --pubwave-hover-task: rgba(255, 255, 255, 0.12);
-}
-
-/**
- * Pubwave Editor Container Styles
- */
-
-/* Editor container */
-
-.pubwave-editor {
-  position: relative;
-  width: var(--pubwave-container-width, 100%);
-  max-width: var(--pubwave-container-max-width, none);
-  font-family: var(--pubwave-font-family);
-  color: var(--pubwave-text);
-  background: var(--pubwave-bg, #ffffff);
-  border-radius: var(--pubwave-container-border-radius, 16px);
-  padding: var(--pubwave-container-padding-y, 96px)
-    var(--pubwave-container-padding-x, 120px);
-  padding-left: var(--pubwave-container-padding-left, 140px);
-  /* Sophisticated tiered shadow */
-  box-shadow:
-    0 0 0 1px rgba(0, 0, 0, 0.04),
-    0 20px 25px -5px rgba(0, 0, 0, 0.05),
-    0 10px 10px -5px rgba(0, 0, 0, 0.02);
-}
-
-/* Default min-height only when not using fixed height mode */
-
-.pubwave-editor:not(.pubwave-editor--fixed-height) {
-  min-height: var(--pubwave-container-min-height, 700px);
-}
-
-/* Mobile responsive styles */
-
-@media (max-width: 768px) {
-  .pubwave-editor {
-    padding: var(--pubwave-container-padding-y-mobile, 20px)
-      var(--pubwave-container-padding-x-mobile, 16px);
-    padding-left: var(--pubwave-container-padding-left-mobile, 16px);
-    border-radius: var(--pubwave-container-border-radius-mobile, 12px);
-  }
-
-  .pubwave-editor:not(.pubwave-editor--fixed-height) {
-    min-height: var(--pubwave-container-min-height-mobile, 400px);
-  }
-}
-
-.pubwave-editor,
-.pubwave-editor *,
-.pubwave-editor *::before,
-.pubwave-editor *::after {
-  box-sizing: border-box;
-}
-
-/* ProseMirror content area */
-
-.pubwave-editor__content {
-  outline: none;
-  min-height: 1em;
-  display: flex;
-  flex-direction: column;
-  flex: 1;
-  /* When parent has fixed height, content should scroll */
-  overflow-y: auto;
-  overflow-x: hidden;
-}
-
-/* When editor has fixed height, reduce padding to avoid excessive scrolling */
-
-.pubwave-editor--fixed-height .pubwave-editor__content {
-  padding-bottom: 2rem;
-  /* Smaller padding for fixed height containers */
-}
-
-/* Placeholder styling */
-
-.pubwave-editor__content p.is-editor-empty:first-child::before {
-  content: attr(data-placeholder);
-  float: left;
-  color: var(--pubwave-text-muted);
-  pointer-events: none;
-  height: 0;
-}
-
-/* Empty paragraph placeholder - always visible when empty, not just when focused */
-
-.pubwave-editor__content p.pubwave-editor__node--empty::before,
-.ProseMirror p.pubwave-editor__node--empty::before {
-  content: attr(data-placeholder);
-  float: left;
-  color: var(--pubwave-text-muted);
-  pointer-events: none;
-  height: 0;
-}
-
-/* Block spacing */
-
-.pubwave-editor__content > * + * {
-  margin-top: 0.75em !important;
-}
-
-/* Mobile: Reduce block spacing and font sizes */
-
-.pubwave-editor__content > * + * {
-  margin-top: 0.35em !important;
-}
-
-.pubwave-editor .pubwave-editor__content > * + * {
-  margin-top: 1rem !important;
-  margin-bottom: 1rem !important;
-}
-
-/* Responsive font sizes for mobile */
-
-.pubwave-editor__content {
-  font-size: var(--pubwave-font-size-base, 15px);
-}
-
-.pubwave-editor__content h1 {
-  font-size: var(--pubwave-font-size-3xl, 1.75rem);
-}
-
-.pubwave-editor__content h2 {
-  font-size: var(--pubwave-font-size-2xl, 1.375rem);
-}
-
-.pubwave-editor__content h3 {
-  font-size: var(--pubwave-font-size-xl, 1.125rem);
-}
-
-/**
- * Pubwave Editor Content Styles
- */
-
-/* Paragraph */
-
-.pubwave-editor__content p {
-  margin: 0;
-  line-height: var(--pubwave-line-height);
-  margin-block-start: 1em;
-  margin-block-end: 1em;
-  margin-inline-start: 0px;
-  margin-inline-end: 0px;
-  unicode-bidi: isolate;
-}
-
-/* Headings */
-
-.pubwave-editor__content h1,
-.pubwave-editor__content h2,
-.pubwave-editor__content h3 {
-  line-height: var(--pubwave-line-height-heading);
-  font-weight: 600;
-}
-
-/* Lists */
-
-.pubwave-editor__content ul:not([data-type='taskList']),
-.pubwave-editor__content ol {
-  margin: 0;
-  padding-left: 1.5em;
-}
-
-.pubwave-editor__content .pubwave-editor__ordered-list {
-  margin: 0;
-  padding-left: 2em !important;
-  display: block;
-  list-style-type: decimal;
-  margin-block-start: 1em;
-  unicode-bidi: isolate;
-}
-
-.pubwave-editor__content .pubwave-editor__bullet-list {
-  display: block;
-  list-style-type: disc;
-  margin-block-start: 1em;
-  margin-block-end: 1em;
-  padding-inline-start: 40px;
-  unicode-bidi: isolate;
-}
-
-.pubwave-editor__content .pubwave-editor__bullet-list,
-.pubwave-editor__content .pubwave-editor__ordered-list {
-  padding-left: 1.3em !important;
-}
-
-.pubwave-editor__content
-  li:not([data-type='taskItem']):not(.pubwave-editor__task-item) {
-  margin: 0.25em 0;
-}
-
-.pubwave-editor__content li > p {
-  margin: 0;
-}
-
-/* Blockquote */
-
-.pubwave-editor__content blockquote,
-.pubwave-editor__content.ProseMirror blockquote {
-  margin: 0;
-  padding-left: 1em;
-  border-left: 3px solid var(--pubwave-text, #1a1a1a) !important;
-  font-style: italic;
-  margin: 0.5em 0;
-}
-
-/* Code block */
-
-.pubwave-editor__content pre,
-.pubwave-editor__content pre {
-  margin: 0.5em 0;
-  padding: 0.5em 0.75em;
-  background: var(--pubwave-border-light, #f3f4f6) !important;
-  border-radius: var(--pubwave-radius-md, 6px) !important;
-  font-family:
-    ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, 'Liberation Mono',
-    'Courier New', monospace !important;
-  font-size: var(--pubwave-font-size-sm, 13px) !important;
-  line-height: 1.5;
-  overflow-x: auto;
-  color: #1a1a1a !important;
-}
-
-.pubwave-editor__content pre code,
-.pubwave-editor__content pre code {
-  background: none !important;
-  padding: 0 !important;
-  border-radius: 0 !important;
-  font-size: inherit !important;
-  color: inherit !important;
-  font-family: inherit !important;
-}
-
-/* Horizontal rule / Divider */
-
-.pubwave-editor__content hr,
-.pubwave-editor__content hr,
-.pubwave-editor__content .pubwave-editor__divider {
-  border: none;
-  border-top: 1px solid var(--pubwave-border, #e5e7eb) !important;
-  height: 0 !important;
-  background: none !important;
-}
-
-/* Image */
-
-.pubwave-editor__content img,
-.pubwave-editor__content img,
-.pubwave-editor__content .pubwave-editor__image {
-  display: block;
-  max-width: 100%;
-  height: auto;
-  margin-top: 1em;
-  border-radius: var(--pubwave-radius-md, 6px);
-  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
-  cursor: pointer;
-  transition: opacity 0.2s ease;
-}
-
-.pubwave-editor__content img:hover,
-.pubwave-editor__content img:hover,
-.pubwave-editor__content .pubwave-editor__image:hover {
-  opacity: 0.6;
-}
-
-.pubwave-editor__content img.ProseMirror-selectednode,
-.pubwave-editor__content img.ProseMirror-selectednode,
-.pubwave-editor__content .pubwave-editor__image.ProseMirror-selectednode {
-  outline: 2px solid var(--pubwave-primary, #2383e2);
-  outline-offset: 2px;
-}
-
-/* Inline marks */
-
-.pubwave-editor__content strong {
-  font-weight: 600;
-}
-
-.pubwave-editor__content em {
-  font-style: italic;
-}
-
-.pubwave-editor__content u {
-  text-decoration: underline;
-}
-
-.pubwave-editor__content s {
-  text-decoration: line-through;
-}
-
-.pubwave-editor__content code {
-  background: var(--pubwave-hover);
-  padding: 0.15em 0.35em;
-  border-radius: var(--pubwave-radius-sm);
-  font-family: var(--pubwave-font-mono);
-  font-size: 0.9em;
-}
-
-/* Links */
-
-.pubwave-editor__content a,
-.pubwave-editor .ProseMirror a {
-  color: var(--pubwave-link-color, #2383e2) !important;
-  text-decoration: underline;
-  cursor: pointer;
-}
-
-.pubwave-editor__content a:hover,
-.pubwave-editor .ProseMirror a:hover {
-  color: var(
-    --pubwave-link-hover-color,
-    var(--pubwave-link-color, #2383e2)
-  ) !important;
-  opacity: 0.8;
-}
-
-/* Selection highlight */
-
-.pubwave-editor__content ::-moz-selection {
-  background-color: var(--pubwave-selection-bg);
-}
-
-.pubwave-editor__content ::selection {
-  background-color: var(--pubwave-selection-bg);
-}
-
-/* Read-only mode */
-
-.pubwave-editor--readonly {
-  cursor: default;
-}
-
-.pubwave-editor--readonly .pubwave-editor__content {
-  cursor: default;
-}
-
-/**
- * Pubwave Editor Task List Styles
- */
-
-/* Task list */
-
-.pubwave-editor__content ul[data-type='taskList'] {
-  list-style: none !important;
-  padding-left: 0 !important;
-  margin: 0 !important;
-  padding: var(--pubwave-spacing-4, 16px) 0;
-}
-
-/* Task list items - unified rules with high specificity */
-
-/* Use very specific selectors to override Tailwind base styles and browser defaults */
-
-.pubwave-editor__content ul[data-type='taskList'] li,
-.pubwave-editor__content ul[data-type='taskList'] > li,
-.pubwave-editor__content ul[data-type='taskList'] li[data-type='taskItem'],
-.pubwave-editor__content ul[data-type='taskList'] li.pubwave-editor__task-item,
-.pubwave-editor__content .pubwave-editor__task-item,
-.pubwave-editor__content.ProseMirror ul[data-type='taskList'] li,
-.ProseMirror.pubwave-editor__content ul[data-type='taskList'] li {
-  display: flex !important;
-  align-items: flex-start !important;
-  flex-direction: row !important;
-  gap: 0.5em !important;
-  padding: 0.25em 0 !important;
-  border-radius: var(--pubwave-radius-sm, 4px) !important;
-  margin: 0 !important;
-  list-style: none !important;
-  list-style-type: none !important;
-  list-style-position: outside !important;
-  padding-left: 0 !important;
-  /* Override browser default list-item display */
-  list-style-image: none !important;
-  /* Force override any Tailwind base styles */
-  -webkit-appearance: none !important;
-  -moz-appearance: none !important;
-       appearance: none !important;
-}
-
-.pubwave-editor__task-item {
-  min-height: var(--pubwave-task-item-height, 30px);
-  height: auto !important;
-}
-
-.pubwave-editor__content ul[data-type='taskList'] li::marker,
-.pubwave-editor__content
-  ul[data-type='taskList']
-  li[data-type='taskItem']::marker,
-.pubwave-editor__content
-  ul[data-type='taskList']
-  li.pubwave-editor__task-item::marker {
-  display: none !important;
-  content: '' !important;
-  width: 0 !important;
-  font-size: 0 !important;
-}
-
-.pubwave-editor__content ul[data-type='taskList'] li::before,
-.pubwave-editor__content
-  ul[data-type='taskList']
-  li[data-type='taskItem']::before,
-.pubwave-editor__content
-  ul[data-type='taskList']
-  li.pubwave-editor__task-item::before {
-  display: none !important;
-  content: '' !important;
-  width: 0 !important;
-}
-
-.pubwave-editor__content ul[data-type='taskList'] li:hover {
-  background-color: var(--pubwave-hover-task);
-  outline: 1px solid rgba(255, 255, 255, 0.1);
-  transition: background-color 0.15s ease;
-}
-
-.pubwave-editor__content ul[data-type='taskList'] li > label,
-.pubwave-editor__content
-  ul[data-type='taskList']
-  li[data-type='taskItem']
-  > label,
-.pubwave-editor__content
-  ul[data-type='taskList']
-  li.pubwave-editor__task-item
-  > label {
-  flex-shrink: 0 !important;
-  margin: 0 !important;
-  margin-right: 0 !important;
-  position: relative !important;
-  cursor: pointer !important;
-  width: var(--pubwave-checkbox-size, 20px) !important;
-  height: var(--pubwave-checkbox-size, 20px) !important;
-  min-height: var(--pubwave-checkbox-size, 20px) !important;
-  max-height: var(--pubwave-checkbox-size, 20px) !important;
-  display: block !important;
-  align-self: flex-start !important;
-  line-height: 1 !important;
-  padding: 0 !important;
-  overflow: hidden !important;
-  margin-top: 0.125em !important;
-}
-
-.pubwave-editor__content input[type='checkbox'] {
-  background-color: initial;
-  cursor: default;
-  -webkit-appearance: auto;
-     -moz-appearance: auto;
-          appearance: auto;
-  box-sizing: border-box;
-  margin: 3px 3px 3px 4px;
-  padding: initial;
-  border: initial;
-}
-
-.pubwave-editor__content ul[data-type='taskList'] li > label::before {
-  content: '';
-  display: block;
-  width: var(--pubwave-checkbox-size, 20px);
-  height: var(--pubwave-checkbox-size, 20px);
-  border: 1.5px solid var(--pubwave-text, #1a1a1a);
-  border-radius: var(--pubwave-radius-xs, 3px);
-  background-color: #ffffff;
-  transition: all 0.15s ease;
-  box-sizing: border-box;
-  position: absolute;
-  top: 0;
-  left: 0;
-}
-
-.pubwave-editor__content
-  ul[data-type='taskList']
-  li[data-checked='true']
-  > label::before {
-  background-color: var(--pubwave-primary-hover, #2563eb);
-  border-color: var(--pubwave-primary-hover, #2563eb);
-}
-
-.pubwave-editor__content
-  ul[data-type='taskList']
-  li[data-checked='true']
-  > label::after {
-  content: '';
-  position: absolute;
-  left: 6px;
-  top: 3px;
-  width: 5px;
-  height: 10px;
-  border: solid var(--pubwave-bg, #ffffff);
-  border-width: 0 2px 2px 0;
-  transform: rotate(45deg);
-  box-sizing: border-box;
-  z-index: 1;
-}
-
-.pubwave-editor__content ul[data-type='taskList'] li > div,
-.pubwave-editor__content
-  ul[data-type='taskList']
-  li[data-type='taskItem']
-  > div,
-.pubwave-editor__content
-  ul[data-type='taskList']
-  li.pubwave-editor__task-item
-  > div {
-  flex: 1 !important;
-  min-width: 0 !important;
-  color: var(--pubwave-text, #1a1a1a) !important;
-  display: block !important;
-  margin: 0 !important;
-  padding: 0 !important;
-  /* Use padding to create height instead of min-height to avoid flex gaps */
-  padding-top: 0.1em !important;
-  padding-bottom: 0.1em !important;
-}
-
-.pubwave-editor__content ul[data-type='taskList'] li > div p,
-.pubwave-editor__content
-  ul[data-type='taskList']
-  li[data-type='taskItem']
-  > div
-  p,
-.pubwave-editor__content
-  ul[data-type='taskList']
-  li.pubwave-editor__task-item
-  > div
-  p,
-.pubwave-editor__content ul[data-type='taskList'] li > div > p,
-.pubwave-editor__content
-  ul[data-type='taskList']
-  li
-  > div
-  p.pubwave-editor__paragraph,
-.pubwave-editor__content
-  ul[data-type='taskList']
-  li[data-type='taskItem']
-  > div
-  p.pubwave-editor__paragraph {
-  margin: 0 !important;
-  padding: 0 !important;
-  line-height: 1.5 !important;
-  display: block !important;
-  width: 100% !important;
-  /* Ensure empty paragraphs have height */
-  min-height: 1.5em !important;
-}
-
-.pubwave-editor__content.ProseMirror
-  ul[data-type='taskList']
-  li[data-checked='true']
-  > div
-  p,
-.pubwave-editor__content
-  ul[data-type='taskList']
-  li[data-checked='true']
-  > div
-  p {
-  color: var(--pubwave-checked-text, #9ca3af) !important;
-  text-decoration: line-through !important;
-}
-
-/**
- * Pubwave Editor Component Styles
- */
-
-.pubwave-block {
-  position: relative;
-  padding-left: 2.5em;
-}
-
-.pubwave-block-menu {
-  position: absolute;
-  left: 0.5em;
-  top: 50%;
-  transform: translateY(-50%);
-  z-index: 2;
-  display: flex;
-  align-items: center;
-  gap: 0.5em;
-}
-
-/* Dragging state */
-
-.pubwave-block--dragging {
-  opacity: 0.4;
-}
-
-/* Specific styling for the drag image (ghost) */
-
-.pubwave-block--drag-preview {
-  color: var(--pubwave-text-muted, #9b9a97) !important;
-  opacity: 0.6 !important;
-}
-
-.pubwave-block--drag-preview div,
-.pubwave-block--drag-preview p,
-.pubwave-block--drag-preview label,
-.pubwave-block--drag-preview .pubwave-editor__task-item > div {
-  color: var(--pubwave-text-muted, #9b9a97) !important;
-}
-
-/* Hide the real input in the ghost to prevent layering */
-
-.pubwave-block--drag-preview label input {
-  display: none !important;
-}
-
-/* Force 16px checkbox in the ghost */
-
-.pubwave-block--drag-preview label::before {
-  border-color: var(--pubwave-text-muted, #9b9a97) !important;
-  width: 16px !important;
-  height: 16px !important;
-}
-
-.pubwave-block--drag-preview label::after {
-  border-color: var(--pubwave-bg, #ffffff) !important;
-  left: 4px !important;
-  top: 2px !important;
-}
-
-/* Gapcursor */
-
-.ProseMirror .ProseMirror-gapcursor {
-  display: none;
-  pointer-events: none;
-  position: absolute;
-}
-
-.ProseMirror .ProseMirror-gapcursor:after {
-  content: '';
-  display: block;
-  position: absolute;
-  top: -2px;
-  width: 20px;
-  border-top: 1px solid var(--pubwave-text);
-  animation: pubwave-cursor-blink 1.1s steps(2, start) infinite;
-}
-
-@keyframes pubwave-cursor-blink {
-  to {
-    visibility: hidden;
-  }
-}
-
-.ProseMirror-focused .ProseMirror-gapcursor {
-  display: block;
-}
-
-/* Drop cursor */
-
-.ProseMirror-dropcursor {
-  border-left: 2px solid var(--pubwave-primary);
-  pointer-events: none;
-}
-
-/* Drag handle icon styles - elegant and theme-aware */
-
-.pubwave-block-handle__drag,
-.pubwave-block-handle__add {
-  color: var(--pubwave-text-muted, #9b9a97) !important;
-}
-
-/* Toolbar button hover styles */
-
-.pubwave-toolbar__button:not(:disabled):hover {
-  background-color: var(--pubwave-hover) !important;
-}
-
-/* Turn Into dropdown button hover - only when not active */
-
-.pubwave-toolbar__turn-into-option:not(
-    .pubwave-toolbar__turn-into-option--active
-  ):hover {
-  background-color: var(--pubwave-hover) !important;
-}
-
-/**
- * Pubwave Editor Popup and Tooltip Styles
- */
-
-/* Tippy.js popup styles for SlashMenu */
-
-.tippy-box {
-  z-index: var(--pubwave-z-dropdown, 60) !important;
-  /* Fix black block flash issue - make tippy-box transparent by default */
-  background: transparent !important;
-  border: none !important;
-}
-
-/* Ensure tippy-box with slash menu is transparent */
-
-.tippy-box:has(.pubwave-slash-menu) {
-  background: transparent !important;
-  border: none !important;
-}
-
-/* Ensure slash menu border uses theme color */
-
-.pubwave-slash-menu {
-  border: 1px solid var(--pubwave-border, #e3e2e0) !important;
-}
-
-/* Style the "/" character when slash menu is active */
-
-/* Only apply styles when suggestion element exists (menu is active) */
-
-.pubwave-editor .ProseMirror .suggestion {
-  /* Use semi-transparent white background for visibility */
-  background-color: rgba(255, 255, 255, 0.95) !important;
-  border: 1px solid var(--pubwave-border, #e3e2e0) !important;
-  border-radius: var(--pubwave-radius-md, 6px) !important;
-  padding: 2px 4px !important;
-  display: inline-block !important;
-  /* Use dark text color for visibility */
-  /* This ensures readability regardless of theme */
-  color: #1f2937 !important;
-}
-
-/* Ensure all text inside suggestion uses dark color for visibility */
-
-.pubwave-editor .ProseMirror .suggestion,
-.pubwave-editor .ProseMirror .suggestion *,
-.pubwave-editor .ProseMirror .suggestion span,
-.pubwave-editor .ProseMirror .suggestion strong,
-.pubwave-editor .ProseMirror .suggestion em,
-.pubwave-editor .ProseMirror .suggestion code {
-  color: #1f2937 !important;
-}
-
-/* Tippy.js Popup Overrides */
-
-.tippy-box,
-.tippy-box[data-theme] {
-  z-index: 60 !important;
-}
-
-.tippy-box[data-theme~='pubwave'] {
-  background: transparent;
-  box-shadow: none;
-  border: none;
-}
-
-.tippy-box[data-theme~='pubwave'] .tippy-content {
-  padding: 0;
-}
-
-/* ColorPicker tooltip theme - always black background with white text */
-
-.tippy-box[data-theme~='light-border'] {
-  background-color: #000000 !important;
-  color: #ffffff !important;
-  border: none !important;
-  border-radius: var(--pubwave-radius, 6px);
-  box-shadow: var(--pubwave-shadow-md, 0 4px 6px -1px rgba(0, 0, 0, 0.1));
-  font-size: 16px;
-  padding: 4px 8px;
-}
-
-/* Ensure tooltip content text is white */
-
-.tippy-box[data-theme~='light-border'] .tippy-content {
-  color: #ffffff !important;
-}
-
-.tippy-box[data-animation=fade][data-state=hidden]{opacity:0}[data-tippy-root]{max-width:calc(100vw - 10px)}.tippy-box{position:relative;background-color:#333;color:#fff;border-radius:4px;font-size:14px;line-height:1.4;white-space:normal;outline:0;transition-property:transform,visibility,opacity}.tippy-box[data-placement^=top]>.tippy-arrow{bottom:0}.tippy-box[data-placement^=top]>.tippy-arrow:before{bottom:-7px;left:0;border-width:8px 8px 0;border-top-color:initial;transform-origin:center top}.tippy-box[data-placement^=bottom]>.tippy-arrow{top:0}.tippy-box[data-placement^=bottom]>.tippy-arrow:before{top:-7px;left:0;border-width:0 8px 8px;border-bottom-color:initial;transform-origin:center bottom}.tippy-box[data-placement^=left]>.tippy-arrow{right:0}.tippy-box[data-placement^=left]>.tippy-arrow:before{border-width:8px 0 8px 8px;border-left-color:initial;right:-7px;transform-origin:center left}.tippy-box[data-placement^=right]>.tippy-arrow{left:0}.tippy-box[data-placement^=right]>.tippy-arrow:before{left:-7px;border-width:8px 8px 8px 0;border-right-color:initial;transform-origin:center right}.tippy-box[data-inertia][data-state=visible]{transition-timing-function:cubic-bezier(.54,1.5,.38,1.11)}.tippy-arrow{width:16px;height:16px;color:#333}.tippy-arrow:before{content:"";position:absolute;border-color:transparent;border-style:solid}.tippy-content{position:relative;padding:5px 9px;z-index:1}
+:root{--pubwave-bg: #ffffff;--pubwave-surface: #ffffff;--pubwave-text: #37352f;--pubwave-text-muted: #9b9a97;--pubwave-border: #e3e2e0;--pubwave-border-light: #f3f4f6;--pubwave-hover: #f7f6f3;--pubwave-focus: rgba(0, 0, 0, .05);--pubwave-selection: #3b82f6;--pubwave-selection-bg: rgba(35, 131, 226, .15);--pubwave-primary: #2383e2;--pubwave-primary-hover: #2563eb;--pubwave-handle-color: #9b9a97;--pubwave-primary-faded: rgba(59, 130, 246, .1);--pubwave-drop-indicator: #3b82f6;--pubwave-drop-target: rgba(59, 130, 246, .05);--pubwave-error: #ef4444;--pubwave-success: #10b981;--pubwave-warning: #f59e0b;--pubwave-text-secondary: #374151;--pubwave-text-tertiary: #4b5563;--pubwave-hover-bg: #f3f4f6;--pubwave-hover-task: rgba(0, 0, 0, .05);--pubwave-checked-text: #9ca3af;--pubwave-spacing-xs: .25rem;--pubwave-spacing-sm: .5rem;--pubwave-spacing-md: 1rem;--pubwave-spacing-lg: 1.5rem;--pubwave-spacing-xl: 2rem;--pubwave-spacing-1: 4px;--pubwave-spacing-2: 8px;--pubwave-spacing-3: 12px;--pubwave-spacing-4: 16px;--pubwave-spacing-7: 28px;--pubwave-font-family: inherit;--pubwave-font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;--pubwave-font-size-xs: .75rem;--pubwave-font-size-sm: .875rem;--pubwave-font-size-base: 1rem;--pubwave-font-size-md: 1.125rem;--pubwave-font-size-lg: 1.25rem;--pubwave-font-size-xl: 1.4rem;--pubwave-font-size-2xl: 1.775rem;--pubwave-font-size-3xl: 2.1rem;--pubwave-line-height: 1.625;--pubwave-line-height-heading: 1.25;--pubwave-button-width: 28px;--pubwave-button-height: 28px;--pubwave-icon-size: 20px;--pubwave-checkbox-size: 20px;--pubwave-checkbox-input-size: 16px;--pubwave-divider-width: 1px;--pubwave-divider-height: 20px;--pubwave-drop-indicator-width: 2px;--pubwave-drop-indicator-height: 2px;--pubwave-task-item-height: 30px;--pubwave-radius-xs: 3px;--pubwave-radius-sm: 4px;--pubwave-radius: 6px;--pubwave-radius-md: 6px;--pubwave-radius-lg: 8px;--pubwave-shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, .05);--pubwave-shadow: 0 4px 6px -1px rgba(0, 0, 0, .1), 0 2px 4px -1px rgba(0, 0, 0, .06);--pubwave-shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, .1), 0 4px 6px -2px rgba(0, 0, 0, .05)}[data-theme=dark]{--pubwave-hover-task: rgba(255, 255, 255, .12)}.pubwave-editor{position:relative;width:var(--pubwave-container-width, 100%);max-width:var(--pubwave-container-max-width, none);font-family:var(--pubwave-font-family);color:var(--pubwave-text);background:var(--pubwave-bg, #ffffff);border-radius:var(--pubwave-container-border-radius, 16px);padding:var(--pubwave-container-padding-y, 96px) var(--pubwave-container-padding-x, 120px);padding-left:var(--pubwave-container-padding-left, 140px);box-shadow:0 0 0 1px #0000000a,0 20px 25px -5px #0000000d,0 10px 10px -5px #00000005}.pubwave-editor:not(.pubwave-editor--fixed-height){min-height:var(--pubwave-container-min-height, 700px)}@media(max-width:768px){.pubwave-editor{padding:var(--pubwave-container-padding-y-mobile, 20px) var(--pubwave-container-padding-x-mobile, 16px);padding-left:var(--pubwave-container-padding-left-mobile, 16px);border-radius:var(--pubwave-container-border-radius-mobile, 12px)}.pubwave-editor:not(.pubwave-editor--fixed-height){min-height:var(--pubwave-container-min-height-mobile, 400px)}}.pubwave-editor,.pubwave-editor *,.pubwave-editor *:before,.pubwave-editor *:after{box-sizing:border-box}.pubwave-editor__content{outline:none;min-height:1em;display:flex;flex-direction:column;flex:1;overflow-y:auto;overflow-x:hidden}.pubwave-editor--fixed-height .pubwave-editor__content{padding-bottom:2rem}.pubwave-editor__content p.is-editor-empty:first-child:before{content:attr(data-placeholder);float:left;color:var(--pubwave-text-muted);pointer-events:none;height:0}.pubwave-editor__content p.pubwave-editor__node--empty:before,.ProseMirror p.pubwave-editor__node--empty:before{content:attr(data-placeholder);float:left;color:var(--pubwave-text-muted);pointer-events:none;height:0}.pubwave-editor__content>*+*{margin-top:.75em!important}.pubwave-editor__content>*+*{margin-top:.35em!important}.pubwave-editor .pubwave-editor__content>*+*{margin-top:1rem!important;margin-bottom:1rem!important}.pubwave-editor__content{font-size:var(--pubwave-font-size-base, 15px)}.pubwave-editor__content h1{font-size:var(--pubwave-font-size-3xl, 1.75rem)}.pubwave-editor__content h2{font-size:var(--pubwave-font-size-2xl, 1.375rem)}.pubwave-editor__content h3{font-size:var(--pubwave-font-size-xl, 1.125rem)}.pubwave-editor__content p{margin:0;line-height:var(--pubwave-line-height);margin-block-start:1em;margin-block-end:1em;margin-inline-start:0px;margin-inline-end:0px;unicode-bidi:isolate}.pubwave-editor__content h1,.pubwave-editor__content h2,.pubwave-editor__content h3{line-height:var(--pubwave-line-height-heading);font-weight:600}.pubwave-editor__content ul:not([data-type=taskList]),.pubwave-editor__content ol{margin:0;padding-left:1.5em}.pubwave-editor__content .pubwave-editor__ordered-list{margin:0;padding-left:2em!important;display:block;list-style-type:decimal;margin-block-start:1em;unicode-bidi:isolate}.pubwave-editor__content .pubwave-editor__bullet-list{display:block;list-style-type:disc;margin-block-start:1em;margin-block-end:1em;padding-inline-start:40px;unicode-bidi:isolate}.pubwave-editor__content .pubwave-editor__bullet-list,.pubwave-editor__content .pubwave-editor__ordered-list{padding-left:1.3em!important}.pubwave-editor__content li:not([data-type=taskItem]):not(.pubwave-editor__task-item){margin:.25em 0}.pubwave-editor__content li>p{margin:0}.pubwave-editor__content blockquote,.pubwave-editor__content.ProseMirror blockquote{padding-left:1em;border-left:3px solid var(--pubwave-text, #1a1a1a)!important;font-style:italic;margin:.5em 0}.pubwave-editor__content pre{margin:.5em 0;padding:.5em .75em;background:var(--pubwave-border-light, #f3f4f6)!important;border-radius:var(--pubwave-radius-md, 6px)!important;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace!important;font-size:var(--pubwave-font-size-sm, 13px)!important;line-height:1.5;overflow-x:auto;color:#1a1a1a!important}.pubwave-editor__content pre code{background:none!important;padding:0!important;border-radius:0!important;font-size:inherit!important;color:inherit!important;font-family:inherit!important}.pubwave-editor__content hr,.pubwave-editor__content .pubwave-editor__divider{border:none;border-top:1px solid var(--pubwave-border, #e5e7eb)!important;height:0!important;background:none!important}.pubwave-editor__content img,.pubwave-editor__content .pubwave-editor__image{display:block;max-width:100%;height:auto;margin-top:1em;border-radius:var(--pubwave-radius-md, 6px);box-shadow:0 1px 3px #0000001a;cursor:pointer;transition:opacity .2s ease}.pubwave-editor__content img:hover,.pubwave-editor__content .pubwave-editor__image:hover{opacity:.6}.pubwave-editor__content img.ProseMirror-selectednode,.pubwave-editor__content .pubwave-editor__image.ProseMirror-selectednode{outline:2px solid var(--pubwave-primary, #2383e2);outline-offset:2px}.pubwave-editor__content strong{font-weight:600}.pubwave-editor__content em{font-style:italic}.pubwave-editor__content u{text-decoration:underline}.pubwave-editor__content s{text-decoration:line-through}.pubwave-editor__content code{background:var(--pubwave-hover);padding:.15em .35em;border-radius:var(--pubwave-radius-sm);font-family:var(--pubwave-font-mono);font-size:.9em}.pubwave-editor__content a,.pubwave-editor .ProseMirror a{color:var(--pubwave-link-color, #2383e2)!important;text-decoration:underline;cursor:pointer}.pubwave-editor__content a:hover,.pubwave-editor .ProseMirror a:hover{color:var( --pubwave-link-hover-color, var(--pubwave-link-color, #2383e2) )!important;opacity:.8}.pubwave-editor__content ::-moz-selection{background-color:var(--pubwave-selection-bg)}.pubwave-editor__content ::selection{background-color:var(--pubwave-selection-bg)}.pubwave-editor--readonly,.pubwave-editor--readonly .pubwave-editor__content{cursor:default}.pubwave-editor__content ul[data-type=taskList]{list-style:none!important;padding-left:0!important;margin:0!important;padding:var(--pubwave-spacing-4, 16px) 0}.pubwave-editor__content ul[data-type=taskList] li,.pubwave-editor__content ul[data-type=taskList]>li,.pubwave-editor__content ul[data-type=taskList] li[data-type=taskItem],.pubwave-editor__content ul[data-type=taskList] li.pubwave-editor__task-item,.pubwave-editor__content .pubwave-editor__task-item,.pubwave-editor__content.ProseMirror ul[data-type=taskList] li,.ProseMirror.pubwave-editor__content ul[data-type=taskList] li{display:flex!important;align-items:flex-start!important;flex-direction:row!important;gap:.5em!important;border-radius:var(--pubwave-radius-sm, 4px)!important;margin:0!important;list-style:none!important;list-style-type:none!important;list-style-position:outside!important;padding:.25em 0!important;list-style-image:none!important;-webkit-appearance:none!important;-moz-appearance:none!important;appearance:none!important}.pubwave-editor__task-item{min-height:var(--pubwave-task-item-height, 30px);height:auto!important}.pubwave-editor__content ul[data-type=taskList] li::marker,.pubwave-editor__content ul[data-type=taskList] li[data-type=taskItem]::marker,.pubwave-editor__content ul[data-type=taskList] li.pubwave-editor__task-item::marker{display:none!important;content:""!important;width:0!important;font-size:0!important}.pubwave-editor__content ul[data-type=taskList] li:before,.pubwave-editor__content ul[data-type=taskList] li[data-type=taskItem]:before,.pubwave-editor__content ul[data-type=taskList] li.pubwave-editor__task-item:before{display:none!important;content:""!important;width:0!important}.pubwave-editor__content ul[data-type=taskList] li:hover{background-color:var(--pubwave-hover-task);outline:1px solid rgba(255,255,255,.1);transition:background-color .15s ease}.pubwave-editor__content ul[data-type=taskList] li>label,.pubwave-editor__content ul[data-type=taskList] li[data-type=taskItem]>label,.pubwave-editor__content ul[data-type=taskList] li.pubwave-editor__task-item>label{flex-shrink:0!important;margin:.125em 0 0!important;position:relative!important;cursor:pointer!important;width:var(--pubwave-checkbox-size, 20px)!important;height:var(--pubwave-checkbox-size, 20px)!important;min-height:var(--pubwave-checkbox-size, 20px)!important;max-height:var(--pubwave-checkbox-size, 20px)!important;display:block!important;align-self:flex-start!important;line-height:1!important;padding:0!important;overflow:hidden!important}.pubwave-editor__content input[type=checkbox]{background-color:initial;cursor:default;-webkit-appearance:auto;-moz-appearance:auto;appearance:auto;box-sizing:border-box;margin:3px 3px 3px 4px;padding:initial;border:initial}.pubwave-editor__content ul[data-type=taskList] li>label:before{content:"";display:block;width:var(--pubwave-checkbox-size, 20px);height:var(--pubwave-checkbox-size, 20px);border:1.5px solid var(--pubwave-text, #1a1a1a);border-radius:var(--pubwave-radius-xs, 3px);background-color:#fff;transition:all .15s ease;box-sizing:border-box;position:absolute;top:0;left:0}.pubwave-editor__content ul[data-type=taskList] li[data-checked=true]>label:before{background-color:var(--pubwave-primary-hover, #2563eb);border-color:var(--pubwave-primary-hover, #2563eb)}.pubwave-editor__content ul[data-type=taskList] li[data-checked=true]>label:after{content:"";position:absolute;left:6px;top:3px;width:5px;height:10px;border:solid var(--pubwave-bg, #ffffff);border-width:0 2px 2px 0;transform:rotate(45deg);box-sizing:border-box;z-index:1}.pubwave-editor__content ul[data-type=taskList] li>div,.pubwave-editor__content ul[data-type=taskList] li[data-type=taskItem]>div,.pubwave-editor__content ul[data-type=taskList] li.pubwave-editor__task-item>div{flex:1!important;min-width:0!important;color:var(--pubwave-text, #1a1a1a)!important;display:block!important;margin:0!important;padding:.1em 0!important}.pubwave-editor__content ul[data-type=taskList] li>div p,.pubwave-editor__content ul[data-type=taskList] li[data-type=taskItem]>div p,.pubwave-editor__content ul[data-type=taskList] li.pubwave-editor__task-item>div p,.pubwave-editor__content ul[data-type=taskList] li>div>p,.pubwave-editor__content ul[data-type=taskList] li>div p.pubwave-editor__paragraph,.pubwave-editor__content ul[data-type=taskList] li[data-type=taskItem]>div p.pubwave-editor__paragraph{margin:0!important;padding:0!important;line-height:1.5!important;display:block!important;width:100%!important;min-height:1.5em!important}.pubwave-editor__content.ProseMirror ul[data-type=taskList] li[data-checked=true]>div p,.pubwave-editor__content ul[data-type=taskList] li[data-checked=true]>div p{color:var(--pubwave-checked-text, #9ca3af)!important;text-decoration:line-through!important}.pubwave-block{position:relative;padding-left:2.5em}.pubwave-block-menu{position:absolute;left:.5em;top:50%;transform:translateY(-50%);z-index:2;display:flex;align-items:center;gap:.5em}.pubwave-block--dragging{opacity:.4}.pubwave-block--drag-preview{color:var(--pubwave-text-muted, #9b9a97)!important;opacity:.6!important}.pubwave-block--drag-preview div,.pubwave-block--drag-preview p,.pubwave-block--drag-preview label,.pubwave-block--drag-preview .pubwave-editor__task-item>div{color:var(--pubwave-text-muted, #9b9a97)!important}.pubwave-block--drag-preview label input{display:none!important}.pubwave-block--drag-preview label:before{border-color:var(--pubwave-text-muted, #9b9a97)!important;width:16px!important;height:16px!important}.pubwave-block--drag-preview label:after{border-color:var(--pubwave-bg, #ffffff)!important;left:4px!important;top:2px!important}.ProseMirror .ProseMirror-gapcursor{display:none;pointer-events:none;position:absolute}.ProseMirror .ProseMirror-gapcursor:after{content:"";display:block;position:absolute;top:-2px;width:20px;border-top:1px solid var(--pubwave-text);animation:pubwave-cursor-blink 1.1s steps(2,start) infinite}@keyframes pubwave-cursor-blink{to{visibility:hidden}}.ProseMirror-focused .ProseMirror-gapcursor{display:block}.ProseMirror-dropcursor{border-left:2px solid var(--pubwave-primary);pointer-events:none}.pubwave-block-handle__drag,.pubwave-block-handle__add{color:var(--pubwave-text-muted, #9b9a97)!important}.pubwave-toolbar__button:not(:disabled):hover{background-color:var(--pubwave-hover)!important}.pubwave-toolbar__turn-into-option:not(.pubwave-toolbar__turn-into-option--active):hover{background-color:var(--pubwave-hover)!important}.tippy-box{z-index:var(--pubwave-z-dropdown, 60)!important;background:transparent!important;border:none!important}.tippy-box:has(.pubwave-slash-menu){background:transparent!important;border:none!important}.pubwave-slash-menu{border:1px solid var(--pubwave-border, #e3e2e0)!important}.pubwave-editor .ProseMirror .suggestion{background-color:#fffffff2!important;border:1px solid var(--pubwave-border, #e3e2e0)!important;border-radius:var(--pubwave-radius-md, 6px)!important;padding:2px 4px!important;display:inline-block!important;color:#1f2937!important}.pubwave-editor .ProseMirror .suggestion,.pubwave-editor .ProseMirror .suggestion *,.pubwave-editor .ProseMirror .suggestion span,.pubwave-editor .ProseMirror .suggestion strong,.pubwave-editor .ProseMirror .suggestion em,.pubwave-editor .ProseMirror .suggestion code{color:#1f2937!important}.tippy-box,.tippy-box[data-theme]{z-index:60!important}.tippy-box[data-theme~=pubwave]{background:transparent;box-shadow:none;border:none}.tippy-box[data-theme~=pubwave] .tippy-content{padding:0}.tippy-box[data-theme~=light-border]{background-color:#000!important;color:#fff!important;border:none!important;border-radius:var(--pubwave-radius, 6px);box-shadow:var(--pubwave-shadow-md, 0 4px 6px -1px rgba(0, 0, 0, .1));font-size:16px;padding:4px 8px}.tippy-box[data-theme~=light-border] .tippy-content{color:#fff!important}.tippy-box[data-animation=fade][data-state=hidden]{opacity:0}[data-tippy-root]{max-width:calc(100vw - 10px)}.tippy-box{position:relative;background-color:#333;color:#fff;border-radius:4px;font-size:14px;line-height:1.4;white-space:normal;outline:0;transition-property:transform,visibility,opacity}.tippy-box[data-placement^=top]>.tippy-arrow{bottom:0}.tippy-box[data-placement^=top]>.tippy-arrow:before{bottom:-7px;left:0;border-width:8px 8px 0;border-top-color:initial;transform-origin:center top}.tippy-box[data-placement^=bottom]>.tippy-arrow{top:0}.tippy-box[data-placement^=bottom]>.tippy-arrow:before{top:-7px;left:0;border-width:0 8px 8px;border-bottom-color:initial;transform-origin:center bottom}.tippy-box[data-placement^=left]>.tippy-arrow{right:0}.tippy-box[data-placement^=left]>.tippy-arrow:before{border-width:8px 0 8px 8px;border-left-color:initial;right:-7px;transform-origin:center left}.tippy-box[data-placement^=right]>.tippy-arrow{left:0}.tippy-box[data-placement^=right]>.tippy-arrow:before{left:-7px;border-width:8px 8px 8px 0;border-right-color:initial;transform-origin:center right}.tippy-box[data-inertia][data-state=visible]{transition-timing-function:cubic-bezier(.54,1.5,.38,1.11)}.tippy-arrow{width:16px;height:16px;color:#333}.tippy-arrow:before{content:"";position:absolute;border-color:transparent;border-style:solid}.tippy-content{position:relative;padding:5px 9px;z-index:1}