import styled, { css } from 'styled-components';
import { selectors } from '@defencedigital/design-tokens';
var spacing = selectors.spacing,
  color = selectors.color;
export var StyledNavItem = styled.div.withConfig({
  displayName: "StyledNavItem",
  componentId: "sc-p01r57-0"
})(["display:flex;align-items:center;margin:", " 0;border-radius:2px;> *:first-child{display:flex;align-items:center;width:100%;}", " &:hover{background-color:", ";> *{text-decoration:none;}}"], spacing('4'), function (_ref) {
  var isActive = _ref.isActive;
  return isActive && css(["background-color:", ";&:hover{background-color:", ";}"], color('action', '500'), color('action', '500'));
}, color('neutral', '400'));