import styled from "styled-components";
export const Container = styled.div ``;
export const Headers = styled.div `
  display: flex;
  align-items: center;
  transition: background-color 0.15s linear;
  padding: ${({ theme }) => theme.new?.table?.headersPadding ?? "unset"};
  margin: ${({ theme }) => theme.new?.table?.headersMargin ?? "unset"};
  background: ${({ theme }) => theme.new?.table?.headersBackground ?? "unset"};
  border-bottom: ${({ theme }) => theme.new?.table?.headersBorderBottom ?? "unset"};
`;
export const Header = styled.div `
  width: ${({ width }) => width ?? "unset"};
`;
export const Row = styled.div `
  display: flex;
  align-items: center;
  padding: ${({ theme }) => theme.new?.table?.rowPadding ?? "unset"};
  height: ${({ height }) => height ?? "unset"};
  border-bottom: ${({ theme }) => theme.new?.table?.rowBorderBottom ?? "unset"};
  background: ${({ theme }) => theme.new?.table?.rowBackground ?? "unset"};

  &:hover {
    background: ${({ theme }) => theme.new?.table?.rowBackgroundHover ?? "unset"};
  }
`;
export const Cell = styled.div `
  display: flex;
  width: ${({ width }) => width ?? "unset"};
`;
//# sourceMappingURL=table.styled.js.map