@media only screen and (max-width: 480px) {
            #xioleni-color-panel {
                width: 260px !important;
                max-width: 95vw !important;
                left: 50% !important;
                right: auto !important;
                transform: translateX(-50%) !important;
                margin-left: 0 !important;
                margin-right: 0 !important;
            }
        }
        
        /* Fix para cursor alpha */
        #xioleni-alpha-cursor {
            display: flex !important;
            visibility: visible !important;
            opacity: 1 !important;
            z-index: 9999 !important;
        }
        
        #xioleni-alpha-cursor > div {
            width: 12px !important;
            height: 12px !important;
            border-radius: 50% !important;
            background-color: white !important;
            border: 1.5px solid white !important;
            box-shadow: 0 0 2px rgba(0,0,0,0.8) !important;
        }
        
        /* Ocultar el thumb original */
        #xioleni-alpha-input::-webkit-slider-thumb,
        #xioleni-alpha-input::-moz-range-thumb {
            opacity: 0 !important;
            height: 0 !important;
            width: 0 !important;
            visibility: hidden !important;
            display: none !important;
        }
    /* Otros estilos pueden mantenerse, pero eliminamos los relacionados con el panel de peso */
    #xioleni-weight-btn {
        position: relative;
    }
    
    /* Estilos para dar hover a los botones del panel */
    #panel-peso button:hover {
        background-color: #555 !important;
    }
    
    /* Estilos para el panel de fuentes */
    #panel-fuentes {
        background-color: #333333 !important;
        position: fixed !important;
        z-index: 9999 !important;
        width: 220px !important;
        padding: 15px !important;
        border-radius: 10px !important;
        box-shadow: 0 5px 15px rgba(0,0,0,0.7) !important;
    }
    
    #font-select-btn {
        background-color: #009bb6b8;
        color: white;
        border: none;
        padding: 8px 12px;
        border-radius: 10px;
        cursor: pointer;
        font-size: 14px;
        font-weight: bold;
        transition: all 0.3s ease;
    }
    
    #font-select-btn:hover {
        background-color: #009bb6b8;
        box-shadow: 0 0 8px 2px #00d4ff;
        transform: translateY(-2px);
    }
    
    #font-select-btn:active,
    #font-select-btn:focus {
        background-color: #009bb6b8;
        box-shadow: 0 0 12px 3px #00d4ff;
        transform: translateY(-1px);
        outline: none;
    }
    
    .font-option {
        background-color: #515150 !important;
        color: white !important;
        border: none !important;
        border-radius: 5px !important;
        padding: 8px 10px !important;
        margin: 5px 0 !important;
        cursor: pointer !important;
        display: block !important;
        width: 100% !important;
        text-align: left !important;
        font-size: 14px !important;
        transition: background-color 0.2s !important;
    }
    
    .font-option:hover {
        background-color: #3f3f3e !important;
    }
    
    #opciones-fuentes {
        max-height: 200px !important;
        overflow-y: auto !important;
        scrollbar-width: thin !important;
        scrollbar-color: #555 #333 !important;
    }
    
    #opciones-fuentes::-webkit-scrollbar {
        width: 6px !important;
    }
    
    #opciones-fuentes::-webkit-scrollbar-track {
        background: #333 !important;
        border-radius: 4px !important;
    }
    
    #opciones-fuentes::-webkit-scrollbar-thumb {
        background-color: #555 !important;
        border-radius: 4px !important;
    }

    /* FORZAR BORDES REDONDEADOS DE 10PX EN TODAS LAS IMÁGENES */
    html body .xioleni-grid-item {
        border-radius: 10px !important;
        overflow: visible !important; /* Permitir que los botones sobresalgan */
        float: none !important; /* Desactivar float para que flex funcione */
        display: block !important; /* Como item flex */
        position: relative !important;
        top: 0 !important;
        left: 0 !important;
        margin-top: 0 !important;
    }

    /* Asegurar que la grilla sea Block con floats para compatibilidad */
    html body #xioleni-editor .xioleni-image-grid {
        display: block !important;
        width: 100% !important;
        overflow: visible !important;
        padding: 0 !important; /* ELIMINADO padding para pegar texto */
        margin: 0 !important; /* Margen reducido a 0 */
        clear: both !important;
        box-sizing: border-box !important;
    }
    
    html body #xioleni-editor .xioleni-image-grid::after {
        content: "";
        display: table;
        clear: both;
    }

    /* Ajuste preciso del ancho de los items */
    html body #xioleni-editor .xioleni-grid-item {
        width: calc(50% - 1px) !important; /* 50% exacto menos la mitad del gap */
        max-width: none !important;
        margin: 0 !important;
        padding: 0 !important;
        float: left !important;
        margin-bottom: 2px !important; /* Espacio vertical mínimo */
        margin-right: 2px !important;
        overflow: hidden !important; /* Mantener botones dentro de la imagen */
    }
    
    html body #xioleni-editor .xioleni-grid-item:nth-child(2n) {
        margin-right: 0 !important;
        float: right !important;
    }

    /* Separación segura entre texto y grilla de imágenes - CONTROLADO POR JS */
    html body #xioleni-editor p + .xioleni-image-grid {
        margin-top: 0 !important;
    }

    html body #xioleni-editor .xioleni-image-grid + p {
        margin-top: 0 !important;
        clear: both !important;
    }

    html body #xioleni-editor .xioleni-grid-wrapper,
    html body .xioleni-editor-publicado .xioleni-grid-wrapper {
        width: 100% !important;
        display: block !important;
        clear: both !important;
        margin: 0 !important; /* Margen reducido a 0 */
        padding: 0 !important; /* ELIMINADO padding para pegar texto */
        box-sizing: border-box !important;
        float: none !important;
    }

    html body #xioleni-editor p + .xioleni-grid-wrapper,
    html body #xioleni-editor div + .xioleni-grid-wrapper,
    html body .xioleni-editor-publicado p + .xioleni-grid-wrapper,
    html body .xioleni-editor-publicado div + .xioleni-grid-wrapper {
        margin-top: 0 !important;
    }

    html body #xioleni-editor .xioleni-grid-wrapper + p,
    html body #xioleni-editor .xioleni-grid-wrapper + div,
    html body .xioleni-editor-publicado .xioleni-grid-wrapper + p,
    html body .xioleni-editor-publicado .xioleni-grid-wrapper + div {
        margin-top: 0 !important;
        clear: both !important;
    }

    /* Separación segura entre texto e imagen individual - CONTROLADO POR JS */
    html body #xioleni-editor p + .xioleni-media-wrapper,
    html body #xioleni-editor p + .xioleni-media-container {
        margin-top: 0 !important;
    }

    html body #xioleni-editor .xioleni-media-wrapper + p,
    html body #xioleni-editor .xioleni-media-container + p {
        margin-top: 0 !important;
        clear: both !important;
    }

    html body #xioleni-editor div + .xioleni-media-wrapper,
    html body #xioleni-editor div + .xioleni-media-container {
        margin-top: 0 !important;
    }

    html body #xioleni-editor .xioleni-media-wrapper + div,
    html body #xioleni-editor .xioleni-media-container + div {
        margin-top: 0 !important;
        clear: both !important;
    }
    
    /* NUEVO: Clase para párrafos espaciadores editables */
