Запретить классу наведения таблицы Bootstrap изменять цвет фона ячеек в таблице ⇐ CSS

[Anonymous]

Я работаю над проектом Django, в котором у меня есть таблица, отображающая задачи, и мне нужно настроить цвет фона ячеек приоритета в зависимости от их статуса (высокий, средний, низкий). Для стилизации я использую Bootstrap, который включает в себя класс наведения таблицы. Однако при наведении указателя мыши на строку цвет фона приоритетных ячеек меняется на цвет таблицы при наведении по умолчанию вместо сохранения заданного мной пользовательского цвета.
Вот соответствующий цвет. HTML:



Priority





{{ task.get_priority_display }}





А вот CSS, который я использую:
.table .high-priority {
background-color: hsl(5, 39%, 30%) !important;
}

.table .medium-priority {
background-color: hsl(27, 64%, 40%) !important;
}

.table .low-priority {
background-color: hsl(146, 34%, 25%) !important;
}

.table .task-row:hover .high-priority,
.table .task-row:hover .medium-priority,
.table .task-row:hover .low-priority {
background-color: inherit !important;
}

Проблема:
Несмотря на эти стили, цвет фона приоритетных ячеек по-прежнему меняется при наведении курсора на строку. Я хочу, чтобы приоритетные ячейки сохраняли назначенные им цвета даже при наведении курсора на строку.
Вопрос:
Как я могу предотвратить изменение цвета фона приоритетные ячейки не меняются при наведении курсора на строку, при этом я все еще использую класс наведения таблицы Bootstrap?
Скриншот, показывающий проблему при наведении курсора на таблицу.
Что я пробовал:
• Using !important on my background colors.
• Setting background-color: inherit for the hover state of the priority cells.


Подробнее здесь: https://stackoverflow.com/questions/789 ... cells-in-a