.margin-right {
  margin-right: 10px;
}

.margin-bottom {
  margin-bottom: 5px;
}

.align-center {
  align-items: center;
}

.edit-controls-container, .edit__section {
  flex-direction: column;
}

.edit__section {
  border-bottom: 1px solid #b3c5d6;
}

.edit__block {
  flex-wrap: wrap;
}

.edit-controls-container {
  flex-grow: 1;
}

.edit__btn {
  cursor: pointer;
  position: relative;
  height: 32px;
  border-radius: 7px;
  flex-grow: 1;
  margin-top: 4px;
  margin-bottom: 4px;

  &.pause {
    background: orange;
  }
  &.enable {
    background: #2eb32e;
  }
  &.reset {
    background: #ff3e3e;
  }
}

input, input[type=text], input[type=number] {
  border: 2px solid #8484f5;
  border-radius: 5px;
  padding: 8px;
  outline: none;
  font-size: 14px !important;
  line-height: normal !important;
}

input[type=text] {
  max-width: 410px;
}

input[type=number] {
  max-width: 60px;
}

input:disabled {
  background: #f7f7ff;
}

.input-label-disabled {
  color: #aaa;
}

.datepicker {
  max-width: 100px !important;
  &.moved + div > div {
    top: auto !important;
    bottom: 50px !important;
    left: -135px !important;
    &>div.arrow {
      bottom: -11px !important;
      left: 75% !important;
      border-top-color: rgba(0, 0, 0, .25) !important;
      border-bottom-width: 0 !important;
      top: auto !important;
      border-top-width: 11px !important;
      &:after {
        bottom: 1px !important;
        border-top-color: #fff !important;
        border-bottom-width: 0 !important;
        top: auto !important;
        border-top-width: 11px !important;
      }
    }
  }
}

.timepicker {
  max-width: 100px;
}

.daypicker {
  max-width: 80px;
}

.copyright {
  color: #bbbed6;
  font-size: 12px;
  text-decoration: none;
}

// sound-input
.sound-upload {
  position: relative;
}

.sound-btn {
  border: 2px solid #8384f5;
  color: #8384f5;
  background-color: white;
  padding: 5px 20px;
  border-radius: 8px;
  font-size: 15px;
  font-weight: bold;
  width: fit-content;
  height: fit-content;
  white-space: nowrap;
}

.sound-upload input[type=file] {
  font-size: 100px;
  position: absolute;
  left: 0;
  top: 0;
  opacity: 0;
}

.sound-path {
  margin-left: 12px;
  & > .Dropdown-control {
    width: 200px;
    padding: 6px 28px 6px 10px;
    & > .Dropdown-placeholder {
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
      display: block;
    }
  }
  & > .Dropdown-menu {
    max-height: 152px;
    & > .Dropdown-option {
      padding: 6px 10px;
    }
  }
}

.refresh-btn {
  color: #fff;
  background: #a3a4ff;
  border-radius: 4px;
  width: 20px;
  height: 25px;
  padding: 4px;
  cursor: pointer;
  margin: 5px 7px;

  &:active {
    background: #8384f5;
  }
}
