/* === TOOLTIP SYSTEM === */

/* === MAIN TOOLTIP CONTAINER === */
.tooltip-container {
    position: relative;
    display: inline-block;
    cursor: pointer;
}

.tooltip-text {
    visibility: hidden;
    background-color: var(--tooltip-background);
    color: var(--tooltip-text-color);
    text-align: left;
    border-radius: var(--tooltip-border-radius);
    padding: 8px 12px;
    position: fixed;
    z-index: 9999;
    width: auto;
    min-width: 100px;
    opacity: 0;
    transition: opacity 0.3s;
    pointer-events: auto; /* Changed from none to auto */
    font-style: var(--normal-font-style);
    font-weight: normal;
    font-size: 0.9rem;
    /* Badges (ALL, HAPAX, ...) set text-transform/letter-spacing on the
       container; the nested tooltip text must not inherit them */
    text-transform: none;
    letter-spacing: normal;
    line-height: 1.4;
    box-shadow: 0 2px 5px rgba(0,0,0,0.2);
    white-space: normal;
    word-wrap: break-word;
}

.copy-icon {
    margin-left: 8px;
    cursor: pointer;
    opacity: 0.7;
    transition: opacity 0.2s;
    font-size: 0.8rem;
}

.copy-icon:hover {
    opacity: 1;
}

.tooltip-text::after {
    content: "";
    position: absolute;
    top: 100%;
    left: 50%;
    margin-left: -5px;
    border-width: 5px;
    border-style: solid;
    border-color: var(--tooltip-background) transparent transparent transparent;
}

/* Tooltip flipped below its trigger (set by the JS positioners when there is
   no room above): the arrow moves to the top edge and points up */
.tooltip-text.tooltip-below::after {
    top: auto;
    bottom: 100%;
    border-color: transparent transparent var(--tooltip-background) transparent;
}

/* Show tooltip when active class is added (via click) */
.tooltip-container.active .tooltip-text {
    visibility: visible;
    opacity: 1;
}

/* Show tooltip on hover (for inline annotations like underlined vowels) */
.tooltip-container.tooltip-hover .tooltip-text {
    position: absolute;
    bottom: 100%;
    left: 50%;
    transform: translateX(-50%);
    margin-bottom: 6px;
    white-space: normal;
    min-width: 200px;
    max-width: 300px;
    pointer-events: none;
}

.tooltip-container.tooltip-hover:hover .tooltip-text {
    visibility: visible;
    opacity: 1;
}

/* Arrow tracks the hovered element via --arrow-left, set by
   positionHoverTooltip() in entry/actions.js when the tooltip is clamped
   to the viewport; falls back to centered when JS has not positioned it. */
.tooltip-container.tooltip-hover .tooltip-text::after {
    left: var(--arrow-left, 50%);
}

/* === BUTTON TOOLTIPS === */
.button-tooltip .tooltip-text {
    position: absolute;
    top: 130%;
    left: 50%;
    transform: translateX(-50%);
    font-size: 0.8rem;
    white-space: nowrap;
    min-width: auto;
}

/* Show button tooltip on hover */
.button-tooltip:hover .tooltip-text {
    visibility: visible;
    opacity: 1;
}

/* Arrow for button tooltips - pointing up */
.button-tooltip .tooltip-text::after {
    bottom: 100%;
    top: auto;
    left: 50%;
    margin-left: -5px;
    border-color: transparent transparent var(--tooltip-background) transparent;
}

/* === TERM TOOLTIPS === */
.term-tooltip {
    position: relative;
    display: inline-block;
    cursor: pointer;
    border-bottom: 1px dotted var(--celestial-blue);
}

.term-tooltip .tooltip-text {
    width: 200px;
    white-space: normal;
    text-align: left;
}

/* === ABBREVIATION TOOLTIPS === */
.term-abbrev {
    color: var(--celestial-blue);
    font-size: 0.9rem;
    font-weight: bold;
    display: inline-block;
}

abbr.abbreviation[title] {
    text-decoration: none;
    cursor: pointer;
}

abbr.abbreviation[title].active {
    border-bottom-style: solid;
}

/* === BIBLIOGRAPHY TOOLTIPS === */
.term-value {
    cursor: pointer;
}

.term-value.active {
    border-bottom-style: solid;
}

/* === DICTIONARY LINK TOOLTIPS (hover-based) === */
.dict-tooltip {
    position: relative;
    display: inline;
}

/* As wide as the longest line (LAD / AHw / CAD + meaning), so no line breaks;
   only the viewport caps it - on a phone the longest meaning still wraps. */
.dict-tooltip .tooltip-text {
    position: fixed;
    min-width: 150px;
    width: max-content;
    max-width: calc(100vw - 20px);
    white-space: normal;
    text-align: left;
    pointer-events: none;
    z-index: 10000;
}

/* Show dictionary tooltip on hover */
.dict-tooltip:hover .tooltip-text {
    visibility: visible;
    opacity: 1;
}

/* Arrow for dict tooltips - default pointing down (tooltip above element) */
.dict-tooltip .tooltip-text::after {
    content: "";
    position: absolute;
    top: 100%;
    left: var(--arrow-left, 50%);
    border-width: 6px;
    border-style: solid;
    border-color: var(--tooltip-background) transparent transparent transparent;
}

/* Arrow pointing up (tooltip below element) */
.dict-tooltip .tooltip-text.arrow-up::after {
    top: auto;
    bottom: 100%;
    border-color: transparent transparent var(--tooltip-background) transparent;
}

/* Tooltip content styling */
.dict-tooltip .tooltip-lemma {
    font-family: var(--akkadian-font);
    font-style: italic;
    font-weight: bold;
    color: var(--tooltip-text-color);
}

