@import url("https://fonts.googleapis.com/css2?family=Roboto&display=swap");
body, button {
    font-family: "Tangerine", sans-serif;
}

        
:root{
    --offcanvas-width: 270px;
    --topBarnavHeight: 56px;
}

.sidebar-nav{
    width: var(--offcanvas-width);
}

.sidebar-link{
    display: flex;
    align-items: center;

}


.sidebar-link .right-icon{
    display: inline-flex;
    transition: all ease 0.25s;

}

.sidebar-link[aria-expanded="true"] .right-icon{
    transform: rotate(180deg);
}



@media (min-width:992px)  {

    body{
        overflow: auto !important;
    }

    .offcanvas-backdrop::before{
        display: none;
    }

    .sidebar-nav{
        transform: none;
        visibility: visible !important;
        top: var(--topBarnavHeight);
        height: calc(100% - var(--topBarnavHeight));
    }

    main{
        margin-left: var(--offcanvas-width);
    }
}

.dropdown-item {
    min-width: 100%;
}
/**/
.neonSuccess {
    animation-duration: 1200ms;
    animation-name: blinkSuccess;
    animation-iteration-count: infinite;
    animation-direction: alternate;
    -webkit-animation:blinkSuccess 1200ms infinite; /* Safari and Chrome */
}
@keyframes blinkSuccess {
    from {
        color:green;
    }
    to {
        color:white;
    }
}
@-webkit-keyframes blinkSuccess {
    from {
        color:green;
    }
    to {
        color:white;
    }
}


.neonDanger {
    animation-duration: 1200ms;
    animation-name: blinkDanger;
    animation-iteration-count: infinite;
    animation-direction: alternate;
    -webkit-animation:blinkDanger 1200ms infinite; /* Safari and Chrome */
}
@keyframes blinkDanger {
    from {
        color:#dc3545;
    }
    to {
        color:white;
    }
}
@-webkit-keyframes blinkDanger {
    from {
        color:#dc3545;
    }
    to {
        color:white;
    }
}


.neonWarning {
    animation-duration: 1200ms;
    animation-name: blinkWarning;
    animation-iteration-count: infinite;
    animation-direction: alternate;
    -webkit-animation:blinkWarning 1200ms infinite; /* Safari and Chrome */
}
@keyframes blinkWarning {
    from {
        color:#ffc107;
    }
    to {
        color:white;
    }
}
@-webkit-keyframes blinkWarning {
    from {
        color:#ffc107;
    }
    to {
        color:white;
    }
}