.elementor-3807 .elementor-element.elementor-element-0b9899b{--display:flex;}.elementor-widget-theme-post-title .elementor-heading-title{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );color:var( --e-global-color-primary );}.elementor-3807 .elementor-element.elementor-element-baefedf > .elementor-widget-container{margin:16px 0px 10px 0px;}.elementor-3807 .elementor-element.elementor-element-baefedf{text-align:center;}.elementor-3807 .elementor-element.elementor-element-baefedf .elementor-heading-title{font-family:"Poppins", Sans-serif;font-size:32px;font-weight:600;color:#FFFFFF;}.elementor-3807 .elementor-element.elementor-element-30e80df{--display:flex;}.elementor-widget-text-editor{font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-weight:var( --e-global-typography-text-font-weight );color:var( --e-global-color-text );}.elementor-widget-text-editor.elementor-drop-cap-view-stacked .elementor-drop-cap{background-color:var( --e-global-color-primary );}.elementor-widget-text-editor.elementor-drop-cap-view-framed .elementor-drop-cap, .elementor-widget-text-editor.elementor-drop-cap-view-default .elementor-drop-cap{color:var( --e-global-color-primary );border-color:var( --e-global-color-primary );}.elementor-3807 .elementor-element.elementor-element-15041ea{text-align:center;font-family:"Poppins", Sans-serif;font-size:20px;font-weight:600;color:#FFFFFF;}.elementor-3807 .elementor-element.elementor-element-2a08c09{--display:flex;--border-radius:10px 10px 0px 0px;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;}.elementor-3807 .elementor-element.elementor-element-2a08c09:not(.elementor-motion-effects-element-type-background), .elementor-3807 .elementor-element.elementor-element-2a08c09 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#3B4580;}.elementor-3807 .elementor-element.elementor-element-f3cf834 > .elementor-widget-container{margin:15px 0px 5px 0px;}.elementor-3807 .elementor-element.elementor-element-f3cf834{text-align:center;font-family:"Poppins", Sans-serif;font-size:20px;font-weight:600;color:#FFFFFF;}.elementor-3807 .elementor-element.elementor-element-eea9506 > .elementor-widget-container{margin:0px 300px 0px 300px;}.elementor-3807 .elementor-element.elementor-element-549e2d5 > .elementor-widget-container{margin:0px 300px 0px 300px;}.elementor-3807 .elementor-element.elementor-element-37c6625 > .elementor-widget-container{margin:0px 300px 15px 300px;}body.elementor-page-3807:not(.elementor-motion-effects-element-type-background), body.elementor-page-3807 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#22252E;}@media(max-width:767px){.elementor-3807 .elementor-element.elementor-element-baefedf > .elementor-widget-container{margin:20px 0px 0px 0px;}.elementor-3807 .elementor-element.elementor-element-baefedf{text-align:center;}.elementor-3807 .elementor-element.elementor-element-baefedf .elementor-heading-title{font-size:30px;}.elementor-3807 .elementor-element.elementor-element-15041ea > .elementor-widget-container{margin:0px 0px 10px 0px;}.elementor-3807 .elementor-element.elementor-element-15041ea{text-align:center;font-size:16px;}.elementor-3807 .elementor-element.elementor-element-2a08c09{--width:473px;--border-radius:10px 10px 0px 0px;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;}.elementor-3807 .elementor-element.elementor-element-f3cf834 > .elementor-widget-container{margin:15px 0px 10px 0px;}.elementor-3807 .elementor-element.elementor-element-f3cf834{text-align:center;font-size:16px;}.elementor-3807 .elementor-element.elementor-element-eea9506 > .elementor-widget-container{margin:-10px 0px 10px 0px;}.elementor-3807 .elementor-element.elementor-element-549e2d5 > .elementor-widget-container{margin:-10px 0px 10px 0px;}.elementor-3807 .elementor-element.elementor-element-37c6625 > .elementor-widget-container{margin:-10px 0px 10px 0px;}}/* Start custom CSS for shortcode, class: .elementor-element-eea9506 */.ad-button {
  background-color: #F4F4F4;
  color: #000000;
  padding: 15px;
  border: none;
  font-family: Poppins, sans-serif;
  font-size: 20px;
  width: 100%;
  position: relative;
  border-radius: 100px;
  border-bottom: 5px solid #F4F4F4;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  box-sizing: border-box;
  cursor: pointer;
}

.ad-button .button-content {
  display: flex;
  align-items: center;
  width: 100%;
  gap: 15px;
}

.ad-button .button-image {
  width: 40px;
  height: 40px;
  object-fit: cover;
  border-radius: 50%;
  flex-shrink: 0;
}

