:root{--bg-dark: #0f172a;--bg-gradient: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);--sidebar-blue: rgba(15, 23, 42, .95);--primary-blue: #3b82f6;--accent-cyan: #06b6d4;--text-primary: #f8fafc;--text-secondary: #94a3b8;--border-light: rgba(255, 255, 255, .1);--glass: blur(16px) saturate(180%);--card-bg: rgba(30, 41, 59, .5);--success: #10b981;--warning: #f59e0b;--danger: #ef4444}*{margin:0;padding:0;box-sizing:border-box;font-family:Inter,system-ui,-apple-system,sans-serif}body{background:var(--bg-gradient);color:var(--text-primary);min-height:100vh;overflow-x:hidden}.layout{display:flex;min-height:100vh}.sidebar{width:280px;background:var(--sidebar-blue);-webkit-backdrop-filter:var(--glass);backdrop-filter:var(--glass);border-right:1px solid var(--border-light);height:100vh;position:sticky;top:0;padding:2rem 1.5rem;display:flex;flex-direction:column;gap:2rem;z-index:10}.main-content{flex:1;padding:2.5rem;max-width:1400px;margin:0 auto;width:100%}.glass-card{background:var(--card-bg);-webkit-backdrop-filter:var(--glass);backdrop-filter:var(--glass);border:1px solid var(--border-light);border-radius:1.25rem;padding:1.5rem;box-shadow:0 4px 30px #0003}.nav-item{display:flex;align-items:center;gap:1rem;padding:1rem;border-radius:.75rem;cursor:pointer;transition:all .3s ease;color:var(--text-secondary)}.nav-item:hover{background:#3b82f61a;color:var(--primary-blue)}.nav-item.active{background:var(--primary-blue);color:#fff;box-shadow:0 4px 15px #3b82f666}.btn{padding:.75rem 1.5rem;border-radius:.75rem;border:none;cursor:pointer;font-weight:600;transition:all .2s ease;display:inline-flex;align-items:center;gap:.5rem}.btn-primary{background:var(--primary-blue);color:#fff}.btn-primary:hover{filter:brightness(1.2);transform:translateY(-2px)}.btn-outline{background:transparent;border:1px solid var(--primary-blue);color:var(--primary-blue)}.status-badge{padding:.25rem .75rem;border-radius:9999px;font-size:.75rem;font-weight:600}.status-success{background:#10b98133;color:#10b981}.status-warning{background:#f59e0b33;color:#f59e0b}.status-danger{background:#ef444433;color:#ef4444}table{width:100%;border-collapse:separate;border-spacing:0 .5rem}th{padding:1rem;text-align:left;color:var(--text-secondary);font-size:.85rem;font-weight:600}td{padding:1rem;background:#ffffff08}tr:hover td{background:#ffffff0d}input,select{background:#0f172a99;border:1px solid var(--border-light);border-radius:.5rem;padding:.75rem 1rem;color:#fff;outline:none}input:focus{border-color:var(--primary-blue);box-shadow:0 0 0 2px #3b82f633}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.fade-in{animation:fadeIn .4s ease forwards}label{font-size:.8rem;color:var(--text-secondary);font-weight:600;display:block}.modal-overlay{background:#0f172ae6;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.item-card{transition:transform .2s ease,border-color .2s ease}.item-card:hover{transform:translateY(-5px);border-color:var(--primary-blue)}button:disabled{opacity:.5;cursor:not-allowed}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:#ffffff05}::-webkit-scrollbar-thumb{background:var(--border-light);border-radius:4px}::-webkit-scrollbar-thumb:hover{background:var(--primary-blue)}.table-container{width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch;margin-top:1rem}@media(max-width:768px){.layout{flex-direction:column;padding-bottom:80px}.sidebar{position:fixed;bottom:0;top:auto;width:100%;height:auto;padding:.75rem 1rem;flex-direction:row;border-right:none;border-top:1px solid var(--border-light);justify-content:space-between;background:#0f172afa}.sidebar>div:first-child{display:none!important}.sidebar nav{display:flex;width:100%;justify-content:space-between;gap:.5rem}.nav-item{flex-direction:column;padding:.5rem;gap:.25rem;font-size:.7rem;text-align:center;flex:1;justify-content:center}.main-content{padding:1.5rem 1rem;max-width:100%}h1{font-size:1.5rem!important}h2{font-size:1.8rem!important}.dashboard-grid,.stats-grid{grid-template-columns:1fr!important}.glass-card{padding:1rem}.modal-overlay .glass-card{width:90%!important;max-height:90vh;overflow-y:auto}.crm-layout{grid-template-columns:1fr!important}}
