.dpt-chat.uploadButtonContainer {
    display: inline-block;
    position: relative;
    overflow: hidden;
}

.dpt-chat.uploadButtonContainer input[type=file] {
    left: 0;
    top: 0;
    opacity: 0;
    position: absolute;
    /*font-size: 90px;*/
}

/*3 Dots animations*/
@keyframes blinkdot {
    0% { opacity: .2; }
    20% { opacity: 1; }
    100% { opacity: .2; }
}
.loading .dot {
    animation-name: blinkdot;
    animation-duration: 1.4s;
    animation-iteration-count: infinite;
    animation-fill-mode: both;
}
.loading .dot:nth-child(2) {
    animation-delay: .2s;
}
.loading .dot:nth-child(3) {
    animation-delay: .4s;
}

/*Text Glitch*/
div.glitch{
    animation: glitch 1s linear infinite;
}

@keyframes glitch{
    2%,64%{
        transform: translate(2px,0) skew(0deg);
    }
    4%,60%{
        transform: translate(-2px,0) skew(0deg);
    }
    62%{
        transform: translate(0,0) skew(5deg);
    }
}

div.glitch:before,
div.glitch:after{
    content: attr(title);
    position: absolute;
    left: 0;
}

div.glitch:before{
    animation: glitchTop 1s linear infinite;
    clip-path: polygon(0 0, 100% 0, 100% 33%, 0 33%);
    -webkit-clip-path: polygon(0 0, 100% 0, 100% 33%, 0 33%);
}

@keyframes glitchTop{
    2%,64%{
        transform: translate(2px,-2px);
    }
    4%,60%{
        transform: translate(-2px,2px);
    }
    62%{
        transform: translate(13px,-1px) skew(-13deg);
    }
}

div.glitch:after{
    animation: glitchBotom 1.5s linear infinite;
    clip-path: polygon(0 67%, 100% 67%, 100% 100%, 0 100%);
    -webkit-clip-path: polygon(0 67%, 100% 67%, 100% 100%, 0 100%);
}

@keyframes glitchBotom{
    2%,64%{
        transform: translate(-2px,0);
    }
    4%,60%{
        transform: translate(-2px,0);
    }
    62%{
        transform: translate(-22px,5px) skew(21deg);
    }
}


/* Chat */
.chat-container {
    height: 100vh;
    height: -webkit-fill-available;
    max-height: -webkit-fill-available;
    /*height: calc(var(--dvh, 1vh) * 100);*/
    /*max-height: calc(var(--dvh, 1vh) * 100);*/

    display:-webkit-box;
    display:flex;
    -webkit-box-orient:vertical;
    flex-direction:column;
}

.chat-scroll-container {

    overflow:hidden;
    overflow-y: scroll;
    min-height: 0;
    -webkit-box-flex: 1;
    flex:1;

    scroll-behavior: smooth;

    overflow-scrolling: auto;
    -webkit-overflow-scrolling: touch;

    /*max-height: 100px;*/

    /*max-height: 100%;*/
}

:root {
    /*Calculated dynamically*/
    --dvh: 1vh;
}

/*Full height = Current available inner screen size*/
.fh {
    height: 100vh;
    height: calc(var(--dvh, 1vh) * 100);
}