.ad-button .button-text {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

.ad-button .button-title {
  font-weight: bold;
}

.ad-button .button-description {
  font-size: 14px;
  color: #666;
  margin-top: 8px;
  text-align: left;
}

/* Button States */
.ad-button.waiting_button {
  border-bottom: 5px solid #F4F4F4 !important;
}

.ad-button.completed_button {
  border-bottom: 4px solid #2ec94f !important;
}

.ad-button.closed_button {
  border-bottom: 5px solid #FF0000;
}

/* Spinner Animation */
.ad-button::before {
  content: "\279C";
  font-size: 32px;
  position: absolute;
  top: 50%;
  right: 22px;
  transform: translateY(-50%);
}

.ad-button.waiting_button::before {
  content: "";
  animation: spin 0.8s linear infinite;
  width: 32px;
  height: 32px;
  border-top: 4px solid #000000;
  border-right: 4px solid transparent;
  border-radius: 50%;
}

.ad-button.completed_button::before {
  content: "\2714";
}

.ad-button.closed_button::before {
  content: "\21BB";
}

@keyframes spin {
  0% {
    transform: translateY(-50%) rotate(0deg);
  }
  100% {
    transform: translateY(-50%) rotate(360deg);
  }
}

/* Mobile Optimization */
@media (max-width: 767px) {
  .ad-button {
    font-size: 16px;
    padding: 10px;
  }

  .ad-button .button-image {
    width: 40px;
    height: 40px;
  }

  .ad-button .button-text .button-title {
    font-size: 15px;
  }

  .ad-button .button-description {
    font-size: 12px;
  }

  .ad-button::before,
  .ad-button.closed_button::before {
    font-size: 23px;
    right: 14px;
  }

  .ad-button.completed_button::before {
    color: #000000;
    background-color: #F4F4F4 !important;
  }

  .ad-button.waiting_button::before {
    width: 23px;
    height: 23px;
    border-top: 4px solid #000000;
    border-right: 4px solid transparent;
  }
}/* End custom CSS */
/* Start custom CSS for shortcode, class: .elementor-element-549e2d5 */#ad-button {
  background-color: #F4F4F4;
  color: #000000;
  padding: 15px;
  border: none;
  font-family: 'Poppins', sans-serif;
  font-size: 20px;
  width: 100%;
  position: relative;
  border-radius: 100px;
  border-bottom: 5px solid #F4F4F4;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  box-sizing: border-box;
  cursor: pointer;
}

#ad-button .button-content {
  display: flex;
  align-items: center;
  width: 100%;
  gap: 15px;
}

#ad-button .button-image {
  width: 40px;
  height: 40px;
  object-fit: cover;
  border-radius: 50%;
  flex-shrink: 0;
}

#ad-button .button-text {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

#ad-button .button-title {
  font-weight: bold;
}

#ad-button .button-description {
  font-size: 14px;
  color: #666;
  margin-top: 8px;
  text-align: left;
}

/* Status classes for the button */
.unclicked_button {
  border-bottom: 5px solid #F4F4F4;
}

.waiting_button {
  border-bottom: 5px solid #F4F4F4 !important;
}

.completed_button {
  border-bottom: 4px solid #2ec94f !important;
}

.closed_button {
  border-bottom: 5px solid #FF0000;
}

/* Icons for different states */
.unclicked_button::before {
  content: "\279C"; /* arrow */
  font-size: 32px;
  position: absolute;
  top: 50%;
  right: 22px;
  transform: translateY(-50%);
}

.waiting_button::before {
  content: "";
  animation: spin 0.8s linear infinite;
  width: 32px;
  height: 32px;
  border-top: 4px solid #000000;
  border-right: 4px solid transparent;
  border-radius: 50%;
  position: absolute;
  top: 50%;
  right: 22px;
  transform: translateY(-50%);
}

.completed_button::before {
  content: "\2714"; /* check mark */
  font-size: 32px;
  position: absolute;
  top: 50%;
  right: 22px;
  transform: translateY(-50%);
}

.closed_button::before {
  content: "\21BB"; /* clockwise arrow */
  font-size: 32px;
  position: absolute;
  top: 50%;
  right: 22px;
  transform: translateY(-50%);
}

/* Spin animation */
@keyframes spin {
  0% {
    transform: translateY(-50%) rotate(0deg);
  }
  100% {
    transform: translateY(-50%) rotate(360deg);
  }
}

/* Responsive */
@media (max-width: 767px) {
  #ad-button {
    font-size: 16px;
    padding: 10px;
  }

  #ad-button .button-image {
    width: 40px;
    height: 40px;
  }

  #ad-button .button-text .button-title {
    font-size: 15px;
  }

  #ad-button .button-description {
    font-size: 12px;
  }

  .unclicked_button::before,
  .waiting_button::before,
  .completed_button::before,
  .closed_button::before {
    font-size: 23px;
    right: 14px;
  }

  .waiting_button::before {
    width: 23px;
    height: 23px;
    border-top: 4px solid #000000;
    border-right: 4px solid transparent;
  }
}/* End custom CSS */
/* Start custom CSS for shortcode, class: .elementor-element-37c6625 */#button-locked-199 {
  background-color: transparent;
  color: #F4F4F4;
  background-color: #2ec94f;
  border: solid 1px;
  border-radius: 100px;
  border-color: #F4F4F4 !important;
  padding: 15px;
  border-color: #2ec94f; 
  font-size: 20px;
    font-family: poppins;
  width: 100%;
  position: relative;
  transition: background-color 0.3s ease;
  display: block !important;
  margin: 0 auto !important;
}

#button-locked-199:disabled {
  background-color: transparent;
  color: #B4B4B4;
  border-color: #B4B4B4 !important;
  cursor: not-allowed;
  animation: border-loading 1.5s infinite linear; /* Adding loading animation */
}

/* Loading animation effect for the border */
@keyframes border-loading {
  0% {
    border-color: #B4B4B4;
  }
  50% {
    border-color: #2ec94f; /* This creates a back-and-forth effect */
  }
  100% {
    border-color: #B4B4B4;
  }
}

@media (max-width: 767px) {
  #button-locked-199 {
    font-size: 18px;
    width: 100%;
  }
}/* End custom CSS */