Динамический стиль в CSS Modules

Подскажите, как динамически менять стиль через пропсы в CSS Modules

Компонент

import { FC } from "react";
import styles from "./Button.module.css";

export const Button: FC = (props) => {
  const { tag = "Начать", theme = "primary" } = props;

  return <button className={`${styles.button} ${styles[theme]}`}>{tag}</button>;
};

Стиль

.button {
  padding: 12px 16px;
  border-radius: 4px;
  font-family: SB Sans Interface;
  font-size: 14px;
  font-weight: 400;
  line-height: 20px;
  outline: none;
  cursor: pointer;
}
.button-primary {
  background-color: #5558fa;
  color: #ffffff;
  border: 0;
}

.button-outline {
  background-color: transparent;
  color: #5558fa;
  border: 1.5px solid #5558fa;
}