/* RESET */
*{
margin:0;
padding:0;
box-sizing:border-box;
font-family:'Inter',sans-serif;
transition: all .25s ease;
}

html{
scroll-behavior:smooth;
}

body{
min-height:100vh;
background:linear-gradient(-45deg,#0f172a,#0b142a,#111827,#0f1c3f);
background-size:400% 400%;
animation:gradientMove 12s ease infinite;
color:#e5e7eb;
}

@keyframes gradientMove{
0%{background-position:0% 50%}
50%{background-position:100% 50%}
100%{background-position:0% 50%}
}

/* Scrollbar */

::-webkit-scrollbar{
width:8px;
}

::-webkit-scrollbar-track{
background:#0f172a;
}

::-webkit-scrollbar-thumb{
background:linear-gradient(#6366f1,#8b5cf6);
border-radius:20px;
}
/* LIGHT MODE */

body.light{
background:#f9fafb;
color:#111;
}

body.light .sidebar{
background:#ffffff;
}

body.light .main{
background:#f9fafb;
}

body.light .topbar{
background:#ffffff;
border-bottom:1px solid #e5e7eb;
}

body.light .orders-table{
background:#ffffff;
color:#111;
}

body.light .stat-card{
background:#ffffff;
}


/* DARK MODE */

body.dark{
background:#0f172a;
color:#fff;
}

body.dark .sidebar{
background:#020617;
}

body.dark .main{
background:#0f172a;
}

body.dark .topbar{
background:#020617;
border-bottom:1px solid #1e293b;
}

body.dark .orders-table{
background:#020617;
color:#fff;
}

body.dark .stat-card{
background:#020617;
}
/* ===== NEXUS THEME SYSTEM ===== */

/* DARK MODE (DEFAULT) */

:root{

--bg-main:#0f172a;
--bg-sidebar:#020617;
--bg-card:#020617;
--bg-table:#020617;

--text-main:#ffffff;
--text-secondary:#9ca3af;

--border:#1e293b;

}


/* LIGHT MODE */

body.light{

--bg-main:#f9fafb;
--bg-sidebar:#ffffff;
--bg-card:#ffffff;
--bg-table:#ffffff;

--text-main:#111827;
--text-secondary:#6b7280;

--border:#e5e7eb;

}


/* GLOBAL */

body{
background:var(--bg-main);
color:var(--text-main);
transition:background .25s,color .25s;
}


/* SIDEBAR */

.sidebar{
background:var(--bg-sidebar);
border-right:1px solid var(--border);
}


/* TOPBAR */

.topbar{
border-bottom:1px solid var(--border);
}


/* CARDS */

.card,
.stat-card,
.chart-card,
.table-card{
background:var(--bg-card);
border:1px solid var(--border);
}


/* TABLE */

.orders-table{
background:var(--bg-table);
color:var(--text-main);
}


/* TEXT */

.stat-card span{
color:var(--text-secondary);
}