/* Basic styles for lecturer site */
.site-wrapper { min-height: 100vh; display: flex; flex-direction: column; }
html, body { height: 100%; }
.Poppins, body { margin: 0; font-family: 'Poppins', Arial, sans-serif; }
body { margin: 0; font-family: 'Poppins', Arial, sans-serif; background: linear-gradient(135deg,#0f172a 0%,#07102a 100%); color: #e6eef8; }
.site-content { flex: 1 0 auto; }
.hero { background: rgba(255,255,255,0.04); padding: 40px; border-radius: 12px; box-shadow: 0 8px 30px rgba(2,6,23,0.6); backdrop-filter: blur(6px); border: 1px solid rgba(255,255,255,0.03); }
.card { border-radius: 12px; background: linear-gradient(180deg, rgba(255,255,255,0.02), rgba(255,255,255,0.01)); border: 1px solid rgba(255,255,255,0.03); box-shadow: 0 10px 30px rgba(2,6,23,0.6); }
.container main { padding-bottom: 2rem; }
.nav-link { color: rgba(255,255,255,0.85); }
.site-footer { position: fixed; left: 0; right: 0; bottom: 0; background: rgba(3,7,18,0.9); border-top: 1px solid rgba(255,255,255,0.03); }
.content-with-footer { padding-bottom: 96px; /* space for fixed footer */ }
.container.main-container { padding-bottom: 2rem; }

.btn-primary {
	background: linear-gradient(90deg,#2563eb,#7c3aed);
	border: none;
	color: #fff;
}
.btn-outline-primary {
	border-color: rgba(255,255,255,0.08);
	color: rgba(255,255,255,0.9);
}

/* Dark UI tokens */
:root{
	--bg-1: #07102a;
	--bg-2: #0f172a;
	--card-bg: rgba(255,255,255,0.03);
	--muted: rgba(230,238,248,0.65);
	--accent: linear-gradient(90deg,#7c3aed,#2563eb);
}

/* Links */
a { color: #9cc3ff; }

/* Forms and controls */
input, textarea, select, .form-control {
	background: rgba(255,255,255,0.03) !important;
	border: 1px solid rgba(255,255,255,0.06) !important;
	color: var(--muted) !important;
	box-shadow: none !important;
}
input::placeholder, textarea::placeholder { color: rgba(230,238,248,0.45) !important; }

/* Tables */
table { color: var(--muted); }
th, td { border-color: rgba(255,255,255,0.03); }

/* Code blocks */
pre, code { background: rgba(0,0,0,0.25); color: #dbeafe; padding: .4rem; border-radius: 6px; }

/* Utility tweaks for converter screen */
.calculator { background: linear-gradient(180deg, rgba(255,255,255,0.03), rgba(255,255,255,0.02)); }
.display { background-color: rgba(0,0,0,0.25); }

/* Small responsive polish */
@media (max-width: 576px) {
	.hero { padding: 20px; }
	.container { padding-left: 12px; padding-right: 12px; }
}

/* Light mode overrides */
.light-mode body { background: linear-gradient(135deg,#f8fafc 0%,#eef2ff 100%); color: #0b1220; }
.light-mode .hero { background: #fff; box-shadow: 0 8px 30px rgba(15,23,42,0.04); border: 1px solid rgba(2,6,23,0.03); }
.light-mode .card { background: #fff; color: #0b1220; border: 1px solid rgba(2,6,23,0.04); }
.light-mode input, .light-mode textarea, .light-mode select, .light-mode .form-control { background: #fff !important; color: #0b1220 !important; border: 1px solid rgba(2,6,23,0.06) !important; }
.light-mode .site-footer { background: #f8fafc; color: #0b1220; border-top: 1px solid rgba(2,6,23,0.04); }
.light-mode .btn-primary { background: linear-gradient(90deg,#2563eb,#7c3aed); }
.light-mode .btn-outline-primary { border-color: rgba(2,6,23,0.06); }