/**
 * YouTube Hover Tooltip Styles
 *
 * Styles for rich hover tooltips on YouTube links in Q-drop messages.
 * Dark theme friendly with semi-transparent background.
 */

.yt-hover-tooltip {
    display: none;
    /* absolute (document-relative): the JS positions using getBoundingClientRect +
       window scrollTop/scrollLeft, which is correct for absolute. 'fixed' would
       double-count the scroll offset and misplace the tooltip once scrolled. */
    position: absolute;
    background: rgba(26, 26, 26, 0.98);
    color: #eeeeee;
    border: 1px solid #444444;
    border-radius: 6px;
    padding: 12px;
    max-width: 360px;
    font-size: 13px;
    line-height: 1.4;
    z-index: 10000;
    pointer-events: none;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.5);
    word-wrap: break-word;
    overflow-wrap: break-word;
}

.yt-hover-tooltip.visible {
    display: block;
}

.yt-hover-title {
    font-weight: bold;
    font-size: 14px;
    margin-bottom: 8px;
    color: #ffffff;
}

.yt-hover-channel {
    color: #ff4444;
    font-size: 12px;
    margin-bottom: 8px;
}

.yt-hover-desc {
    font-weight: normal;
    margin-bottom: 8px;
    white-space: normal;
}

.yt-hover-tags {
    color: #999999;
    font-size: 11px;
    margin-top: 8px;
    font-style: italic;
}