/**
 * The following styles get applied inside the editor only.
 *
 * Replace them with your own styles or remove the file completely.
 */

.wp-block-animatikon-reveal {
	border: 1px dotted #f00;
	min-height: 30px;

    .content {
        // Fix inner block alignment in the editor
        > .block-editor-inner-blocks {
            > .block-editor-block-list__layout {
                display: block !important;

                > .wp-block {
                    clear: none;

                    // Universal text alignment reset - covers ALL block types (paragraph, heading, quote, etc.)
                    // has-text-align-* is the standard WP class used by every block with alignment support
                    &:not(.has-text-align-center):not(.has-text-align-right) {
                        text-align: left !important;
                    }
                    &.has-text-align-left   { text-align: left !important; }
                    &.has-text-align-center { text-align: center !important; }
                    &.has-text-align-right  { text-align: right !important; }

                    // Block-level (spatial) alignment - float-based, works for Image etc.
                    &.alignleft {
                        clear: none !important;
                        float: left !important;
                        width: auto;
                    }
                    &.aligncenter {
                        clear: none !important;
                        float: none !important;
                        display: flex !important;        // centers the inner element (figure, etc.)
                        justify-content: center !important; // immune to theme width/margin overrides
                        width: auto !important;
                    }
                    &.alignright {
                        clear: none !important;
                        float: right !important;
                        width: auto;
                    }
                }
            }
        }
    }
    
}

// Disable filling of SVGs in the toolbar (for Tabler icons)
.block-editor-block-toolbar .components-button svg {
	&.no-fill {
		fill: none;
	}
}