/* Fix for Insights tab intermittently turning grey */

/* Ensure active Insights tab always has proper styling */
#aiAnalysisTabBtn.active {
    color: var(--tab-text-active-dark) !important;
    background-color: rgba(74, 144, 226, 0.25) !important;
}

.theme-light #aiAnalysisTabBtn.active {
    color: var(--tab-text-active-light) !important;
    background-color: rgba(37, 99, 235, 0.25) !important;
}

/* Ensure the active indicator bar is visible */
#aiAnalysisTabBtn.active::after {
    content: '' !important;
    position: absolute !important;
    bottom: -1px !important;
    left: 0 !important;
    right: 0 !important;
    height: 3px !important;
    background-color: #4A90E2 !important;
    display: block !important;
    opacity: 1 !important;
}

/* Prevent inherited grey colors */
#aiAnalysisTabBtn.active,
#aiAnalysisTabBtn.active * {
    color: inherit !important;
}

/* Ensure hover state doesn't override active state */
#aiAnalysisTabBtn.active:hover {
    color: var(--tab-text-active-dark) !important;
    background-color: rgba(74, 144, 226, 0.25) !important;
}

.theme-light #aiAnalysisTabBtn.active:hover {
    color: var(--tab-text-active-light) !important;
    background-color: rgba(37, 99, 235, 0.25) !important;
}

/* Fix for potential CSS variable issues */
.main-tab-button.active {
    /* Fallback colors if CSS variables fail */
    color: #ffffff !important;
    background-color: rgba(74, 144, 226, 0.25) !important;
}

/* Ensure the sparkles icon maintains visibility */
#aiAnalysisTabBtn.active .fa-sparkles {
    color: inherit !important;
    opacity: 1 !important;
}

/* Force repaint hack for stubborn rendering issues */
@keyframes forceRepaint {
    from { opacity: 0.99999; }
    to { opacity: 1; }
}

#aiAnalysisTabBtn.active {
    animation: forceRepaint 0.1s ease-in-out;
}