:root{
		--primary:#1f6fb2;       /* أزرق ATC */
		--secondary:#f57c00;     /* برتقالي ATC */
		--bg:#f5f7fa;
		--card:#ffffff;
		--text:#1a1a1a;
		--muted:#777;
		--radius:16px;
		--shadow:0 4px 12px rgba(0,0,0,.06);
		--font:'Tajawal', sans-serif;
}

/* Dark Mode */
[data-theme="dark"]{
		--bg:#121212;
		--card:#1e1e1e;
		--text:#f1f1f1;
		--muted:#aaa;
}

body{
		margin:0;
		font-family:var(--font);
		background:var(--bg);
		color:var(--text);
}

.header{
		background:#fff;
		padding:15px;
		display:flex;
		justify-content:space-between;
		align-items:center;
		box-shadow:var(--shadow);
}

[data-theme="dark"] .header{
		background:#1e1e1e;
}

.card{
		background:var(--card);
		border-radius:var(--radius);
		padding:15px;
		box-shadow:var(--shadow);
		margin-bottom:15px;
}

.btn-primary{
		background:var(--primary);
		color:#fff;
		border:none;
		padding:12px;
		border-radius:12px;
		width:100%;
}

.btn-secondary{
		background:var(--secondary);
		color:#fff;
		border:none;
		padding:12px;
		border-radius:12px;
		width:100%;
}

.bottom-nav{
		position:fixed;
		bottom:0;
		left:0;
		right:0;
		background:#fff;
		display:flex;
		justify-content:space-around;
		padding:10px 0;
		box-shadow:0 -3px 10px rgba(0,0,0,.1);
}

[data-theme="dark"] .bottom-nav{
		background:#1e1e1e;
}

.bottom-nav a{
		text-decoration:none;
		color:var(--muted);
		font-size:14px;
}

.bottom-nav a.active{
		color:var(--primary);
}