import styled from 'styled-components';
import { selectors } from '@defencedigital/design-tokens';
import { getTransitionOpacity } from '../../../../styled-components';
var spacing = selectors.spacing,
  color = selectors.color,
  fontSize = selectors.fontSize;
export var StyledUserText = styled.div.withConfig({
  displayName: "StyledUserText",
  componentId: "sc-1nz24f5-0"
})(["display:flex;align-items:center;justify-content:space-between;width:calc(100% - 1rem);padding:0 0 0 ", ";white-space:nowrap;opacity:", ";transition:opacity 150ms linear;> div{display:inline-flex;justify-content:center;flex-direction:column;a:hover{text-decoration:none;}> span{color:", ";font-size:", ";}a span{margin-top:", ";color:", ";font-size:", ";}}svg{width:1.65rem;height:1.65rem;color:", ";background-color:", ";border-radius:2px;padding:", ";}"], spacing('6'), function (_ref) {
  var $transitionStatus = _ref.$transitionStatus;
  return getTransitionOpacity($transitionStatus);
}, color('neutral', 'white'), fontSize('m'), spacing('1'), color('neutral', '300'), fontSize('s'), color('neutral', 'white'), color('neutral', '400'), spacing('2'));