/* --- Brand Variables --- */
:root {
    --brand-primary: #6366f1;
    --brand-success: #28a745;
    --brand-info: #17a2b8;
    --brand-warning: #f39c12;
    --dark-slate: #0f172a;
    --light-bg: #f4f6f9;
}

/* ১. গ্লোবাল ফিক্স: কার্ড ও টাইপোগ্রাফি */
body { font-family: 'Source Sans Pro', 'Hind Siliguri', sans-serif; }
.card { border-radius: 12px !important; box-shadow: 0 4px 6px -1px rgba(0,0,0,0.1) !important; border: none !important; }

/* ২. ছবির মতো ভাইব্রেন্ট ইনফো-বক্স (Widgets) */
/* এই ক্লাসগুলো আপনার ড্যাশবোর্ডের HTML-এ ব্যবহার করবেন */
.info-box { border-radius: 12px !important; border: none !important; min-height: 100px; }

.bg-teal-gradient { background: linear-gradient(135deg, #20c997, #17a2b8) !important; color: #fff !important; }
.bg-blue-gradient { background: linear-gradient(135deg, #007bff, #6610f2) !important; color: #fff !important; }
.bg-green-gradient { background: linear-gradient(135deg, #28a745, #20c997) !important; color: #fff !important; }
.bg-orange-gradient { background: linear-gradient(135deg, #fd7e14, #f39c12) !important; color: #fff !important; }

.info-box .info-box-icon { border-radius: 10px !important; background: rgba(255, 255, 255, 0.2) !important; }

/* ৩. সাইডবার ইউনিফর্ম ডিজাইন (Dark & Light) */
/* লাইট মোডে টেক্সট স্পষ্ট করার জন্য */
body:not(.dark-mode) .main-sidebar { background-color: #ffffff !important; border-right: 1px solid #e2e8f0 !important; }
body:not(.dark-mode) .nav-sidebar .nav-link p, 
body:not(.dark-mode) .nav-sidebar .nav-link i { color: #1e293b !important; font-weight: 600 !important; }

/* ডার্ক মোডে সাইডবার */
body.dark-mode .main-sidebar { background-color: var(--dark-slate) !important; }
body.dark-mode .nav-sidebar .nav-link.active { background-color: rgba(99, 102, 241, 0.1) !important; color: var(--brand-primary) !important; border-left: 4px solid var(--brand-primary); }

/* ৪. বাটন গ্লো ইফেক্ট */
.btn-primary { background-color: var(--brand-primary) !important; border: none !important; padding: 8px 20px; border-radius: 8px; box-shadow: 0 4px 10px rgba(99, 102, 241, 0.2) !important; }
.btn-primary:hover { transform: translateY(-1px); box-shadow: 0 6px 15px rgba(99, 102, 241, 0.3) !important; }