*{
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
}
body {
background: #f4f7fb;
}
.containernew{
    display: flex;
}
/* Slidebar */
.sidebarnew{
    width: 220px;
    background: #0f172a;
    color: white;
    height: 123vh;
//	height: 100%;
    padding: 20px;
}

.sidebarnew h2{
    margin-bottom: 30px;
}
.sidebarnew ul{
    list-style: none;
}
.sidebarnew ul li{
  //  padding: 0px;
    margin-bottom: 10px;
    cursor: pointer;
    border-radius: 8px;
}
.sidebarnew ul li:hover,
sidebarnew ul li.active{
    background: #2563eb;
}
/* Main */

.main{
    flex: 1;
    padding: 20px;
}

/* Topbar*/
.topbar{
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 25px;
}
.topbat h3{
    margin-bottom: 5px;
}

.user{
    background: #e2e8f0;
    padding: 10px 15px;
    border-radius: 10px;
}
/*Cards*/
.cards{
    display: grid;
    grid-template-columns: repeat(auto-fit,minmax(200px, 1fr));
    gap: 20px;
    margin-bottom: 25px;
}

.card{
    background: white;
    padding:20px;
    border-radius: 15px;
    box-shadow: 0 5px 15px rgba(0,0,0,0.05);
}
.card h4{
    margin-bottom: 10px;
}
.card p{
    font-size: 28px;
    font-weight: bold;
}

/*Color*/
.green{border-left: 6px solid #10b981;}
.yellow{ border-left: 6px solid #f59e0b;}
.red {border-left: 6px solid #ef4444;}

/*Grid Section*/

.grid{
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap:20px
}
.box{
    background: white;
    padding: 20px;
    border-radius: 15px;
}
.box h3{
    margin-bottom: 15px;
}
.big{
    font-size: 30px;
    color: #2563eb;
    font-weight: bold;
}
/*Footer*/

.footer-box{
    margin-top: 30px;
    background: linear-gradient(90deg, #2563eb, #38bdf8);
    color: white;
    padding: 20px;
    border-radius: 15px;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.footer-box button{
    background: white;
    color: #2563eb;
    border: none;
    padding: 10px 15px;
    border-radius: 8px;
    cursor: pointer;
    font-weight: bold;
}

/*Responsive*/

    .fullbar{
        display: none;
    }	
	
@media(max-width: 768px){
    .sidebarnew{
        display: none;
    }
    .fullbar{
        display: block;
    }	
}