import styled, { css } from 'styled-components';
import { defaultThemeProp } from '@pega/cosmos-react-core';

// Commonly used theme tokens — explore more under theme.base.* or theme.components.*
// const spacing        = theme.base.spacing;
// const borderRadius   = theme.base['border-radius'];
// const brand          = theme.base.palette['brand-primary'];
// const brandBg        = theme.base.palette['brand-background'];
// const appBackground  = theme.base.palette['app-background'];
// const panelBg        = theme.base.palette['primary-background'];
// const secondaryBg    = theme.base.palette['secondary-background'];
// const interactive    = theme.base.palette.interactive;
// const border         = theme.base.palette['border-line'];
// const urgent         = theme.base.palette.urgent;
// const success        = theme.base.palette.success;

const StyledPegaDxilMyCaseviewWrapper = styled.div(({ theme }) => {
  const foregroundColor = theme.base.palette['foreground-color'];

  return css`
    color: ${foregroundColor};
  `;
});

StyledPegaDxilMyCaseviewWrapper.defaultProps = defaultThemeProp;

export default StyledPegaDxilMyCaseviewWrapper;