:root{--primary:#4f46e5;--primary-hover:#4338ca;--bg-color:#f3f4f6;--sidebar-bg:#1f2937;--text-main:#111827;--text-muted:#6b7280;--card-bg:#fff;--success:#10b981;--warning:#f59e0b;--danger:#ef4444}*{box-sizing:border-box;margin:0;padding:0}body{background-color:var(--bg-color);color:var(--text-main);font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif;line-height:1.5}.layout-container{min-height:100vh;display:flex}.sidebar{background-color:var(--sidebar-bg);color:#fff;flex-direction:column;width:250px;height:100vh;transition:all .3s;display:flex;position:fixed}.sidebar-header{text-align:center;letter-spacing:2px;border-bottom:1px solid #ffffff1a;padding:1.5rem;font-size:1.5rem;font-weight:800}.sidebar-nav{flex:1;padding:1rem 0}.nav-item{color:#ffffffb3;padding:1rem 1.5rem;font-weight:500;text-decoration:none;transition:all .2s;display:block}.nav-item:hover,.nav-item.active{color:#fff;border-left:4px solid var(--primary);background-color:#ffffff1a}.main-content{flex:1;margin-left:250px;padding:2rem}.page-title{color:var(--text-main);margin-bottom:1.5rem;font-size:1.875rem;font-weight:700}.dashboard-grid{grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:1.5rem;margin-bottom:2rem;display:grid}.stat-card{background-color:var(--card-bg);border-radius:12px;padding:1.5rem;transition:transform .2s;box-shadow:0 4px 6px -1px #0000000d}.stat-card:hover{transform:translateY(-5px)}.stat-title{color:var(--text-muted);text-transform:uppercase;margin-bottom:.5rem;font-size:.875rem;font-weight:600}.stat-value{color:var(--text-main);font-size:2rem;font-weight:700}.stat-value.success{color:var(--success)}.stat-value.warning{color:var(--warning)}.stat-value.danger{color:var(--danger)}.table-container{background:var(--card-bg);border-radius:12px;overflow:hidden;box-shadow:0 4px 6px -1px #0000000d}.data-table{border-collapse:collapse;width:100%}.data-table th,.data-table td{text-align:left;border-bottom:1px solid #e5e7eb;padding:1rem 1.5rem}.data-table th{color:var(--text-muted);text-transform:uppercase;letter-spacing:.05em;background-color:#f9fafb;font-size:.75rem;font-weight:600}.data-table tr:hover{background-color:#f9fafb}.badge{border-radius:9999px;padding:.25rem .75rem;font-size:.75rem;font-weight:600}.badge-success{color:#065f46;background-color:#d1fae5}.badge-warning{color:#92400e;background-color:#fef3c7}.badge-danger{color:#991b1b;background-color:#fee2e2}@media (max-width:768px){.layout-container{flex-direction:column}.sidebar{z-index:50;width:100%;height:auto;position:sticky;top:0}.sidebar-header{justify-content:center;padding:1rem;flex-direction:row!important;gap:1rem!important}.sidebar-header img{width:40px!important;height:40px!important}.sidebar-header h2{font-size:1.2rem!important}.sidebar-nav{white-space:nowrap;-ms-overflow-style:none;scrollbar-width:none;padding:0;display:flex;overflow-x:auto}.sidebar-nav::-webkit-scrollbar{display:none}.nav-item{border-bottom:3px solid #0000;border-left:none;padding:.75rem 1rem;display:inline-block}.nav-item:hover,.nav-item.active{border-left:none;border-bottom:3px solid var(--primary)}.main-content{margin-left:0;padding:1rem}.dashboard-grid{grid-template-columns:1fr}.table-container{-webkit-overflow-scrolling:touch;overflow-x:auto}.page-title{font-size:1.5rem}}