import styled, { css } from 'styled-components';
import { selectors } from '@defencedigital/design-tokens';
import { IconArrowDropDown } from '@defencedigital/icon-library';
var color = selectors.color;
export var StyledIconArrowDropDown = styled(IconArrowDropDown).withConfig({
  displayName: "StyledIconArrowDropDown",
  componentId: "sc-uaiz65-0"
})(["position:relative;width:26px;height:26px;left:-4px;color:", ";transition:transform 300ms cubic-bezier(0.4,0,0.2,1) 0ms;transform:", ";"], function (_ref) {
  var $isOpen = _ref.$isOpen;
  return $isOpen ? color('action', '600') : color('neutral', '200');
}, function (_ref2) {
  var $isOpen = _ref2.$isOpen;
  return $isOpen ? css(["translateY(-2px) rotate(180deg)"]) : '';
});