.font-poppins {
  font-family: 'Poppins', sans-serif;
}

.main-page-bg {
  background-image: url('./assets/svg/home-bg.svg');
  background-position: 110% 4%;
  background-repeat: no-repeat;
}

@media screen and (max-width: 768px) {
  .main-page-bg {
    background-position: 60% 5%;
    background-size: 150%;
  }
  
}

.glass-effect-box {
  border-radius: 8px;
  border: 1px solid rgba(255, 255, 255, 0.1);
  background: #584D652B;
  backdrop-filter: blur(35px);
  z-index: 1;
}

@media screen and (max-width: 768px) {
  .glass-effect-box {
    min-width: 100%;
    min-height: 150px;
  }
  
}

/* @media screen and (min-width: 1000px) and (max-width: 1024px) {
  .glass-effect-box {
    min-width: 400px;
    min-height: 150px;
  }
} */

.why-choose-our-ai-solutions-box-effect {
  border-radius: 8px;
  border: 1px solid rgba(255, 255, 255, 0.1);
  background-color: #6986CE2B;
  backdrop-filter: blur(35px);
}

/* @media screen and (max-width: 768px) {
  .why-choose-our-ai-solutions-box-effect {
    min-width: 100%;
    min-height: 150px;
  }
}

@media screen and (min-width: 600px) and (max-width: 1000px) {
  .why-choose-our-ai-solutions-box-effect {
    min-width: 100%;
    min-height: 220px;
  }
}

@media screen and (min-width: 1000px) and (max-width: 1024px) {
  .why-choose-our-ai-solutions-box-effect {
    min-width: 220px;
    min-height: 220px;
  }
} */


.bg-gradient-contact-section {
  background: linear-gradient(90deg, #200B46 0%, #212768 100%);
}

.contact-form-border {
  border: 1px solid rgba(255, 255, 255, 0.1);
}


.try-demo-btn {
  background: linear-gradient(90deg, #572AE6 0%, #1D73FF 100%);
}

.chatbot-home-know-more-btn {
  box-shadow: 0px 4px 4px 0px #8C8C8C40;
  transition: all 300ms ease-out;
  cursor: pointer;
}

button.llm-page-btn {
  opacity: 0.5;
  cursor: not-allowed;
  pointer-events: none;
}


/* personas page styles */

.gradient-text {
  background: linear-gradient(to right, #7e57c2, #42a5f5);
  /* Purple to Blue gradient */
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.card {
  background-color: rgba(255, 255, 255, 0.05);
  /* Semi-transparent white */
  border: 1px solid rgba(255, 255, 255, 0.1);
  backdrop-filter: blur(10px);
  transition: transform 0.3s ease, background-color 0.3s ease;
}

.card:hover:not(.draggable-memo) {
  transform: translateY(-5px);
  background-color: rgba(255, 255, 255, 0.1);
}

.draggable-memo {
  cursor: grab;
  transition: background-color 0.2s ease;
}

.draggable-memo:hover {
  background-color: rgba(255, 255, 255, 0.15);
}

.draggable-memo:active {
  cursor: grabbing;
}

.drop-zone {
  border: 2px dashed rgba(255, 255, 255, 0.2);
  background-color: rgba(0, 0, 0, 0.2);
  transition: border-color 0.3s ease, background-color 0.3s ease;
}

.drop-zone.drag-over {
  border-color: #7e57c2;
  background-color: rgba(126, 87, 194, 0.1);
}

.btn-primary {
  background: linear-gradient(to right, #5e35b1, #7e57c2);
  /* Deep purple gradient */
  color: #ffffff;
  transition: all 0.3s ease;
  box-shadow: 0 4px 15px rgba(126, 87, 194, 0.2);
}

.btn-primary:hover {
  box-shadow: 0 0 25px rgba(126, 87, 194, 0.5);
  transform: translateY(-2px);
}

.btn-secondary {
  background-color: transparent;
  border: 1px solid #7e57c2;
  color: #b39ddb;
  /* Lighter purple */
  transition: all 0.3s ease;
}

.btn-secondary:hover {
  background-color: #7e57c2;
  color: #ffffff;
}

.close-btn-dropzone-card {
    position: absolute;
    top: -1px;
    right: -1px;
    color: white;
    font-weight: bold;
    border: none;
    width: 38px;
    height: 25px;
    border-top-left-radius: 0;
    border-top-right-radius: 10px;
    border-bottom-left-radius: 10px;
    border-bottom-right-radius: 0;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: transparent;
    transition: background-color 0.3s;
    z-index: 2;
}

.card:hover .close-btn-dropzone-card {
    background-color: red;
}



/* Tab Styles */
.tab-button {
  transition: color 0.3s ease, border-color 0.3s ease;
  border-bottom: 2px solid transparent;
}

.tab-button.active {
  color: white;
  border-color: #7e57c2;
}

/* Modal Styles */
.modal-backdrop {
  background-color: rgba(0, 0, 26, 0.7);
  backdrop-filter: blur(8px);
}

/* Tooltip for Draggable Memos */
#memo-tooltip {
  pointer-events: none;
  /* Allows cursor to pass through */
  background-color: #1a237e;
  /* Dark indigo */
  border: 1px solid #5c6bc0;
  /* Indigo border */
}

/* Loader effects */

@keyframes glow {
  0% {
    filter: drop-shadow(0 0 0px #6366f1);
  }
  100% {
    filter: drop-shadow(0 0 8px #6366f1);
  }
}
.animate-glow {
  animation: glow 1s ease-in-out infinite alternate;
}
