/* Target Semantic UI dropdowns when they are focused or active */
.ui.dropdown:focus,
.ui.dropdown.active,
.ui.dropdown.visible {
  border-color: #bf3d53 !important; /* Changed to #bf3d53 */
  box-shadow: 0 0 0 1px #bf3d53 !important; /* Changed to #bf3d53 */
}

/* Sometimes the input inside the dropdown gets the focus style */
.ui.dropdown .menu .item:hover,
.ui.dropdown .menu .selected.item,
.ui.search.dropdown.active > input.search,
.ui.search.dropdown.visible > input.search,
.ui.search.selection.dropdown.active > input.search, /* for search selection dropdown */
.ui.search.selection.dropdown.visible > input.search { /* for search selection dropdown */
  border-color: #bf3d53 !important; /* Changed to #bf3d53 */
  box-shadow: 0 0 0 1px #bf3d53 !important; /* Changed to #bf3d53 */
}

/* If the Semantic UI dropdown uses an outline for focus */
.ui.dropdown:focus {
  outline-color: #bf3d53 !important; /* Changed to #bf3d53 */
  outline-style: solid !important;
  outline-width: 1px !important;
}

/* You might also need to target the specific input inside a search dropdown if it gets the focus */
.ui.search.dropdown > input.search:focus {
  border-color: #bf3d53 !important; /* Changed to #bf3d53 */
}

/* General input focus style - assuming this is desired for consistency */
/* If you have a specific class or CSS-in-JS for the red input focus, that should be used/matched */
input:focus,
textarea:focus,
select:focus {
  border-color: #bf3d53 !important; /* Changed to #bf3d53 */
  outline-color: #bf3d53 !important; /* Changed to #bf3d53 */
  /* Add box-shadow if you want a glow effect, matching the dropdowns */
  box-shadow: 0 0 0 1px #bf3d53 !important; /* Changed to #bf3d53 */
}