@import url('https://fonts.googleapis.com/css2?family=Kanit:wght@200;300;400;500;600;700&display=swap');

body {
    font-family: 'Kanit', sans-serif;
    background-color: #f4f7f6; /* สีพื้นหลังที่อมเทาฟ้าอ่อนๆ ให้ดูคลีน */
}

/* Sidebar Gradient: ไล่สีดำไปหาน้ำเงินเข้มจัดๆ (Midnight Blue) */
.sidebar-gradient {
    background: linear-gradient(180deg, #111827 0%, #0f172a 50%, #082f49 100%);
}

/* เมนูที่ถูกเลือก (Active) ให้มีแถบสีเหลืองและพื้นหลังสว่างขึ้นนิดๆ */
.menu-active {
    background: linear-gradient(90deg, rgba(250, 204, 21, 0.15) 0%, transparent 100%);
    border-left: 4px solid #FACC15;
}

/* สไตล์การ์ดต่างๆ แบบในเรฟเฟอเรนซ์ */
.card-dark {
    background: linear-gradient(135deg, #1f2937 0%, #111827 100%);
    color: white;
}

.card-yellow {
    background: linear-gradient(135deg, #fde047 0%, #eab308 100%);
    color: #111827;
}

.card-blue-light {
    background: linear-gradient(135deg, #eff6ff 0%, #e0f2fe 100%);
    color: #0c4a6e;
}

.custom-shadow {
    box-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.05), 0 8px 10px -6px rgba(0, 0, 0, 0.01);
}