import { taggedTemplateLiteral as _taggedTemplateLiteral } from '../../../_virtual/_rollupPluginBabelHelpers.js';
import styled, { css } from 'styled-components';

var _templateObject, _templateObject2;
var sizeCss = css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  width: 15px;\n  height: 15px;\n"])));
var ColorPickerWrapper = styled.div(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\nwidth: 218px;\nbackground: ", ";\nborder-radius:  8px ;\nbox-shadow: 0px -3px 20px ", ";\n>div:nth-child(2) {\n    width: auto !important;\n    padding: 14px 24px;\n    gap: 14px;\n    >div:first-child {\n        height: 170px !important;\n        border-radius : 4px;\n        >div{\n            ", "\n            cursor: pointer;\n        }\n    }\n    >div:last-child {\n        padding: 0px;\n        >div:first-child {\n            height: 5px;\n            margin-top: 14px \n            border: 1px solid ", ";\n            >div{\n                ", "\n            }\n        }\n        >div:last-child {\n            display: none;\n        }\n    }\n}\n>div:last-child {\n    >div {\n    padding: 0px 24px 14px 24px;\n    }\n}\n\n.rcp-hue-cursor{\n    transform: translate(-10px,-6px);\n    background: ", " !important;\n    border: 1px solid ", ";\n}\n\n"])), function (_ref) {
  var theme = _ref.theme;
  return theme.colourMaterialPrimary;
}, function (_ref2) {
  var theme = _ref2.theme;
  return theme.colorBoxShadow;
}, sizeCss, function (_ref3) {
  var theme = _ref3.theme;
  return theme.colourMaterialBorder;
}, sizeCss, function (_ref4) {
  var theme = _ref4.theme;
  return theme.colourMaterialPrimary;
}, function (_ref5) {
  var theme = _ref5.theme;
  return theme.colourMaterialBorder;
});

export { ColorPickerWrapper };
//# sourceMappingURL=style.js.map
