/* iBoard / iPX layout compatibility fix */

html,
body {
    width: 100%;
    max-width: 100%;
    margin: 0;
    padding: 0;
    overflow-x: hidden;
    box-sizing: border-box;
}

*,
*::before,
*::after {
    box-sizing: border-box;
}

/* Main iBoard containers */
#ShowBody,
#content,
.content {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    margin: 0;
    padding: 0;
    overflow-x: hidden;
}

/* Do not force header/footer inner design */
#header,
.header,
#bottom {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    box-sizing: border-box;
}

/* radix layout wrapper */
#content .radix_boxton_3x,
.radix_boxton_3x {
    width: 100%;
    max-width: 1710px;
    min-width: 0;
    margin: 0 auto;
    padding: 0;
    overflow-x: hidden;
    box-sizing: border-box;
}

    /* Main content area */
    #content .radix_boxton_3x #main,
    .radix_boxton_3x #main,
    #main {
        display: block;
        width: 100%;
        max-width: 100%;
        min-width: 0;
        margin: 0;
        padding: 0;
        overflow-x: hidden;
        box-sizing: border-box;
    }

    /* Side areas, only when old layer uses them */
    #content .radix_boxton_3x #left,
    #content .radix_boxton_3x #right,
    .radix_boxton_3x #left,
    .radix_boxton_3x #right {
        max-width: 100%;
        min-width: 0;
        box-sizing: border-box;
    }

/* Media safety only */
#main img,
#main iframe,
#main video,
#main canvas,
#main svg {
    max-width: 100%;
}

#main img,
#main video,
#main canvas {
    height: auto;
}

/* iframe should keep its own height if inline height exists */
#main iframe {
    display: block;
}

/* Table safety without destroying table layouts too much */
#main table {
    max-width: 100%;
    border-collapse: collapse;
}

/* Long text safety only for real text blocks */
#main p,
#main li,
#main td,
#main th,
#main pre,
#main code {
    overflow-wrap: break-word;
    word-break: normal;
}

/* IPX header protection */
#header .top,
.header .top,
.top.top--smart {
    width: 100%;
    max-width: 100%;
    min-width: 0;
}

/* IPX wrap should control its own max-width */
.top .wrap,
.bottom .wrap,
.footer-wrap,
.footer-legal__inner {
    /*    max-width: var(--ipx-wrap-max, 1280px);*/
    margin-left: auto;
    margin-right: auto;
}

/* Prevent Bootstrap/container conflict inside iPX header/footer */
#header .wrap,
#bottom .wrap {
    /*width: min(100% - 40px, var(--ipx-wrap-max, 1280px));*/
}

@media (max-width: 767.98px) {
    #header .wrap,
    #bottom .wrap {
        width: min(100% - 28px, var(--ipx-wrap-max, 1280px));
    }
}

/* Admin panel should not push layout width */
#AdminPanel,
#Header_show,
#Top_show,
#Main_show,
#Bottom_show {
    max-width: 100%;
    overflow-x: auto;
}

/* Mobile drawer/panel protection */
.mobile-drawer,
.mobile-drawer-backdrop,
.header-panel {
    box-sizing: border-box;
}

/* Footer protection */
#bottom .bottom,
footer.bottom {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    box-sizing: border-box;
}