/* okitoki-v4 — editor tooltips (ot-tinymce-advanced: <span class="tinymce-tooltip" data-tooltip="…">).
 * The plugin ships a one-line, centred bubble (white-space: nowrap), which runs off the screen
 * on long hints and near the page edge. Only layout is overridden here; colours and the
 * top/bottom/left/right variants stay the plugin's. PROG-9638 fixed this in v3 (style.css),
 * v4 has its own copy. The `html` prefix outranks the plugin's per-position selectors. */

html .tinymce-tooltip[data-tooltip]:hover::after {
    width: max-content;
    max-width: min(300px, 80vw);
    font-family: inherit;
    font-weight: var(--v-font-weight, 400);
    text-align: left;
    white-space: normal;
    overflow-wrap: anywhere;
}

/* Narrow and mid screens: the bubble cannot be anchored to a word near the edge without
 * leaving the screen, so it becomes a card pinned to the bottom of the viewport. */
@media (max-width: 1399.98px) {
    html .tinymce-tooltip[data-tooltip]:hover::before { display: none; }
    html .tinymce-tooltip[data-tooltip]:hover::after {
        position: fixed;
        top: auto;
        right: var(--v-space);
        bottom: var(--v-space);
        left: var(--v-space);
        width: auto;
        max-width: none;
        margin: 0;
        transform: none;
        font-size: var(--v-font-size-sm);
        z-index: 1100;
    }
}