/* Source reference tooltips - normal weight, no italic */
.dict-tooltip.source-tooltip-wrapper .tooltip-lemma {
    font-family: inherit;
    font-style: normal;
    font-weight: normal;
}

.dict-tooltip .tooltip-pos {
    font-style: normal;
    opacity: 0.9;
}

.dict-tooltip .tooltip-def {
    margin-top: 4px;
    font-size: 0.85rem;
    opacity: 0.95;
}

/* The meaning quoted after a lemma in a cross-reference tooltip:
   AHw: ajjabis "feindlich". Slightly dimmed so the lemma stays dominant. */
.dict-tooltip .tooltip-gloss {
    font-style: normal;
    opacity: 0.85;
}

/* An Akkadian headword inside a tooltip line (LAD: šakānu "to place"): the
   Akkadian face, italic, no bold - three of them stack in a concordance. */
.dict-tooltip .tooltip-akk {
    font-style: var(--akkadian-font-style, italic);
}

/* The dictionary label that opens each line of a concordance tooltip
   (LAD: / AHw: / CAD:), aligned so the three headwords line up. */
.dict-tooltip .tooltip-dict {
    display: inline-block;
    min-width: 2.6em;
    font-weight: 600;
    opacity: 0.8;
}

.dict-tooltip .tooltip-lad-ref {
    margin-top: 4px;
    font-size: 0.8rem;
    opacity: 0.8;
    border-top: 1px solid rgba(255,255,255,0.2);
    padding-top: 4px;
}

/* === MUSEUM SIGLA INFO (inside bibl tooltip) === */
/* Museum info displayed at the bottom of bibliography tooltips */
.museum-tooltip-info {
    margin-top: 8px;
    padding-top: 6px;
    border-top: 1px solid rgba(255, 255, 255, 0.2);
    font-size: 0.85rem;
}

.museum-tooltip-info .museum-gloss {
    font-weight: bold;
}

/* === RESPONSIVE TOOLTIPS === */
@media (max-width: 768px) {
    .tooltip-text {
        position: fixed;
        bottom: 20px;
        left: 10px;
        right: 10px;
        width: auto;
        transform: none;
        border-radius: 8px;
        font-size: 0.9rem;
        white-space: normal;
        text-align: left;
        max-width: none;
    }
    
    .tooltip-text::after {
        display: none;
    }
}

/* === SOURCE REFERENCE TOOLTIPS === */
/* Tooltips for external project links (ARCHIBAB, CDLI, DCCLT, etc.) */
.source-ref {
    position: relative;
}

.source-tooltip {
    position: fixed;
    z-index: 10000;
    background: var(--tooltip-background, #333);
    color: var(--tooltip-text-color, #fff);
    padding: 8px 12px;
    border-radius: 6px;
    font-size: 0.85rem;
    line-height: 1.4;
    max-width: 300px;
    white-space: normal;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.25);
    pointer-events: none;
    opacity: 0;
    transition: opacity 0.2s ease;
}

.source-tooltip.visible {
    opacity: 1;
}

.source-tooltip::after {
    content: "";
    position: absolute;
    border-width: 6px;
    border-style: solid;
}

/* Arrow pointing down (tooltip above element) */
.source-tooltip.arrow-down::after {
    top: 100%;
    left: var(--arrow-left, 50%);
    transform: translateX(-50%);
    border-color: var(--tooltip-background, #333) transparent transparent transparent;
}

/* Arrow pointing up (tooltip below element) */
.source-tooltip.arrow-up::after {
    bottom: 100%;
    left: var(--arrow-left, 50%);
    transform: translateX(-50%);
    border-color: transparent transparent var(--tooltip-background, #333) transparent;
}

.source-tooltip .tooltip-title {
    font-weight: 600;
    margin-bottom: 4px;
    color: var(--tooltip-text-color, #fff);
}

.source-tooltip .tooltip-description {
    opacity: 0.9;
    font-size: 0.8rem;
}

.source-tooltip .tooltip-id {
    margin-top: 4px;
    padding-top: 4px;
    border-top: 1px solid rgba(255, 255, 255, 0.2);
    font-size: 0.75rem;
    opacity: 0.7;
}

/* === EDITORIAL SOURCE LINK IN BIBLIOGRAPHY TOOLTIPS === */
/* Links added by LAD editors to external resources (e.g., eBL tablets) */
.editorial-tooltip-link {
    margin-top: 8px;
    padding-top: 6px;
    border-top: 1px solid rgba(255, 255, 255, 0.2);
    font-size: 0.85rem;
}

.editorial-tooltip-link a.editorial-link {
    color: var(--tooltip-link-color, #7dd3fc);
    text-decoration: none;
}

.editorial-tooltip-link a.editorial-link:hover {
    color: var(--tooltip-link-hover-color, #bae6fd);
    text-decoration: underline;
}

/* The "read it online" mark inside a bibliography tooltip. Same icon and the same
   restraint as the one on the Works Cited page: grey until hovered, sized in em so
   it tracks the tooltip text. */
.tooltip-text .bib-open,
.cad-tooltip-text .bib-open {
    display: inline-block;
    margin-left: 0.3em;
    color: #b3bcc4;
    vertical-align: -0.1em;
    transition: color 0.15s ease;
}
.tooltip-text .bib-open svg,
.cad-tooltip-text .bib-open svg {
    display: block;
    width: 0.85em;
    height: 0.85em;
}
.tooltip-text .bib-open:hover,
.cad-tooltip-text .bib-open:hover {
    color: var(--vermilion, #d94f2b);
}