﻿.loader {
    position: relative;
    overflow: hidden;
    color: transparent;
    background-color: transparent; 
    transition: background-color 0.4s;
}
[v-cloak] {
    display: none;
}

.loader::before {
    content: "";
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background-color: #29baf9;
    animation: fillEffect 10s forwards;
    z-index: 0;
}

@keyframes fillEffect {
     0% {
         left: -100%;
     }

     40% {
         left: -20%;
     }

     100% {
         left: 0%;
     }
 }

.loader div,
.loader svg,
.loader span {
    position: relative;
    z-index: 1;
}

.spin {
    animation: spin 2s linear infinite;
}

@keyframes spin {
     to {
         transform: rotate(360deg);
     }
 }

.aba {
    opacity: 0;
    transform: translateY(10px);
    pointer-events: none;
    height: 0;
    overflow: hidden;
    transition: all 0.3s ease;
}

.aba.visivel {
    opacity: 1;
    transform: translateY(0);
    pointer-events: auto;
    height: auto;
}

.loader-simulado {
    width: 0%;
    animation: carregarBarra 5s ease-in-out forwards;
}

@keyframes carregarBarra {
     0% {
         width: 0%;
         background-color: #e53f3c;
     }
     30% {
         width: 60%;
         background-color: #f2b807;
     }
     100% {
         width: 100%;
         background-color: #19cb98;
     }
 }


.offcanvas.offcanvas-top {
    height: 70vh;
}

.offcanvas.offcanvas-end {
    width: 90vh;
}
.chat-footer {
    position: inherit;
}

.navbar-vertical .navbar-nav .nav-item .nav-link[data-bs-toggle=collapse] .fa-book {
    opacity: 1;
    display: block;
    transition: opacity .3s ease
}

.navbar-vertical .navbar-nav .nav-item .nav-link[data-bs-toggle=collapse] .fa-book-open-cover {
    opacity: 0;
    display: none;
    transition: opacity .3s ease
}

.navbar-vertical .navbar-nav .nav-item .nav-link[data-bs-toggle=collapse][aria-expanded=true] {
    background-color: var(--bs-light-secondary);
    color: #facf4c
}

.navbar-vertical .navbar-nav .nav-item .nav-link[data-bs-toggle=collapse][aria-expanded=true] .fa-book {
    opacity: 0;
    display: none;
    pointer-events: none
}

.navbar-vertical .navbar-nav .nav-item .nav-link[data-bs-toggle=collapse][aria-expanded=true] .fa-book-open-cover {
    opacity: 1;
    display: block;
    pointer-events: none
}