@import url("https://cdn.jsdelivr.net/npm/flatpickr/dist/flatpickr.min.css");
@import url("https://unpkg.com/filepond/dist/filepond.css");
@import url("https://unpkg.com/filepond-plugin-image-preview/dist/filepond-plugin-image-preview.css");
@import url("https://api.fontshare.com/css?f[]=general-sans@300,400,600&display=swap");
@import url("https://cdn.jsdelivr.net/npm/tom-select@2.0.0/dist/css/tom-select.min.css");
@import url("https://cdnjs.cloudflare.com/ajax/libs/cropperjs/2.0.0-alpha.2/cropper.css");

body {
  margin: 0;
  font-family: "General Sans", sans-serif !important;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  -webkit-tap-highlight-color: transparent;
}

.filepond--root .filepond--drop-label {
  min-height: 270px;
}

.flatpickr-calendar {
  box-shadow: none !important;
}

.ts-control {
  border-radius: 0.5rem;
  cursor: pointer;
  padding: 1rem 0px;
  border: 1px solid #d9f1fd;
}

.ts-dropdown {
  margin-top: 0;
  border-bottom-left-radius: 0.5rem;
  border-bottom-right-radius: 0.5rem;
}

.ts-dropdown .option {
  padding: 1rem 0px;
}

.ts-wrapper .ts-control {
  border: 0 !important;
  padding: 0.25rem 0 !important;
}

.ts-custom-item {
  background-color: #effaff !important;
  border-radius: 0.25rem;
}

.border-error-important {
  border-color: #ff6538 !important;
}

.loader-svg {
  width: 100%;
  max-width: 10rem;
  animation: rotate 3.4s linear infinite;
}

.loader-svg circle {
  fill: none;
  stroke: #46bcf3;
  stroke-width: 8px;
  stroke-dasharray: 300;
  animation: outline 2s cubic-bezier(0.77, 0, 0.18, 1) infinite;
}

.fit-content-important {
  width: fit-content !important;
}

@keyframes outline {
  0% {
    stroke-dashoffset: 0;
  }

  5% {
    stroke-dashoffset: 0;
  }

  50% {
    stroke-dashoffset: 300;
  }

  95% {
    stroke-dashoffset: 600;
  }

  100% {
    stroke-dashoffset: 600;
  }
}

@keyframes rotate {
  from {
    transform: rotate(0turn);
  }

  to {
    transform: rotate(-1turn);
  }
}

.notification-bell {
  display: block;
  width: 40px;
  height: 40px;
  font-size: 40px;
  color: #9e9e9e;
  -webkit-animation: ring 4s 0.7s ease-in-out infinite;
  -webkit-transform-origin: 50% 4px;
  -moz-animation: ring 4s 0.7s ease-in-out infinite;
  -moz-transform-origin: 50% 4px;
  animation: ring 4s 0.7s ease-in-out infinite;
  transform-origin: 50% 4px;
}

@-webkit-keyframes ring {
  0% {
    -webkit-transform: rotateZ(0);
  }

  1% {
    -webkit-transform: rotateZ(30deg);
  }

  3% {
    -webkit-transform: rotateZ(-28deg);
  }

  5% {
    -webkit-transform: rotateZ(34deg);
  }

  7% {
    -webkit-transform: rotateZ(-32deg);
  }

  9% {
    -webkit-transform: rotateZ(30deg);
  }

  11% {
    -webkit-transform: rotateZ(-28deg);
  }

  13% {
    -webkit-transform: rotateZ(26deg);
  }

  15% {
    -webkit-transform: rotateZ(-24deg);
  }

  17% {
    -webkit-transform: rotateZ(22deg);
  }

  19% {
    -webkit-transform: rotateZ(-20deg);
  }

  21% {
    -webkit-transform: rotateZ(18deg);
  }

  23% {
    -webkit-transform: rotateZ(-16deg);
  }

  25% {
    -webkit-transform: rotateZ(14deg);
  }

  27% {
    -webkit-transform: rotateZ(-12deg);
  }

  29% {
    -webkit-transform: rotateZ(10deg);
  }

  31% {
    -webkit-transform: rotateZ(-8deg);
  }

  33% {
    -webkit-transform: rotateZ(6deg);
  }

  35% {
    -webkit-transform: rotateZ(-4deg);
  }

  37% {
    -webkit-transform: rotateZ(2deg);
  }

  39% {
    -webkit-transform: rotateZ(-1deg);
  }

  41% {
    -webkit-transform: rotateZ(1deg);
  }

  43% {
    -webkit-transform: rotateZ(0);
  }

  100% {
    -webkit-transform: rotateZ(0);
  }
}

