/* Tiny Tooltips (Hover, Speech Bubble) */ .jy-tip-trigger { text-decoration: underline dotted; cursor: help; position: relative; } /* Floating container appended to */ .jy-tip-pop { position: absolute; z-index: 10005; max-width: 320px; padding: .6rem .8rem; border-radius: .75rem; background: #fff; color: #000; box-shadow: 0 12px 28px rgba(0,0,0,.25); font-size: 14px; line-height: 1.45; display: none; pointer-events: auto; } /* speech-bubble arrow (default: above the trigger, arrow at bottom) */ .jy-tip-pop::after { content: ""; position: absolute; bottom: -8px; left: 50%; width: 0; height: 0; transform: translateX(-50%); border-left: 8px solid transparent; border-right: 8px solid transparent; border-top: 8px solid #fff; /* matches background */ } /* Variant when placed below (arrow on top) */ .jy-tip-pop.place-below::after { top: -8px; bottom: auto; border-top: none; border-bottom: 8px solid #fff; } .jy-tip-pop[data-show="true"] { display: block; } /* Optional richer content styling */ .jy-tip-pop p { margin: 0 0 .5rem; } .jy-tip-pop p:last-child { margin-bottom: 0; } .jy-tip-pop a { color: #9fd3ff; text-decoration: underline; } .jy-tip-pop ul, .jy-tip-pop ol { margin: .5rem 0 .5rem 1.25rem; }