@import url(form.css);

.body-a-odr-section {
    margin-top: 40px;
}


.card-left-col1 .body-red-title {
    text-align: left;
    font-family: Poppins;
    font-weight: 700;
    font-style: Bold;
    font-size: 50px;
    line-height: 100%;
    letter-spacing: -2%;
}

.card-left-col1 .body-subtitle {
    margin-top: 40px;
    margin-bottom: 40px;
    font-family: Poppins;
    font-weight: 500;
    font-style: Medium;
    font-size: 16px;
    line-height: 120%;
    letter-spacing: 0%;
    vertical-align: middle;
    text-align: left;
    color: #706F6F;
}


.success-map-message-container {
  display: none;
  text-align: center;
}
.success-map-message {
  font-family: Poppins;
  font-weight: 700;
  font-style: Bold;
  font-size: 24px;
  line-height: 100%;
  letter-spacing: -2%;
  text-align: center;
  color:#2F2F2F;
}

.success-container {
  display: none;
  background-color: #F5F5F5;
  border-radius: 24px;
  padding: 24px;
  width: 100%;
  text-align: center;
}

.map-offer-image {

}

.map-offer-image img {
  width: 100%;
}

#successCheck {
  margin: 0 auto;
  margin-bottom: 20px;
}

.success-container .success-title
{
  font-family: Poppins;
  font-weight: 500;
  font-style: Medium;
  font-size: 28px;
  line-height: 100%;
  letter-spacing: -2%;
  text-align: center;
  color: #27AE60;
  margin-bottom: 20px;
}	

.success-container .success-comment {
  color: #706F6F;
  font-family: Poppins;
  font-weight: 500;
  font-style: Medium;
  font-size: 16px;
  line-height: 120%;
  letter-spacing: 0%;
  text-align: center;
  vertical-align: middle;
}

.success-container .launch-game-btn {
  margin-top: 20px;
  max-width: 80%;
  min-width: 320px;
  padding-left: 20px;
  padding-right: 20px;
  margin-left: auto;
  margin-right: auto;
}

.success-check{
  width: 88px;   /* ajustez à votre taille */
  height: 88px;
  transform: scale(0);
  opacity: 0;
}

/* l'animation ne se joue que quand cette classe est ajoutée en JS,
   donc le badge reste invisible tant que rien ne le déclenche */
.success-check.is-visible{
  animation: successBounce 1.1s cubic-bezier(.22, 1, .36, 1) forwards;
}

@keyframes successBounce{
  0%   { opacity: 0; transform: scale(0); }
  45%  { opacity: 1; transform: scale(1.15); }  /* 1er battement, ample   */
  65%  { transform: scale(.92); }                /* petit retour          */
  82%  { transform: scale(1.05); }                /* 2e battement, réduit  */
  100% { opacity: 1; transform: scale(1); }       /* se stabilise en grand */
}

@media (prefers-reduced-motion: reduce){
  .success-check.is-visible{
    animation: none;
    opacity: 1;
    transform: scale(1);
  }
}