/**
 * Container Columns Block - Minimal Styles
 * Works in frontend, FSE editor, and block editor environments
 */

.cm-container-columns,
.wp-block .cm-container-columns,
.editor-styles-wrapper .cm-container-columns,
.block-editor-block-list__layout .cm-container-columns {
    display: block;
    width: 100%;
    clear: both;
}

/* Responsive clearfix */
.cm-container-columns::after,
.wp-block .cm-container-columns::after,
.editor-styles-wrapper .cm-container-columns::after,
.block-editor-block-list__layout .cm-container-columns::after {
    content: "";
    display: table;
    clear: both;
}

/* Override WordPress core columns flexbox to use our width classes */
.cm-container-columns .wp-block-columns,
.wp-block .cm-container-columns .wp-block-columns,
.editor-styles-wrapper .cm-container-columns .wp-block-columns,
.block-editor-block-list__layout .cm-container-columns .wp-block-columns {
    display: block !important;
    width: 100%;
}

.cm-container-columns .wp-block-columns::after,
.wp-block .cm-container-columns .wp-block-columns::after,
.editor-styles-wrapper .cm-container-columns .wp-block-columns::after,
.block-editor-block-list__layout .cm-container-columns .wp-block-columns::after {
    content: "";
    display: table;
    clear: both;
}

/* Force column blocks to float and respect width classes */
.cm-container-columns .wp-block-column,
.wp-block .cm-container-columns .wp-block-column,
.editor-styles-wrapper .cm-container-columns .wp-block-column,
.block-editor-block-list__layout .cm-container-columns .wp-block-column {
    flex-grow: 0 !important;
    flex-basis: auto !important;
    float: left;
}

/* Ensure the responsive width classes take precedence */
.cm-container-columns .wp-block-column.cm-container-columns__left,
.cm-container-columns .wp-block-column.cm-container-columns__right {
    max-width: none !important;
    overflow: hidden; /* Contain all content within column boundaries */
}

/* Ensure all content respects column width */
.cm-container-columns .wp-block-column > * {
    max-width: 100% !important;
    overflow-wrap: break-word;
    word-wrap: break-word;
}

/* Handle images specifically */
.cm-container-columns .wp-block-column img,
.cm-container-columns .wp-block-column figure {
    max-width: 100% !important;
    height: auto;
}