body{
margin:0;
padding:0;
font-family:'Segoe UI',sans-serif;
background:#f4f6f9;
overflow-x:hidden;
}

/* SIDEBAR */

.sidebar{
position:fixed;
left:0;
top:0;
width:220px;
height:100vh;
background:#06112b;
padding-top:15px;
z-index:999;
}

/* LOGO */

.sidebar-logo{
width:110px;
display:block;
margin:10px auto 20px;
border-radius:10px;
}

/* MENU */

.sidebar-menu{
list-style:none;
padding:0;
margin-top:10px;
}

.sidebar-menu li{
width:100%;
}

.sidebar-menu li a{
display:block;
padding:14px 20px;
color:#fff;
text-decoration:none;
font-size:15px;
font-weight:600;
border-bottom:1px solid rgba(255,255,255,0.05);
transition:0.3s;
}

.sidebar-menu li a:hover{
background:#0d6efd;
padding-left:28px;
}

/* CONTENT */

.content-area{
margin-left:220px;
padding:15px;
}

/* TOP HEADER */

.top-header{
background:#4093d0;
padding:18px 20px;
border-radius:12px;
color:#fff;
font-size:18px;
font-weight:bold;
margin-bottom:15px;
box-shadow:0 2px 8px rgba(0,0,0,0.1);
}

/* SUMMARY CARDS */

.summary-card{
background:#fff;
padding:18px;
border-radius:14px;
text-align:center;
margin-bottom:15px;
box-shadow:0 2px 8px rgba(0,0,0,0.08);
min-height:110px;
}

.summary-title{
font-size:16px;
color:#666;
margin-bottom:15px;
}

.summary-value{
font-size:30px;
font-weight:bold;
color:#2f7dbd;
}

/* ERP PANEL */

.erp-panel{
background:#fff;
border-radius:15px;
box-shadow:0 2px 8px rgba(0,0,0,0.08);
overflow:hidden;
margin-top:10px;
}

/* PANEL HEADER */

.panel-header{
padding:15px;
font-size:20px;
font-weight:bold;
border-bottom:1px solid #ddd;
color:#102542;
}

/* PANEL BODY */

.panel-body{
padding:15px;
}

/* FORM CONTROLS */

.form-control-custom{
height:40px;
border-radius:7px;
border:1px solid #ced4da;
}

/* TABLE */

.salary-table{
width:100%;
border-collapse:collapse;
margin-top:15px;
}

.salary-table th{
background:#f1f3f5;
padding:10px;
font-size:13px;
border:1px solid #dcdcdc;
text-align:center;
}

.salary-table td{
padding:4px;
border:1px solid #dcdcdc;
}

/* INPUTS */

.grid-input{
width:100%;
height:30px;
border:1px solid #cfd4da;
border-radius:4px;
padding:5px;
text-align:center;
font-size:13px;
}

/* SAVE BUTTON */

.save-section{
text-align:center;
margin-top:25px;
}

.save-btn{
background:#2eaf5d;
border:none;
color:#fff;
padding:10px 35px;
font-size:15px;
font-weight:bold;
border-radius:8px;
transition:0.3s;
}

.save-btn:hover{
background:#24914b;
}

/* TOTAL BOXES */

.total-card{
background:#fff;
padding:10px;
border-radius:10px;
box-shadow:0 2px 5px rgba(0,0,0,0.08);
margin-bottom:10px;
}

.total-card label{
display:block;
font-size:13px;
font-weight:600;
margin-bottom:5px;
color:#555;
}

.total-input{
background:#f9fafb !important;
font-weight:bold;
text-align:center;
height:36px;
}

/* CHARTS */

.chart-box{
background:#fff;
padding:15px;
border-radius:15px;
margin-top:15px;
box-shadow:0 2px 8px rgba(0,0,0,0.08);
}

.chart-box h5{
font-size:16px;
font-weight:bold;
margin-bottom:15px;
}

/* RESPONSIVE */

@media(max-width:991px){

.sidebar{
width:100%;
height:auto;
position:relative;
}

.content-area{
margin-left:0;
}

.salary-table{
min-width:1200px;
}

}