:root{

--primary:#2563EB;
--success:#16A34A;
--danger:#DC2626;
--warning:#F59E0B;

--bg:#F4F6F9;
--card:#FFFFFF;
--border:#E5E7EB;
--text:#1E293B;

--sidebar:#1E293B;

}

*{
margin:0;
padding:0;
box-sizing:border-box;
}

body{

font-family:'Poppins',sans-serif;

background:var(--bg);

color:var(--text);

}

.wrapper{

display:flex;

}

.sidebar{

width:250px;

background:var(--sidebar);

min-height:100vh;

position:fixed;

left:0;

top:0;

}

.content{

margin-left:250px;

width:calc(100% - 250px);

}

.topbar{

height:70px;

background:#fff;

display:flex;

align-items:center;

justify-content:space-between;

padding:0 25px;

border-bottom:1px solid var(--border);

}

.page{

padding:25px;

}

.card{

border:none;

border-radius:12px;

box-shadow:0 2px 10px rgba(0,0,0,.05);

}

.btn{

border-radius:10px;

}

.table{

background:#fff;

}

.table thead{

background:#F8FAFC;

}

a{

text-decoration:none;


}

.sidebar .nav-link{

    color:#CBD5E1;

    padding:14px 22px;

    transition:.2s;

    border-left:4px solid transparent;

}

.sidebar .nav-link:hover{

    background:#334155;

    color:#fff;

    border-left:4px solid #2563EB;

}

.sidebar .nav-link.active{

    background:#2563EB;

    color:#fff;

    border-left:4px solid #60A5FA;

}

.sidebar hr{

    margin:15px 20px;

}

.topbar{

position:sticky;

top:0;

z-index:999;

}

.dropdown-toggle{

border-radius:10px;

}

.page{

padding:25px;

min-height:calc(100vh - 70px);

background:#F4F6F9;

}