:root { --light:#f8f9fc; --dark:#5a5c69; }
* { margin:0; padding:0; box-sizing:border-box; }
body { font-family:'Segoe UI',Tahoma,Geneva,Verdana,sans-serif; background:var(--light); color:var(--dark); }
a { text-decoration:none; color:inherit; }
.sidebar { width:250px; height:100vh; background:var(--sidebar); color:#fff; position:fixed; left:0; top:0; overflow-y:auto; transition:.3s; z-index:1000; }
.sidebar-brand { padding:1.5rem; font-size:1.1rem; font-weight:700; border-bottom:1px solid rgba(255,255,255,.1); }
.sidebar-menu { list-style:none; padding:1rem 0; }
.sidebar-menu li a { display:block; padding:.75rem 1.5rem; color:rgba(255,255,255,.8); transition:.2s; border-left:4px solid transparent; }
.sidebar-menu li a:hover, .sidebar-menu li a.active { background:rgba(255,255,255,.1); color:#fff; border-left-color:#fff; }
.main-content { margin-left:250px; min-height:100vh; transition:.3s; }
.header { background:#fff; height:70px; display:flex; align-items:center; justify-content:space-between; padding:0 1.5rem; box-shadow:0 .15rem 1.75rem 0 rgba(58,59,69,.15); position:sticky; top:0; z-index:900; }
.toggle-btn { font-size:1.5rem; cursor:pointer; display:none; }
.page-content { padding:1.5rem; }
.card { background:#fff; border-radius:.5rem; box-shadow:0 .15rem 1.75rem 0 rgba(58,59,69,.1); border:none; margin-bottom:1.5rem; }
.card-header { background:var(--primary); color:#fff; padding:1rem 1.25rem; border-radius:.5rem .5rem 0 0 !important; font-weight:600; }
.card-body { padding:1.25rem; }
.stat-card { border-left:.25rem solid var(--primary); padding:1rem; background:#fff; border-radius:.5rem; box-shadow:0 .15rem 1.75rem 0 rgba(58,59,69,.1); margin-bottom:1rem; }
.stat-label { font-size:.8rem; font-weight:700; text-transform:uppercase; color:var(--dark); }
.stat-value { font-size:1.5rem; font-weight:700; color:#333; }
.btn-theme { background:var(--primary); color:#fff !important; border:none; }
.btn-theme:hover { opacity:.9; }
.login-wrap { min-height:100vh; display:flex; align-items:center; justify-content:center; background:linear-gradient(135deg, var(--sidebar) 0%, var(--primary) 100%); }
.login-card { width:100%; max-width:450px; background:#fff; padding:2rem; border-radius:1rem; box-shadow:0 1rem 3rem rgba(0,0,0,.3); }
@media (max-width:768px) {
    .sidebar { left:-250px; }
    .sidebar.open { left:0; }
    .main-content { margin-left:0; }
    .toggle-btn { display:block; }
}
