body { background: #f4f6fa; }
.card { border: 0; border-radius: 14px; box-shadow: 0 1px 4px rgba(0,0,0,.06); }
.stat .label { font-size: .85rem; color: #6c757d; }
.stat .value { font-size: 1.35rem; font-weight: 700; }
.text-thu { color: #198754; }
.text-chi { color: #dc3545; }
.dot { display: inline-block; width: 12px; height: 12px; border-radius: 50%; }
.gd-item { display: flex; align-items: center; gap: .75rem; padding: .7rem 0; border-bottom: 1px solid #eee; text-decoration: none; color: inherit; }
.gd-item:last-child { border-bottom: 0; }
.gd-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; color: #fff; font-weight: 700; flex-shrink: 0; }
.fab { position: fixed; right: 20px; bottom: 84px; width: 56px; height: 56px; display: flex; align-items: center; justify-content: center; font-size: 1.5rem; z-index: 1030; }
.bottom-nav { position: fixed; bottom: 0; left: 0; right: 0; background: #fff; display: flex; border-top: 1px solid #ddd; z-index: 1020; }
.bottom-nav a.active { color: #0d6efd; font-weight: 600; box-shadow: inset 0 -3px 0 #0d6efd; }
.bottom-nav a { flex: 1; text-align: center; padding: 8px 0; color: #555; text-decoration: none; font-size: .75rem; display: flex; flex-direction: column; }
.bottom-nav a i { font-size: 1.3rem; }
.chart-pie { position: relative; height: 160px; }
.chart-bar { position: relative; height: 180px; }
@media (min-width: 768px) { .chart-pie { height: 240px; } .chart-bar { height: 240px; } }
/* Loading toàn trang */
#loading { position: fixed; inset: 0; z-index: 2000; display: none; background: rgba(255,255,255,.55); backdrop-filter: blur(1px); align-items: center; justify-content: center; }
#loading.show { display: flex; animation: loadfade .15s ease both; }
@keyframes loadfade { from { opacity: 0; } to { opacity: 1; } }
#loading .loading-box { background: #fff; padding: 18px 26px; border-radius: 14px; box-shadow: 0 4px 18px rgba(0,0,0,.12); text-align: center; }
#loading .loading-bar { position: absolute; top: 0; left: 0; height: 3px; width: 40%; background: #0d6efd; animation: loadbar 1s ease-in-out infinite; }
@keyframes loadbar { 0% { left: -40%; } 100% { left: 100%; } }
/* Đăng nhập */
.auth-wrap { min-height: calc(100vh - 120px); display: flex; align-items: center; justify-content: center; }
.auth-card { width: 100%; max-width: 380px; }
.auth-logo { width: 56px; height: 56px; border-radius: 50%; background: #0d6efd; color: #fff; display: inline-flex; align-items: center; justify-content: center; font-size: 1.6rem; }
.navbar .container-fluid { flex-wrap: nowrap; gap: 8px; }