.pm-form {
  &__row {
    display: flex;
    gap: 8px;
    align-items: flex-end;
    flex-wrap: wrap;
  }

  &__field {
    flex: 1;
    min-width: 160px;
  }

  &__actions {
    display: flex;
    align-items: flex-end;
    padding-bottom: 2px;
  }
}

.pm-row {
  &--inactive {
    opacity: 0.5;
  }

  &__actions {
    white-space: nowrap;

    .btn + .btn {
      margin-left: 4px;
    }
  }
}

.project-badge {
  display: inline-flex;
  align-items: center;
  gap: 2px;
  font-size: 10px;
  line-height: 1;
  padding: 1px 4px;
  border-radius: 3px;
  vertical-align: middle;
  margin-left: 4px;

  &--done {
    color: #16a34a;
    background: rgba(22, 163, 74, 0.1);
  }

  &--partial {
    color: #d97706;
    background: rgba(217, 119, 6, 0.1);
    font-weight: 600;
  }

  &--none {
    color: #9ca3af;
    background: rgba(156, 163, 175, 0.1);
  }
}

.item-project-badge {
  display: inline-block;
  font-size: 10px;
  padding: 1px 6px;
  border-radius: 3px;
  margin-left: 6px;
  vertical-align: middle;

  &--done {
    color: #16a34a;
    background: rgba(22, 163, 74, 0.1);
  }

  &--pending {
    color: #9ca3af;
    background: rgba(156, 163, 175, 0.1);
  }
}

.pm-modal {
  position: fixed;
  inset: 0;
  z-index: 1000;
  display: flex;
  align-items: center;
  justify-content: center;

  &__overlay {
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.4);
  }

  &__content {
    position: relative;
    width: 100%;
    max-width: 500px;
    z-index: 1;
  }
}