html body #xioleni-editor p.xioleni-editable-spacer {
    display: block !important;
    min-height: 8px !important;
    line-height: 1.1 !important;
    margin: 0 !important;
    clear: both !important;
    cursor: text !important;
    caret-color: auto !important; /* Asegurar color de cursor */
    width: 100% !important;
    position: relative !important;
    z-index: 100 !important;
    padding: 0 !important;
}
    
    /* Asegurar que el BR dentro del spacer no colapse y sea visible */
html body #xioleni-editor p.xioleni-editable-spacer br {
    display: inline !important;
    height: auto !important;
    line-height: inherit !important;
    content: "" !important;
}

/* Reducir al mínimo el espacio entre una imagen y el texto de abajo */
html body #xioleni-editor .xioleni-media-container + p.xioleni-editable-spacer,
html body #xioleni-editor .xioleni-image-grid + p.xioleni-editable-spacer,
html body #xioleni-editor .xioleni-grid-wrapper + p.xioleni-editable-spacer,
html body #xioleni-editor .xioleni-media-wrapper + p.xioleni-editable-spacer {
    margin-top: 0 !important;
    padding-top: 0 !important;
}
    
    /* Regla radical para eliminar márgenes de wrappers */
    html body #xioleni-editor .xioleni-grid-wrapper,
    html body #xioleni-editor .xioleni-media-wrapper,
    html body #xioleni-editor .xioleni-image-grid,
    html body #xioleni-editor .xioleni-media-container {
        margin: 0 !important;
        padding: 0 !important;
        border: none !important;
    }

html body #xioleni-editor .xioleni-noneditable-spacer {
    display: block !important;
    width: 100% !important;
    height: 8px !important;
    clear: both !important;
    pointer-events: none !important;
    user-select: none !important;
}

html body #xioleni-editor .xioleni-noneditable-spacer + .xioleni-media-container,
html body #xioleni-editor .xioleni-noneditable-spacer + .xioleni-image-grid,
html body #xioleni-editor .xioleni-noneditable-spacer + .xioleni-grid-wrapper,
html body #xioleni-editor .xioleni-noneditable-spacer + .xioleni-media-wrapper {
    margin-top: 0 !important;
}

