import t, { css as o } from "styled-components";
import { getFontSize as e, convertToTransientProps as s, getColorAlias as n } from "../../../../utils/index.js";
import { ListItemSecondaryText as l } from "../ListItemContent/styles.js";
const i = o`
  display: flex;
  flex-direction: row;
  justify-content: flex-end;
`, m = t(l).withConfig({
  shouldForwardProp: s([
    "variant"
  ])
})`
  ${i}
  align-self: ${({ variant: r }) => r === "multi-line" ? "flex-start" : "center"};
  ${e("size14")};
`, d = t.div`
  ${i}
  align-self: center;

  & > svg {
    ${e("size24")};
    fill: ${n("interactivePrimary")};
  }
`;
export {
  m as ListItemMetaText,
  d as ListItemSuffixWrapper
};
