.event {
  padding-bottom: 10px;
  padding-top: 10px;
  cursor: pointer;
  width: 100%;
  background-color: #f1f1f1;
  border: 1px solid #adadad;
}

.event.selected {
  background-color: #d2d2d2;
  border: 1px solid #7d7d7d;
  margin: 10px 0px;
}

.event .date-picker-input input {
  min-width: 155px;
}

.event .date-picker-input .read-only-date {
  border-radius: 2px;
  padding: 1px 4px 1px 4px;
}

.event .date-picker-input,
.event .title-input,
.event .comment-input,
.event .type-input,
.event .state-input,
.event .location-input,
.event .boolean-attributes {
  padding: 4px 0px 4px 0px;
}

.event .boolean-attributes {
  margin-left: 10px;
}

.event .boolean-attributes .read-only-label span,
.event .boolean-attributes .private-label span,
.event .boolean-attributes .all-day-label span,
.event .boolean-attributes .milestone-label span,
.event .boolean-attributes .task-label span,
.event .boolean-attributes .time-label span {
  transition: 0.2s all ease;
  color: black;
  padding: 4px 7px 4px 7px;
}

.event .boolean-attributes .read-only-label:hover span,
.event .boolean-attributes .private-label:hover span,
.event .boolean-attributes .all-day-label:hover span,
.event .boolean-attributes .milestone-label:hover span,
.event .boolean-attributes .task-label:hover span,
.event .boolean-attributes .time-label:hover span {
  color: white;
  border-radius: 10%;
  background-color: black;
}

.event .title-input input {
  min-width: 200px;
}

.event .title-input > span {
  max-width: 200px;
}

@media (min-width: 992px) {
  .event .title-input > span {
    max-width: 180px;
  }
}

@media (min-width: 1200px) {
  .event .title-input > span {
    max-width: 180px;
  }
}

.event .title-input > span,
.event .comment-input > span,
.event .type-input > span,
.event .state-input > span,
.event .location-input .read-only-location {
  margin-left: 5px;
  display: inline-block;
  vertical-align: middle;
}

.event .event-creator {
  /* margin-left: 5px; */
  display: inline-block;
  vertical-align: middle;
}

.event .event-creator .user-profile-icon .initials span,
.event .event-creator .user-profile-icon .avatar,
.event .event-creator .user-profile-icon .avatar .image {
  width: 30px;
  height: 30px;
}

.event .event-creator .user-profile-icon .initials span {
  padding-top: 5px;
  font-size: small;
}

.event .location-input input {
  min-width: 300px;
}

.event .location-input .read-only-location {
  max-width: 200px;
}

.event .type-input input {
  min-width: 135px;
}

.event .state-input input {
  min-width: 100px;
}

.event .comment-input textarea {
  min-width: 150px;
  min-height: 30px;
}

.event:hover {
  background-color: #ececec;
}

.event.short-mode {
  padding-bottom: 0px;
  padding-top: 0px;
  cursor: auto;
}

.event.short-mode .inputs-container {
  font-size: smaller;
}

.event .reference-tag.tag {
  border-radius: 2px;
  padding: 1px 4px 1px 4px;
  font-weight: normal;
}

.event .property-ref-input input {
  max-width: 70px;
}