html body .xioleni-post-content .xioleni-noneditable-spacer,
html body .xioleni-editor-publicado .xioleni-noneditable-spacer {
    display: block !important;
    width: 100% !important;
    height: 8px !important;
    clear: both !important;
    pointer-events: none !important;
    user-select: none !important;
}

html body #xioleni-editor p + .xioleni-media-container,
html body #xioleni-editor p + .xioleni-image-grid,
html body #xioleni-editor p + .xioleni-grid-wrapper,
html body #xioleni-editor p + .xioleni-media-wrapper,
html body #xioleni-editor p + img:not(.xioleni-emoji-inline) {
    margin-top: 8px !important;
}

html body .xioleni-post-content p + .xioleni-media-container,
html body .xioleni-post-content p + .xioleni-image-grid,
html body .xioleni-post-content p + .xioleni-grid-wrapper,
html body .xioleni-post-content p + .xioleni-media-wrapper,
html body .xioleni-post-content p + img:not(.xioleni-emoji-inline),
html body .xioleni-editor-publicado p + .xioleni-media-container,
html body .xioleni-editor-publicado p + .xioleni-image-grid,
html body .xioleni-editor-publicado p + .xioleni-grid-wrapper,
html body .xioleni-editor-publicado p + .xioleni-media-wrapper,
html body .xioleni-editor-publicado p + img:not(.xioleni-emoji-inline) {
    margin-top: 8px !important;
}

