#register-newUserButton {
  background: #e6d5b538;
  transition: 0.2s;
}

#register-newUserButton:hover {
  background: #e6d5b55a;
}

#register-removeButton {
  background: #911212dd;
  transition: 0.2s;
}

#register-removeButton:hover {
  background: #af1616e1;
}

#register-editButton {
  background: #1d2040;
}

#register-editButton:hover {
  background: #1d2040b8;
}

.register-userContainer {
  background: #252e5976;
  transition: background 0.2s ease;
}

.register-userContainer.close:hover {
  background: #e6d5b519;
}

.register-userContainer:not(.close):hover {
  background: #252e5976;
}

.register-userInfo {
  border: 1px solid #40528c7b;
  transition: all 0.2s ease;
}

.register-userInfo:focus {
  border: 1px solid #6f8cff40;
  box-shadow: 0 0 5px 2px #6f8cff33;
}

.register-permissionSelect {
  border: 1px solid #40528c7b;
  transition: all 0.2s ease;
}

.register-permissionSelect:focus {
  border: 1px solid #6f8cff40;
  box-shadow: 0 0 5px 2px #6f8cff33;
}

#register-createNewUserButton {
  background-color: #485da3;
  transition: all 0.2s ease;
}

#register-createNewUserButton:hover {
  background-color: #485da3d5;
}

#register-saveButton {
  background-color: #485da3;
  transition: all 0.2s ease;
}
#register-saveButton:hover {
  background-color: #485da3d5;
}

#register-cancelButton {
  background: #303c76cc;
  transition: all 0.2s ease;
}

#register-cancelButton:hover {
  background: #303c76;
}

#register-cancelNewUserButton {
  background: #303c76cc;
  transition: all 0.2s ease;
}
#register-cancelNewUserButton:hover {
  background: #303c76;
}

input::placeholder {
  color: #e6d5b5;
}

@media (max-width: 480px) {
  #register-userHeader {
    flex-wrap: wrap;
    align-items: flex-start;
  }

  #register-userInfo {
    flex: 1;
  }

  #register-userPermission {
    order: 1;
    width: 100%;
    gap: 2rem;
    margin-top: 0.5rem;
  }

  #edit-user {
    font-size: 14px !important;
  }

  #remove-text {
    font-size: 14px !important;
  }
}