/* El contenido de cada campo se ajusta al ancho de su contenedor
   (widget de Elementor, columna, sección, etc.). Si el widget mide
   el 80% de la pantalla, todo dentro se limita a ese 80%. */

.campo-adicional-contenido {
    max-width: 100%;
    box-sizing: border-box;
    overflow-wrap: break-word;
    word-wrap: break-word;
}

.campo-adicional-contenido *,
.campo-adicional-contenido *::before,
.campo-adicional-contenido *::after {
    box-sizing: border-box;
}

/* Medios: nunca desbordan el contenedor y conservan su proporción */
.campo-adicional-contenido img,
.campo-adicional-contenido video,
.campo-adicional-contenido svg,
.campo-adicional-contenido canvas,
.campo-adicional-contenido audio,
.campo-adicional-contenido embed,
.campo-adicional-contenido object {
    max-width: 100%;
    height: auto;
}

/* Iframes (mapas, formularios, etc.): limitados al ancho disponible */
.campo-adicional-contenido iframe {
    max-width: 100%;
}

/* Videos embebidos (YouTube, Vimeo, oEmbed de WordPress):
   ocupan el ancho del contenedor manteniendo proporción 16:9 */
.campo-adicional-contenido iframe[src*="youtube.com"],
.campo-adicional-contenido iframe[src*="youtube-nocookie.com"],
.campo-adicional-contenido iframe[src*="youtu.be"],
.campo-adicional-contenido iframe[src*="vimeo.com"],
.campo-adicional-contenido iframe[src*="dailymotion.com"],
.campo-adicional-contenido .wp-embedded-content {
    width: 100%;
    aspect-ratio: 16 / 9;
    height: auto;
}

/* Figuras y galerías de WordPress */
.campo-adicional-contenido figure {
    max-width: 100%;
    margin-left: 0;
    margin-right: 0;
}

.campo-adicional-contenido figure img {
    width: auto;
    max-width: 100%;
}

/* Tablas anchas: scroll horizontal interno en vez de romper el diseño */
.campo-adicional-contenido table {
    max-width: 100%;
    width: 100%;
    border-collapse: collapse;
    display: block;
    overflow-x: auto;
}

@media (min-width: 768px) {
    .campo-adicional-contenido table {
        display: table;
        overflow-x: visible;
    }
}

/* Bloques de código y preformateados */
.campo-adicional-contenido pre {
    max-width: 100%;
    overflow-x: auto;
    white-space: pre-wrap;
}
