/* Mobile Navigation Specific Styles */
.tooltip {
    font-size: 0.8rem;
}

@media (max-width: 767.98px) {
    /* Make tooltips more prominent on mobile */
    .tooltip .tooltip-inner {
        max-width: 200px;
        padding: 8px 10px;
        font-size: 0.9rem;
        background-color: rgba(0, 0, 0, 0.85);
    }
    
    /* Fix dropdown behavior on mobile */
    .dropdown-menu {
        width: auto;
        min-width: 200px;
    }
    
    /* Ensure text doesn't overflow buttons */
    .dropdown-item span {
        white-space: normal;
        display: inline-block;
        vertical-align: middle;
    }
    
    /* Add spacing between icon-only navigation */
    .nav-tabs .nav-item {
        margin: 0 3px;
    }
}

/* Custom hover states for touch devices */
@media (hover: none) {
    .nav-tabs .nav-link:hover {
        transform: none;
        box-shadow: 0 2px 4px rgba(0,0,0,0.1);
    }
}