سلام.
من یه وب اپلیکیشن دارم که می خوام رنگ border یه dropdown اش رو تغییر بدم.
مشکل اینه که دراپ داون بوت استرپیه، یعنی اینجوریه:
<select class="form-control m-bootstrap-select ItemValue">
</select>

وقتی Dom صفحه رو نگاه می کنم میبینم ساختاری که توی مرور گر نشون میده تشکیل شده از یه دیو و یه باتن که در واقع استایل اصلی رو اون button گرفته. اینجوری:

<button type="button" class="btn dropdown-toggle bs-placeholder btn-light" data-toggle="dropdown" role="button" data-id="DegreeTypeID__1" title="نوع مدرک"><div class="filter-option"><div class="filter-option-inner">نوع مدرک</div></div>&nbsp;<span class="bs-caret"><span class="caret"></span></span></button>

وقتی من میام بالای صفحه به کلاس مربوط به اون باتن border میدم درست میشه ولی همه ی دراپ داونای صفحه رو تحت تاثیر قرار میده. اینجوری:
.bootstrap-select > .dropdown-toggle.btn-light , .bootstrap-select > .dropdown-toggle.btn-secondary
{
border-color:#ff6666 !important;
}
چیکار کنم که فقط همون یدونه select تغییر کنه؟