:root{--primary:#d35400;--primary-hover:#e67e22;--bg-dark:#161412;--bg-card:#221f1c;--bg-card-hover:#2a2422;--text-main:#fff;--text-muted:#888;--font-heading:"Oswald", sans-serif;--font-body:"Inter", sans-serif}*{box-sizing:border-box;margin:0;padding:0}body{font-family:var(--font-body);background-color:var(--bg-dark);color:var(--text-main);line-height:1.6;overflow-x:hidden}h1,h2,h3,h4,h5,h6{font-family:var(--font-heading);letter-spacing:1px;text-transform:uppercase}#app{width:100%;min-height:100vh;display:flex}.sidebar{border-right:1px solid var(--bg-card-hover);background-color:#110f0d;flex-direction:column;width:280px;padding:20px 0;display:flex}.sidebar-header{border-bottom:1px solid var(--bg-card-hover);align-items:center;gap:15px;margin-bottom:20px;padding:0 20px 30px;display:flex}.sidebar-header img{border:2px solid var(--primary);border-radius:50%;width:50px;height:50px}.sidebar-header h2{color:var(--primary);font-size:1.2rem}.nav-item{color:var(--text-muted);font-family:var(--font-heading);cursor:pointer;align-items:center;gap:15px;padding:15px 30px;font-size:1.1rem;text-decoration:none;transition:all .3s;display:flex}.nav-item:hover,.nav-item.active{background-color:var(--bg-card-hover);color:var(--primary);border-left:4px solid var(--primary)}.nav-item .material-icons{font-size:24px}.main-content{flex-direction:column;flex:1;height:100vh;display:flex;overflow-y:auto}.topbar{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-bottom:1px solid var(--bg-card-hover);z-index:100;background-color:#161412f2;justify-content:space-between;align-items:center;height:70px;padding:0 40px;display:flex;position:sticky;top:0}.topbar-title-area{align-items:center;gap:15px;display:flex}.topbar-logo{height:40px}.topbar h1{margin:0;font-size:1.5rem}.topbar-slogan{color:var(--text-muted);font-size:.9rem;font-style:italic;font-family:var(--font-body);letter-spacing:.5px;white-space:nowrap;position:absolute;left:50%;transform:translate(-50%)}.topbar-actions{gap:20px;display:flex}.btn{background-color:var(--primary);color:#fff;font-family:var(--font-body);cursor:pointer;border:none;border-radius:8px;padding:10px 20px;font-weight:700;transition:background-color .3s}.btn:hover{background-color:var(--primary-hover)}.btn-danger{background-color:#c0392b}.btn-danger:hover{background-color:#e74c3c}.dashboard-grid{grid-template-columns:minmax(0,2fr) minmax(0,1fr);gap:30px;width:100%;max-width:1400px;margin:0;padding:40px;display:grid}.card{background-color:var(--bg-card);border:1px solid #ffffff0d;border-radius:12px;margin-bottom:25px;padding:25px;box-shadow:0 10px 30px #00000080}.card-title{color:var(--text-muted);border-bottom:1px solid var(--bg-card-hover);margin-bottom:15px;padding-bottom:10px;font-size:.9rem}.login-screen{background:radial-gradient(circle,#2a2422 0%,#161412 100%);flex-direction:column;justify-content:center;align-items:center;width:100%;height:100vh;display:flex}.login-box{background-color:var(--bg-card);border-top:4px solid var(--primary);text-align:center;border-radius:16px;width:100%;max-width:400px;padding:40px;box-shadow:0 20px 50px #000c}.login-box h2{color:var(--primary);margin-bottom:20px;font-size:2rem}.login-box input{border:1px solid var(--bg-card-hover);color:#fff;width:100%;font-family:var(--font-body);background-color:#110f0d;border-radius:8px;margin-bottom:20px;padding:15px}.login-box button{width:100%;padding:15px;font-size:1.1rem}.error-msg{color:#e74c3c;margin-top:15px;font-size:.9rem;display:none}.loader-container{background-color:var(--bg-dark);justify-content:center;align-items:center;width:100%;height:100vh;display:flex}.loader{border:4px solid #ffffff1a;border-top:4px solid var(--primary);border-radius:50%;width:40px;height:40px;animation:1s linear infinite spin}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}label{color:var(--text-muted);margin-bottom:8px;font-size:.9rem;font-weight:500;display:block}input[type=text],input[type=email],input[type=password],input[type=date],input[type=number],select,textarea{border:1px solid var(--bg-card-hover);color:#fff;width:100%;font-family:var(--font-body);background-color:#110f0d;border-radius:8px;padding:12px 15px;font-size:1rem;transition:border-color .3s,box-shadow .3s}input:focus,select:focus,textarea:focus{border-color:var(--primary);outline:none;box-shadow:0 0 0 2px #d3540033}select{appearance:none;background-image:url(data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22292.4%22%20height%3D%22292.4%22%3E%3Cpath%20fill%3D%22%23888888%22%20d%3D%22M287%2069.4a17.6%2017.6%200%200%200-13-5.4H18.4c-5%200-9.3%201.8-12.9%205.4A17.6%2017.6%200%200%200%200%2082.2c0%205%201.8%209.3%205.4%2012.9l128%20127.9c3.6%203.6%207.8%205.4%2012.8%205.4s9.2-1.8%2012.8-5.4L287%2095c3.5-3.5%205.4-7.8%205.4-12.8%200-5-1.9-9.2-5.5-12.8z%22%2F%3E%3C%2Fsvg%3E);background-position:right 15px top 50%;background-repeat:no-repeat;background-size:12px;padding-right:40px}textarea{resize:vertical;min-height:100px}.mc-tooltip{cursor:help;margin-left:5px;display:inline-block;position:relative}.mc-tooltip .tooltip-text{visibility:hidden;background-color:var(--bg-card);width:max-content;max-width:250px;color:var(--text-main);text-align:center;z-index:10;opacity:0;border:1px solid var(--primary);border-radius:6px;padding:8px 12px;font-size:.85rem;font-weight:400;transition:opacity .3s;position:absolute;bottom:150%;left:50%;transform:translate(-50%);box-shadow:0 4px 10px #000c}.mc-tooltip .tooltip-text:after{content:"";border-style:solid;border-width:6px;border-color:var(--primary) transparent transparent transparent;margin-left:-6px;position:absolute;top:100%;left:50%}.mc-tooltip:hover .tooltip-text{visibility:visible;opacity:1}.switch{width:50px;height:24px;display:inline-block;position:relative}.switch input{opacity:0;width:0;height:0}.slider{cursor:pointer;background-color:#555;transition:all .4s;position:absolute;inset:0}.slider:before{content:"";background-color:#fff;width:16px;height:16px;transition:all .4s;position:absolute;bottom:4px;left:4px}input:checked+.slider{background-color:var(--primary)}input:checked+.slider:before{transform:translate(26px)}.slider.round{border-radius:24px}.slider.round:before{border-radius:50%}
