/*
 * SisCon Editor Legacy Bridge 1.0
 *
 * Compatibilidade mínima para matérias LEGACY editadas posteriormente
 * com componentes do SisCon Editor.
 *
 * IMPORTANTE:
 * - não define tipografia da matéria;
 * - não altera p, h2, h3, listas, links ou blockquotes históricos;
 * - atua somente em classes explícitas criadas pelo SisCon Editor;
 * - structured continua usando siscon-editorial.css.
 */

figure.sce-image {
    box-sizing: border-box;
    max-width: 100%;
    margin: 1.2em 0;
}

figure.sce-image img {
    display: block;
    max-width: 100%;
    height: auto;
    margin: 0;
    border: 0;
}

figure.sce-image > figcaption {
    display: block !important;
    caption-side: initial !important;
    box-sizing: border-box !important;
    width: 100% !important;
    min-width: 100% !important;
    max-width: 100% !important;
    float: none !important;
    clear: both !important;
    margin: 0;
    padding: 7px 2px 0;
    border: 0;
    background: transparent;
    color: #6b7785;
    font-size: .82em;
    font-weight: 400;
    font-style: normal;
    line-height: 1.45;
    text-align: left;
}

figure.sce-image[data-align="left"],
figure.sce-image[style*="text-align:left"],
figure.sce-image[style*="text-align: left"] {
    float: left !important;
    clear: none !important;
    width: fit-content;
    max-width: 100%;
    margin: .25em 1.25em 1em 0 !important;
}

figure.sce-image[data-align="right"],
figure.sce-image[style*="text-align:right"],
figure.sce-image[style*="text-align: right"] {
    float: right !important;
    clear: none !important;
    width: fit-content;
    max-width: 100%;
    margin: .25em 0 1em 1.25em !important;
}

figure.sce-image[data-align="center"],
figure.sce-image[style*="text-align:center"],
figure.sce-image[style*="text-align: center"] {
    float: none !important;
    clear: both;
    display: table;
    width: auto;
    max-width: 100%;
    margin: 1.2em auto !important;
}

.sce-embed,
[data-siscon-embed="1"] {
    box-sizing: border-box;
    clear: both;
    max-width: 100%;
    margin-top: 1.5em;
    margin-bottom: 1.5em;
}

.sce-embed iframe,
[data-siscon-embed="1"] iframe,
.sce-embed video,
[data-siscon-embed="1"] video {
    max-width: 100%;
}

@media (max-width: 767px) {
    figure.sce-image[data-align="left"],
    figure.sce-image[style*="text-align:left"],
    figure.sce-image[style*="text-align: left"],
    figure.sce-image[data-align="right"],
    figure.sce-image[style*="text-align:right"],
    figure.sce-image[style*="text-align: right"] {
        float: none !important;
        clear: both !important;
        display: table;
        width: 100% !important;
        margin: 1.2em 0 !important;
    }

    figure.sce-image img {
        width: 100%;
    }
}

/* Legacy Bridge 1.1.2 — neutralização visual do componente moderno
 * O tema legado pode aplicar borda, fundo, padding e box-shadow ao figure/
 * figcaption. Como o elemento é explicitamente do SisCon Editor (.sce-image),
 * neutralizamos apenas esse componente, sem tocar no restante da matéria.
 */
body figure.sce-image {
    box-sizing: border-box !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    outline: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}

body figure.sce-image > img {
    display: block !important;
    max-width: 100% !important;
    height: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    outline: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}

body figure.sce-image > figcaption {
    display: block !important;
    box-sizing: border-box !important;
    width: 100% !important;
    min-width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 7px 2px 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    color: #6b7785 !important;
    font-size: .82em !important;
    font-weight: 400 !important;
    font-style: normal !important;
    line-height: 1.45 !important;
    text-align: left !important;
}

/* SisCon Facebook Mobile Hotfix 1.1
 * O plugin de vídeo do Facebook calcula o layout interno pela largura
 * enviada na própria URL. Mantemos uma variante própria para mobile.
 */
.siscon-facebook-video-desktop {
    display: block !important;
}

.siscon-facebook-video-mobile {
    display: none !important;
}

@media (max-width: 767px) {
    .siscon-facebook-video-desktop {
        display: none !important;
    }

    .siscon-facebook-video-mobile {
        display: block !important;
        width: 100% !important;
        max-width: 320px !important;
        margin-left: auto !important;
        margin-right: auto !important;
    }
}

