/* SVG Isolation CSS - Previene interferencia de colores entre iconos */

/* Aislar completamente cada SVG individual */
.svg-isolated {
    isolation: isolate !important;
    contain: style !important;
    display: inline-block !important;
    vertical-align: middle !important;
    color: unset !important;
    position: relative !important;
    z-index: 1 !important;
}

/* Resetear solo propiedades de color heredadas */
.svg-isolated * {
    color: unset !important;
}

/* Asegurar que los gradientes funcionen correctamente */
.svg-isolated defs {
    isolation: isolate !important;
}

.svg-isolated linearGradient,
.svg-isolated radialGradient {
    isolation: isolate !important;
}

.svg-isolated stop {
    isolation: isolate !important;
}

/* Aislar del contexto de color del padre */
.svg-container {
    isolation: isolate;
    contain: style;
}

/* Prevenir que las clases de Tailwind afecten los SVGs */
.svg-isolated[class*="text-"],
.svg-isolated[class*="bg-"],
.svg-isolated[class*="border-"] {
    color: unset !important;
    background: unset !important;
    border-color: unset !important;
}