/* TipTap placeholder styles (scoped to .editor) */
.editor .ProseMirror p.is-editor-empty:first-child::before {
    content: attr(data-placeholder);
    float: left;
    color: #adb5bd; /* muted gray */
    pointer-events: none;
    height: 0;
    white-space: nowrap;
}

/* Volitelně jemné základní styly ProseMirror obsahu */
.editor .ProseMirror {
    outline: none;
    min-height: 100px;

    max-height: 600px;
    overflow-y: auto;
    /*background:transparent;*/
}


/* Omezení velikosti obrázků v editoru */
.editor .ProseMirror img {
    max-width: 600px;
    max-height: 400px;
    height: auto;
    width: auto;
    display: block;
    margin: 8px 0;
}

/* Resizable image wrapper + handle */
.editor .ProseMirror .tt-resizable-image {
    position: relative;
    display: inline-block;
}
.editor .ProseMirror .tt-resizable-image.is-selected img {
    outline: 2px solid rgba(13,110,253,0.25);
    outline-offset: 2px;
}
.editor .ProseMirror .tt-resizable-image .tt-resize-handle {
    position: absolute;
    right: -4px;
    bottom: -4px;
    width: 10px;
    height: 10px;
    background: #0d6efd;
    border: 2px solid #fff;
    border-radius: 2px;
    cursor: se-resize;
    box-shadow: 0 0 0 1px rgba(0,0,0,.2);
    opacity: 0; /* defaultně skryté */
    pointer-events: none; /* neklikatelný, dokud není vidět */
    transition: opacity .12s ease-in-out;
}
/* Zobraz handle na hover nebo když je image vybraný */
.editor .ProseMirror .tt-resizable-image:hover .tt-resize-handle,
.editor .ProseMirror .tt-resizable-image.is-selected .tt-resize-handle {
    opacity: 0.85;
    pointer-events: auto;
}


/* Toolbar */
.tiptap-toolbar {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 0px 8px;
    /*border: 1px solid #e5e7eb;*/
    border-radius: 8px;
    background: #fff;
    margin-bottom: 6px;
    transition: opacity 0.5s ease-in-out;
}

.tiptap-toolbar.hide {
    opacity: 0;
    /*pointer-events: none;*/
}

.tt-btn {
    font-size: 13px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
    height: 30px;
    min-width: 30px;
    padding: 0 8px;
    border: 1px solid transparent;
    border-radius: 6px;
    background: transparent;
    color: #374151;
    cursor: pointer;
}

.tt-btn:hover {
    background: #f3f4f6;
}

.tt-btn.active {
    background: #e5e7eb;
    border-color: #d1d5db;
}

.tt-btn small {
    font-size: 10px;
    margin-left: 2px;
    opacity: .8;
}

.tt-sep {
    width: 1px;
    height: 20px;
    background: #e5e7eb;
    margin: 0 2px;
    display: inline-block;
}

/* Dark mode pro Tiptap editor */
[data-bs-theme=dark] .ProseMirror,
[data-bs-theme=dark] .tiptap-toolbar,
[data-bs-theme=dark] .tt-btn,
[data-bs-theme=dark] .tt-btn:hover,
[data-bs-theme=dark] .tt-btn.active,
[data-bs-theme=dark] .tt-sep,
[data-bs-theme=dark] .ProseMirror p.is-editor-empty:first-child::before {
/ / background: #181a1b !important;
    color: #e5e7eb !important;
}

/*[data-bs-theme=dark] .editor {*/
/*    background: #181a1b !important;*/
/*}*/


[data-bs-theme=dark] .tiptap-toolbar {
    background: #23272b !important;
    border-color: #343a40 !important;
}

[data-bs-theme=dark] .tt-btn {
    color: #e5e7eb !important;
}

[data-bs-theme=dark] .tt-btn:hover {
    background: #23272b !important;
}

[data-bs-theme=dark] .tt-btn.active {
    background: #343a40 !important;
    border-color: #495057 !important;
}

[data-bs-theme=dark] .tt-sep {
    background: #343a40 !important;
}

[data-bs-theme=dark] .ProseMirror p.is-editor-empty:first-child::before {
    color: #6c757d !important;
}