import { styled } from 'styleh-components';
import { media, fontValue } from '@skava/styleh-toolset';
const TopBarWrapper = styled.div.attrs({
    className: 'top-bar',
}) `
  max-height: 2.75rem;
  height: 2.75rem;
  padding: var(--spacing-small) var(--spacing-medium);
  z-index: 20;
  position: relative;

  color: var(--color-light-grey);
  background-color: var(--color-black);

  &::before {
    height: 20rem;
    background-color: var(--color-black);
    position: absolute;
    content: '';
    display: block;
    width: 100%;
    right: 0;
    bottom: 100%;
    left: 0;
  }

  ${media.tabletOrSmaller `
    display: none;
  `}
`;
const TopBarBox = styled.div `
  max-width: 75rem;
  margin: 0 auto;
  display: flex;
  padding-top: var(--spacing-extra-small);
  padding-bottom: var(--spacing-extra-small);
  font: ${fontValue(12, 'regular')};
  justify-content: space-between;
  position: relative;
`;
export { TopBarWrapper, TopBarBox };
//# sourceMappingURL=styled.js.map