:root {
  --light:#f6f6f6;
}

/* GPT */
div.gpt{position:fixed;bottom:20px;right:20px;display:flex!Important;justify-content:flex-end;flex-wrap:wrap;gap:10px;z-index:9999;width:0%;}
div.gpt.active{width:450px;max-width:450px;transition:all .4s;}
div.gpt div.chat{box-shadow:rgba(0, 0, 0, 0.1) 0px 0px 25px 0px;border:1px solid var(--border);background:#fff;border-radius:20px;overflow:hidden;width:50%;opacity:0;transition:all .4s;}
div.gpt input:-webkit-autofill, div.gpt input:-webkit-autofill:hover, div.gpt input:-webkit-autofill:focus, div.gpt textarea:-webkit-autofill, div.gpt textarea:-webkit-autofill:hover, div.gpt textarea:-webkit-autofill:focus, div.gpt select:-webkit-autofill, div.gpt select:-webkit-autofill:hover, div.gpt select:-webkit-autofill:focus{-webkit-box-shadow:0 0 0px 1000px var(--light) inset;}
div.gpt.active div.chat{opacity:1;width:100%;transition:all .4s;}
div.gpt div.icon{width:100%;min-width:75px;display:flex;justify-content:flex-end;}
div.gpt div.icon i.fa,div.gpt div.icon span,div.gpt div.icon{background:var(--main-color);border:2px solid #fff;color:#fff;font-size:2rem;display:flex;justify-content:center;align-items:center;height:75px;max-width:75px;aspect-ratio:1/1;border-radius:100%;box-shadow:0 10px 25px rgba(0,0,0,0.12);transition:all .4s;}
div.gpt div.icon svg{height:50px;fill:#fff!Important;}
div.gpt div.icon:hover{cursor:pointer;transform:scale(1.05);border:2px solid var(--main-color);background:#fff;color:var(--main-color);transition:all .4s;}
div.gpt div.icon.red:hover{cursor:pointer;transform:scale(1.05);border:2px solid var(--main-color);background:#fff;color:var(--main-color);transition:all .4s;}
div.gpt div.icon:hover svg{fill:var(--main-color)!important;transition:all .4s;}
div.gpt div.icon.red{background:var(--red);}
div.gpt div.icon.cta_container{aspect-ratio:unset;border-radius:40px;height:unset;min-width:max-content;padding:8px 30px;font-size:1.05rem;font-weight:600;text-transform:uppercase;gap:12px;}
div.gpt div.icon.cta_container svg{height:40px;}
div.gpt form{margin:0px!Important;padding:15px;display:flex;flex-wrap:wrap;gap:15px;}
div.gpt form img.logo{width:90px;margin-bottom:10px;display:none;}
div.gpt form p.title{width:100%;font-size:1.1rem;font-weight:500;display:flex;align-items:center;gap:10px;}
div.gpt form p.title img{width:60px;}
div.gpt div.textarea{display:flex;gap:10px;width:100%;}
div.gpt div.textarea .prompt{width:100%;font-family:var(--font);font-size:0.9rem;border:1px solid var(--border);padding:10px 15px;border-radius:20px;}
div.gpt .submit{background:var(--main-color);border:2px solid var(--main-color)!Important;color:#fff;border-radius:20px!Important;font-weight:500;font-size:14px;text-transform:uppercase;padding:10px 20px!Important;transition:all .4s;}
div.gpt .submit .fa{margin-left:0!Important;}
div.gpt .submit:hover{cursor:pointer;background:#fff;color:var(--main-color);transition:all .4s;}
div.gpt div.result{width:100%;background:#fff;font-size:1rem;display:flex;flex-wrap:wrap;align-content:flex-start;gap:10px;border-radius:5px;height:60vh;overflow-y:scroll;position:relative;}
div.gpt div.result p.message{width:100%;height:fit-content;padding:8px 15px;border-radius:20px;font-size:1rem;line-height:1.4;}
div.gpt div.result p.message a{color:var(--main-color)!Important;text-decoration:underline!Important;font-weight:500!Important;}
div.gpt div.result p.message ul{list-style:disc;margin:10px 0 10px 20px;}
div.gpt div.result p.message img{width:50px;}
div.gpt div.result p.message:nth-child(odd){border:1px solid var(--border);background:var(--grey);}
div.gpt div.result::-webkit-scrollbar{width:8px;}
div.gpt div.result::-webkit-scrollbar-thumb{background:rgb(0,0,0,0.1);border-radius:5px;}
div.gpt div.result::-webkit-scrollbar-track{background:#fff;margin:0px;}
div.gpt div.result div.suggestions{width:100%;position:absolute;bottom:0;right:0;display:flex;justify-content:flex-end;gap:8px;}
div.gpt div.result div.suggestions span{padding:8px 12px;line-height:1;background:var(--grey);border:1px solid var(--border);font-size:0.95rem;font-weight:500;border-radius:20px;transition:all .4s;}
div.gpt div.result div.suggestions span:hover{cursor:pointer;border:1px solid var(--main-color);transition:all .4s;}
div.gpt p.ai_genereted{font-size:11px;font-style:italic;line-height:1;text-align:right;width:100%;}
div.gpt div.policy{display:flex;align-items:center;gap:5px;font-size:13px;color:#333;font-weight:300;}
div.gpt div.policy a{color:unset;text-decoration:underline!Important;}
div.gpt div.policy *:hover{cursor:pointer;}
div.gpt div.cta{width:100%;min-width:max-content;display:flex;justify-content:flex-end;}
div.gpt div.cta p{width:fit-content;background:#fff;padding:6px 20px;text-align:center;border-radius:20px;box-shadow:rgba(0, 0, 0, 0.1) 0px 0px 25px 0px;border:1px solid var(--border);}

@media screen and (max-width:700px){
	div.gpt{width:0%!Important;bottom:5px;right:10px;}
	div.gpt.active{width:92%!important;max-width:100%!important;}
	div.gpt div.result{height:400px;font-size:0.9rem;}
	div.gpt div.icon{min-width:70px;height:70px;}
	div.gpt div.icon i.fa,div.gpt div.icon span,div.gpt div.icon svg{height:48px;font-size:1.6rem;}
	div.gpt p.ai_genereted{font-size:10px;}
	
	div.gpt div.icon.cta_container{font-size:0.85rem;gap:8px;padding:6px 20px;}
	div.gpt div.icon.cta_container svg{height:30px;}
}