body{
margin:0;
font-family:Arial;
background:#06111f;
color:white;
}

.login-page{
display:flex;
justify-content:center;
align-items:center;
height:100vh;
background:#020817;
}

.login-box{
background:#081827;
padding:50px;
border-radius:20px;
width:420px;
text-align:center;
box-shadow:0 0 30px rgba(0,0,0,0.5);
}

.login-box h1{
color:#8cff00;
font-size:42px;
margin-bottom:0;
}

.login-box p{
opacity:0.8;
margin-bottom:30px;
}

input{
width:100%;
padding:15px;
margin-bottom:15px;
border:none;
border-radius:12px;
background:#0f2238;
color:white;
}

button{
padding:14px;
border:none;
border-radius:12px;
cursor:pointer;
font-weight:bold;
}

.login-box button{
width:100%;
background:#8cff00;
}

.sidebar{
position:fixed;
left:0;
top:0;
width:280px;
height:100vh;
background:#04101d;
padding:20px;
overflow:auto;
border-right:1px solid #10253d;
}

.logo h2{
color:#8cff00;
margin:0;
}

.logo p{
margin-top:5px;
opacity:0.7;
}

.menu{
list-style:none;
padding:0;
margin-top:30px;
}

.menu li{
padding:16px;
background:#081827;
margin-bottom:12px;
border-radius:14px;
display:flex;
justify-content:space-between;
transition:0.3s;
}

.menu li:hover{
background:#10253d;
}

.active{
background:#8cff00 !important;
color:#000;
font-weight:bold;
}

.sidebar-box{
margin-top:40px;
padding:20px;
border:1px solid #8cff00;
border-radius:18px;
}

.main{
margin-left:320px;
padding:30px;
}

.topbar{
display:flex;
justify-content:space-between;
align-items:center;
margin-bottom:30px;
}

.topbar h1{
margin:0;
}

.cliente-topo{
background:#081827;
padding:14px 20px;
border-radius:14px;
}

.cards{
display:grid;
grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
gap:20px;
margin-bottom:30px;
}

.card{
padding:30px;
border-radius:20px;
}

.card h2{
font-size:42px;
margin:0;
}

.azul{
background:linear-gradient(135deg,#0f4cff,#0d2f8b);
}

.amarelo{
background:linear-gradient(135deg,#ffb300,#8b6500);
}

.verde{
background:linear-gradient(135deg,#00c853,#006b2c);
}

.roxo{
background:linear-gradient(135deg,#7c4dff,#4527a0);
}

.bloco{
display:grid;
grid-template-columns:2fr 1fr;
gap:25px;
}

.tabela-box,.detalhes{
background:#081827;
padding:25px;
border-radius:20px;
}

table{
width:100%;
border-collapse:collapse;
margin-top:20px;
}

th,td{
padding:16px;
text-align:left;
border-bottom:1px solid #132b45;
}

.btn-confirmar{
background:#8cff00;
padding:10px 16px;
}

.mini-card{
background:#10253d;
padding:20px;
border-radius:16px;
margin-bottom:15px;
}

.mini-card h3{
font-size:36px;
color:#8cff00;
margin:0;
}

.erro{
color:#ff5252;
margin-top:15px;
}