html body .xioleni-post-content .xioleni-noneditable-spacer + .xioleni-media-container,
html body .xioleni-post-content .xioleni-noneditable-spacer + .xioleni-image-grid,
html body .xioleni-post-content .xioleni-noneditable-spacer + .xioleni-grid-wrapper,
html body .xioleni-post-content .xioleni-noneditable-spacer + .xioleni-media-wrapper,
html body .xioleni-editor-publicado .xioleni-noneditable-spacer + .xioleni-media-container,
html body .xioleni-editor-publicado .xioleni-noneditable-spacer + .xioleni-image-grid,
html body .xioleni-editor-publicado .xioleni-noneditable-spacer + .xioleni-grid-wrapper,
html body .xioleni-editor-publicado .xioleni-noneditable-spacer + .xioleni-media-wrapper {
    margin-top: 0 !important;
}

    html body #xioleni-editor { padding-top: 12px !important; }
    html body #xioleni-editor > p:first-child,
    html body #xioleni-editor > p[data-xioleni-editable="true"]:first-child { margin-top: 0 !important; }

    html body #xioleni-editor p {
        line-height: 1.08 !important;
        margin: 0 !important;
    }

    html body #xioleni-editor div {
        line-height: 1.08 !important;
        margin: 0 !important;
    }
    
    html body #xioleni-editor br {
        line-height: 1.00 !important;
        margin: 0 !important;
        padding: 0 !important;
        height: 0.2em !important;
    }

    html body .xioleni-post-content p,
    html body .xioleni-post-content div {
        line-height: 1.08 !important;
        margin: 0 !important;
    }
    html body .xioleni-post-content br {
        line-height: 1.00 !important;
        margin: 0 !important;
        padding: 0 !important;
        height: 0.2em !important;
    }

    html body .xioleni-post-content {
        padding-top: 5px !important;
    }

    html body .xioleni-editor-width-shell {
        width: 100% !important;
        box-sizing: border-box !important;
        padding: 10px !important;
    }

    html body .xioleni-editor-width-inner {
        width: 100% !important;
        box-sizing: border-box !important;
        padding: 15px !important;
        background-color: #004c5924 !important;
        border-radius: 15px !important;
        overflow: hidden !important;
    }

    html body .xioleni-editor-width-inner #xioleni-editor {
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
        display: block !important;
    }

    html body #xioleni-editor .xioleni-image-grid,
    html body #xioleni-editor .xioleni-grid-wrapper {
        pointer-events: auto !important;
        caret-color: auto !important;
    }

    html body #xioleni-editor .xioleni-grid-item {
        pointer-events: auto !important;
    }

    html body #xioleni-editor .xioleni-grid-item .xioleni-media-remove-btn,
    html body #xioleni-editor .xioleni-grid-item .xioleni-image-select-box {
        pointer-events: auto !important;
    }

    html body .xioleni-grid-item img:not(.xioleni-emoji-inline),
    html body .xioleni-media-container img:not(.xioleni-emoji-inline),
    html body #xioleni-editor img:not(.xioleni-emoji-inline),
    html body .xioleni-post-content img:not(.xioleni-emoji-inline) {
        border-radius: 10px !important;
        -webkit-mask-image: -webkit-radial-gradient(white, black) !important;
        width: 100% !important;
        height: auto !important;
        aspect-ratio: 1/1 !important;
        object-fit: cover !important;
        position: relative !important;
        left: 0 !important;
        top: 0 !important;
    }

    html body #xioleni-editor .xioleni-media-container img:not(.xioleni-emoji-inline):not([data-size]):not([data-tag-image]):not([data-is-tag]):not([data-is-emoji]),
    html body .xioleni-post-content .xioleni-media-container img:not(.xioleni-emoji-inline):not([data-size]):not([data-tag-image]):not([data-is-tag]):not([data-is-emoji]),
    html body .xioleni-post-content > img:not(.xioleni-emoji-inline):not([data-size]):not([data-tag-image]):not([data-is-tag]):not([data-is-emoji]) {
        width: 550px !important;
        height: 550px !important;
        max-width: 550px !important;
        max-height: 550px !important;
        aspect-ratio: 1/1 !important;
        object-fit: cover !important;
        display: block !important;
        margin: 0 auto !important;
    }

    @media (max-width: 768px) {
        html body #xioleni-editor .xioleni-media-container img:not(.xioleni-emoji-inline):not([data-size]):not([data-tag-image]):not([data-is-tag]):not([data-is-emoji]),
        html body .xioleni-post-content .xioleni-media-container img:not(.xioleni-emoji-inline):not([data-size]):not([data-tag-image]):not([data-is-tag]):not([data-is-emoji]),
        html body .xioleni-post-content > img:not(.xioleni-emoji-inline):not([data-size]):not([data-tag-image]):not([data-is-tag]):not([data-is-emoji]) {
            width: 300px !important;
            height: 300px !important;
            max-width: 300px !important;
            max-height: 300px !important;
        }
    }

    /* Estilos para la barra de herramientas en todos los dispositivos */
    .xioleni-toolbar {
        display: flex;
        flex-wrap: wrap;
        gap: 12px;
        justify-content: flex-start;
    }
    
    /* Prevenir scroll no deseado al usar el selector de color en dispositivos móviles */
    body.xioleni-color-selecting {
        overflow: hidden !important;
        touch-action: none !important;
        position: fixed !important;
        width: 100% !important;
        height: 100% !important;
    }
    
    /* Estilos específicos para el panel de color */
    #xioleni-color-panel {
        user-select: none !important;
    }
    
    #xioleni-alpha-container, #xioleni-hue-slider {
        touch-action: none !important;
    }
    
    /* Ajustes para tamaños de controles en diferentes dispositivos */
    @media (min-width: 769px) {
        /* PC y pantallas grandes */
        #xioleni-hue-slider, #xioleni-alpha-container {
            width: 14px !important; 
            height: 65px !important;
        }
    }
    
    @media (max-width: 768px) {
        /* Tablets */
        #xioleni-hue-slider, #xioleni-alpha-container {
            width: 14px !important;
            height: 65px !important;
        }
    }
    
    @media (max-width: 480px) {
        /* Móviles */
        #xioleni-hue-slider, #xioleni-alpha-container {
            width: 12px !important;
            height: 65px !important;
        }
    }
    
    /* Estilos responsivos para tablet */
    @media (max-width: 768px) {
        #panel-fuentes {
            width: 260px !important;
            max-width: 90vw !important;
        }
        
        .font-option {
            padding: 12px !important;
            font-size: 16px !important;
            white-space: nowrap !important;
            overflow: hidden !important;
            text-overflow: ellipsis !important;
        }
        
        #opciones-fuentes {
            max-height: 220px !important;
            padding-right: 10px !important;
        }
        
        .xioleni-toolbar {
            justify-content: flex-start;
            gap: 8px;
        }
        
        .xioleni-toolbar button {
            margin-bottom: 5px;
        }
        
        /* Ajustes para paneles desplegables en tablets */
        #panel-fuentes, #panel-tamanio, #panel-peso, #xioleni-fondo-panel {
            max-width: 90vw !important;
            right: auto !important;
        }
        
        /* Ajustar posición si el panel se sale por la derecha */
         #panel-tamanio {
             width: 280px !important;
             max-width: 90vw !important;
         }
     }
     
     /* Estilos responsivos para móviles */
     @media (max-width: 480px) {
         /* Ajustes para paneles desplegables en móviles */
         #panel-fuentes, #panel-tamanio, #panel-peso, #xioleni-fondo-panel {
             max-width: 95vw !important;
             right: auto !important;
             left: 0 !important;
         }
         
         #panel-fuentes {
             width: 240px !important;
             max-width: 95vw !important;
         }
         
         #panel-tamanio {
             width: 260px !important;
             max-width: 95vw !important;
         }
         
         #panel-peso {
             width: 200px !important;
             max-width: 95vw !important;
         }
         
         #xioleni-fondo-panel {
             width: 180px !important;
             max-width: 95vw !important;
         }
         
         .xioleni-toolbar {
             gap: 6px;
         }
         
         .xioleni-toolbar button {
             padding: 6px 8px !important;
             font-size: 12px !important;
         }
     }
    
    /* Ajustes específicos para móviles pequeños */
    @media (max-width: 480px) {
        #panel-fuentes {
            width: 240px !important;
            max-width: 95vw !important;
        }
        
        .font-option {
            padding: 10px !important;
            font-size: 15px !important;
        }
        
        .xioleni-toolbar {
            justify-content: flex-start;
            gap: 5px;
        }
        
        .xioleni-toolbar button {
            padding: 6px 8px !important;
            font-size: 12px !important;
            margin-bottom: 4px;
        }
    }
    
    /* Estilos para la bolita del slider */
    #xioleni-alpha-input::-webkit-slider-thumb {
        -webkit-appearance: none;
        appearance: none;
        width: 14px;
        height: 14px;
        border-radius: 50%;
        background-color: white;
        border: 1px solid #444;
        cursor: pointer;
        box-shadow: 0 0 2px rgba(0, 0, 0, 0.8);
    }
    
    #xioleni-alpha-input::-moz-range-thumb {
        width: 14px;
        height: 14px;
        border-radius: 50%;
        background-color: white;
        border: 1px solid #444;
        cursor: pointer;
        box-shadow: 0 0 2px rgba(0, 0, 0, 0.8);
    }
    
    /* Estilo para la pista del slider */
    #xioleni-alpha-input::-webkit-slider-runnable-track {
        background: transparent;
        height: 1px;
        cursor: pointer;
    }
    
    #xioleni-alpha-input::-moz-range-track {
        background: transparent;
        height: 1px;
        cursor: pointer;
    }
    
    /* Estilos responsivos para el selector de color */
    @media (max-width: 768px) {
        #xioleni-color-panel {
            width: 260px !important;
            padding: 8px !important;
        }
        
        #xioleni-color-area {
            width: 180px !important;
            height: 95px !important;
        }
        
        #xioleni-hue-slider, 
        #xioleni-alpha-input + div {
            width: 15px !important;
            height: 95px !important;
        }
    }
    
    @media (max-width: 480px) {
        #xioleni-color-panel {
            width: 220px !important;
            padding: 8px !important;
        }
        
        #xioleni-color-area {
            width: 150px !important;
            height: 90px !important;
        }
        
        #xioleni-hue-slider, 
        #xioleni-alpha-input + div {
            width: 14px !important;
            height: 90px !important;
        }
    }
    
    /* Estilo para el botón de color */
    .xioleni-color-btn {
        background-color: #333;
        color: white;
        border: none;
        border-radius: 8px;
        padding: 6px 8px;
        font-size: 13px;
        font-weight: bold;
        cursor: pointer;
    }
    
    .xioleni-color-btn:hover {
        background-color: #444;
    }

    /* Estilos para las bolitas de los sliders */
    #xioleni-alpha-input::-webkit-slider-thumb {
        -webkit-appearance: none;
        appearance: none;
        width: 14px;
        height: 14px;
        border-radius: 50%;
        background-color: white;
        border: 1px solid #444;
        cursor: pointer;
        box-shadow: 0 0 2px rgba(0, 0, 0, 0.8);
    }
    
    #xioleni-alpha-input::-moz-range-thumb {
        width: 14px;
        height: 14px;
        border-radius: 50%;
        background-color: white;
        border: 1px solid #444;
        cursor: pointer;
        box-shadow: 0 0 2px rgba(0, 0, 0, 0.8);
    }
    
    /* Transparencia del track para el input de alfa */
    #xioleni-alpha-input::-webkit-slider-runnable-track {
        background: transparent;
        height: 1px;
        cursor: pointer;
    }
    
    #xioleni-alpha-input::-moz-range-track {
        background: transparent;
        height: 1px;
        cursor: pointer;
    }

    /* Estilos responsivos para el selector de color rectangular */
    @media (max-width: 768px) {
        #xioleni-color-panel {
            width: 240px !important;
            padding: 8px !important;
        }
        
        #xioleni-hue-slider, 
        #xioleni-alpha-input + div {
            width: 15px !important;
            height: 65px !important;
        }
    }
    
    @media (max-width: 480px) {
        #xioleni-color-panel {
            width: 200px !important;
            padding: 8px !important;
        }
        
        #xioleni-hue-slider, 
        #xioleni-alpha-input + div {
            width: 14px !important;
            height: 65px !important;
        }
    }
    
    /* Definición duplicada eliminada para evitar conflictos */
 
    .xioleni-post-content .xioleni-text-entrada-rain,
    .xioleni-post-content .xioleni-text-entrada-rain *,
    .xioleni-post-content .xioleni-text-bucle-wave,
    .xioleni-post-content .xioleni-text-bucle-wave *,
    .xioleni-post-content .xioleni-text-bucle-spin,
    .xioleni-post-content .xioleni-text-bucle-spin * {
        display: inline-block !important;
        background: transparent !important;
        -webkit-background-clip: initial !important;
        background-clip: initial !important;
        color: currentColor !important;
        text-fill-color: currentColor !important;
        -webkit-text-fill-color: currentColor !important;
        text-decoration: none !important;
        text-shadow: none !important;
        opacity: 1 !important;
        visibility: visible !important;
        z-index: 9999 !important;
        position: relative !important;
    }

    /* Anular cualquier estilo que pueda interferir */
    .xioleni-post-content:not(.xioleni-text-entrada-rain):not(.xioleni-text-bucle-wave):not(.xioleni-text-bucle-spin) [style*="color"],
    .xioleni-post:not(.xioleni-text-entrada-rain):not(.xioleni-text-bucle-wave):not(.xioleni-text-bucle-spin) [style*="color"] {
        /* Estos estilos son posiblemente los que están causando los problemas */
        background: initial !important;
        background-clip: initial !important;
        -webkit-background-clip: initial !important;
    }

    /* Forzar que los caracteres de los efectos sean completamente visibles */
    .xioleni-post-content .xioleni-char-effect-container[data-effect="entrada-rain"],
    .xioleni-post-content .xioleni-char-effect-container[data-effect="bucle-wave"],
    .xioleni-post-content .xioleni-char-effect-container[data-effect="bucle-spin"],
    .xioleni-post-content [data-colored="true"] {
        color: currentColor !important;
        text-fill-color: currentColor !important;
        -webkit-text-fill-color: currentColor !important;
    }

    /* Reiniciar todas las reglas potencialmente peligrosas - EXCEPTO para degradados */
    .xioleni-post-content [style*="background-clip: text"]:not([data-has-gradient]):not([data-xioleni-has-gradient]):not([data-gradient-css]), 
    .xioleni-post-content [style*="-webkit-background-clip: text"]:not([data-has-gradient]):not([data-xioleni-has-gradient]):not([data-gradient-css]) {
        color: inherit !important;
        -webkit-text-fill-color: currentColor !important;
    }
    
    /* Asegurar que los degradados mantengan color transparente */
    .xioleni-post-content [style*="background-clip: text"][data-has-gradient="true"],
    .xioleni-post-content [style*="background-clip: text"][data-xioleni-has-gradient="true"],
    .xioleni-post-content [style*="background-clip: text"][data-gradient-css],
    .xioleni-post-content [style*="-webkit-background-clip: text"][data-has-gradient="true"],
    .xioleni-post-content [style*="-webkit-background-clip: text"][data-xioleni-has-gradient="true"],
    .xioleni-post-content [style*="-webkit-background-clip: text"][data-gradient-css] {
        color: transparent !important;
        -webkit-text-fill-color: transparent !important;
        background-clip: text !important;
        -webkit-background-clip: text !important;
    }

    /* Especificidad máxima para el efecto arcoíris para evitar cualquier sobreescritura */
    html body .xioleni-post-content .xioleni-text-interaccion-rainbow,
    html body .xioleni-post-content .xioleni-text-interaccion-rainbow *,
    html body .xioleni-post .xioleni-text-interaccion-rainbow,
    html body .xioleni-post .xioleni-text-interaccion-rainbow *,
    html body .xioleni-editor-publicado .xioleni-text-interaccion-rainbow,
    html body .xioleni-editor-publicado .xioleni-text-interaccion-rainbow * {
        background-image: linear-gradient(to right, 
            #FF0000, #FF7F00, #FFFF00, #00FF00, #0000FF, #4B0082, #8B00FF) !important;
        background-size: 200% 100% !important;
        background-clip: text !important;
        -webkit-background-clip: text !important;
        color: transparent !important;
        -webkit-text-fill-color: transparent !important;
        text-fill-color: transparent !important;
        animation: xioleni-rainbow-animation-fix 3s linear infinite !important;
    }

    /* Prevenir que los estilos inline sobreescriban el efecto arcoíris */
    [style*="color:"].xioleni-text-interaccion-rainbow,
    [style*="color:"] .xioleni-text-interaccion-rainbow,
    .xioleni-text-interaccion-rainbow[style*="color:"],
    .xioleni-text-interaccion-rainbow [style*="color:"] {
        color: transparent !important;
        -webkit-text-fill-color: transparent !important;
    }

    /* Regla para asegurar que los colores automáticos aplicados dinámicamente no afecten el arcoíris */
    .xioleni-post-content *:not(.xioleni-text-interaccion-rainbow):not(.xioleni-text-interaccion-rainbow *)[style*="color:"] {
        /* Aplicar color heredado solo a elementos sin efectos especiales */
        background-clip: initial !important;
        -webkit-background-clip: initial !important;
    }

    /* Definir animación arcoíris si no existe */
    @keyframes xioleni-rainbow-animation-fix {
        0% {background-position: 0% 50%;}
        100% {background-position: 100% 50%;}
    }

    /* SOLUCIÓN PARA COLORES AUTOMÁTICOS */
    /* Mejorar detección de fondo claro para aplicar texto oscuro */
    .xioleni-post-content[style*="background-color: rgb(235, 249, 249)"],
    .xioleni-post-content[style*="background-color: #ebf9f9"],
    .xioleni-post-content[style*="background-color: #9dbac5"],
    .xioleni-post-content[style*="background-color: rgb(157, 186, 197)"] {
        color: #3c3c3b !important;
    }

    /* Asegurar que los textos con colores personalizados o efectos no sean afectados */
    .xioleni-post-content [style*="color:"],
    .xioleni-post-content [style*="color="],
    .xioleni-post-content [data-force-color="true"],
    .xioleni-post-content [data-colored="true"],
    .xioleni-post-content [class*="xioleni-text-"] {
        color: inherit !important;
    }

    /* Excepción específica para el efecto arcoíris - siempre transparente */
    .xioleni-post-content .xioleni-text-interaccion-rainbow,
    .xioleni-post-content .xioleni-text-interaccion-rainbow * {
        color: transparent !important;
        -webkit-text-fill-color: transparent !important;
    }

    /* REGLAS MEJORADAS PARA COLORES AUTOMÁTICOS EN EL MURO */

    /* Base para colores de texto automáticos */
    .xioleni-post-content {
        color: inherit;
    }

    /* Colores de texto automáticos para fondos claros - AGREGAR !IMPORTANT */
    .xioleni-post[style*="background-color: rgb(235, 249, 249)"] .xioleni-post-content,
    .xioleni-post[style*="background-color: #ebf9f9"] .xioleni-post-content,
    .xioleni-post[style*="background-color: #9dbac5"] .xioleni-post-content,
    .xioleni-post[style*="background-color: rgb(157, 186, 197)"] .xioleni-post-content {
        color: #3c3c3b !important;
    }

    /* Selector adicional para fondo gris claro en muro */
    .xioleni-post[style*="background-color"] .xioleni-post-content:not([style*="color"]) {
        color: #3c3c3b !important;
    }

    /* Colores de texto automáticos para fondos oscuros */
    .xioleni-post[style*="background-color: #21353d"] .xioleni-post-content,
    .xioleni-post[style*="background-color: #001a27"] .xioleni-post-content,
    .xioleni-post[style*="background-color: rgb(33, 53, 61)"] .xioleni-post-content,
    .xioleni-post[style*="background-color: rgb(0, 26, 39)"] .xioleni-post-content,
    .xioleni-post[style*="background-color: rgb(10, 17, 20)"] .xioleni-post-content,
    .xioleni-post[style*="background-color: #122631"] .xioleni-post-content {
        color: #ffffff !important;
    }

    /* Excepción para elementos con colores personalizados o efectos */
    .xioleni-post-content [style*="color:"],
    .xioleni-post-content [data-force-color="true"],
    .xioleni-post-content [data-colored="true"],
    .xioleni-post-content [data-has-gradient="true"],
    .xioleni-post-content [data-xioleni-has-gradient="true"],
    .xioleni-post-content [data-xioleni-gradient],
    .xioleni-post-content [data-xioleni-gradient-fixed="true"],
    .xioleni-post-content [class*="xioleni-text-interaccion-"],
    .xioleni-post-content [class*="xioleni-text-bucle-"],
    .xioleni-post-content [class*="xioleni-text-entrada-"] {
        color: inherit !important;
    }

    /* Reglas específicas para el efecto arcoíris */
    .xioleni-post-content .xioleni-text-interaccion-rainbow,
    .xioleni-post-content .xioleni-text-interaccion-rainbow * {
        background-image: linear-gradient(to right, 
            #FF0000, #FF7F00, #FFFF00, #00FF00, #0000FF, #4B0082, #8B00FF) !important;
        background-size: 200% 100% !important;
        background-clip: text !important;
        -webkit-background-clip: text !important;
        color: transparent !important;
        -webkit-text-fill-color: transparent !important;
        text-fill-color: transparent !important;
        animation: xioleni-rainbow-animation-fix 3s linear infinite !important;
    }

    /* Asegurar que degradados y efectos con backgrounds sean visibles */
    .xioleni-post-content [style*="background-clip: text"],
    .xioleni-post-content [style*="-webkit-background-clip: text"] {
        color: transparent !important;
        -webkit-text-fill-color: transparent !important;
        line-height: inherit !important;
        height: auto !important;
        min-height: auto !important;
        max-height: none !important;
        display: inline !important;
        overflow: visible !important;
    }
    
    /* Corrección específica para elementos con degradados que se ven como líneas - SOLO EN EL MURO */
    .xioleni-post-content [style*="background-clip: text"],
    .xioleni-post-content [style*="-webkit-background-clip: text"],
    .xioleni-post-content [data-has-gradient="true"],
    .xioleni-post-content [data-xioleni-has-gradient="true"],
    .xioleni-post-content [data-gradient-css],
    .xioleni-post [style*="background-clip: text"],
    .xioleni-post [style*="-webkit-background-clip: text"],
    .xioleni-post [data-has-gradient="true"],
    .xioleni-post [data-xioleni-has-gradient="true"],
    .xioleni-post [data-gradient-css] {
        line-height: inherit !important;
        height: auto !important;
        min-height: auto !important;
        max-height: none !important;
        display: inline !important;
        overflow: visible !important;
        white-space: normal !important;
    }
    
    /* Correcciones específicas para degradados en el editor - más conservadoras */
    #xioleni-editor [style*="background-clip: text"],
    #xioleni-editor [style*="-webkit-background-clip: text"],
    #xioleni-editor [data-has-gradient="true"],
    #xioleni-editor [data-xioleni-has-gradient="true"],
    #xioleni-editor [data-gradient-css] {
        line-height: inherit !important;
        height: auto !important;
        display: inline !important;
        overflow: visible !important;
    }

    @keyframes xioleni-rainbow-animation-fix {
        0% {background-position: 0% 50%;}
        100% {background-position: 100% 50%;}
    }

    /* Reglas adicionales para aplicar el color automático a elementos internos */
    .xioleni-post[style*="background-color: rgb(235, 249, 249)"] .xioleni-post-content *:not([style*="color"]):not([class*="xioleni-text-interaccion"]),
    .xioleni-post[style*="background-color: #ebf9f9"] .xioleni-post-content *:not([style*="color"]):not([class*="xioleni-text-interaccion"]),
    .xioleni-post[style*="background-color: #9dbac5"] .xioleni-post-content *:not([style*="color"]):not([class*="xioleni-text-interaccion"]),
    .xioleni-post[style*="background-color: rgb(157, 186, 197)"] .xioleni-post-content *:not([style*="color"]):not([class*="xioleni-text-interaccion"]) {
        color: #3c3c3b !important;
    }

    /* Reglas específicas para elementos dentro de elementos con fondo claro */
    .xioleni-post[style*="background-color: #9dbac5"] .xioleni-post-content div,
    .xioleni-post[style*="background-color: #9dbac5"] .xioleni-post-content p,
    .xioleni-post[style*="background-color: #9dbac5"] .xioleni-post-content span:not([class*="xioleni-text-interaccion"]),
    .xioleni-post[style*="background-color: rgb(157, 186, 197)"] .xioleni-post-content div,
    .xioleni-post[style*="background-color: rgb(157, 186, 197)"] .xioleni-post-content p,
    .xioleni-post[style*="background-color: rgb(157, 186, 197)"] .xioleni-post-content span:not([class*="xioleni-text-interaccion"]) {
        color: #3c3c3b !important;
    }

    /* Regla específica para elementos de texto con fondo gris claro */
    html body .xioleni-post[style*="background-color: #9dbac5"] .xioleni-post-content .xioleni-editor-publicado,
    html body .xioleni-post[style*="background-color: rgb(157, 186, 197)"] .xioleni-post-content .xioleni-editor-publicado {
        color: #3c3c3b !important;
    }

    /* ESTILOS PARA COLUMNAS ULTRA SIMPLE */
    .xioleni-simple-columns {
        width: 100%;
        overflow: hidden;
        clear: both;
        margin: 10px 0;
        display: block;
        position: relative;
        box-sizing: border-box;
    }

    .xioleni-left-column,
    .xioleni-right-column {
        float: left;
        width: 48%;
        padding: 0;
        white-space: pre-wrap;
        word-wrap: break-word;
        overflow-wrap: break-word;
        min-height: 1em;
        box-sizing: border-box;
        line-height: inherit;
        font-size: inherit;
        font-family: inherit;
    }

    .xioleni-left-column {
        margin-right: 2%;
    }

    .xioleni-right-column {
        margin-left: 2%;
    }

    /* Asegurar que se respetan los saltos de línea */
    .xioleni-left-column br, 
    .xioleni-right-column br {
        display: block;
        content: "";
        margin-top: 0;
        line-height: inherit;
    }

    /* Limpiar flotante */
    .xioleni-simple-columns::after {
        content: "";
        display: table;
        clear: both;
        width: 100%;
        height: 0;
    }

    /* Versión móvil */
    @media (max-width: 480px) {
        .xioleni-left-column,
        .xioleni-right-column {
            float: none;
            width: 100%;
            margin-left: 0;
            margin-right: 0;
            margin-bottom: 10px;
        }
    }