@font-face {
    font-family: 'FontinSmallcaps';
    src: url('../fonts/Fontin-SmallCaps.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

/* PoE Tooltip Styles */
.poe-hoverable {
    cursor: pointer;
    touch-action: manipulation;
}

.poe-hoverable:hover {
    color: #ff6600 !important;
}

.poe-hoverable:hover .coloraugmented,
.poe-hoverable:hover .craftedMod {
    color: #ff6600 !important;
}

.haunted-spirits {
    cursor: pointer;
}

.haunted-spirits:hover {
    color: #ff6600;
}

#poe-tooltip {
    position: absolute;
    background: #1a1a1a;
    border: 1px solid #7d5932;
    /* PoE 1 Brownish Border */
    border-radius: 4px;
    padding: 10px 14px;
    min-width: 200px;
    max-width: 450px;
    z-index: 10000;
    pointer-events: none;
    opacity: 0;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.9);
    font-family: 'FontinSmallcaps', Arial, sans-serif;
    font-size: 14px;
    line-height: 1.4;
    color: #888;
    transition: opacity 0.1s ease;
}

#poe-tooltip.visible {
    opacity: 1;
}

/* Removed Arrow for 1:1 PoE aesthetic */

.tooltip-content {
    display: flex;
    flex-direction: row;
    gap: 8px;
}

.tooltip-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 15px;
    width: 100%;
}

.tooltip-divider {
    border-bottom: 2px solid #555;
    margin: 4px 0;
    width: 100%;
}

/* Vertical layout for annoint/passive tooltips */
.tooltip-annoint-section {
    display: flex;
    flex-direction: column;
    width: 100%;
    margin-top: 4px;
}

.tooltip-annoint-section .tooltip-row {
    justify-content: flex-start;
    gap: 10px;
}

.tooltip-annoint-effect {
    color: #ff6600;
    font-weight: normal;
}

.tooltip-left {
    flex: 1;
}

.tooltip-right {
    text-align: right;
    flex-shrink: 0;
}

.tooltip-name {
    color: #c9c9c9;
    font-family: inherit;
}

.tooltip-range {
    color: #ff6600;
    font-weight: normal;
}

.tooltip-tier {
    color: #8888ff;
    font-style: italic;
}

.tooltip-ilvl {
    color: #888;
    font-size: 12px;
    font-family: sans-serif !important;
}

.tooltip-paren {
    font-family: sans-serif !important;
    font-size: 12px;
    color: #888;
}

/* Hybrid modifier styles */
.tooltip-hybrid-line {
    margin-bottom: 4px;
}

.tooltip-hybrid-line:last-child {
    margin-bottom: 0;
}

/* Haunted Spirits specific styles */
.tooltip-haunted-spirits {
    text-align: left;
}

.tooltip-haunted-spirits div {
    color: #ff6600;
}