/* Base styles for menu icons with pseudo-elements */
.menu-icon::after {
  display: inline-block;
  width: 18px;
  height: 18px;
  margin-bottom: 2px;
  content: "";
  background-color: currentColor;
  mask-size: contain;
  mask-repeat: no-repeat;
  mask-position: center;
}

/* Flex container for icons with inline text */
.menu-icon {
  display: inline-flex;
  align-items: center;
  gap: 5px;
}

/* External link icon variant */
.menu-icon.external-link::after {
  mask-image: url("../assets/icons/external-link.svg");
}
