/**
 * Custom Atomics for Elementor -- frontend and editor-canvas styles.
 *
 * Box model and sizing for the button and the icon come from the widget's
 * atomic base styles, so they stay editable from the Style tab. This file only
 * carries what the atomic style schema cannot express: the ordering flip for a
 * trailing icon, and normalising the two kinds of icon content.
 *
 * Colour: font glyphs inherit the CSS `color` property, and uploaded SVGs are
 * inlined by Elementor with `fill="currentColor"`, so both follow `color` --
 * inherited from the button label unless the widget sets `color` inline for a
 * custom icon colour.
 *
 * @package Deknows\Atomic_Elements
 */

.dkae-icon {
	/* Never let a long label squeeze the icon. */
	flex: 0 0 auto;
	line-height: 1;
}

.dkae-icon--after {
	/* The label is order 0, so this moves the icon past it without changing
	   the source order. */
	order: 1;
}

/* The icon box is sized in em, so a font glyph scales with the box. */
.dkae-icon > i {
	font-size: inherit;
	line-height: 1;
}

/* Uploaded SVGs are inlined with width/height 100%, filling the icon box. */
.dkae-icon > svg {
	display: block;
}
