body { background-color: #F8F9FA; }
        .glass-card {
            background: rgba(255, 255, 255, 0.95);
            backdrop-filter: blur(10px);
            border: 1px solid rgba(0,0,0,0.05);
            box-shadow: 0 10px 30px -10px rgba(0,0,0,0.1);
            transition: all 0.3s ease;
        }
        .kegiatan-card { cursor: pointer; }
        .kegiatan-card:hover {
            transform: translateY(-5px);
            box-shadow: 0 15px 35px -10px rgba(0,0,0,0.15);
        }
        .glass-card.active-filter {
            border: 2px solid #B12025;
            background: rgba(177, 32, 37, 0.02);
        }
        /* Custom Scrollbar */
        ::-webkit-scrollbar { height: 8px; width: 6px; }
        ::-webkit-scrollbar-track { background: #f1f1f1; border-radius: 4px; }
        ::-webkit-scrollbar-thumb { background: #ccc; border-radius: 4px; }
        ::-webkit-scrollbar-thumb:hover { background: #B12025; }
        
        /* Checkbox styling */
        .custom-checkbox:checked {
            background-color: #B12025;
            border-color: #B12025;
        }
        
        /* Select Status Presensi */
        .select-status {
            -webkit-appearance: none;
            -moz-appearance: none;
            appearance: none;
            background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3e%3cpolyline points='6 9 12 15 18 9'%3e%3c/polyline%3e%3c/svg%3e");
            background-repeat: no-repeat;
            background-position: right 0.5rem center;
            background-size: 1em;
        }

        .animate-fade-in {
            animation: fadeIn 0.3s ease-in-out;
        }
        @keyframes fadeIn {
            from { opacity: 0; transform: translateY(10px); }
            to { opacity: 1; transform: translateY(0); }
        }