/*--Assistant Window---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/
.assistant-holder{
    pointer-events:none;
    position:fixed;
    display:none;
    height:100%;
    z-index:12;
    width:25rem;
    right:0px;
    top:0px;
}
.assistant-button{
    box-shadow:0rem 0rem 0.5rem rgba(0, 0, 0, 0.15);
    transform:translateY(0px);
    border-radius:100%;
    position:absolute;
    aspect-ratio:1;
    width:3rem;
    right:1rem;
    bottom:1rem;

    display:none;
    cursor:pointer;
    user-select:none;
    pointer-events:auto;
    transition:ease-in-out 0.1s;

    justify-content:center;
    align-items:center;
}
.assistant-button > img{
    aspect-ratio:1;
    width:1.75rem;
}

.assistant-window{
    box-shadow:0.25rem 0.25rem 0.5rem rgba(0, 0, 0, 0.15);
    border-bottom-left-radius:var(--border-radius-2);
    border-top-left-radius:var(--border-radius-2);
    border:1px solid var(--border-gray-1);
    pointer-events:auto;
    position:absolute;
    overflow:hidden;
    height:calc(100% + 2px);
    right:-110%;
    width:100%;
    top:-1px;
}
.assistant-window-head{
    background-image:linear-gradient(-45deg, var(--accent-blue-2), var(--accent-blue-1), var(--accent-blue-4), var(--accent-blue-9));
    color:var(--background-white);
    font-size:1.25rem;
    height:2.5rem;
    width:100%;

    justify-content:center;
    align-items:center;
    position:relative;
    font-weight:bold; 
    user-select:none;
    display:flex;
}
.assistant-window-close{
    background-image:url("../assets/icons/x.png");
    background-position:center center;
    background-repeat:no-repeat;
    background-size:75%;
    position:absolute;
    cursor:pointer;

    transform:translate(-50%, -50%);
    transition:ease-in-out 0.05s;
    border-radius:100%;
    aspect-ratio:1;
    width:1rem;
    right:0.25rem;
    top:50%;
}
.assistant-window-close:hover{
    transform:translate(-50%, -50%) scale(1.1);
}
.assistant-window-close:active{
    transform:translate(-50%, -50%) scale(1);
}
.assistant-window-body{
    background-color:var(--background-white);
    height:calc(100% - 5.5rem);
    overflow-x:hidden;
    overflow-y:auto;
    width:100%;
}
.assistant-messages-list{
    height:fit-content;
    min-height:100%;
    width:100%;

    flex-direction:column-reverse;
    justify-content:flex-start;
    align-items:flex-end;
    display:flex;
}
.assistant-message{
    justify-content:flex-end;
    align-items:flex-start;
    display:flex;
    width:100%;
    animation:assistant-message-pop-in ease-in-out 0.2s;
}
.assistant-message-body{
    background-color:var(--accent-blue-4);
    border-radius:var(--border-radius-2);
    border-bottom-right-radius:0px;
    color:var(--background-white);
    margin-right:0.5rem;
    margin-bottom:1rem;
    margin-left:0.5rem;
    flex-shrink:0;
    max-width:75%;
    padding:0.5rem;
    height:100%;
}
.bot-message{
    transform:scaleX(-1);
    animation:assistant-message-pop-in-bot ease-in-out 0.2s;
}
.bot-message-body{
    border-radius:var(--border-radius-2);
    background-color:var(--gray-1);
    border-bottom-left-radius:0px;
    transform:scaleX(-1);
}
.assistant-message-thinking-dot-holder{
    justify-content:space-evenly;
    align-items:center;
    display:flex;
    height:1rem;
    width:3rem;
}
.assistant-message-thinking-dot{
    background-color:var(--background-white);
    border-radius:100%;
    aspect-ratio:1;
    height:0.5rem;
    animation:assistant-message-thinking-dot ease-in-out infinite 1s;
}
.assistant-window-foot{
    border-top:1px solid var(--border-gray-1);
    background-color:var(--background-white);
    width:calc(100% - 1rem);
    padding-right:0.5rem;
    padding-left:0.5rem;
    height:3rem;
   

    justify-content:center;
    align-items:center;
    display:flex;
}
.assistant-input{
    background-color:var(--white) !important;
    color:var(--text-gray) !important;
    border-radius:3rem !important;
    width:100%;
}
.assistant-send{
    border:1px solid var(--accent-blue-2);
    margin-left:0.25rem;
    flex-shrink:0;
    width:4rem;
    height:2rem;
    min-height:2rem;

    justify-content:center;
    align-items:center;
    display:flex;
}
.assistant-send > img{
    height:80%;
}

@keyframes assistant-window-slide-in{
    from {right:-110%}
    to   {right:-1px}
}
@keyframes assistant-window-slide-out{
    from {right:-1px}
    to   {right:-110%}
}
@keyframes assistant-message-pop-in{
    0%   {opacity:0; transform:translateX(100%) scale(0.5);}
    60%  {opacity:1; transform:translateX(0%) scale(1.1);}
    100% {opacity:1; transform:scale(1);}
}
@keyframes assistant-message-pop-in-bot{
    0%   {opacity:0; transform:translateX(-100%) scaleX(-1) scale(0.5);}
    60%  {opacity:1; transform:translateX(0%) scaleX(-1) scale(1.1);}
    100% {opacity:1; transform:scaleX(-1) scale(1);}
}
@keyframes assistant-message-thinking-dot{
    0%   {transform:scale(1);}
    25%  {transform:scale(1.5);}
    50%  {transform:scale(1);}
    100% {transform:scale(1);}
}