/**handles:geshmak-icon-button**/
/** בס״ד
 * GESHMAK ICON BUTTON — STRUCTURAL CSS
 *
 * Structural-only rules for the child parts of the Geshmak Icon Button widget
 * (icon / separator / text). Root-level layout (flex, gap, padding, focus ring,
 * hover) lives in the widget's Atomic base styles and is overridable via the
 * Style tab; these child rules keep the inline SVGs from distorting and are not
 * exposed as panel controls. Visual styling is expected to come from a stacked
 * Atomic class such as .btn-primary.
 *
 * DEVELOPED BY TOM GOLDSTEIN > GESHMAK! > https://geshmak.com.au/
 */

/* The icon and separator wrappers must not shrink or add stray line-box height,
   so the SVGs stay square and vertically centred alongside the text. */
.geshmak-icon-button__icon,
.geshmak-icon-button__sep {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex: 0 0 auto;
	line-height: 0;
	width: 1em;
	height: 1em;
}

/* Svg_Src_Prop_Type inlines width/height:100% on the <svg>; sizing the wrapper
   (1em by default) makes the icon scale with the button's font-size. */
.geshmak-icon-button__icon svg,
.geshmak-icon-button__sep svg {
	display: block;
	width: 100%;
	height: 100%;
}

/* The text is the only part allowed to flex/wrap. */
.geshmak-icon-button__text {
	flex: 0 1 auto;
	line-height: 1.2;
}