.custom-checkbox {
    display: inline-block;
    position: relative;
    padding-left: 35px;
    cursor: pointer;
    user-select: none;
  }
  
  .custom-checkbox input[type="checkbox"] {
    visibility: hidden;
  }
  
  .custom-checkbox .checkmark {
    position: absolute;
    top: 0;
    left: 0;
    height: 25px;
    width: 25px;
    background-color: #eee;
    border-radius: 4px;
    transition: background-color 0.3s;
  }
  
  .custom-checkbox:hover input ~ .checkmark {
    background-color: #ccc;
  }
  
  .custom-checkbox input:checked ~ .checkmark {
    background-color: #3cf7a2;
  }
  
  .custom-checkbox .checkmark:after {
    content: "";
    position: absolute;
    display: none;
  }
  
  .custom-checkbox input:checked ~ .checkmark:after {
    display: block;
  }
  
  .custom-checkbox .checkmark:after {
    left: 9px;
    top: 5px;
    width: 7px;
    height: 13px;
    border: solid white;
    border-width: 0 3px 3px 0;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
  }
  
  .form-control:focus{
    box-shadow: none !important;
    border-color: #3cf7a2 !important;
    transition: border-color 0.3s;
    }

.fa-button{
  font-size: 30px !important;
  color:#3cf7a2 !important;
  transition: color 0.3s;
}

.fa-button-delete{
  font-size: 30px !important;
  color:#e60000 !important;
  transition: color 0.3s;
  }

.fa-button-delete:hover{
    color: #bb0000 !important;
  }

  .btn-delete{
    border: none;
    background: none;
  }


.fa-button:hover{
color:#32da8e !important; 
}


.pointer{
  cursor: pointer;
}

.plant-img-sm{
  border-radius: 20px;
}

.flatpickr-day.selected {
  background-color: #3cf7a2 !important;
  border-color: #3cf7a2 !important;
  color: #ffffff;
}

.flatpickr-calendar{
  border-radius: 20px;
}

.flatpickr-months{
  padding-bottom: 10px;
}

.flatpickr-months .flatpickr-next-month:hover svg {
  fill: #3cf7a2 !important;
}

.flatpickr-months .flatpickr-prev-month:hover svg {
  fill: #3cf7a2 !important;
}

.numInputWrapper span.arrowDown{
  left: 59px;
}

.numInputWrapper span.arrowUp{
  left: 59px;
}

#noteTextarea{
  border-radius: 20px;
}

.custom-modal-width {
  max-width: 1000px !important;
}

.generate-nickname-btn{
  border: none;
  background: none;
}

.generate-nickname-btn:hover, .generate-nickname-btn:active{
  background: none !important;
}


.cropper-line, .cropper-point{
  background-color:#32da8e !important;}

.cropper-view-box{
  outline: 1px solid #32da8e !important;
}

.warning-meldung > p{
  color: red !important;
}

#cropperContainerNew, #croppedImageNew, .card-image, textarea{
  border-radius: 20px !important;
}

body{
  background-color: #ecffe5;
}

.card, .card-image {
  box-shadow: 0px 5px 5px 0px #0000001a;
}

.modal-l{
  min-width: 600px !important;
}

.modal-image, .cropper-wrap-box {
  width: 300px;
  height: 300px;
  border-radius: 20px;
  box-shadow: 0px 5px 5px 0px #0000001a;
}

.cropper-wrap-box, .cropper-crop-box,.cropper-drag-box, .cropper-container{
  width: 300px;
  height: 300px;
  border-radius: 20px;
}

.navbar-collapse{
  margin-top: 10px;
  padding-top: 5px;
}

.properties-modal{
  padding-left: 0px !important;
  padding-right: 0px !important;
}

.card-hover{
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.card-hover:hover{
  transform: scale(1.05);
  box-shadow: 0px 20px 5px 0px #0000001a;
}

html, body {
  height: 100%;
}

footer{/*
  position:absolute;
  bottom: 0;
  width: 100%;*/
  box-shadow: 0px 0.125px 0.25rem rgba(0, 0, 0, 0.075);
}

a{
  color: #32da8e ;
  text-decoration: none;
}

.loading-overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.5);
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 9999;
}

.loading-spinner {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  border: 4px solid #fff;
  border-top-color: #32da8e;
  animation: spin 1s infinite linear;
}

@keyframes spin {
  0% {
      transform: rotate(0deg);
  }
  100% {
      transform: rotate(360deg);
  }
}

.link-deko{
  color: #32da8e;
}

.link-deko:hover{
 color: #3cf7a2;
}

.flatpickr-wrapper{
  display: block !important;
}