/* ===== MAXIMUM SPECIFICITY ICON FIXES ===== */
/* Based on actual HTML structure from components */
/* These selectors use maximum specificity to override ALL conflicting styles */
/* INCLUDING svg-icon-styles.css which defines .insight-icon styles */

/* ===== KNOWLEDGE HUB - ENHANCED RESOURCE CARDS ===== */
/* Target the actual classes: enhanced-resource-card and resource-icon spectacular */

/* Fix Knowledge Hub Resource Icons - simplified specificity */
.enhanced-resource-card .resource-icon {
    width: 44px !important;
    height: 44px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex-shrink: 0 !important;
    border-radius: var(--radius-lg, 8px) !important;
    margin: 0 !important;
    padding: 0 !important;
}

.enhanced-resource-card .resource-icon svg {
    width: 22px !important;
    height: 22px !important;
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
}

/* Fix Knowledge Hub Resource Action Buttons - simplified */
.enhanced-resource-card .resource-btn {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
}

.enhanced-resource-card .resource-btn svg {
    width: 16px !important;
    height: 16px !important;
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    flex-shrink: 0 !important;
}

/* ===== SMART INSIGHTS DASHBOARD - MAIN INSIGHT ICONS ===== */
/* Target the actual classes: insight-icon-container and insight-icon */
/* CRITICAL: Override svg-icon-styles.css .insight-icon definitions */

/* Fix Smart Insights Dashboard - Main insight icons (these are too big) */
html body .insight-icon-container {
    width: 36px !important;
    height: 36px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex-shrink: 0 !important;
}

/* Smart Insights Dashboard - simplified specificity */
.smart-insights-dashboard .insight-icon,
.insight-icon-container .insight-icon,
.main-insight .insight-icon,
.insight-header .insight-icon {
    width: 32px !important;
    height: 32px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex-shrink: 0 !important;
    border-radius: var(--radius-md, 6px) !important;
    margin-right: 0 !important;
    background: transparent !important;
    background-color: transparent !important;
}

.smart-insights-dashboard .insight-icon svg,
.insight-icon-container .insight-icon svg,
.main-insight .insight-icon svg,
.insight-header .insight-icon svg {
    width: 16px !important;
    height: 16px !important;
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
}

/* Fix Smart Insights Dashboard - Action Icons - simplified */
.smart-insights-dashboard .action-icon,
.insight-actions .action-icon {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 18px !important;
    height: 18px !important;
    background: transparent !important;
    background-color: transparent !important;
}

.smart-insights-dashboard .action-icon svg,
.insight-actions .action-icon svg {
    width: 16px !important;
    height: 16px !important;
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
}

/* Fix Smart Insights Dashboard - Impact Icons */
html body .smart-insights-dashboard .impact-icon,
html body .insight-impact-grid .impact-icon {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 20px !important;
    height: 20px !important;
    flex-shrink: 0 !important;
    /* Remove any backgrounds */
    background: transparent !important;
    background-color: transparent !important;
}

html body .smart-insights-dashboard .impact-icon svg,
html body .insight-impact-grid .impact-icon svg {
    width: 16px !important;
    height: 16px !important;
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
}

/* Fix Smart Insights Dashboard - Indicator Type Icons */
html body .insight-indicators .indicator-type {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 16px !important;
    height: 16px !important;
    /* Remove any backgrounds */
    background: transparent !important;
    background-color: transparent !important;
}

html body .insight-indicators .indicator-type svg {
    width: 14px !important;
    height: 14px !important;
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
}

/* Fix Smart Insights Dashboard - Quick Action Button Icons */
html body .quick-actions-grid .quick-action-btn .action-icon-wrapper {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 24px !important;
    height: 24px !important;
    flex-shrink: 0 !important;
    /* Remove any backgrounds */
    background: transparent !important;
    background-color: transparent !important;
}

html body .quick-actions-grid .quick-action-btn .action-icon-wrapper svg {
    width: 18px !important;
    height: 18px !important;
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
}

/* Fix Smart Insights Dashboard - Confidence and AI Score Icons */
html body .insight-metrics .insight-confidence svg,
html body .insight-metrics .insight-ai-score svg {
    width: 14px !important;
    height: 14px !important;
    display: inline !important;
    visibility: visible !important;
    opacity: 1 !important;
    margin-right: 4px !important;
}

/* Remove gray backgrounds from Smart Insights icons - simplified */
.smart-insights-dashboard .activity-icon,
.smart-insights-dashboard .stat-icon,
.smart-insights-dashboard .feedback-icon,
.live-activity .activity-icon {
    background: transparent !important;
    background-color: transparent !important;
}

/* ===== PRESERVE WORKING ICONS ===== */
/* Don't break the welcome section or other working components */

/* Preserved working icon styles are now handled in their respective component files */

/* ===== RESPONSIVE ADJUSTMENTS ===== */
@media (max-width: 768px) {

    /* Mobile icon size adjustments */
    .enhanced-resource-card .resource-icon {
        width: 40px !important;
        height: 40px !important;
    }

    .enhanced-resource-card .resource-icon svg {
        width: 20px !important;
        height: 20px !important;
    }

    .insight-icon-container {
        width: 44px !important;
        height: 44px !important;
    }

    .smart-insights-dashboard .insight-icon,
    .insight-icon-container .insight-icon,
    .main-insight .insight-icon,
    .insight-header .insight-icon {
        width: 36px !important;
        height: 36px !important;
    }

    .smart-insights-dashboard .insight-icon svg,
    .insight-icon-container .insight-icon svg,
    .main-insight .insight-icon svg,
    .insight-header .insight-icon svg {
        width: 18px !important;
        height: 18px !important;
    }
}
