/* AI Button disabled style  */

#deal-status-wrapper {
  display: flex;
  align-items: center;
  gap: 10px;
}

#spinner-container {
  display: none;
  align-items: center;
  gap: 10px;
}

#spinner {
  border: 2px solid #f3f3f3;
  border-top: 4px solid #3498db;
  border-radius: 50%;
  width: 20px;
  height: 20px;
  animation: spin 2s linear infinite;
}

#progress-container {
  display: none;
  width: 100%;
  border-radius: 5px;
  overflow: hidden;
  margin-top: 16px;
  margin-bottom: 16px;
}

#progress-bar-track {
  width: 100%;
  height: 20px;
  background-color: #f1f1f1;
}

#progress-bar {
  width: 0%;
  height: 20px;
  background-color: #4caf50;
}

#success-message {
  display: none;
  color: #008905;
}

#error-message {
  display: none;
  color: #cd3730;
}

/* html:has(.wpfepp-message[style="display: block;"]) #deal-status-wrapper,
html:has(.wpfepp-message[style="display: block;"]) #after-message-container {
  display: none !important;
} */

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

/* new ui */
#new-deal-add-from-wrapper form {
  display: none;
}
#deal-status-main-container {
  display: none;
}
#new-deal-add-from-wrapper
  form.create-with-ai-form.ai-form-result-generated
  .wpfepp-form-fields
  .wpfepp_footer {
  display: block !important;
}
#new-deal-add-from-wrapper
  form.create-with-ai-form.ai-form-result-generated
  .wpfepp-form-fields
  .wpfepp-form-field-container {
  display: block !important;
}
#new-deal-add-from-wrapper
  form.create-with-ai-form
  .wpfepp-form-fields
  .wpfepp_footer {
  display: none !important;
}
#new-deal-add-from-wrapper
  form.create-with-ai-form
  .wpfepp-form-fields
  .wpfepp-form-field-container {
  display: none !important;
}
#new-deal-add-from-wrapper
  form.create-with-ai-form
  .wpfepp-form-fields
  .wpfepp-rehub_offer_product_url-field-container.wpfepp-form-field-container {
  display: block !important;
}
#new-deal-add-from-wrapper
  form.create-with-ai-form
  .wpfepp-form-fields
  #create-with-ai-submit {
  display: block !important;
}
#new-deal-add-from-wrapper
  form.create-with-ai-form
  .wpfepp-form-fields
  #deal-status-main-container {
  display: block !important;
}

#button-container {
  width: 100%;
  display: flex;
  justify-content: center;
  gap: 12px;
  margin-bottom: 20px;
}
.create-without-ai-class,
.create-with-ai-class {
  background: #c7c7c7;
  color: #000;
  border-radius: 6px;
  border: 0px;
  padding: 10px 20px;
  font-weight: 700;
  cursor: pointer;
  transition: all 0.3s ease;
}
.create-without-ai-class:hover,
.create-with-ai-class:hover {
  opacity: 0.8;
}
.create-without-ai-class.active,
.create-with-ai-class.active {
  background: #2a65b7;
  color: #ffffff;
}
#create-with-ai-submit {
  display: none;
  width: fit-content;
  margin: 20px auto 0 !important;
  background-color: #2a65b7 !important;
  color: #ffffff !important;
  border-radius: 6px !important;
  border: 0px !important;
  padding: 10px 20px !important;
  font-weight: 700 !important;
  cursor: pointer !important;
  transition: all 0.3s ease;
  text-transform: none !important;
}
#create-with-ai-submit:hover {
  opacity: 0.8;
}
#create-with-ai-submit:disabled {
  opacity: 0.5;
  cursor: not-allowed !important;
  box-shadow: none !important;
}

/* tictactoe game styles */
#new-deal-add-from-wrapper form.create-without-ai-form  .tic-tac-toe-game-wrapper {
  display: none !important;
}
#new-deal-add-from-wrapper .tic-tac-toe-game-wrapper {
  display: none;
  max-width: 300px;
  margin: 32px auto 0;
  background-color: #2a65b71f;
  padding: 16px;
  border-radius: 16px;
}
#new-deal-add-from-wrapper .tic-tac-toe-game-wrapper .game-container {
  text-align: center;
}
#new-deal-add-from-wrapper .tic-tac-toe-game-wrapper .board {
  max-width: 200px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  grid-gap: 16px;
}
#new-deal-add-from-wrapper .tic-tac-toe-game-wrapper h2 {
  margin-top: 0px;
  font-size: 18px;
  font-weight: 700;
  margin-bottom: 8px;
}
#new-deal-add-from-wrapper .tic-tac-toe-game-wrapper .cell {
  aspect-ratio: 1;
  background-color: #fff;
  border: 1px solid #cbcdd0;
  border-radius: 16px;
  font-size: 1.5em;
  display: flex;
  justify-content: center;
  align-items: center;
  cursor: pointer;
}
#new-deal-add-from-wrapper .tic-tac-toe-game-wrapper .cell:hover {
  background-color: #f5f5f5;
}
#new-deal-add-from-wrapper .tic-tac-toe-game-wrapper .status {
  font-size: 14px;
  margin-bottom: 12px;
}
#new-deal-add-from-wrapper .tic-tac-toe-game-wrapper .reset {
  width: fit-content;
  margin: 16px auto 0 !important;
  background-color: #2a65b7 !important;
  color: #ffffff !important;
  border-radius: 6px !important;
  border: 0px !important;
  padding: 10px 20px !important;
  font-weight: 700 !important;
  cursor: pointer !important;
  transition: all 0.3s ease;
  text-transform: none !important;
}