/* Text User Input
–––––––––––––––––––––––––––––––––––––––––––––––––– */

.text_input {
  min-width: 216px;
  max-width: fit-content;
  border-radius: 4px;
  appearance: none;
  border: .5px solid;
  height: 34px;
  background: none;
  color: white;
  padding: 2.5px;
  padding-left: 5px;
  text-overflow: ellipsis;
}
  
.text_input_large {
  min-width: 375px;
  max-width: fit-content;
  border-radius: 4px;
  appearance: none;
  border: .5px solid;
  height: 34px;
  background: none;
  color: white;
  padding: 2.5px;
  padding-left: 5px;
  text-overflow: ellipsis;  
}

/* must set add_text_input label=none AND add an html.b() classname='html_b_input_field_subtle' */
.text_input_non_editable {
  min-width: 216px;
  max-width: fit-content;
  border-radius: 4px;
  appearance: none;
  border: none;
  height: 34px;
  background: none;
  color: #CCCDCC;
  padding: 2.5px;
  padding-left: 5px;
  text-overflow: ellipsis;
}

.text_input_non_editable:focus {
  border: none !important;
}

.html_b_input_field_subtle {
  color: #CCCDCC;
}