Material-UIにおいてmakeStylesが効かない

Question

前提・実現したいこと

Material-UIのパーツのcss上書きを実施するためmakeStylesを入れたが効かない

発生している問題・エラーメッセージ

styleの上書きが行えない

該当のソースコード

import React from "react";
import Button from '@mui/material/Button';
import { makeStyles } from "@mui/styles";

const useStyles = makeStyles({
    button: {
        borderColor: "#ffb549",
        color: '#ffb549',
        fontWeight: 600,
        marginBottom: '8px',
        "&:hover": {
            backgroundColor: '#ffb549',
            borderColor: "#ffb549",
            color: '#fff'
        }
    }
})

const Answer = (props) => {
    const classes = useStyles();

    return (
        <Button
            variant="outlined" className={classes.button}
            onClick={() => props.select(props.content, props.nextId)}>
            {props.content}
        </Button>
    );
}

export default Answer;

試したこと

variantとclassNameの順番入れ替え、useStylesの書き方を確認など

補足情報（FW/ツールのバージョンなど）

添付画像のようにmakeStyleで定義したもの（.makeStyles-button-6がMaterial-UIのパーツ（css-1rwt...）で上書きされている。
順番を入れ替えるためにはどうすれば良いか（公式サイトなどを見ても特に書き方自体に差異はない）

Comments

[senryTY]

importが@muiなので気になりました。
お使いのMuterial-uiはv4でよろしかったでしょうか？
最新バージョンのMUI v5(Muterial-ui)ではmakeStyleは廃止(非推薦)されているようです。

[vnsa7221]

senryTYさん
こちらバージョン確認を行ったところ、v5が入っておりました・・・。
makeStyleではなくStyledの方で書く必要がありました・・・。

Answer 1

バージョン確認を行ったところv5が入っていることを確認。
makeStyleはv5だと非推奨となっているため、Styledを使用する形に変更