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

var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5;
var centerCss = css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  display: flex;\n  align-items: center;\n"])));
var SideMenuWrapper = styled.div(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  width: ", ";\n  height: 100vh;\n  position: fixed;\n  top: 0px;\n  left: 0px;\n  display: flex;\n  flex-direction: column;\n  z-index: 1300;\n  justify-content: space-between;\n  background: ", ";\n"])), function (_ref) {
  var width = _ref.width;
  return width;
}, function (_ref2) {
  var theme = _ref2.theme;
  return theme.colourMaterialPrimary;
});
var SideMenuHeaderWrapper = styled.a(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n  min-height: 80px;\n  background: ", ";\n  ", "\n\n  justify-content: center;\n  border-bottom: 1px solid ", ";\n"])), function (_ref3) {
  var theme = _ref3.theme;
  return theme.colourMaterialPrimary;
}, centerCss, function (_ref4) {
  var theme = _ref4.theme;
  return theme.colourMaterialBorder;
});
var SideMenuBodyWrapper = styled.div(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n  height: 75vh;\n  overflow: auto;\n  background: ", ";\n  ", "\n  justify-content: space-between;\n  flex-direction: column;\n  row-gap: 10px;\n  padding-top: 20px;\n  padding-bottom: 20px;\n  -ms-overflow-style: none;\n  scrollbar-width: none;\n\n  ::-webkit-scrollbar {\n    display: none;\n  }\n"])), function (_ref5) {
  var theme = _ref5.theme;
  return theme.colourMaterialPrimary;
}, centerCss);
var SideMenuFooterWrapper = styled.div(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n  background: ", ";\n  ", "\n  justify-content: end;\n  flex-direction: column;\n  row-gap: 10px;\n  padding: 15px;\n  border-top: 1px solid ", ";\n  svg {\n    :hover {\n      cursor: pointer;\n    }\n  }\n\n  div {\n    :hover {\n      cursor: pointer;\n    }\n  }\n"])), function (_ref6) {
  var theme = _ref6.theme;
  return theme.colourMaterialPrimary;
}, centerCss, function (_ref7) {
  var theme = _ref7.theme;
  return theme.colourMaterialBorder;
});

export { SideMenuBodyWrapper, SideMenuFooterWrapper, SideMenuHeaderWrapper, SideMenuWrapper };
//# sourceMappingURL=style.js.map
