Bootstrap 5 單選按鈕更改 NET Core 中的背景顏色

Question

自從遷移到 Bootstrap 5 后，我不再能夠通過 CSS 修改來更改背景顏色。

任何人有任何想法來解決這個問題？

Razor 代碼示例：

<div class="mb-3" style="margin-top: 1.5em">
<div class="d-flex flex-row">
    <div>
        Conditional Logic:
    </div>
    <div class="custom-control custom-radio form-check form-check-inline ms-2">
        <input checked class="custom-control-input form-check-input" type="radio" name="RadioBtn1" id="customRadio1" value="OR">
        <label class="custom-control-label form-check-label" for="customRadio1">OR</label>
    </div>
    <div class="custom-control custom-radio form-check form-check-inline">
        <input class="custom-control-input form-check-input" type="radio" name="RadioBtn2" id="customRadio2" value="AND">
        <label class="custom-control-label form-check-label" for="customRadio2">AND</label>
    </div>
</div>

CSS 不再工作：

/* Custom Radio Button color before checked */
.custom-control-label::before {
    background-color: #6C757D;
}

我想要的結果是將白色背景更改為更接近主題的背景顏色：

Answer 1

看起來 CSS 有點錯誤，下面這似乎工作正常：

.custom-control-input {
    background-color: #6C757D;
}

更新的 Razor/HMTL：

<div class="mb-3" style="margin-top: 1.5em">
<div class="d-flex flex-row">
    <div>
        Conditional Logic:
    </div>
    <div class="form-check form-check-inline ms-2">
        <input checked class="custom-control-input form-check-input" type="radio" name="RadioBtn1" id="customRadio1" value="OR">
        <label class="form-check-label" for="customRadio1">OR</label>
    </div>
    <div class="form-check form-check-inline">
        <input class="custom-control-input form-check-input" type="radio" name="RadioBtn1" id="customRadio2" value="AND">
        <label class="form-check-label" for="customRadio1">AND</label>
    </div>
</div>