*{margin:0;padding:0;box-sizing:border-box}body{font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;background-color:#f0f2f5;min-height:100vh}#root{min-height:100vh}.dashboard{display:flex;min-height:100vh}.sidebar{width:250px;background:linear-gradient(180deg,#1a1f36,#121629);color:#fff;padding:20px 0;position:fixed;height:100vh;overflow-y:auto}.logo{padding:0 20px 30px;border-bottom:1px solid rgba(255,255,255,.1);margin-bottom:20px}.logo h2{font-size:1.5rem;font-weight:600;color:#fff}.nav-menu{display:flex;flex-direction:column;gap:5px}.nav-item{display:flex;align-items:center;gap:12px;padding:12px 20px;color:#ffffffb3;text-decoration:none;transition:all .3s ease;font-size:.95rem}.nav-item:hover{background:#ffffff1a;color:#fff}.nav-item.active{background:#6366f133;color:#818cf8;border-left:3px solid #818cf8}.nav-item .icon{font-size:1.2rem}.main-content{flex:1;margin-left:250px;padding:30px;background:#f0f2f5}.header{display:flex;justify-content:space-between;align-items:center;margin-bottom:30px}.header-left h1{font-size:1.8rem;color:#1a1f36;margin-bottom:5px}.header-left .date{color:#6b7280;font-size:.9rem}.header-right{display:flex;align-items:center;gap:20px}.header-right .time{color:#6b7280;font-size:.95rem}.user-avatar{width:45px;height:45px;background:linear-gradient(135deg,#6366f1,#8b5cf6);border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff;font-weight:600;font-size:.9rem}.stats-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;margin-bottom:30px}.stat-card{background:#fff;border-radius:16px;padding:24px;display:flex;align-items:center;gap:20px;box-shadow:0 1px 3px #0000001a;transition:transform .3s ease,box-shadow .3s ease}.stat-card:hover{transform:translateY(-5px);box-shadow:0 10px 25px #0000001a}.stat-icon{width:60px;height:60px;border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:1.8rem}.stat-icon.users{background:linear-gradient(135deg,#dbeafe,#bfdbfe)}.stat-icon.revenue{background:linear-gradient(135deg,#d1fae5,#a7f3d0)}.stat-icon.orders{background:linear-gradient(135deg,#fef3c7,#fde68a)}.stat-icon.visitors{background:linear-gradient(135deg,#ede9fe,#ddd6fe)}.stat-info h3{font-size:.85rem;color:#6b7280;font-weight:500;margin-bottom:5px}.stat-value{font-size:1.8rem;font-weight:700;color:#1a1f36;margin-bottom:5px}.stat-change{font-size:.8rem;font-weight:500}.stat-change.positive{color:#10b981}.stat-change.negative{color:#ef4444}.content-grid{display:grid;grid-template-columns:2fr 1fr;gap:20px}.card{background:#fff;border-radius:16px;padding:24px;box-shadow:0 1px 3px #0000001a}.card-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}.card-header h2{font-size:1.1rem;color:#1a1f36;font-weight:600}.btn-view-all{background:#f3f4f6;border:none;padding:8px 16px;border-radius:8px;color:#6b7280;font-size:.85rem;cursor:pointer;transition:all .3s ease}.btn-view-all:hover{background:#e5e7eb;color:#1a1f36}.orders-table table{width:100%;border-collapse:collapse}.orders-table th,.orders-table td{padding:14px 12px;text-align:left}.orders-table th{color:#6b7280;font-weight:500;font-size:.85rem;border-bottom:1px solid #e5e7eb}.orders-table td{color:#1a1f36;font-size:.9rem;border-bottom:1px solid #f3f4f6}.orders-table tr:last-child td{border-bottom:none}.orders-table tr:hover{background:#f9fafb}.status-badge{padding:6px 12px;border-radius:20px;font-size:.75rem;font-weight:500;text-transform:capitalize}.status-completed{background:#d1fae5;color:#059669}.status-pending{background:#fef3c7;color:#d97706}.status-processing{background:#dbeafe;color:#2563eb}.quick-stats-content{display:flex;flex-direction:column;gap:20px}.quick-stat{display:flex;flex-direction:column;gap:8px}.quick-stat-label{color:#6b7280;font-size:.85rem}.quick-stat-value{color:#1a1f36;font-size:1.1rem;font-weight:600}.progress-bar{height:8px;background:#e5e7eb;border-radius:4px;overflow:hidden}.progress{height:100%;background:linear-gradient(90deg,#6366f1,#8b5cf6);border-radius:4px;transition:width .5s ease}@media(max-width:1200px){.stats-grid{grid-template-columns:repeat(2,1fr)}.content-grid{grid-template-columns:1fr}}@media(max-width:768px){.sidebar{width:70px;padding:15px 0}.logo h2,.nav-item span:not(.icon){display:none}.nav-item{justify-content:center;padding:15px}.main-content{margin-left:70px;padding:20px}.stats-grid{grid-template-columns:1fr}.header{flex-direction:column;align-items:flex-start;gap:15px}}