openaire-assets/library-css/input.scss

.uk-form-label {
  font-size: 16px;
  font-family: "Roboto", sans-serif;
  color: currentColor;
}

.uk-form-hint {
  font-family: "Roboto", sans-serif;
  color: currentColor;
  font-size: 14px;
}

.input-box .uk-input,
.input-box .uk-textarea,
.input-borderless .uk-input,
.input-borderless .uk-textarea {
  height: auto;
  padding: 0;
  background-color: transparent !important;
  color: currentColor;
  font-size: 14px;
  line-height: 31px;
}

.input-box .uk-input:not(.uk-form-danger),
.input-box .uk-textarea:not(.uk-form-danger),
.input-borderless .uk-input:not(.uk-form-danger),
.input-borderless .uk-textarea:not(.uk-form-danger){
  border: none !important;
}

.input-box .uk-input::placeholder,
.input-box .uk-textarea::placeholder,
.input-box::placeholder,
.placeholder {
  color: #7A7A7A !important;
  font-size: 14px;
}

.input-box .mat-chip-list-wrapper,
.input-borderless .mat-chip-list-wrapper {
  max-height: 150px;
  overflow-y: auto;
  overflow-x: hidden;
}

.input-box *:focus,
.input-borderless *:focus {
  outline: none;
}

  /* Input Box */
.input-box {
  background-color: #FAFAFA !important;
  border: 1px solid transparent;
  padding: 12px 16px;
  border-radius: 4px;
  color: currentColor;
  height: auto;
  line-height: 17px;
  transition-property: height;
  transition-duration: 0.5s;
}

.input-box .uk-textarea {
  padding-right: 16px;
}

.input-box .uk-input:focus,
.input-box .uk-textarea:focus,
.input-box:focus{
  color: currentColor !important;
}

.input-box:not(.uk-form-danger){
  border: 1px solid #D1D1D1 !important;
}

.input-box .mat-select {
  font-family: "Open Sans", sans-serif;
  font-size: 16px;
}

.input-box .mat-select.mat-select-invalid .mat-select-arrow {
  color: #1A1A1A !important;
}

.input-box .mat-select-value {
  color: currentColor;
}

.input-box .mat-form-field-infix {
  border: none !important;
  line-height: 30px;
  padding: 0 !important;
}

.input-box .mat-form-field-appearance-legacy .mat-form-field-wrapper {
  padding: 0 !important;
}

.input-box .mat-form-field-appearance-legacy .mat-form-field-underline {
  display: none;
}

.input-box .mat-form-field-appearance-legacy .mat-form-field-subscript-wrapper {
  display: none;
}

.input-box .uk-input:disabled,
.input-box .uk-textarea:disabled,
.input-box .mat-select-disabled .mat-select-value,
.input-box .mat-form-field .mat-select.mat-select-disabled .mat-select-arrow {
  color: currentColor !important;
}

.input-box .mat-chip.mat-standard-chip, .mat-chip.mat-standard-chip:hover {
  color: var(--text-color);
  border: 1px solid rgba(var(--text-color-rgb), 0.2);
  background: white;
}

.input-box .mat-chip.mat-standard-chip::after {
  background: transparent;
}

.input-box .mat-chip.mat-standard-chip .mat-chip-remove {
  color: rgba(var(--text-color-rgb), 0.5);
  width: 20px;
  height: 20px;
}

.input-box .tools {
  max-height: 0;
  transition: max-height 0.3s linear;
  overflow: hidden;
  padding-right: 16px;
}

.input-box .tools.focused {
  max-height: 100px;
}

/* Input borderless*/
.input-borderless {
  background-color: transparent !important;
  border: none;
  padding: 5px;
  color: currentColor;
  height: auto;
  line-height: 17px;
}

.input-borderless .uk-input:focus,
.input-borderless .uk-textarea:focus,
.input-borderless:focus{
  color: currentColor !important;
}

.input-borderless .uk-input:not(.uk-form-danger),
.input-borderless .uk-textarea:not(.uk-form-danger),
.input-borderless:not(.uk-form-danger){
  border: none !important;
}

.input-box .placeholder,
.input-borderless .placeholder {
  position: absolute;
  top: 6px;
  left: 6px;
  cursor: text;
}

.input-borderless .mat-select {
  font-family: "Open Sans", sans-serif;
  font-size: 16px;
}

.input-borderless .mat-select-value {
  color: currentColor;
}

.input-borderless .mat-form-field-infix {
  border: none !important;
  line-height: 30px;
  padding: 0 !important;
}

.input-borderless .mat-form-field-appearance-legacy .mat-form-field-wrapper {
  padding: 0 !important;
}

.input-borderless .mat-form-field-appearance-legacy .mat-form-field-underline {
  display: none;
}

.input-box .mat-form-field-appearance-legacy .mat-form-field-subscript-wrapper {
  display: none;
}

.input-borderless .uk-input:disabled,
.input-borderless .uk-textarea:disabled,
.input-borderless .mat-select-disabled .mat-select-value,
.input-borderless .mat-form-field .mat-select.mat-select-disabled .mat-select-arrow {
  color: currentColor !important;
}

.input-borderless .mat-chip.mat-standard-chip, .mat-chip.mat-standard-chip:hover {
  color: var(--text-color);
  border: 1px solid rgba(var(--text-color-rgb), 0.5);
  background: white;
}

.input-borderless .mat-chip.mat-standard-chip::after {
  background: transparent;
}

.input-borderless .mat-chip.mat-standard-chip .mat-chip-remove {
  color: var(--text-color);
  width: 20px;
  height: 20px;
}