import { createComponentTheme, vars } from '../../css';
import { alertContract } from './alert.contract';

export const alertTheme = createComponentTheme(alertContract, {
  colors: {
    'info-text-strong': vars.colors['neutral-text-strong'],
    info: vars.colors['neutral'],
    'error-text-strong': vars.colors['red500'],
    error: vars.colors['red200'],
  },
  fontSizes: {
    base: vars.fontSizes['body1'],
    button: vars.fontSizes['xs'],
  },
  fontWeights: {
    base: vars.fontWeights['normal'],
  },
  space: {
    'padding-x': vars.space[5],
    'padding-y': vars.space[3],
    gap: vars.space[3],
  },
});