/* Inline woord met tooltip */ .amelisiweerd-tooltip, .amelisweerd-tooltip { position: relative; display: inline; border-bottom: 1px dotted currentColor; cursor: help; text-decoration: none; } /* De tooltip zelf wordt op de voorkant door JavaScript rechtstreeks in geplaatst. Daardoor kan Stackable hem niet afknippen met overflow:hidden. */ .amelisweerd-tooltip-popover { position: fixed; z-index: 2147483647; box-sizing: border-box; width: max-content; max-width: min(360px, calc(100vw - 24px)); min-width: 220px; padding: 12px 16px; border: 1px solid rgba(0, 0, 0, 0.12); border-radius: 12px; background: #fff; color: #222; box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12); font-size: 15px; font-weight: 400; line-height: 1.45; text-align: left; white-space: normal; opacity: 0; visibility: hidden; pointer-events: none; transform: translateY(5px); transition: opacity .16s ease, transform .16s ease, visibility .16s ease; } .amelisweerd-tooltip-popover.is-visible { opacity: 1; visibility: visible; transform: translateY(0); } /* Alleen in de editor: subtiele markering van het woord. */ .editor-styles-wrapper .amelisweerd-tooltip, .block-editor-writing-flow .amelisweerd-tooltip { border-bottom: 1px dotted currentColor; } @media (max-width: 600px) { .amelisweerd-tooltip-popover { min-width: 200px; max-width: min(300px, calc(100vw - 20px)); padding: 10px 12px; font-size: 14px; } }