import styled, { css } from 'styled-components';
import { selectors } from '@defencedigital/design-tokens';
var spacing = selectors.spacing,
  color = selectors.color;
export var StyledSwitchOption = styled.label.withConfig({
  displayName: "StyledSwitchOption",
  componentId: "sc-3vd65u-0"
})(["display:inline-flex;align-items:center;justify-content:center;padding:0 ", ";border:1px solid ", ";color:", ";font-size:inherit;font-weight:600;user-select:none;cursor:pointer;z-index:0;&:nth-child(n + 2){margin-left:-1px;}&:first-of-type{border-top-left-radius:15px;border-bottom-left-radius:15px;}&:last-of-type{border-top-right-radius:15px;border-bottom-right-radius:15px;}", " ", " ", " ", ""], spacing('6'), color('neutral', '200'), color('neutral', '400'), function (_ref) {
  var $isDisabled = _ref.$isDisabled;
  return $isDisabled && css(["border-color:transparent;cursor:not-allowed;&:hover{background-color:initial;}"]);
}, function (_ref2) {
  var $isActive = _ref2.$isActive;
  return $isActive && css(["background-color:", ";color:", ";border-color:", ";cursor:default;outline:none;&:focus-within,&:active{z-index:1;outline:none;border-color:", ";box-shadow:0 0 0 2px ", ",0 0 0 5px ", ";}"], color('action', '600'), color('neutral', 'white'), color('action', '600'), color('action', '500'), color('action', '500'), color('action', '100'));
}, function (_ref3) {
  var $isDisabled = _ref3.$isDisabled,
    $isActive = _ref3.$isActive;
  return !$isDisabled && !$isActive && css(["&:hover{background-color:", ";color:", ";border-color:", ";}&:focus-within,&:active{z-index:1;outline:none;border-color:", ";box-shadow:0 0 0 2px ", ",0 0 0 5px ", ";}"], color('neutral', '100'), color('neutral', '400'), color('neutral', '200'), color('action', '500'), color('action', '500'), color('action', '100'));
}, function (_ref4) {
  var $isDisabled = _ref4.$isDisabled,
    $isActive = _ref4.$isActive;
  return $isDisabled && $isActive && css(["background-color:", ";border-color:", ";color:", ";cursor:not-allowed;&&&{&:hover,&:focus-within,&:active{background-color:", ";border-color:transparent;box-shadow:none;}}"], color('neutral', '100'), color('neutral', '100'), color('neutral', '400'), color('neutral', '100'));
});