@-moz-keyframes ring {
  0% {
    -moz-transform: rotate(0);
  }

  1% {
    -moz-transform: rotate(30deg);
  }

  3% {
    -moz-transform: rotate(-28deg);
  }

  5% {
    -moz-transform: rotate(34deg);
  }

  7% {
    -moz-transform: rotate(-32deg);
  }

  9% {
    -moz-transform: rotate(30deg);
  }

  11% {
    -moz-transform: rotate(-28deg);
  }

  13% {
    -moz-transform: rotate(26deg);
  }

  15% {
    -moz-transform: rotate(-24deg);
  }

  17% {
    -moz-transform: rotate(22deg);
  }

  19% {
    -moz-transform: rotate(-20deg);
  }

  21% {
    -moz-transform: rotate(18deg);
  }

  23% {
    -moz-transform: rotate(-16deg);
  }

  25% {
    -moz-transform: rotate(14deg);
  }

  27% {
    -moz-transform: rotate(-12deg);
  }

  29% {
    -moz-transform: rotate(10deg);
  }

  31% {
    -moz-transform: rotate(-8deg);
  }

  33% {
    -moz-transform: rotate(6deg);
  }

  35% {
    -moz-transform: rotate(-4deg);
  }

  37% {
    -moz-transform: rotate(2deg);
  }

  39% {
    -moz-transform: rotate(-1deg);
  }

  41% {
    -moz-transform: rotate(1deg);
  }

  43% {
    -moz-transform: rotate(0);
  }

  100% {
    -moz-transform: rotate(0);
  }
}

@keyframes ring {
  0% {
    transform: rotate(0);
  }

  1% {
    transform: rotate(30deg);
  }

  3% {
    transform: rotate(-28deg);
  }

  5% {
    transform: rotate(34deg);
  }

  7% {
    transform: rotate(-32deg);
  }

  9% {
    transform: rotate(30deg);
  }

  11% {
    transform: rotate(-28deg);
  }

  13% {
    transform: rotate(26deg);
  }

  15% {
    transform: rotate(-24deg);
  }

  17% {
    transform: rotate(22deg);
  }

  19% {
    transform: rotate(-20deg);
  }

  21% {
    transform: rotate(18deg);
  }

  23% {
    transform: rotate(-16deg);
  }

  25% {
    transform: rotate(14deg);
  }

  27% {
    transform: rotate(-12deg);
  }

  29% {
    transform: rotate(10deg);
  }

  31% {
    transform: rotate(-8deg);
  }

  33% {
    transform: rotate(6deg);
  }

  35% {
    transform: rotate(-4deg);
  }

  37% {
    transform: rotate(2deg);
  }

  39% {
    transform: rotate(-1deg);
  }

  41% {
    transform: rotate(1deg);
  }

  43% {
    transform: rotate(0);
  }

  100% {
    transform: rotate(0);
  }
}

.multi-select-input-wrapper {
  .item {
    font-size: 16px !important;
  }
  .ts-control {
    padding: 0.5rem 0.75rem !important;
    background-color: rgb(255 255 255) !important;
    border-radius: 0.5rem !important;
    border: 1px solid rgb(209 213 219) !important;
    width: 100% !important;
    line-height: 1.5rem;
    font-size: 16px !important;
  }

  input {
    width: auto !important;
    font-size: 16px !important;
  }

  .ts-wrapper.contacts .ts-control > div .email {
    opacity: 0.7;
  }
  .ts-wrapper.contacts .ts-control > div .name + .email {
    margin-left: 5px;
  }
  .ts-wrapper.contacts .ts-control > div .email:before {
    content: "<";
  }
  .ts-wrapper.contacts .ts-control > div .email:after {
    content: ">";
  }
  .ts-wrapper.contacts .ts-dropdown .caption {
    font-size: 12px;
    display: block;
    color: #a0a0a0;
  }
  .option {
    padding: 0.5rem 0.75rem;
  }
}