/* Tiptap Table Column Resize - Enhanced Handles */

/* Note: table-layout must stay 'fixed' for the ProseMirror resize plugin.
   Column proportions are controlled via colwidth data in the JSON. */

/* More visible resize handle */
.tiptap-editor .ProseMirror table .column-resize-handle {
    background-color: rgb(59, 130, 246); /* blue-500 */
    width: 6px;
    right: -3px;
    opacity: 0.7;
    transition: opacity 0.15s ease, background-color 0.15s ease;
    pointer-events: none;
    z-index: 10;
}

/* Brighter on active drag */
.tiptap-editor .ProseMirror.resize-cursor table .column-resize-handle {
    opacity: 1;
    background-color: rgb(37, 99, 235); /* blue-600 */
    width: 8px;
    right: -4px;
}

/* Dark mode */
.dark .tiptap-editor .ProseMirror table .column-resize-handle {
    background-color: rgb(96, 165, 250); /* blue-400 */
}

.dark .tiptap-editor .ProseMirror.resize-cursor table .column-resize-handle {
    background-color: rgb(147, 197, 253); /* blue-300 */
}

/* Bubble menu must not block column resize.
   Problem: .resize-cursor is only added when ProseMirror receives mousemove,
   but the tippy bubble menu intercepts events first (chicken-and-egg).
   Solution: make the tippy overlay always pass-through for pointer events.
   The actual buttons inside remain clickable via pointer-events: auto. */
[data-tippy-root] .tippy-box[data-theme="tiptap-editor-bubble"] {
    pointer-events: auto;
}
[data-tippy-root] .tippy-box[data-theme="tiptap-editor-bubble"] .tippy-content {
    pointer-events: auto;
}
[data-tippy-root]:has(.tippy-box[data-theme="tiptap-editor-bubble"]) {
    pointer-events: none !important;
}

/* Fade bubble menu when resize cursor is active */
.tiptap-editor:has(.ProseMirror.resize-cursor) [data-tippy-root] {
    opacity: 0.2 !important;
    transition: opacity 0.1s ease;
}

/* Ensure resize handles z-index above bubble menu */
.tiptap-editor .ProseMirror table .column-resize-handle {
    z-index: 50 !important;
}