/* Social Media Mention Styles */
.mention-link {
    font-weight: 600;
    text-decoration: none;
    padding: 2px 4px;
    border-radius: 4px;
    transition: all 0.2s ease;
}

.mention-link:hover {
    text-decoration: none;
}

/* User mentions */
.mention-user {
    color: #1d9bf0;
    background-color: rgba(29, 155, 240, 0.1);
    border: 1px solid rgba(29, 155, 240, 0.2);
}

.mention-user:hover {
    color: #1a8cd8;
    background-color: rgba(29, 155, 240, 0.15);
    border-color: rgba(29, 155, 240, 0.3);
}

/* Locomotive mentions */
.mention-locomotive {
    color: #dc3545;
    background-color: rgba(220, 53, 69, 0.1);
    border: 1px solid rgba(220, 53, 69, 0.2);
}

.mention-locomotive:hover {
    color: #c82333;
    background-color: rgba(220, 53, 69, 0.15);
    border-color: rgba(220, 53, 69, 0.3);
}

/* Station mentions */
.mention-station {
    color: #198754;
    background-color: rgba(25, 135, 84, 0.1);
    border: 1px solid rgba(25, 135, 84, 0.2);
}

.mention-station:hover {
    color: #157347;
    background-color: rgba(25, 135, 84, 0.15);
    border-color: rgba(25, 135, 84, 0.3);
}

/* Rolling stock mentions */
.mention-rolling_stock {
    color: #fd7e14;
    background-color: rgba(253, 126, 20, 0.1);
    border: 1px solid rgba(253, 126, 20, 0.2);
}

.mention-rolling_stock:hover {
    color: #fd6c07;
    background-color: rgba(253, 126, 20, 0.15);
    border-color: rgba(253, 126, 20, 0.3);
}

/* Train mentions */
.mention-train {
    color: #6f42c1;
    background-color: rgba(111, 66, 193, 0.1);
    border: 1px solid rgba(111, 66, 193, 0.2);
}

.mention-train:hover {
    color: #5a37a3;
    background-color: rgba(111, 66, 193, 0.15);
    border-color: rgba(111, 66, 193, 0.3);
}

/* Tooltip styling for mentions */
.mention-link[data-bs-toggle="tooltip"] {
    cursor: help;
}

/* Mobile responsive adjustments */
@media (max-width: 768px) {
    .mention-link {
        font-size: 0.9em;
        padding: 1px 3px;
    }
}

/* Dark mode support */
@media (prefers-color-scheme: dark) {
    .mention-user {
        color: #1d9bf0;
        background-color: rgba(29, 155, 240, 0.15);
    }
    
    .mention-locomotive {
        color: #ff6b7a;
        background-color: rgba(255, 107, 122, 0.15);
    }
    
    .mention-station {
        color: #20c997;
        background-color: rgba(32, 201, 151, 0.15);
    }
    
    .mention-rolling_stock {
        color: #fd7e14;
        background-color: rgba(253, 126, 20, 0.15);
    }
    
    .mention-train {
        color: #a78bfa;
        background-color: rgba(167, 139, 250, 0.15);
    }
}