.scroll-list-container{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:50%;height:75%;background-color:#131313;padding:10px;border-radius:10px;filter:drop-shadow(0 0 25px #21A698)}.scroll-list{max-height:100%;overflow-y:auto;padding:16px}.noChatsFallback{text-align:center;color:#3d3d3d;margin-top:27.5%}.scroll-list::-webkit-scrollbar{width:8px}.scroll-list::-webkit-scrollbar-track{background:black}.scroll-list::-webkit-scrollbar-thumb{background:#21A698;border-radius:4px}.no-scrollbar::-webkit-scrollbar{display:none}.no-scrollbar{-ms-overflow-style:none;scrollbar-width:none}.item{padding:16px;background-color:black;border-radius:10px;margin-bottom:1rem;transition:all .3s}.item.selected{background-color:#21A698;transition:all .3s}.item-text{color:white;margin:0}@media (min-width:993px) and (max-width:1200px){.scroll-list-container{width:75%}}@media (max-width:992px){.scroll-list-container{width:90%}}main{display:flex;flex-direction:column;align-items:center}.notAtTheTop{backdrop-filter:blur(5px);transition:all .3s}header{position:fixed;width:100%;flex-direction:row;padding:10px;z-index:1;justify-content:space-between;transition:all .3s}header,header .headerDiv{display:flex;align-items:center}header .headerDiv img{height:40px;margin-right:10px}header .headerDiv button:first-child{margin-right:10px}header input{position:absolute;left:50%;transform:translateX(-50%);width:25%;text-align:center;transition:.3s;border-bottom:1px solid rgba(0,0,0,0)}header input:focus{outline:none;border-bottom:1px solid #21a698}header .crudButton{transition:all .3s}header .crudButton:hover{filter:drop-shadow(0 0 10px #21A698)}header .crudButton:active{filter:drop-shadow(0 0 10px #147373)}header .logOut{margin-right:0!important}#chatList{position:fixed;z-index:2;backdrop-filter:blur(5px);width:100%;height:100%}#chatList h1{text-align:center;margin-top:30px}#chat{width:50%;display:flex;flex-direction:column;align-items:center;min-height:50vh;margin-bottom:100px}.aiMessage,.userMessage{text-align:left;width:100%;margin-top:25px;opacity:0;transform:translateY(-50%);word-wrap:break-word}.aiMessage h1,.aiMessage h2,.userMessage h1,.userMessage h2{color:#21a698}.aiMessage h3,.aiMessage h4,.userMessage h3,.userMessage h4{color:#147373}.aiMessage div,.userMessage div{background-color:rgba(19,19,19,.8);border:1px solid hsla(0,0%,100%,.05);padding:20px;border-radius:10px;box-shadow:0 4px 15px rgba(0,0,0,.2);backdrop-filter:blur(10px)}.aiMessage div pre,.userMessage div pre{width:100%}.aiMessage div a,.aiMessage div strong,.userMessage div a,.userMessage div strong{color:#21a698}.aiMessage div section,.userMessage div section{overflow-x:scroll;background-color:#222!important}.aiMessage div section::-webkit-scrollbar,.userMessage div section::-webkit-scrollbar{width:8px}.aiMessage div section::-webkit-scrollbar-track,.userMessage div section::-webkit-scrollbar-track{background:#242424;border-bottom-left-radius:10px;border-bottom-right-radius:10px}.aiMessage div section::-webkit-scrollbar-thumb,.userMessage div section::-webkit-scrollbar-thumb{background:#21a698;border-bottom-left-radius:10px;border-bottom-right-radius:10px}.aiMessage div hr,.userMessage div hr{margin:50px 0;border:none;border-top:1px solid hsla(0,0%,100%,.1)}.aiMessage div p strong,.userMessage div p strong{color:#147373;font-weight:600;font-size:1.1rem}#codeInfo{display:flex;justify-content:space-between;align-items:center;background-color:rgba(29,29,29,.9);border:1px solid hsla(0,0%,100%,.08);border-bottom:none;padding:8px 15px;border-top-left-radius:8px;border-top-right-radius:8px;margin-bottom:0}#codeInfo h4{margin:0;color:#21a698;font-size:.85rem;font-weight:500;text-transform:uppercase;letter-spacing:.5px}#codeInfo button{background-color:rgba(33,166,152,.1);border:1px solid rgba(33,166,152,.3);color:#21a698;padding:4px 10px;border-radius:5px;font-size:.75rem;font-weight:500;transition:all .2s ease;cursor:pointer}#codeInfo button:hover{background-color:rgba(33,166,152,.2);border-color:rgba(33,166,152,.5);transform:translateY(-1px);box-shadow:0 2px 8px rgba(33,166,152,.2)}#codeInfo button:active{transform:translateY(0);box-shadow:0 1px 4px rgba(33,166,152,.3)}.greeting{display:flex;flex-direction:column;width:50%;position:relative;top:75px}.greeting img{margin:0 auto}.greeting h5{text-align:center;color:#21a698;font-size:1.1rem;font-weight:400;margin-top:20px}.messageBox{width:50%;border-radius:10px;display:flex;flex-direction:column;background-color:#131313;height:auto;position:sticky;margin-top:100px;bottom:50px;box-shadow:0 4px 15px rgba(0,0,0,.2);border:1px solid hsla(0,0%,100%,.05)}.messageBox textarea{width:100%;height:auto;resize:none;max-height:300px;padding:15px;background-color:rgba(0,0,0,0);border:none;color:#e0e0e0;font-family:inherit;font-size:1rem}.messageBox textarea::-webkit-scrollbar{width:8px}.messageBox textarea::-webkit-scrollbar-track{background:#242424;border-radius:10px}.messageBox textarea::-webkit-scrollbar-thumb{background:#21a698;border-radius:10px}.messageBox textarea:focus{outline:none}.messageBox textarea::placeholder{color:rgba(20,115,115,.7)}.messageBox .promptBoxButtons{height:auto;justify-content:right;display:flex;margin:10px;padding:5px 0}.messageBox .promptBoxButtons img{margin-left:auto;margin-right:auto}.messageBox .promptBoxButtons button{width:48px;height:48px;background-color:rgba(29,29,29,.8);border:1px solid hsla(0,0%,100%,.05);border-radius:8px;transition:all .3s ease;margin-left:10px}.messageBox .promptBoxButtons button:hover{cursor:pointer;background-color:rgba(45,45,45,.9);border-color:rgba(33,166,152,.3)}.messageBox .promptBoxButtons button:active{transform:scale(.95)}.messageBox .promptBoxButtons .active{background-color:rgba(45,45,45,.9);border-color:rgba(33,166,152,.3)}@media(min-width:993px)and (max-width:1200px){#chat,.greeting,.messageBox{width:75%}}@media(max-width:992px){#chat,.greeting{width:95%}.leftHeaderDiv{flex-direction:column;justify-content:center}.leftHeaderDiv button{width:100px;margin:0!important}.messageBox{width:100%;bottom:0;margin-top:50px;border-bottom-right-radius:0;border-bottom-left-radius:0}.messageBox button{width:20%;border-bottom-right-radius:0}#codeInfo{padding:6px 12px}#codeInfo h4{font-size:.8rem}#codeInfo button{padding:3px 8px;font-size:.7rem}}@media(max-width:768px){.greeting{top:50px}.greeting img{width:300px!important;height:300px!important}.greeting h5{font-size:1rem}.messageBox{margin-top:75px}.messageBox textarea{padding:12px}#codeInfo{padding:5px 10px}#codeInfo h4{font-size:.75rem}#codeInfo button{padding:2px 6px;font-size:.65rem}}