#remcat, #bulk-edit-remcat {
  display: none;
  margin: 0;
  padding: 0;
  color: white !important;
}

#bulk-edit #remcat,
#bulk-edit #bulk-edit-remcat {
  display: block;
  width: 100%;
  margin: 10px 0;
}

.remcat-button {
  display: block;
  max-width: 100% !important;
  text-align: center;
  background-color: transparent; /* initial state */
  color: white !important;
  border: 2px solid #dc3545; /* red border */
  border-radius: 10px;
  cursor: pointer;
  font-size: 14px;
  line-height: 1.5 !important;
  padding: 8px;
}

/* Hover state: semi-red background (RGBA 0.1) */
.remcat-button:hover {
  background-color: rgba(220, 53, 69, 0.1);
}

/* When checked (.red is applied), use the same semi-red background */
#remcat.red .remcat-button,
#bulk-edit-remcat.red .remcat-button {
  background-color: rgba(220, 53, 69, 0.1);
}

/* The checkbox inside the button */
.remcat-button input[type="checkbox"] {
  margin-right: 10px;
  vertical-align: middle;
  transform: scale(1.1);
}

/* Category checklists keep their red outline */
ul.cat-checklist.red {
  border: 1px solid #dc3545 !important;
  background-color: rgba(220, 53, 69, 0.1) !important;
}