.news-font, body { padding-top: 80px; background: #f8f9fa; font-family: 'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif; color: #222; }
.news-font h1, .news-font h2, .news-font h3, .news-font h4, .news-font h5 { font-weight: 600; }
.news-font p, .news-font small, .news-font .small { color: #495057; }
.card img { max-height: 220px; object-fit: cover; }
.news-card { transition: transform .25s ease, box-shadow .25s ease; }
.news-card:hover { transform: translateY(-6px); box-shadow: 0 10px 20px rgba(0,0,0,0.12); }

.hero{
	background: linear-gradient(135deg,#0d6efd 0%, #6610f2 100%);
}
.hero h1, .hero p{ color: #fff; }
.card.shadow-sm{ border: none; }
.list-group-item{ border: none; }

/* News list styles */
.news-list-item{
	background: linear-gradient(90deg,#ffffff 0%, #eef8ff 100%);
	border: 1px solid rgba(13,110,253,0.14);
	border-radius: 1rem;
	margin-bottom: 1rem;
	padding: 1rem;
	box-shadow: 0 10px 30px rgba(13,110,253,0.06);
	transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.news-list-item:hover{
	transform: translateY(-6px);
	box-shadow: 0 22px 44px rgba(13,110,253,0.12);
	border-color: rgba(13,110,253,0.22);
}
.thumb{ width:96px; height:64px; object-fit:cover; border-radius: .4rem; border: 1px solid #eee; }
.thumb-wrap{ flex: 0 0 auto; }
.news-list .btn{ min-width:80px; }

/* Navbar custom styles */
.navbar-custom{
	background: linear-gradient(90deg,#0b1226 0%, #131726 100%);
	padding: .6rem 1rem;
	box-shadow: 0 8px 26px rgba(0,0,0,0.45);
	border-bottom: 1px solid rgba(255,255,255,0.03);
	transition: background .2s ease, box-shadow .2s ease, transform .2s ease;
}
.navbar-custom .navbar-brand{ font-weight:700; font-size:1.05rem; letter-spacing:.2px; color:#ffffff !important; }
.navbar-custom .nav-link{ color: rgba(255,255,255,0.9) !important; padding: .3rem .6rem; border-radius: .4rem; }
.navbar-custom .nav-link:hover{ background: rgba(255,255,255,0.04); color: #fff !important; }
.navbar-custom .admin-badge{ color: rgba(255,255,255,0.85); margin-right: .5rem; }
.navbar-custom .btn-logout{ background: transparent; color:#fff !important; padding:.35rem .7rem; border-radius:.4rem; border:1px solid rgba(255,255,255,0.08); }
.navbar-custom .btn-logout:hover{ background: rgba(255,255,255,0.04); transform:translateY(-2px); box-shadow: 0 6px 18px rgba(0,0,0,0.25); }

@media (prefers-reduced-motion: no-preference){
	.navbar-custom.animate__animated.animate__fadeInDown{ --animate-duration: .6s; }
}

/* Icon spacing for buttons */
.btn .bi, .btn i.bi { margin-right: .4rem; vertical-align: -.12em; }

/* Homepage dashboard cards */
.dashboard-card{ border-radius: 1rem; border: 1px solid rgba(13,110,253,0.06); background: linear-gradient(180deg,#fff,#fbfdff); box-shadow: 0 10px 30px rgba(13,110,253,0.04); transition: transform .22s cubic-bezier(.2,.9,.2,1), box-shadow .22s ease; min-height:200px; display:flex; align-items:center; justify-content:center; flex-direction:column; padding:1.5rem; }
.dashboard-card:hover{ transform: translateY(-6px) scale(1.03); box-shadow: 0 28px 56px rgba(13,110,253,0.10); }
.dashboard-card .bi{ background: rgba(13,110,253,0.08); padding: .6rem; border-radius: 50%; }

/* Hero separation and thin title */
.dashboard-hero{ margin-top: 1.5rem; margin-bottom: .5rem; }
.dashboard-hero h1{ font-weight: 300; letter-spacing: .6px; color: #0f1724; }
.dashboard-hero p{ font-weight: 300; color: #4b5563; }

/* Accent variants for dashboard cards */
.dashboard-card.accent-1{ background: linear-gradient(135deg,#4f46e5 0%, #6366f1 100%); color:#fff; border: none; }
.dashboard-card.accent-2{ background: linear-gradient(135deg,#06b6d4 0%, #0891b2 100%); color:#fff; border: none; }
.dashboard-card.accent-3{ background: linear-gradient(135deg,#f97316 0%, #fb923c 100%); color:#fff; border: none; }
.dashboard-card.accent-1 .bi, .dashboard-card.accent-2 .bi, .dashboard-card.accent-3 .bi{ background: rgba(255,255,255,0.12); color: #fff; }
.dashboard-card.accent-1 h4, .dashboard-card.accent-2 h4, .dashboard-card.accent-3 h4{ color:#fff; }
.dashboard-card.accent-1 p, .dashboard-card.accent-2 p, .dashboard-card.accent-3 p{ color: rgba(255,255,255,0.9); }