/* login page css */
.sign-up-box{
    width: 450px;
    min-width: 300px !important;
    max-width: 460px !important;
}
.signup-box-top{
    width: 100%;
    display: flex;
    justify-content: center;
    padding: 10px !important;
}
.signup-box-top .boxed-logo{
    width: 100px;
    height: 80px;

}
.social-btn-grp a{
min-width: 100%;
}


/* chat css */


.chat-box.author-speech {
    justify-self: flex-end !important;
 width: calc(100% - 100px);

}
.chat-box.ai-speech {
    width: calc(100% - 60px);
}
.studio-image-preview{
    border: 1px rgba(124, 123, 123, 0.495) solid;
     border-radius: 10px;
      min-height: 100%; 

  }
   .image-card {
    padding: 3px;
    margin-top:5px;
    border-radius: 10px;
    position: relative;
    overflow: hidden;
    
  
  }
  
    .image-card img, .image-card video {
    border-radius: 8px;
    transition: .5s ease;
    width: 100%;
    height: 100%;
  }
  
    .image-card:hover img {
    transform: scale(1.05);
  }
  
  
    .image-card .image-icons {
    position: absolute;
    top: 50%;
    left: 50%;
    display: flex;
   

    opacity: 0;
    transform: translate(-50%, -50%);
  }
  
    .image-card .image-icons button {
    margin-right: 10px;
    margin-left: 10px;
    padding: 0px !important;
  }
  
    .image-card .image-icons i {
        font-size: 18px;
    background-color: rgb(61, 57, 57);
    border-radius: 50%;
    padding: 8px;
    color: #fff;
    font-weight: lighter;
  }
  
    .image-card:hover .image-icons {
    opacity: 1;
  
  }
  /* avatar css (sai) */
.avatar-image-preview{
  border: 1px rgba(124, 123, 123, 0.495) solid;
   border-radius: 10px;
    min-height: 200px; 
   background-color: rgb(184, 189, 193);
}
.avatar-modal-container{
  height: 200px; 
  overflow-y: auto;
  overflow-x: hidden; 
  scrollbar-width: 0px;
}
.avatar-modal-container .card img{
  width:"100%";
  height: 100px;
    border-radius: 5px;

}
.avatar-modal .modal-dialog .modal-content {
 
  width: fit-content;
}
.avatar-modal .modal-dialog .modal-body{
  width: auto;
}
.avatar-modal .modal-dialog .modal-body img{
width: 100%;
height: 100%;
min-width: 250px;
min-height: 250px;
}

.avatar-modal .rbt-static-bar.p-studio {

  position: relative !important;
  background: none !important;
  width: 100% !important;
  box-shadow:none !important;
 

 
  transition: all 0.4s ease;
  text-align: center;
}
.studio-image-preview label{
  border: 0.5px solid black;
  border-radius: 30px;
  padding: 5px;
  background-color: linear-gradient(94deg, #dd00ac 10.66%, #7130c3 53.03%, #410093 96.34%, rgba(255, 0, 238, 0.26) 191.41%, rgba(255, 59, 212, 0) 191.43%) !important;
}


/* css code for ai-ppt */

.step {
  display: none;
}

.active {
  display: block;
}



.progress {
  margin-bottom: 20px;
}


/* custom */

.radio-group {
  
  justify-content: space-around;
  gap: 10px;
}
.radio-group div.col-md-4{
  
  max-width: fit-content;
}

.radio-label {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
  background: #f1f5f9;
  padding: 10px;
  border-radius: 8px;
  cursor: pointer;
  transition: 0.3s ease;
  
  border: #374151 0.5px solid;
}

.radio-label:hover {
  background: #e2e8f0;
}

.radio-label input[type="radio"] {
  display: none;
}
.radio-label input {
    margin-right: 0px;
  width:20% ;
}

.custom-radio {
  width: 18px;
  height: 18px;
  border: 2px solid #64748b;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: 0.3s ease;
}

.custom-radio::after {
  content: "";
  width: 10px;
  height: 10px;
  background: #2563eb;
  border-radius: 50%;
  transform: scale(0);
  transition: 0.3s ease;
}

input:checked + .custom-radio {
  border-color: #2563eb;
}

input:checked + .custom-radio::after {
  transform: scale(1);
}

.radio-text {
  display: flex;
   gap: 10px;
  align-items: baseline;
  flex: 1;
  font-size: 14px;
  color: #374151;
}
.templates div.row{
  max-height:400px;
  overflow-y: scroll;
  overflow-x: hidden;
}
.ppt-template-container{
  min-height: 140px;
  display: flex;
  margin-bottom: 0px !important;
  justify-content: center;
  align-items: center;
  padding: 0px !important;
 border: 1px #64748b solid;
 transition: all 0.19s linear;
}
.ppt-template-container.active{
  scale: 0.98;
  border: 4px #02a1f7 solid;
  box-shadow: 0 0 10px rgba(0, 0, 255, 0.5);

}
.show-all-ppt .ppt-template-container{
  min-height: 140px;
  display: flex;
  flex-direction: column;
  margin-bottom: 0px !important;
  justify-content: center;
  align-items: center;
  padding: 10px !important;
 border: 1px #64748b solid;
 transition: all 0.19s linear;
  background-color: rgba(122, 121, 122, 0.47) !important;

}

/* show all ppt css  */
.ppt-template-container .show-ppt{
  display: flex;
  justify-content: center;
  align-items: center;
    background-color: #fff;
    width: 35px;
    height: 35px;
    border-radius: 50%;
    transition: all 0.2s linear;
}
.ppt-template-container:hover .show-ppt{
    border-radius: 20%;
}
.ppt-template-container .title{
    max-width: 100%;
    overflow: hidden;
    transition: all 0.2s linear;
}
.ppt-template-container:hover .title{
 font-weight: bold;
}



/* ai writing tools  */
.writing-tool-tabs{
  display: flex;
  flex-wrap: nowrap;
    overflow-x: auto;
    white-space: nowrap;
    -ms-overflow-style: none; /* Hide scrollbar for IE and Edge */
    scrollbar-width: none;
  gap: 8px !important;
  padding-inline-start: 10px;
}
.writing-tool-tabs .nav-item a
{
  transition: all 1s linear;
}
.writing-tool-tabs .nav-item a.active{
  background: transparent;
  color: black;
  border: #c202f7 1px solid;
  transform: scale(1.02);
}

/* show all ppt css  */
.ppt-template-container .show-ppt{
  display: flex;
  justify-content: center;
  align-items: center;
    background-color: #fff;
    width: 35px;
    height: 35px;
    border-radius: 50%;
    transition: all 0.2s linear;
}
.ppt-template-container:hover .show-ppt{
    border-radius: 20%;
}
.ppt-template-container .title{
    max-width: 100%;
    overflow: hidden;
    transition: all 0.2s linear;
}
.ppt-template-container:hover .title{
 font-weight: bold;
}