/* Tier 1 language-reduction: inline SVG icon system.
   Icons live in the #mc-icon-sprite <symbol> defs in index.html and are
   referenced with <svg class="icon"><use href="#icon-..."/></svg>.
   Stroke uses currentColor so icons inherit each button's text color and
   stay themeable via the existing design tokens. */

.icon {
	width: 1.4em;
	height: 1.4em;
	vertical-align: -0.2em;
	flex: none;
	pointer-events: none; /* clicks fall through to the button */
}

/* Icon-only buttons: center the glyph and keep a square-ish tap target.
   Applied via .icon-btn so we don't disturb buttons that still hold text. */
.icon-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.4em;
}

/* Icon-only buttons were text-sized (width:auto); without a label they would
   collapse to a sliver. Make them a uniform square control-height box: floor
   the width and drop the horizontal padding so the glyph centers in a square.
   width:auto (from the base rule) is kept, so a button that DOES carry a label
   still grows past the square instead of clipping. */
.menu-button.icon-btn,
.pass-button.icon-btn,
.cancel-button.icon-btn,
#copy-link.icon-btn {
	min-width: var(--control-height, 44px);
	padding-left: 0;
	padding-right: 0;
}

/* The hidden sprite must never take layout space. */
#mc-icon-sprite {
	position: absolute;
	width: 0;
	height: 0;
	overflow: hidden;
}

/* Contains AI-generated edits. */