import styled from 'styled-components';

export const SummaryExtractionStyled = styled.div<{
  editStatus?: boolean;
  focus?: boolean;
  error?: boolean;
}>`
  background-color: ${(props) =>
    props.editStatus ? 'var(--Fill_Background_Light)' : 'var(--Fill_Tertiary)'};
  cursor: pointer;
  border-radius: 8px;
  /* border: 0.5px solid transparent; */
  /* border: ${(props) => {
    if (!props.editStatus) return '0.5px solid var(--Fill_Brand_Tertiary)';
    if (props.focus) {
      return '0.5px solid var(--Line_Heavy)';
    }
    return props.error
      ? '0.5px solid var(--Text_Danger)'
      : '0.5px solid var(--Line_Light)';
  }}; */
  &:hover {
    background-color: var(--Fill_Brand_Tertiary);
  }
`;
