#connection_button {
  width: 170px;
}

.connection_button {
  font-size: 10px;
  margin:1rem;
  border-radius: 8px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

.connection_button:hover {
  text-decoration:none;
}

.connection_button > img {
  width: 100px;
}

.connection_button:hover:disabled {
  text-decoration:none;
  cursor:auto;
}

.connection_button > img {
  width: 100px;
}


#delete_connection {
  width: 170px;
  font-size: 10px;
  margin:1rem;
  border-radius: 8px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

#delete_connection:hover {
  text-decoration:none;
}

#delete_connection > img {
  width: 100px;
}

.hubspot {
  background-color: #f57722;
}

.hubspot:hover {
  background-color: #e04826;
}

.hubspot:disabled, .hubspot:hover:disabled {
  background-color:  #f57722;
}

.pipedrive {
  background-color: #2d8647;
}

.pipedrive:hover {
  background-color: #37a055;
}

.pipedrive:disabled, .pipedrive:hover:disabled {
  background-color:  #2d8647;
}

.salesforce {
  background-color: #00a2e1;
}

.salesforce:hover {
  background-color: #0bbbff;
}

.salesforce:disabled, .salesforce:hover:disabled {
  background-color:  #00a2e1;
}

/* PIPELINE STYLE */
.select-stage {
  background-color:lightgrey;
  padding: 0.5rem;
  border-radius: 8px;
  font-size: 20px;
  border:none;
  width: 100%;
}

.pipeline-name {
  font-weight: 600;
}

#pipeline-table {
  display: block !important;
  border:none;
}

#pipeline-table thead th:nth-child(3) {
  width:20px;
}

#pipeline-table thead th:last-child {
  width:20px;
}

#pipeline-table th, #pipeline-table td {
  border:none;
  min-width: 50px;
}

#pipeline-table th:first-child, td:first-child{
  text-align: left;
}

#pipeline-table td:first-child{
  text-align: left;
  color:grey;
  font-size: 1.5rem;
}

#pipeline-table img {
  display: none;
  animation: fadeInOut 2s ease-in-out; 
}

@keyframes fadeInOut {
    0% { opacity: 0; } 
    50% { opacity: 1; } 
    100% { opacity: 1; }
}

#test-container {
  border: 1px solid black;
  width: 30vw;
  display: flex;
  flex-direction: column;
  align-items: center;
  border-radius: 1rem;
}

/* SPINNER */
.hollow-dots-spinner, .hollow-dots-spinner * {
  box-sizing: border-box;
}

.hollow-dots-spinner {
  height: 15px;
  width: calc(30px * 3);
}

.hollow-dots-spinner .dot {
  width: 15px;
  height: 15px;
  margin: 0 calc(15px / 2);
  border: calc(15px / 5) solid #2d68ff;
  border-radius: 50%;
  float: left;
  transform: scale(0);
  animation: hollow-dots-spinner-animation 1500ms ease infinite 0ms;
}

.hollow-dots-spinner .dot:nth-child(1) {
  animation-delay: calc(300ms * 1);
}

.hollow-dots-spinner .dot:nth-child(2) {
  animation-delay: calc(300ms * 2);
}

.hollow-dots-spinner .dot:nth-child(3) {
  animation-delay: calc(300ms * 3);

}

@keyframes hollow-dots-spinner-animation {
  50% {
    transform: scale(1);
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

#is_proxy_page {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items:center;
}



/* Choisir le montant à modifier dans le CRM */
select#amountToUpdate {
  font-size: 1rem;
  background-color: lightgrey;
  padding: 0.5rem;
  border-radius: 8px;
  border: none;
  max-width: 300px;
  width: 100%;
  margin-bottom: 30px;
}

/* Choisir le montant à modifier dans le CRM */
select#langToUpdate {
  font-size: 1rem;
  background-color: lightgrey;
  padding: 0.5rem;
  border-radius: 8px;
  border: none;
  max-width: 300px;
  width: 100%;
  margin-bottom: 30px;
}

/* style pop-in */

#crm-disconnect-validation-popin-background {
  position: fixed;
  top: 0;
  left: 0;
  max-width: 100%;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.5);
}

#crm-disconnect-validation-popin {
  width: 500px; 
  /* il faut absolument conserver une width, sinon le click sur la zone grise pour quitter la popin ne fonctionne pas correctement */
  position: fixed;
  margin: auto 0;
  z-index: 1;
  display: flex;
  align-items: center;
  justify-content: center;
}

.crm-disconnect-validation-popin-content {
  background-color: white;
  padding: 50px;
  border-radius: 5px;
  text-align: center;
}

#crm-disconnect-validation-popin button {
  margin-top: 10px;
  border-radius: 5px;
  font-size: 15px;
}

#confirm_disconnect {
  background-color:green;
}