import styled, { css } from 'styled-components';
import { selectors } from '@defencedigital/design-tokens';
import { StyledIconWrapper } from './StyledIconWrapper';
var color = selectors.color;
export var StyledInlineButton = styled.button.withConfig({
  displayName: "StyledInlineButton",
  componentId: "sc-ocpq2l-0"
})(["position:relative;display:flex;justify-content:center;align-items:center;text-align:center;padding:0;cursor:pointer;background:transparent;outline:none;color:", ";border:none;height:100%;&:disabled{color:", ";cursor:not-allowed;}&:focus{outline:none;}&:enabled:focus,&:enabled:hover{", "{background-color:", ";}}", " &:enabled:active{", "{background-color:", ";}}"], color('action', '700'), color('neutral', '300'), StyledIconWrapper, color('action', '000'), function (_ref) {
  var $hasHover = _ref.$hasHover;
  return $hasHover && css(["", "{background-color:", ";}"], StyledIconWrapper, color('action', '000'));
}, StyledIconWrapper, color('action', '100'));