*{
margin:0;
padding:0;
box-sizing:border-box;
font-family:Segoe UI,sans-serif;
}

body{
background:#070B14;
color:white;
}

.dashboard{
display:flex;
min-height:100vh;
}

/* SIDEBAR */

.sidebar{
width:260px;
background:#0B1220;
border-right:1px solid #1E293B;
padding:30px 20px;
}

.sidebar h2{
color:#8B5CF6;
margin-bottom:5px;
}

.sidebar p{
color:#94A3B8;
font-size:14px;
margin-bottom:25px;
}

.sidebar hr{
border:1px solid #1E293B;
margin-bottom:20px;
}

.sidebar a{
display:block;
padding:14px;
margin-bottom:12px;
text-decoration:none;
color:#E5E7EB;
border-radius:10px;
transition:.3s;
font-size:17px;
}

.sidebar a:hover{
background:#6D28D9;
transform:translateX(5px);
}

/* MAIN */

.main{
flex:1;
padding:35px;
}

/* TOPBAR */

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

.topbar h2{
font-size:40px;
}

.user{
background:#111827;
padding:12px 22px;
border-radius:30px;
border:1px solid #374151;
}

/* CARDS */

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

.stat{
padding:25px;
border-radius:18px;
background:#111827;
border:1px solid #1F2937;
transition:.3s;
}

.stat:hover{
transform:translateY(-6px);
box-shadow:0 0 20px rgba(139,92,246,.3);
}

.stat h3{
font-size:18px;
margin-bottom:15px;
}

.stat h1{
font-size:48px;
}

.purple h3{color:#A855F7;}
.green h3{color:#22C55E;}
.red h3{color:#EF4444;}
.blue h3{color:#3B82F6;}

/* CONTENT */

.content-grid{
display:grid;
grid-template-columns:1.3fr 1fr;
gap:25px;
margin-bottom:30px;
}

.card{
background:#111827;
padding:25px;
border-radius:18px;
border:1px solid #1F2937;
}

.logs p{
padding:8px 0;
color:#CBD5E1;
}

.chart{
text-align:center;
}

/* QUICK */

.quick{
display:grid;
grid-template-columns:repeat(4,1fr);
gap:20px;
}

.quick-card{
background:#111827;
border:1px solid #374151;
border-radius:15px;
padding:25px;
text-align:center;
text-decoration:none;
color:white;
transition:.3s;
}

.quick-card h3{
margin-top:12px;
margin-bottom:8px;
}

.quick-card:hover{
background:#6D28D9;
transform:translateY(-8px);
box-shadow:0 0 25px rgba(139,92,246,.4);
}

/* TABLE */

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

table th{
background:#6D28D9;
padding:15px;
}

table td{
background:#111827;
padding:15px;
border-bottom:1px solid #1F2937;
text-align:center;
}

/* FORM */

input,
select{
width:100%;
padding:14px;
margin-top:10px;
margin-bottom:18px;
background:#0B1220;
border:1px solid #374151;
border-radius:10px;
color:white;
}

input:focus,
select:focus{
outline:none;
border:1px solid #8B5CF6;
}

/* BUTTON */

.btn{
display:inline-block;
padding:14px 25px;
background:#6D28D9;
border:none;
border-radius:10px;
text-decoration:none;
color:white;
cursor:pointer;
transition:.3s;
}

.btn:hover{
background:#7C3AED;
transform:scale(1.05);
}

/* MOBILE */

@media(max-width:1100px){

.cards{
grid-template-columns:repeat(2,1fr);
}

.quick{
grid-template-columns:repeat(2,1fr);
}

.content-grid{
grid-template-columns:1fr;
}

.sidebar{
display:none;
}

}
/* ===========================
   LANDING PAGE
=========================== */

.landing-container{

width:100%;
min-height:100vh;

display:flex;
flex-direction:column;

justify-content:center;
align-items:center;

padding:40px;

}

.landing-header{

text-align:center;
margin-bottom:45px;

}

.logo{

font-size:60px;
margin-bottom:15px;

}

.landing-header h1{

font-size:42px;
color:#ffffff;

margin-bottom:10px;

}

.landing-header p{

color:#9CA3AF;
font-size:18px;

}

.landing-grid{

display:grid;

grid-template-columns:1fr 1fr;

gap:35px;

max-width:950px;
width:100%;

}

.landing-card{

background:#121826;

border:1px solid rgba(255,255,255,.08);

border-radius:18px;

padding:35px;

box-shadow:0 10px 25px rgba(0,0,0,.30);

}

.landing-card h2{

color:white;

margin-bottom:15px;

}

.landing-card p{

color:#94A3B8;

margin-bottom:25px;

}

.landing-btn{

display:block;

text-align:center;

padding:14px;

border-radius:10px;

background:linear-gradient(90deg,#6D28D9,#8B5CF6);

color:white;

text-decoration:none;

font-weight:bold;

transition:.3s;

}

.landing-btn:hover{

transform:translateY(-3px);

}

.register-link{

margin-top:25px;

text-align:center;

color:#94A3B8;

}

.register-link a{

color:#A855F7;

font-weight:bold;

text-decoration:none;

}

.feature-list{

list-style:none;

padding:0;

margin-top:20px;

}

.feature-list li{

padding:12px 0;

color:#CBD5E1;

font-size:17px;

}

.landing-footer{

margin-top:45px;

color:#64748B;

}

@media(max-width:850px){

.landing-grid{

grid-template-columns:1fr;

}

}
.alert{

background:#7F1D1D;

padding:12px;

border-radius:8px;

margin-bottom:20px;

color:white;

text-align:center;

border-left:4px solid red;

}
/* ========================= */
/* LANDING PAGE */
/* ========================= */

.landing-container{
    min-height:100vh;
    display:flex;
    flex-direction:column;
    justify-content:center;
    align-items:center;
    padding:40px 20px;
}

.logo{
    font-size:70px;
    margin-bottom:15px;
}

.landing-header{
    text-align:center;
    margin-bottom:40px;
}

.landing-header h1{
    font-size:52px;
    color:#8B5CF6;
}

.landing-header p{
    color:#94A3B8;
    margin-top:10px;
    font-size:18px;
}

.landing-buttons{
    display:flex;
    gap:20px;
    margin-top:20px;
}

.landing-btn{
    padding:15px 35px;
    border-radius:12px;
    background:#6D28D9;
    color:white;
    text-decoration:none;
    font-size:18px;
    transition:.3s;
}

.landing-btn:hover{
    background:#7C3AED;
    transform:translateY(-3px);
}

.landing-btn.secondary{
    background:#111827;
    border:1px solid #374151;
}

.landing-btn.secondary:hover{
    background:#1F2937;
}

.landing-footer{
    margin-top:40px;
    color:#64748B;
    font-size:14px;
}