Comment changer la couleur de la bordure inférieure d'un v-overflow de Vuetify-BTN?

Question

Je suis en train de construire un site Web dans NUXT.JS en utilisant Vuetify. J'ai créé un menu basé sur un v-overflow-btn, un v-text-field et une v-btn. Voici ce que mon menu ressemble réellement.

Parce que je suis un peu maniaque, je voudrais changer la couleur de la bordure inférieure de mon v-overflow-btn Pour faire correspondre toutes les différentes diviseurs Color Bar de mon menu. Par défaut, la couleur est noire.

J'ai déjà essayé de définir mon propre CSS dans la section de style ci-dessous:

<style>
  v-overflow-btn {
    border-color:grey !important;
  }
</style>

Mais rien ne change ...

Est-ce que quelqu'un pourrait me protéger pour changer cette couleur frontière? Merci d'avance :)

Answer 1

Essaye ça

<style>
  .v-overflow-btn .v-input__slot::before {
    border-color: grey !important;
  }
</style>

Answer 2

Je devais ajouter le sélecteur profond au cas où quelqu'un d'autre ait cette question.

.nbb >>> .v-input__slot:before  {
  border-color: white !important;
}