*{
    transition:
        background-color .3s ease,
        color .3s ease,
        border-color .3s ease,
        box-shadow .3s ease;
}
.sidebar{
    transition:all .35s ease-in-out;
}
.sidebar.collapsed{
    width:80px;
}

.sidebar.collapsed .logo-text{
    display:none;
}

.sidebar.collapsed .menu-content{
    display:none;
}

.sidebar.collapsed .sidebar-menu a{
    justify-content:center;
}
.main-wrapper{
    transition:margin-left .35s ease;
}
.sidebar-menu li{
    transition:.3s;
}
.sidebar-menu a{
    position:relative;
    overflow:hidden;
}
.sidebar-menu a::before{
    content:"";
    position:absolute;
    left:0;
    top:0;
    width:4px;
    height:100%;
    background:#fff;
    transform:scaleY(0);
    transition:.3s;
}
.sidebar-menu a:hover::before{
    transform:scaleY(1);
}
.top-header{
    animation:slideDown .5s ease;
}
.card,
.dashboard-card{
    transition:.35s;
}
.card:hover,
.dashboard-card:hover{
    transform:translateY(-8px);
    box-shadow:0 20px 45px rgba(13,110,253,.15);
}
.btn{
    position:relative;
    overflow:hidden;
}
.btn::after{
    content:"";
    position:absolute;
    width:0;
    height:100%;
    top:0;
    left:50%;
    background:rgba(255,255,255,.18);
    transition:.4s;
}
.btn:hover::after{
    left:0;
    width:100%;
}
.header-icon{
    transition:.3s;
}
.header-icon:hover{
    transform:rotate(12deg);
}
.profile-img{
    transition:.3s;
}
.profile-img:hover{
    transform:scale(1.08);
}
.form-control{
    transition:.3s;
}
.form-control:focus{
    transform:scale(1.02);
}
.table tbody tr{
    transition:.3s;
}
.table tbody tr:hover{
    transform:scale(1.01);
}
.dropdown-menu{
    animation:fadeDown .25s ease;
}
.login-card{
    animation:zoomIn .6s ease;
}
.login-logo{
    animation:float 3s infinite ease-in-out;
}
.dashboard-icon{
    transition:.3s;
}
.dashboard-card:hover .dashboard-icon{
    transform:rotate(10deg) scale(1.08);
}
.content-area{
    animation:fadeUp .6s;
}
@keyframes fadeUp{
0%{
opacity:0;
transform:translateY(30px);
}
100%{
opacity:1;
transform:translateY(0);
}
}
@keyframes fadeDown{
0%{
opacity:0;
transform:translateY(-20px);
}
100%{
opacity:1;
transform:translateY(0);
}
}
@keyframes slideDown{
0%{
transform:translateY(-100%);
}
100%{
transform:translateY(0);
}
}
@keyframes zoomIn{
0%{
opacity:0;
transform:scale(.8);
}
100%{
opacity:1;
transform:scale(1);
}
}
@keyframes float{
0%{
transform:translateY(0);
}
50%{
transform:translateY(-8px);
}
100%{
transform:translateY(0);
}
}
@keyframes pulse{
0%{
transform:scale(1);
}
50%{
transform:scale(1.05);
}
100%{
transform:scale(1);
}
}
.pulse{
    animation:pulse 2s infinite;
}
.spinner{
    width:45px;
    height:45px;
    border:4px solid #dbeafe;
    border-top:4px solid #0d6efd;
    border-radius:50%;
    animation:spin .8s linear infinite;
}
@keyframes spin{
100%{
transform:rotate(360deg);
}
}
.shake{
    animation:shake .5s;
}
@keyframes shake{
0%{transform:translateX(0);}
20%{transform:translateX(-6px);}
40%{transform:translateX(6px);}
60%{transform:translateX(-6px);}
80%{transform:translateX(6px);}
100%{transform:translateX(0);}
}
.scale-hover{
    transition:.3s;
}
.scale-hover:hover{
    transform:scale(1.05);
}
.glow:hover{
    box-shadow:0 0 20px rgba(13,110,253,.35);
}
.fade-in{
    animation:fadeUp .6s ease;
}
.slide-left{
    animation:slideLeft .5s ease;
}
.slide-right{
    animation:slideRight .5s ease;
}
@keyframes slideLeft{
0%{
opacity:0;
transform:translateX(-35px);
}
100%{
opacity:1;
transform:translateX(0);
}
}
@keyframes slideRight{
0%{
opacity:0;
transform:translateX(35px);
}
100%{
opacity:1;
transform:translateX(0);
}
}
.notify-dot{
    animation:pulse 1.5s infinite;
}
img{
    transition:.3s;
}
img:hover{
    transform:scale(1.02);
}
::-webkit-scrollbar-thumb:hover{
    background:#084298;
}