/*
MD Icon General Styling
This section styles the icons that use the 'md-icon' class, ensuring they are displayed inline,
centered, and have consistent dimensions and color.
*/
md-icon {
	margin: auto;
	/* Centers the icon horizontally and vertically */
	background-repeat: no-repeat no-repeat;
	/* Prevents background from repeating */
	display: inline-block;
	/* Ensures the icon is displayed inline with other elements */
	vertical-align: middle;
	/* Vertically aligns the icon in the middle */
	fill: currentColor;
	/* Fills the icon with the current text color */
	min-height: 10px;
	/* Sets a minimum height for the icon */
	min-width: 10px;
	/* Sets a minimum width for the icon */
}

/*
Material Icons with Gray Tag Styling
This section applies specific styling to material icons with the 'bn-tag-gray' class,
setting a gray color to these icons.
*/

md-icon.material-symbols-outlined.bn-tag-gray {
	color: #2f2b3d6b;
	/* Applies a gray color with transparency to material icons */
}

[data-theme="dark"] md-icon.material-symbols-outlined.bn-tag-gray {
	color: var(--dark-text);
	/* Applies a gray color with transparency to material icons */
}